/*
Theme Name: Flex Restaurant
Author: flextheme
Author URI: https://www.flextheme.net/
Theme URI: https://www.flextheme.net/products/flex-restaurant
Description: Flex Restaurant is a free, responsive theme designed for restaurants, cafes, fast food outlets, bakeries, food delivery services, and culinary businesses, offering a visually appealing and functional platform to showcase menus and manage online orders through WooCommerce for seamless online food ordering, takeaway, and digital menu management; with One Click Demo Import, you can instantly launch a fully designed restaurant site featuring pre-built layouts with a banner section to highlight special dishes, promotions, chef’s specials, seasonal offers, or combo meal deals, while the customizable layout allows easy editing of colors, fonts, and sections without coding; fully responsive and mobile-optimized for smooth user experience across all devices, this restaurant ecommerce layout also integrates Contact Form 7 for table reservations, inquiries, catering requests, and customer feedback, plus Yoast SEO compatibility to boost ranking for searches like restaurant near me, online food delivery, bakery shop online, and fast food menu; ideal for building modern food delivery platforms, café portals, bakery stores, cloud kitchen menus, or fast-casual dining sites, it includes essential features like engaging menu showcase, online ordering, customer interaction tools, and integration with Charitable plugin for donation-based campaigns, making Flex Restaurant a stylish, user-friendly, and high-performing solution for restaurant ecommerce websites.
Version: 1.0.2
Tested up to: 6.8
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Template: flex-multi-business
Text Domain: flex-restaurant
Tags: blog, food-and-drink, e-commerce, custom-background, custom-logo, custom-menu, featured-images, one-column, two-columns, right-sidebar, left-sidebar, grid-layout, custom-header, flexible-header, footer-widgets, full-width-template, editor-style, theme-options, threaded-comments, rtl-language-support

flex-restaurant is based on Underscores https://underscores.me/, (C) 2012-2022 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

:root {
  --primary-theme-color: #da1818 !important;
  --secondary-theme-color: #f09b12 !important;
}
body {
  font-family: "Poppins", sans-serif;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Edu NSW ACT Foundation", cursive;
}
.header-two,
.read-more a,
.widget_block .wp-block-search .wp-block-search__button,
.page-content .search-form .search-submit,
.widget_search .search-form .search-submit,
#c-scroll:hover,
.footer-one,
.pagination .page-numbers:hover,
.pagination .current {
  background: var(--primary-theme-color);
}
.wp-block-calendar .wp-calendar-table tbody tr td#today,
.widget_calendar .calendar_wrap .wp-calendar-table tbody tr td#today,
.search-form .search-submit,
.widget_block .wp-block-tag-cloud a:hover,
.widget_tag_cloud .tagcloud a:hover {
  background-color: var(--primary-theme-color) !important;
}

.widget_block .wp-block-search .wp-block-search__button,
.main-navigation .menu .children .page_item > a::before,
.main-navigation .menu .dropdown-menu .menu-item > a::before,
.comments-area .form-submit .submit {
  background: var(--primary-theme-color) !important;
}

.read-more a {
  outline-color: var(--primary-theme-color);
}

.pagination .page-numbers,
.pagination .current {
  border-color: var(--primary-theme-color);
}

.comments-area .comment-form-comment textarea:focus,
.comments-area .comment-form-comment textarea:hover,
.widget_block .wp-block-tag-cloud a:hover,
.widget_tag_cloud .tagcloud a:hover {
  border-color: var(--primary-theme-color) !important;
}

.read-more a:hover,
a:hover,
a:active,
#primary-menu .current-menu-item a,
h5 a:hover,
h6 a:hover,
.post-meta li a:hover,
.post-tags a:hover {
  color: var(--primary-theme-color);
}

#primary-menu .menu-item:hover .nav-link,
.main-navigation .menu .children .page_item:hover > a,
.main-navigation .menu .dropdown-menu .menu-item:hover > a {
  color: var(--primary-theme-color) !important;
}
.main-navbar {
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}
.ac-btn:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce input[type="submit"].button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover,
.woocommerce #respond input#submit.disabled,
.woocommerce #respond input#submit:disabled,
.woocommerce #respond input#submit:disabled[disabled],
.woocommerce a.button.disabled,
.woocommerce a.button:disabled,
.woocommerce a.button:disabled[disabled],
.woocommerce button.button.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button:disabled[disabled],
.woocommerce input.button.disabled,
.woocommerce input.button:disabled,
.woocommerce input.button:disabled[disabled],
.woocommerce #respond input#submit.disabled:hover,
.woocommerce #respond input#submit:disabled:hover,
.woocommerce #respond input#submit:disabled[disabled]:hover,
.woocommerce a.button.disabled:hover,
.woocommerce a.button:disabled:hover,
.woocommerce a.button:disabled[disabled]:hover,
.woocommerce button.button.disabled:hover,
.woocommerce button.button:disabled:hover,
.woocommerce button.button:disabled[disabled]:hover,
.woocommerce input.button.disabled:hover,
.woocommerce input.button:disabled:hover,
.woocommerce input.button:disabled[disabled]:hover,
.woocommerce #respond input#submit.alt.disabled,
.woocommerce #respond input#submit.alt.disabled:hover,
.woocommerce #respond input#submit.alt:disabled,
.woocommerce #respond input#submit.alt:disabled:hover,
.woocommerce #respond input#submit.alt:disabled[disabled],
.woocommerce #respond input#submit.alt:disabled[disabled]:hover,
.woocommerce a.button.alt.disabled,
.woocommerce a.button.alt.disabled:hover,
.woocommerce a.button.alt:disabled,
.woocommerce a.button.alt:disabled:hover,
.woocommerce a.button.alt:disabled[disabled],
.woocommerce a.button.alt:disabled[disabled]:hover,
.woocommerce button.button.alt.disabled,
.woocommerce button.button.alt.disabled:hover,
.woocommerce button.button.alt:disabled,
.woocommerce button.button.alt:disabled:hover,
.woocommerce button.button.alt:disabled[disabled],
.woocommerce button.button.alt:disabled[disabled]:hover,
.woocommerce input.button.alt.disabled,
.woocommerce input.button.alt.disabled:hover,
.woocommerce input.button.alt:disabled,
.woocommerce input.button.alt:disabled:hover,
.woocommerce input.button.alt:disabled[disabled],
.woocommerce input.button.alt:disabled[disabled]:hover {
  background-color: var(--primary-theme-color) !important;
  color: #ffffff;
}
#page #primary-menu a.nav-link,
#page #primary-menu li:hover a.nav-link,
#page #primary-menu li {
  color: #fff !important;
}
.single-post .comment-list {
  margin-left: 0px;
}
.footer-copyright a:hover {
  color: #000;
}
@media (min-width: 1440px) {
  .container {
    max-width: 1160px !important;
  }
}
@media screen and (max-width: 991px) {
  #page #primary-menu a.nav-link,
  #page #primary-menu li:hover a.nav-link,
  #page #primary-menu li {
    color: #000 !important;
  }
}
.page-header h1,
.site-main .blog-detail h4,
#comments .comments-title,
.post-content a,
.wp-block-latest-comments__comment-link {
  word-break: break-word;
}
.woocommerce-cart .wc-block-cart-item__image img {
  padding: 10px;
}
.woocommerce-cart
  .wp-block-woocommerce-cart-order-summary-coupon-form-block.wc-block-components-totals-wrapper {
  padding: 16px 10px !important;
}
.woocommerce nav.woocommerce-pagination ul li span.current {
  color: #fff !important;
}
.woocommerce nav.woocommerce-pagination ul li a {
  color: #000 !important;
}
.blog-2 .post-meta {
  background: hsl(0deg 100% 50% / 27%) 0% 0%;
}

.custom-logo {
  max-width: 70px;
  width: 100%;
}

.menu.nav-menu {
  text-align: right;
}

/* ============================================
   FILIPINO RESTAURANT STYLES - MODERN & ELEGANT
   ============================================ */

/* ROOT VARIABLES */
:root {
  --primary-red: #d32f2f;
  --primary-gold: #ffa726;
  --dark-bg: #1a1a1a;
  --light-text: #f5f5f5;
  --accent-gold: #ffb74d;
  --shadow-color: rgba(211, 47, 47, 0.3);
}

/* GLOBAL TYPOGRAPHY */
body {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  line-height: 1.8;
  color: #333;
}

h1,
h2,
h3,
h4 {
  font-family: Georgia, serif;
  font-weight: 700;
  color: var(--dark-bg);
  letter-spacing: 0.5px;
}

h1.wp-block-heading {
  font-size: 2.5rem;
  text-align: center;
  margin-bottom: 2rem;
  color: var(--primary-red);
  text-transform: uppercase;
  letter-spacing: 2px;
  position: relative;
  padding-bottom: 1.5rem;
}

body.home h1.wp-block-heading::after {
  content: "🍴";
  display: block;
  font-size: 2rem;
  margin-top: 1rem;
}

h2.wp-block-heading {
  font-size: 2rem;
  color: var(--primary-red);
  text-align: center;
  margin: 1rem 0 2rem;
  position: relative;
  padding-bottom: 1rem;
}

h2.wp-block-heading::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100px;
  height: 4px;
  background: linear-gradient(90deg, var(--primary-red), var(--primary-gold));
  border-radius: 2px;
}

h3.wp-block-heading {
  font-size: 1.8rem;
  color: var(--primary-red);
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* ============================================
   TOP LIST STYLING - MEDAL RANKINGS
   ============================================ */
.top-list {
  background: linear-gradient(135deg, #fff9e6 0%, #ffe8cc 100%);
  border-left: 6px solid var(--primary-gold);
  padding: 2.5rem 2rem;
  margin: 2rem 0;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  font-size: 1.15rem;
  line-height: 2.2;
  position: relative;
  overflow: hidden;
}

.top-list::before {
  content: "🏆";
  position: absolute;
  top: -20px;
  right: 20px;
  font-size: 6rem;
  opacity: 0.1;
  transform: rotate(15deg);
}

.top-list strong {
  color: var(--primary-red);
  font-weight: 700;
  font-size: 1.1em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.top-list br {
  margin-bottom: 0.8rem;
}

/* ============================================
   IMAGE RIGHT BLOCK - PREMIUM STYLE
   ============================================ */
.img-right {
  background: #fff;
  border-radius: 16px;
  padding: 2.5rem;
  margin: 3rem 0;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1);
  position: relative;
  overflow: hidden;
}

.img-right::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 6px;
  background: linear-gradient(90deg, var(--primary-red), var(--primary-gold));
}

.img-right .wp-block-column:last-child {
  position: relative;
}

.img-right .wp-block-column:last-child .wp-block-image {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(211, 47, 47, 0.25);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.img-right .wp-block-column:last-child .wp-block-image::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    45deg,
    transparent 30%,
    rgba(255, 255, 255, 0.3) 50%,
    transparent 70%
  );
  transform: rotate(45deg);
  transition: all 0.6s ease;
  z-index: 1;
}

.img-right .wp-block-column:last-child .wp-block-image:hover::before {
  left: 100%;
}

.img-right .wp-block-column:last-child .wp-block-image:hover {
  transform: scale(1.05);
  box-shadow: 0 12px 48px rgba(211, 47, 47, 0.35);
}

.img-right .wp-block-column:last-child img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
  position: relative;
}

.img-right .wp-block-column:first-child {
  padding-right: 2rem;
}

/* ============================================
   IMAGE LEFT BLOCK - PREMIUM STYLE
   ============================================ */
.img-left {
  background: #fff;
  border-radius: 16px;
  padding: 2.5rem;
  margin: 3rem 0;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1);
  position: relative;
  overflow: hidden;
}

.img-left::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 6px;
  background: linear-gradient(90deg, var(--primary-gold), var(--primary-red));
}

.img-left .wp-block-column:first-child {
  position: relative;
}

.img-left .wp-block-column:first-child .wp-block-image {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(255, 167, 38, 0.25);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.img-left .wp-block-column:first-child .wp-block-image::before {
  content: "";
  position: absolute;
  top: -50%;
  right: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    -45deg,
    transparent 30%,
    rgba(255, 255, 255, 0.3) 50%,
    transparent 70%
  );
  transform: rotate(-45deg);
  transition: all 0.6s ease;
  z-index: 1;
}

.img-left .wp-block-column:first-child .wp-block-image:hover::before {
  right: 100%;
}

.img-left .wp-block-column:first-child .wp-block-image:hover {
  transform: scale(1.05);
  box-shadow: 0 12px 48px rgba(255, 167, 38, 0.35);
}

.img-left .wp-block-column:first-child img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
  position: relative;
}

.img-left .wp-block-column:last-child {
  padding-left: 2rem;
}

/* ============================================
   FULL WIDTH COVER - HERO SECTIONS
   ============================================ */
.full-width-cover {
  margin: 4rem 0;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.2);
  position: relative;
}

.full-width-cover::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    135deg,
    rgba(211, 47, 47, 0.7) 0%,
    rgba(255, 167, 38, 0.6) 100%
  );
  mix-blend-mode: multiply;
  pointer-events: none;
}

.full-width-cover .wp-block-cover__inner-container {
  position: relative;
  z-index: 2;
}

.full-width-cover h3 {
  color: #fff;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3);
  margin-bottom: 1.5rem;
}

.full-width-cover p {
  color: #fff;
  text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
}

.full-width-cover a {
  color: var(--accent-gold);
  text-decoration: underline;
  font-weight: 600;
  transition: color 0.3s ease;
}

.full-width-cover a:hover {
  color: #fff;
}

/* ============================================
   THEME BLOCKS - RESTAURANT CARDS
   ============================================ */
.theme-block {
  background: linear-gradient(135deg, #fff 0%, #fafafa 100%);
  border-radius: 16px;
  padding: 2.5rem;
  margin: 2rem 0;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  border: 2px solid transparent;
  transition: all 0.4s ease;
  position: relative;
  overflow: hidden;
}

.theme-block::before {
  content: "🍽️";
  position: absolute;
  top: 20px;
  right: 20px;
  font-size: 3rem;
  opacity: 0.1;
}

.theme-block:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 40px rgba(211, 47, 47, 0.15);
  border-color: var(--primary-gold);
}

.theme-block h3 {
  margin-top: 0;
  padding-bottom: 1rem;
  border-bottom: 3px solid var(--primary-gold);
  margin-bottom: 1.5rem;
}

.theme-block .wp-block-image {
  margin-top: 1.5rem;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
}

.theme-block img {
  transition: transform 0.4s ease;
}

.theme-block:hover img {
  transform: scale(1.08);
}

/* ============================================
   LINKS & BUTTONS
   ============================================ */
a {
  color: var(--primary-red);
  text-decoration: none;
  font-weight: 600;
  transition: all 0.3s ease;
  position: relative;
}

a::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--primary-gold);
  transition: width 0.3s ease;
}

a:hover::after {
  width: 100%;
}

a:hover {
  color: var(--primary-gold);
}

/* ============================================
   BLOCKQUOTE - DISCLAIMER
   ============================================ */
.wp-block-quote {
  background: linear-gradient(135deg, #f5f5f5 0%, #ebebeb 100%);
  border-left: 6px solid var(--primary-red);
  padding: 2rem 2.5rem;
  margin: 3rem 0;
  border-radius: 8px;
  font-style: italic;
  color: #555;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.wp-block-quote p:first-child {
  font-weight: 700;
  color: var(--primary-red);
  font-size: 1.1rem;
  margin-bottom: 1rem;
}

.wp-block-quote em {
  font-size: 0.95rem;
  line-height: 1.7;
}

/* ============================================
   TABLES - RESTAURANT INFO
   ============================================ */
table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 2rem 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

thead {
  background: linear-gradient(135deg, var(--primary-red), #c62828);
  color: #fff;
}

thead th {
  padding: 1.5rem 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 0.95rem;
}

tbody tr {
  transition: background 0.3s ease;
}

tbody tr:nth-child(even) {
  background: #fafafa;
}

tbody tr:hover {
  background: #fff9e6;
}

tbody td {
  padding: 1.2rem 1rem;
  border-bottom: 1px solid #e0e0e0;
}

tbody tr:last-child td {
  border-bottom: none;
}

/* ============================================
   FAQ SECTION STYLES
   ============================================ */
.faq-item {
  background: #fff;
  border-radius: 12px;
  padding: 2rem;
  margin: 1.5rem 0;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  border-left: 5px solid var(--primary-gold);
  transition: all 0.3s ease;
}

.faq-item:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  transform: translateX(8px);
}

.faq-item h4 {
  color: var(--primary-red);
  font-size: 1.3rem;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.faq-item h4::before {
  content: "❓";
  font-size: 1.5rem;
}

.faq-item p {
  color: #555;
  line-height: 1.8;
}

/* ============================================
   RESTAURANT INFO BADGES
   ============================================ */
.restaurant-info {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  margin: 1rem 0;
}

.info-badge {
  background: linear-gradient(135deg, #fff9e6, #ffe8cc);
  padding: 0.6rem 1.2rem;
  border-radius: 20px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--primary-red);
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* ============================================
   RATING STARS
   ============================================ */
.rating {
  color: var(--primary-gold);
  font-size: 1.2rem;
  display: inline-block;
  margin-left: 0.5rem;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */
@media (max-width: 768px) {
  h1.wp-block-heading {
    font-size: 2rem;
  }

  h2.wp-block-heading {
    font-size: 1.7rem;
  }

  .img-right,
  .img-left {
    padding: 1.5rem;
  }

  .img-right .wp-block-column:first-child,
  .img-left .wp-block-column:last-child {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 1.5rem;
  }

  .theme-block {
    padding: 1rem;
  }

  .top-list {
    padding: 1.5rem;
    font-size: 1rem;
  }
}

/* ============================================
   PRINT STYLES
   ============================================ */
@media print {
  .img-right,
  .img-left,
  .theme-block {
    box-shadow: none;
    border: 1px solid #ddd;
  }

  a::after {
    display: none;
  }
}

/* ============================================
   CASINO PAGE STYLES - EXTENSION
   Maintains restaurant color scheme with casino elements
   ============================================ */

/* REVIEW BLOCKS - CASINO CARDS */
.review-block {
  background: linear-gradient(135deg, #fff 0%, #fafafa 100%);
  border-radius: 20px;
  padding: 1.4rem;
  margin: 2rem 0;
  box-shadow: 0 12px 40px rgba(211, 47, 47, 0.15);
  border: 3px solid transparent;
  background-clip: padding-box;
  position: relative;
  overflow: hidden;
  transition: all 0.4s ease;
}

.review-block::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 8px;
  background: linear-gradient(
    90deg,
    var(--primary-red),
    var(--primary-gold),
    var(--primary-red)
  );
  background-size: 200% 100%;
  animation: shimmer 3s linear infinite;
}

@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

.review-block:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 60px rgba(211, 47, 47, 0.25);
  border-color: var(--primary-gold);
}

.review-block h3 {
  font-size: 2rem;
  margin-bottom: 2rem;
  position: relative;
  padding-left: 4rem;
  padding-bottom: 1.5rem;
  color: var(--primary-red);
}

.review-block h3::before {
  content: "🎰";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 3rem;
  background: linear-gradient(135deg, #fff9e6, #ffe8cc);
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  box-shadow: 0 4px 16px rgba(211, 47, 47, 0.2);
}

.review-block h3::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 120px;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--primary-red),
    var(--primary-gold),
    transparent
  );
  border-radius: 2px;
}

.review-block .wp-block-image {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
  margin-bottom: 2rem;
  position: relative;
}

.review-block .wp-block-image::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    135deg,
    rgba(211, 47, 47, 0.1),
    rgba(255, 167, 38, 0.1)
  );
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
}

.review-block:hover .wp-block-image::after {
  opacity: 1;
}

.review-block img {
  transition: transform 0.5s ease;
}

.review-block:hover img {
  transform: scale(1.05);
}

/* PLATFORM DETAILS SECTION */
.platform-details {
  background: transparent;
  position: relative;
  padding-top: 20px;
}

.platform-details::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100px;
  height: 4px;
  background: linear-gradient(90deg, var(--primary-red), var(--primary-gold));
  border-radius: 2px;
}

.platform-details > p:first-child {
  font-weight: 700;
  font-size: 1.5rem;
  color: var(--primary-red);
  margin-bottom: 2.5rem;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 2px;
  position: relative;
}

.platform-details > p:first-child::after {
  content: "◆◆◆";
  display: block;
  margin-top: 0.8rem;
  color: var(--primary-gold);
  font-size: 0.8rem;
  letter-spacing: 0.5rem;
}

.platform-details .wp-block-columns {
  margin-bottom: 2rem;
  gap: 2rem;
}

.platform-details .wp-block-column {
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(135deg, #fff 0%, #fafafa 100%);
  border-radius: 16px;
  padding: 1.4rem;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  position: relative;
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  border: 2px solid transparent;
}

.platform-details .wp-block-column::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  background: linear-gradient(
    90deg,
    var(--primary-gold),
    var(--primary-red),
    var(--primary-gold)
  );
  background-size: 200% 100%;
  animation: gradientShift 3s ease-in-out infinite;
}

@keyframes gradientShift {
  0%,
  100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

.platform-details .wp-block-column::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 167, 38, 0.1),
    transparent
  );
  transform: translateY(-50%);
  transition: right 0.6s ease;
}

.platform-details .wp-block-column:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 40px rgba(211, 47, 47, 0.15);
  border-color: rgba(255, 167, 38, 0.3);
}

.platform-details .wp-block-column:hover::after {
  right: 100%;
}

.platform-details .wp-block-column p {
  font-size: 0.95rem;
  line-height: 1.9;
  color: #333;
  margin: 0;
  position: relative;
  z-index: 1;
}

.platform-details .wp-block-column p strong {
  color: var(--primary-red);
  font-weight: 700;
  display: inline-block;
  position: relative;
  padding-right: 0.5rem;
}

/* Different decoration for each column */
.platform-details .wp-block-columns .wp-block-column:nth-child(1) {
  background: linear-gradient(135deg, #fff9e6 0%, #fff 100%);
}

.platform-details .wp-block-columns .wp-block-column:nth-child(2) {
  background: linear-gradient(135deg, #fff 0%, #ffe8cc 100%);
}

.platform-details .wp-block-columns .wp-block-column:nth-child(3) {
  background: linear-gradient(135deg, #fafafa 0%, #fff9e6 100%);
}

/* PROS AND CONS SECTION */
.pros-cons {
  margin-top: 2rem;
  gap: 2rem;
  margin-bottom: 0;
}

.pros-cons .wp-block-column {
  background: #fff;
  border-radius: 12px;
  padding: 1.4rem;
  margin: 0;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.pros-cons .wp-block-column:first-child {
  border-left: 4px solid #4caf50;
}

.pros-cons .wp-block-column:first-child:hover {
  box-shadow: 0 8px 24px rgba(76, 175, 80, 0.2);
  transform: translateY(-3px);
}

.pros-cons .wp-block-column:last-child {
  border-left: 4px solid #ff9800;
}

.pros-cons .wp-block-column:last-child:hover {
  box-shadow: 0 8px 24px rgba(255, 152, 0, 0.2);
  transform: translateY(-3px);
}

.pros-cons p:first-child {
  font-weight: 700;
  font-size: 1.2rem;
  margin-bottom: 1rem;
}

.pros-cons .wp-block-column:first-child p:first-child {
  color: #4caf50;
}

.pros-cons .wp-block-column:last-child p:first-child {
  color: #ff9800;
}

.pros-cons p:last-child {
  color: #555;
  line-height: 1.8;
}

/* CHOOSE SECTION - STEPS GUIDE */
.choose-section {
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
  border-radius: 24px;
  padding: 1rem 2rem;
  margin: 3rem 0;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  position: relative;
  overflow: hidden;
}

.choose-section p {
  color: #fff;
}

.choose-section::before {
  content: "";
  position: absolute;
  top: -50%;
  right: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(
    circle,
    rgba(211, 47, 47, 0.1) 0%,
    transparent 70%
  );
  animation: pulse 8s ease-in-out infinite;
}

@keyframes pulse {
  0%,
  100% {
    transform: scale(1);
    opacity: 0.5;
  }
  50% {
    transform: scale(1.1);
    opacity: 0.8;
  }
}

.choose-section::after {
  content: "♠ ♥ ♦ ♣";
  position: absolute;
  top: 20px;
  left: 20px;
  font-size: 2rem;
  color: var(--primary-gold);
  opacity: 0.2;
  letter-spacing: 1rem;
}

.choose-section > h2 {
  text-align: center;
  margin-bottom: 3rem;
  color: #fff;
  font-size: 2.5rem;
  position: relative;
  z-index: 1;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

.choose-section > h2::before {
  content: "★";
  display: block;
  font-size: 3rem;
  color: var(--primary-gold);
  margin-bottom: 1rem;
  animation: starGlow 2s ease-in-out infinite;
}

@keyframes starGlow {
  0%,
  100% {
    text-shadow: 0 0 10px rgba(255, 167, 38, 0.5);
  }
  50% {
    text-shadow: 0 0 20px rgba(255, 167, 38, 0.8);
  }
}

.step {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.95) 0%,
    rgba(250, 250, 250, 0.95) 100%
  );
  border-radius: 20px;
  padding: 2.5rem;
  margin: 2.5rem 0;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
  position: relative;
  z-index: 1;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
}

.step:last-child {
  margin-bottom: 0;
}

.step::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 8px;
  background: linear-gradient(
    180deg,
    var(--primary-red) 0%,
    var(--primary-gold) 100%
  );
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.4s ease;
}

.step::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 167, 38, 0.05));
  transition: width 0.4s ease;
}

.step:hover {
  transform: scale(1.02);
  box-shadow: 0 15px 45px rgba(211, 47, 47, 0.25);
}

.step:hover::before {
  transform: scaleY(1);
}

.step:hover::after {
  width: 100%;
}

.step h3 {
  color: var(--primary-red);
  margin-bottom: 1.5rem;
  font-size: 1.6rem;
  position: relative;
  padding-left: 3.5rem;
  display: flex;
  align-items: center;
}

.step h3::before {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  background: linear-gradient(135deg, var(--primary-red), var(--primary-gold));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
  box-shadow: 0 4px 12px rgba(211, 47, 47, 0.3);
}

.step p {
  color: #555;
  line-height: 1.9;
  font-size: 1.05rem;
}

/* NUMBER BADGES FOR STEPS */
.step-1 h3::before {
  content: "1";
  color: #fff;
  font-weight: 700;
}
.step-2 h3::before {
  content: "2";
  color: #fff;
  font-weight: 700;
}
.step-3 h3::before {
  content: "3";
  color: #fff;
  font-weight: 700;
}
.step-4 h3::before {
  content: "4";
  color: #fff;
  font-weight: 700;
}
.step-5 h3::before {
  content: "5";
  color: #fff;
  font-weight: 700;
}
.step-6 h3::before {
  content: "6";
  color: #fff;
  font-weight: 700;
}

/* Staggered animation delay */
.step:nth-child(2) {
  animation-delay: 0.1s;
}
.step:nth-child(3) {
  animation-delay: 0.2s;
}
.step:nth-child(4) {
  animation-delay: 0.3s;
}
.step:nth-child(5) {
  animation-delay: 0.4s;
}
.step:nth-child(6) {
  animation-delay: 0.5s;
}
.step:nth-child(7) {
  animation-delay: 0.6s;
}

/* FAQ SCHEMA STYLING */
.schema-faq {
  background: #fff;
  border-radius: 16px;
  padding: 1rem;
  margin: 2rem 0;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.schema-faq-section {
  background: linear-gradient(135deg, #fafafa 0%, #f5f5f5 100%);
  border-radius: 12px;
  padding: 2rem;
  margin: 1.5rem 0;
  border-left: 4px solid var(--primary-gold);
  transition: all 0.3s ease;
}

.schema-faq-section:hover {
  background: linear-gradient(135deg, #fff9e6 0%, #ffe8cc 100%);
  box-shadow: 0 6px 20px rgba(211, 47, 47, 0.1);
  transform: translateX(8px);
}

.schema-faq-question {
  color: var(--primary-red);
  font-size: 1.2rem;
  margin-bottom: 1rem;
  display: block;
  position: relative;
  padding-left: 2rem;
}

.schema-faq-question::before {
  content: "❓";
  position: absolute;
  left: 0;
  top: 0;
  font-size: 1.5rem;
}

.schema-faq-answer {
  color: #555;
  line-height: 1.8;
  padding-left: 2rem;
}

/* SEPARATOR LINE */
.wp-block-separator {
  border: none;
  height: 3px;
  background: linear-gradient(
    90deg,
    transparent,
    var(--primary-gold),
    transparent
  );
  margin: 3rem 0;
  opacity: 0.6;
}

/* CASINO BADGE ICONS */
.casino-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: linear-gradient(135deg, #fff9e6, #ffe8cc);
  padding: 0.5rem 1rem;
  border-radius: 20px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--primary-red);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  margin: 0.3rem;
}

/* CHIP DECORATION */
.review-block::after {
  content: "🎲";
  position: absolute;
  bottom: 20px;
  right: 20px;
  font-size: 4rem;
  opacity: 0.05;
  transform: rotate(25deg);
}

/* RESPONSIBLE GAMBLING SECTION */
.entry-content > p:last-of-type {
  background: linear-gradient(135deg, #fff9e6, #ffe8cc);
  border-left: 5px solid var(--primary-gold);
  padding: 1.5rem;
  border-radius: 8px;
  font-weight: 600;
  color: #333;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* LICENCE BADGE */
.platform-details .wp-block-column p:contains("Licence"),
.platform-details .wp-block-column p:contains("Licences") {
  position: relative;
  padding-left: 2rem;
}

.platform-details .wp-block-column p:contains("Licence")::before,
.platform-details .wp-block-column p:contains("Licences")::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  width: 24px;
  height: 24px;
  background: #4caf50;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.9rem;
}

/* SCROLL REVEAL ANIMATION */
@media (prefers-reduced-motion: no-preference) {
  .review-block,
  .step {
    opacity: 0;
    animation: fadeInUp 0.6s ease-out forwards;
  }

  .review-block:nth-child(1) {
    animation-delay: 0.1s;
  }
  .review-block:nth-child(2) {
    animation-delay: 0.2s;
  }
  .review-block:nth-child(3) {
    animation-delay: 0.3s;
  }

  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translateY(30px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
}

/* MOBILE RESPONSIVE */
@media (max-width: 768px) {
  .review-block {
    padding: 1.2rem;
  }
  .review-block h3 {
    padding-left: 0;
    font-size: 1.3rem;
  }

  .step h3 {
    font-size: 1.3rem;
    padding-left: 1.7rem;
  }

  .step h3::before {
    left: -19px;
    width: 40px;
    height: 40px;
    font-size: 1.4rem;
  }

  .review-block h3::before {
    display: none;
  }

  .step {
    padding: 1.5rem;
  }

  .pros-cons {
    flex-direction: column;
  }

  .schema-faq-section {
    padding: 1.5rem;
  }
}

/* PRINT STYLES */
@media print {
  .review-block,
  .step,
  .schema-faq-section {
    page-break-inside: avoid;
    box-shadow: none;
    border: 1px solid #ddd;
  }
}

/* TRUST LIST STYLING */
.trust-list {
  list-style: none;
  padding: 0;
  margin: 3rem 0;
  counter-reset: trust-counter;
}

.trust-list li {
  background: linear-gradient(135deg, #fff 0%, #fafafa 100%);
  border-radius: 16px;
  padding: 2rem 2rem 2rem 5rem;
  margin: 1.5rem 0;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
  position: relative;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  counter-increment: trust-counter;
  overflow: hidden;
}

.trust-list li::before {
  content: counter(trust-counter);
  position: absolute;
  left: 1.5rem;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  background: linear-gradient(135deg, var(--primary-red), var(--primary-gold));
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 700;
  box-shadow: 0 4px 12px rgba(211, 47, 47, 0.3);
  transition: all 0.3s ease;
}

.trust-list li::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--primary-gold),
    var(--primary-red),
    var(--primary-gold)
  );
  background-size: 200% 100%;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.trust-list li:hover {
  transform: translateX(10px);
  box-shadow: 0 10px 30px rgba(211, 47, 47, 0.15);
}

.trust-list li:hover::before {
  transform: translateY(-50%) scale(1.1);
  box-shadow: 0 6px 16px rgba(211, 47, 47, 0.4);
}

.trust-list li:hover::after {
  opacity: 1;
  animation: shimmer 2s linear infinite;
}

.trust-list li strong {
  color: var(--primary-red);
  font-size: 1.1rem;
  display: block;
  margin-bottom: 0.5rem;
  position: relative;
}

.trust-list li strong::after {
  content: "✓";
  position: absolute;
  right: 0;
  top: 0;
  color: var(--primary-gold);
  font-size: 1.2rem;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.trust-list li:hover strong::after {
  opacity: 1;
}

/* Different icon/decoration for each list item */
.trust-list li:nth-child(1)::before {
  content: "🛡️";
  font-size: 1.8rem;
  background: linear-gradient(135deg, #4caf50, #45a049);
}

.trust-list li:nth-child(2)::before {
  content: "💰";
  font-size: 1.8rem;
  background: linear-gradient(135deg, var(--primary-gold), #f57c00);
}

.trust-list li:nth-child(3)::before {
  content: "⚖️";
  font-size: 1.8rem;
  background: linear-gradient(135deg, #2196f3, #1976d2);
}

.trust-list li:nth-child(4)::before {
  content: "⭐";
  font-size: 1.8rem;
  background: linear-gradient(135deg, var(--primary-red), #c62828);
}

.trust-list li:nth-child(5)::before {
  content: "💬";
  font-size: 1.8rem;
  background: linear-gradient(135deg, #9c27b0, #7b1fa2);
}

/* Staggered entrance animation */
.trust-list li:nth-child(1) {
  animation-delay: 0.1s;
}
.trust-list li:nth-child(2) {
  animation-delay: 0.2s;
}
.trust-list li:nth-child(3) {
  animation-delay: 0.3s;
}
.trust-list li:nth-child(4) {
  animation-delay: 0.4s;
}
.trust-list li:nth-child(5) {
  animation-delay: 0.5s;
}

/* ============================================
   CASINO TABLE STYLING
   ============================================ */

.tbl-casino-wrap {
  margin: 3rem 0;
  position: relative;
}

.tbl-casino-row {
  background: linear-gradient(135deg, #fff 0%, #fafafa 100%);
  border-radius: 20px;
  margin: 2rem 0;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  transition: all 0.4s ease;
  position: relative;
  border: 2px solid transparent;
}

.tbl-casino-row::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  background: linear-gradient(
    90deg,
    var(--primary-gold),
    var(--primary-red),
    var(--primary-gold)
  );
  background-size: 200% 100%;
  animation: gradientShift 3s ease-in-out infinite;
}

.tbl-casino-row:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 48px rgba(211, 47, 47, 0.2);
  border-color: rgba(255, 167, 38, 0.3);
}

/* FIRST ITEM - TOP CASINO BADGE */
.tbl-casino-row:first-child {
  background: linear-gradient(135deg, #fff9e6 0%, #fff 100%);
  border: 3px solid var(--primary-gold);
  box-shadow: 0 12px 40px rgba(255, 167, 38, 0.25);
  position: relative;
}

.tbl-casino-row:first-child::after {
  content: "⭐ TOP PICK";
  position: absolute;
  top: -15px;
  right: 30px;
  background: linear-gradient(135deg, var(--primary-red), var(--primary-gold));
  color: #fff;
  padding: 0.5rem 1.5rem;
  border-radius: 25px;
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 1px;
  box-shadow: 0 6px 20px rgba(211, 47, 47, 0.4);
  z-index: 10;
  animation: badgePulse 2s ease-in-out infinite;
}

@keyframes badgePulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 8px 25px rgba(211, 47, 47, 0.5);
  }
}

.tbl-casino-row:first-child .tbl-casino-main {
  background: linear-gradient(90deg, rgba(255, 249, 230, 0.5), transparent);
}

/* MAIN LAYOUT */
.tbl-casino-main {
  display: flex;
  align-items: center;
  padding: 2rem;
  gap: 2rem;
  position: relative;
}

/* CASINO LOGO/IMAGE */
.tbl-casino-img {
  flex-shrink: 0;
  width: 180px;
  height: 100px;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  transition: all 0.3s ease;
  position: relative;
  background-color: #fff !important;
}

.tbl-casino-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 0.4s ease;
}

.tbl-casino-row:hover .tbl-casino-img {
  box-shadow: 0 8px 24px rgba(211, 47, 47, 0.2);
}

.tbl-casino-row:hover .tbl-casino-img img {
  transform: scale(1.08);
}

/* Hide unnecessary buttons in image */
.tbl-casino-img button {
  display: none;
}

/* CASINO INFO */
.tbl-casino-info {
  flex: 1;
  padding: 0 1rem;
  text-align: center;
}

.tbl-casino-info a {
  text-decoration: none;
  color: inherit;
}

.tbl-casino-title h2 {
  font-size: 1.8rem;
  color: var(--primary-red);
  margin: 0 0 0.5rem 0;
  font-weight: 700;
  transition: color 0.3s ease;
}

.tbl-casino-row:hover .tbl-casino-title h2 {
  color: var(--primary-gold);
}

.tbl-casino-text {
  color: #666;
  font-size: 0.95rem;
  line-height: 1.6;
}

/* Hide info button */
.tbl-casino-info button {
  display: none;
}

/* PLAY NOW BUTTON */
.tbl-casino-links {
  padding: 0 2rem 0 1rem;
}

.tbl-casino-btn-visit {
  background: linear-gradient(135deg, var(--primary-red), var(--primary-gold));
  color: #fff;
  border: none;
  padding: 1rem 2.5rem;
  border-radius: 30px;
  font-size: 1.1rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 16px rgba(211, 47, 47, 0.3);
  text-transform: uppercase;
  letter-spacing: 1px;
  position: relative;
  overflow: hidden;
}

.tbl-casino-btn-visit::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  transform: translate(-50%, -50%);
  transition: width 0.6s, height 0.6s;
}

.tbl-casino-btn-visit:hover::before {
  width: 300px;
  height: 300px;
}

.tbl-casino-btn-visit:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 24px rgba(211, 47, 47, 0.5);
}

.tbl-casino-btn-visit:active {
  transform: scale(0.98);
}

/* First item button special style */
.tbl-casino-row:first-child .tbl-casino-btn-visit {
  background: linear-gradient(135deg, #ffa726, #f57c00);
  box-shadow: 0 6px 20px rgba(255, 167, 38, 0.4);
}

.tbl-casino-row:first-child .tbl-casino-btn-visit::after {
  content: "🔥";
  margin-left: 0.5rem;
}

/* ROW NUMBER INDICATOR */
.tbl-casino-wrap .tbl-casino-row {
  counter-increment: casino-counter;
}

.tbl-casino-main::before {
  content: "#" counter(casino-counter);
  position: absolute;
  top: 10px;
  left: 10px;
  background: rgba(0, 0, 0, 0.05);
  color: #999;
  padding: 0.3rem 0.8rem;
  border-radius: 20px;
  font-size: 0.85rem;
  font-weight: 700;
}

.tbl-casino-row:first-child .tbl-casino-main::before {
  background: linear-gradient(135deg, var(--primary-gold), #f57c00);
  color: #fff;
  box-shadow: 0 2px 8px rgba(255, 167, 38, 0.3);
}

/* RESPONSIVE DESIGN */
@media (max-width: 1024px) {
  .tbl-casino-main {
    flex-wrap: wrap;
    gap: 1.5rem;
  }

  .tbl-casino-img {
    width: 150px;
    height: 80px;
  }

  .tbl-casino-links {
    width: 100%;
    text-align: center;
    padding: 0;
  }

  .tbl-casino-btn-visit {
    width: 100%;
  }
}

@media (max-width: 768px) {
  .tbl-casino-main {
    flex-direction: column;
    padding: 1.5rem;
    text-align: center;
  }

  .tbl-casino-img {
    width: 100%;
    max-width: 250px;
    height: 120px;
    margin: 0 auto;
  }

  .tbl-casino-info {
    padding: 0;
    width: 100%;
  }

  .tbl-casino-title h2 {
    font-size: 1.5rem;
  }

  .tbl-casino-extra {
    width: 100%;
    min-width: auto;
    padding: 0;
  }

  .tbl-casino-row:first-child::after {
    top: -12px;
    right: 50%;
    transform: translateX(50%);
    font-size: 0.85rem;
    padding: 0.4rem 1.2rem;
  }

  .mob-hide {
    display: block !important;
  }
}

/* STAGGERED ANIMATION */
.tbl-casino-wrap {
  counter-reset: casino-counter;
}

.tbl-casino-row:nth-child(1) {
  animation: fadeInUp 0.6s ease-out 0.1s backwards;
}
.tbl-casino-row:nth-child(2) {
  animation: fadeInUp 0.6s ease-out 0.2s backwards;
}
.tbl-casino-row:nth-child(3) {
  animation: fadeInUp 0.6s ease-out 0.3s backwards;
}
.tbl-casino-row:nth-child(4) {
  animation: fadeInUp 0.6s ease-out 0.4s backwards;
}
.tbl-casino-row:nth-child(5) {
  animation: fadeInUp 0.6s ease-out 0.5s backwards;
}
.tbl-casino-row:nth-child(6) {
  animation: fadeInUp 0.6s ease-out 0.6s backwards;
}
.tbl-casino-row:nth-child(7) {
  animation: fadeInUp 0.6s ease-out 0.7s backwards;
}
.tbl-casino-row:nth-child(8) {
  animation: fadeInUp 0.6s ease-out 0.8s backwards;
}

@media (max-width: 991px) {
  .main-mobile-menu {
    justify-content: flex-end !important;
  }
}