/*
 Theme Name:   Royal Rajputhana Child
 Theme URI:    
 Description:  
 Author:       Prominere
 Author URI:   http://prominere.org/
 Template:     wp_nuvo
 Version:      
 Tags:         two-columns, three-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
 Text Domain:  wp-nuvo-child-theme
*/

/* ============================================================
   ROYAL RAJPUTANA - REGAL & MODERN REDESIGN
   Color Palette (from menu branding):
   - Saffron Gold:    #F5A623
   - Deep Crimson:    #8B1A1A
   - Rich Gold:       #C8960C
   - Warm Amber:      #E8961A
   - Cream/Ivory:     #FDF5E6
   - Dark Maroon:     #6B0F0F
   - Deep Burgundy:   #A61B1C
   ============================================================ */

/* ---- GOOGLE FONTS IMPORT ---- */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;900&family=Lato:wght@300;400;700&display=swap');

/* ---- CSS VARIABLES ---- */
:root {
  --rr-saffron:    #F5A623;
  --rr-gold:       #C8960C;
  --rr-amber:      #E8961A;
  --rr-crimson:    #8B1A1A;
  --rr-maroon:     #A61B1C;
  --rr-dark-maroon:#6B0F0F;
  --rr-cream:      #FDF5E6;
  --rr-ivory:      #FFF8E7;
  --rr-text-dark:  #2C1A0E;
  --rr-gold-border: rgba(200,150,12,0.4);
}

/* ============================================================
   GLOBAL TYPOGRAPHY
   ============================================================ */
body {
  font-family: 'Lato', sans-serif !important;
  color: var(--rr-text-dark) !important;
}

h1, h2, h3, h4, h5, h6,
.cs-section-title,
.wpb_content_element h2 {
  font-family: 'Cinzel', serif !important;
  letter-spacing: 0.05em;
}

/* ============================================================
   HEADER TOP BAR - Gradient Maroon to Deep Crimson
   ============================================================ */
#header-top,
.header-top-wrapper,
.header .header-top {
  background: linear-gradient(135deg, var(--rr-dark-maroon) 0%, var(--rr-maroon) 50%, #B52020 100%) !important;
  
}

.header-top {
  background: transparent !important;
  padding: 8px 0 !important;
}

.header-top .header-top-1,
.header-top .header-top-2,
.header-top .header-top-3 {
  color: var(--rr-cream) !important;
}

.header-top a,
.header-top p,
.header-top span,
.header-top div {
  color: var(--rr-cream) !important;
}

.header-top a:hover {
  color: var(--rr-saffron) !important;
}

/* CTA Buttons in header-top */
.header-top-3 .widget a,
.header-top-3 a,
.header-top .btn {
  background: linear-gradient(135deg, var(--rr-saffron), var(--rr-amber)) !important;
  color: var(--rr-dark-maroon) !important;
  border: 1px solid var(--rr-gold) !important;
  border-radius: 20px !important;
  padding: 6px 16px !important;
  font-family: 'Lato', sans-serif !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: 0.03em !important;
  text-decoration: none !important;
  display: inline-block !important;
  transition: all 0.3s ease !important;
  margin: 3px !important;
  box-shadow: 0 2px 8px rgba(200,150,12,0.3) !important;
}

.header-top-3 .widget a:hover,
.header-top-3 a:hover {
  background: linear-gradient(135deg, #fff5d6, var(--rr-saffron)) !important;
  box-shadow: 0 4px 14px rgba(200,150,12,0.5) !important;
  transform: translateY(-1px) !important;
}

/* ============================================================
   STICKY / MAIN NAVIGATION BAR
   ============================================================ */
.sticky-header,
.cs-sticky,
.header.header-v1 > .row > .sticky-menu,
#sticky-nav-wrap {
  background: linear-gradient(90deg, var(--rr-dark-maroon) 0%, var(--rr-maroon) 100%) !important;
}

.sticky-header {
  background: linear-gradient(90deg, var(--rr-dark-maroon) 0%, var(--rr-maroon) 100%) !important;
  border-bottom: 3px solid var(--rr-saffron) !important;
  box-shadow: 0 4px 20px rgba(107,15,15,0.4) !important;
}

/* Nav menu items */
.cs_mega_menu > li > a,
.nav-holder .cs_mega_menu > li > a,
#sticky-nav-wrap > li > a {
  font-family: 'Cinzel', serif !important;
  font-size: 12px !important;
  letter-spacing: 0.12em !important;
  font-weight: 600 !important;
  color: var(--rr-cream) !important;
  text-transform: uppercase !important;
  padding: 18px 16px !important;
  transition: color 0.3s ease !important;
}

.cs_mega_menu > li > a:hover,
.nav-holder .cs_mega_menu > li > a:hover,
.cs_mega_menu > li.active > a {
  color: var(--rr-saffron) !important;
  background: rgba(245,166,35,0.12) !important;
}

/* Hamburger / Mobile Toggle */
.btn-navbar.navbar-toggle,
.btn.btn-navbar.navbar-toggle {
  background: var(--rr-saffron) !important;
  border: 2px solid var(--rr-gold) !important;
  border-radius: 4px !important;
}

.btn-navbar .icon-bar {
  background-color: var(--rr-dark-maroon) !important;
}

/* ============================================================
   LOGO AREA
   ============================================================ */
.header .logo img,
.sticky-header .logo img {
  max-height: 80px !important;
  width: auto !important;
}

/* ============================================================
   INFO/FEATURE BOXES (Week Timings, Weekend, Find Us)
   ============================================================ */
/*.vc_hidden-xs .wpb_column,
[class*="vc_col-sm-4"] .wpb_wrapper {
  background: linear-gradient(135deg, var(--rr-maroon) 0%, var(--rr-dark-maroon) 100%) !important;
  border: 1px solid var(--rr-saffron) !important;
  border-radius: 4px !important;
}*/

/* Heading inside info boxes */
.vc_hidden-xs h2,
.vc_hidden-xs h3,
.vc_hidden-xs h4 {
  color: var(--rr-saffron) !important;
  font-family: 'Cinzel', serif !important;
}

/* ============================================================
   PAGE SECTION BACKGROUNDS
   ============================================================ */

/* Hero / Slider section */
.cs-cover-slider-events {
  border-bottom: 4px solid var(--rr-saffron) !important;
}

/* "Royal Rajputana" title section (cream bg) */
.wpb_row.title-center.title-large {
  background: linear-gradient(180deg, var(--rr-ivory) 0%, #FFF0CC 100%) !important;
  border-top: 2px solid var(--rr-gold-border) !important;
  border-bottom: 2px solid var(--rr-gold-border) !important;
}

.wpb_row.title-center.title-large h1,
.wpb_row.title-center.title-large h2 {
  color: var(--rr-maroon) !important;
  font-family: 'Cinzel', serif !important;
  letter-spacing: 0.12em !important;
}

.wpb_row.title-center.title-large p,
.wpb_row.title-center.title-large .wpb_text_column {
  color: var(--rr-text-dark) !important;
}

/* Reservations section */
.stripe-parallax-bg {
  background-color: rgba(107,15,15,0.85) !important;
}

.stripe-parallax-bg h1,
.stripe-parallax-bg h2,
.stripe-parallax-bg h3 {
  color: var(--rr-saffron) !important;
  font-family: 'Cinzel', serif !important;
  text-shadow: 1px 2px 6px rgba(0,0,0,0.6) !important;
}

.stripe-parallax-bg p,
.stripe-parallax-bg .wpb_text_column {
  color: var(--rr-cream) !important;
}

/* ============================================================
   RESERVATION FORM
   ============================================================ */
.stripe-parallax-bg input[type="text"],
.stripe-parallax-bg select,
.stripe-parallax-bg textarea {
  border: 1px solid var(--rr-gold) !important;
  border-radius: 4px !important;
  background: rgba(253,245,230,0.95) !important;
  color: var(--rr-text-dark) !important;
}

.stripe-parallax-bg input[type="submit"],
.stripe-parallax-bg button[type="submit"],
#booking-form .btn,
.btn-book-table {
  background: linear-gradient(135deg, var(--rr-saffron), var(--rr-amber)) !important;
  color: var(--rr-dark-maroon) !important;
  border: 2px solid var(--rr-gold) !important;
  border-radius: 25px !important;
  font-family: 'Cinzel', serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  padding: 12px 32px !important;
  transition: all 0.3s ease !important;
  text-transform: uppercase !important;
  box-shadow: 0 4px 14px rgba(200,150,12,0.35) !important;
}

.stripe-parallax-bg input[type="submit"]:hover,
#booking-form .btn:hover {
  background: linear-gradient(135deg, var(--rr-amber), var(--rr-saffron)) !important;
  box-shadow: 0 6px 20px rgba(200,150,12,0.55) !important;
  transform: translateY(-2px) !important;
}

/* ============================================================
   FOOTER
   ============================================================ */
#footer-top,
.footer-top {
  background: linear-gradient(135deg, var(--rr-dark-maroon) 0%, #3D0808 100%) !important;
  /*border-top: 3px solid var(--rr-saffron) !important; */
}

#footer-top h4,
.footer-top h4,
.footer-widget-col h4,
.footer-top .widget-title {
  color: var(--rr-saffron) !important;
  font-family: 'Cinzel', serif !important;
  font-size: 15px !important;
  letter-spacing: 0.1em !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid var(--rr-gold-border) !important;
  margin-bottom: 14px !important;
}

#footer-top h3.wg-title {
    color: #c79c60 !important;
}

#footer-top p,
#footer-top a,
#footer-top li,
#footer-top address,
.footer-top p,
.footer-top a,
.footer-top li {
  color: #EEDCC8 !important;
}

#footer-top a:hover,
.footer-top a:hover {
  color: var(--rr-saffron) !important;
}

.footer-bottom,
#footer-bottom {
  background: #2A0505 !important;
  color: #EEDCC8 !important;
}

.textwidget {
    text-align: right;
}

/* ============================================================
   GENERAL BUTTONS & LINKS
   ============================================================ */
.btn-primary,
.cs-btn,
a.cs-btn,
.vc_btn3 {
  background: linear-gradient(135deg, var(--rr-saffron), var(--rr-amber)) !important;
  color: var(--rr-dark-maroon) !important;
  border: 2px solid var(--rr-gold) !important;
  border-radius: 22px !important;
  font-weight: 700 !important;
  transition: all 0.3s ease !important;
}

.btn-primary:hover,
.cs-btn:hover,
a.cs-btn:hover {
  background: linear-gradient(135deg, var(--rr-amber), var(--rr-saffron)) !important;
  box-shadow: 0 5px 16px rgba(200,150,12,0.45) !important;
}

/* "See Menu" floating button */
.cs-order-btn,
[class*="order-btn"],
[class*="see-menu"] {
  background: linear-gradient(135deg, var(--rr-saffron), var(--rr-amber)) !important;
  color: var(--rr-dark-maroon) !important;
  border: 2px solid var(--rr-gold) !important;
  border-radius: 25px !important;
  font-weight: 700 !important;
}

/* ============================================================
   MENU PAGE ITEMS / POST CARDS
   ============================================================ */
.cs-post-block .entry-header,
.home .type-post .entry-header {
  background: linear-gradient(135deg, var(--rr-maroon), var(--rr-dark-maroon)) !important;
}

.home .type-post h2.entry-title a,
.cs-post-block h2 a {
  color: var(--rr-saffron) !important;
  font-family: 'Cinzel', serif !important;
}

.home .type-post h2.entry-title a:hover {
  color: var(--rr-cream) !important;
}

/* ============================================================
   DECORATIVE GOLD DIVIDERS
   ============================================================ */
.cs-section-title:after,
.title-center .wpb_wrapper > h2:after,
h2.section-heading:after {
  content: '';
  display: block;
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--rr-saffron), transparent);
  margin: 10px auto 0;
  border-radius: 2px;
}

/* ============================================================
   MOBILE RESPONSIVE FIXES
   ============================================================ */

/* Small screens (max 767px) */
@media (max-width: 767px) {

  /* Header top - stack vertically, centered */
  .header-top.clearfix {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 10px 12px !important;
    gap: 6px !important;
  }

  .header-top .header-top-1,
  .header-top .header-top-2,
  .header-top .header-top-3 {
    width: 100% !important;
    text-align: center !important;
    float: none !important;
    padding: 4px 8px !important;
    font-size: 12px !important;
  }

  /* Address line - shorter on mobile */
  .header-top-1 {
    font-size: 11px !important;
    line-height: 1.4 !important;
  }

  /* Email + menu link centered */
  .header-top-2 {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
  }

  /* CTA buttons row - flex centered */
  .header-top-3 {
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    padding: 4px 0 !important;
  }

  .header-top-3 .widget a,
  .header-top-3 a {
    padding: 7px 14px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
    margin: 2px !important;
  }

  /* Sticky nav / main nav on mobile */
  .sticky-header,
  .sticky-menu {
    background: linear-gradient(90deg, var(--rr-dark-maroon), var(--rr-maroon)) !important;
  }

  .col-xs-3 {
    width: 40% !important;
    max-width: 160px !important;
  }

  .col-xs-9 {
    width: 60% !important;
  }

  /* Logo */
  .header .logo img,
  .sticky-header .logo img {
    max-height: 60px !important;
  }

  /* Mobile nav dropdown background */
  .cshero-mobile .dropdown-menu,
  .cs_mega_menu .dropdown-menu,
  #sticky-nav-wrap .sub-menu {
    background: var(--rr-dark-maroon) !important;
    border: 1px solid var(--rr-saffron) !important;
    border-radius: 4px !important;
  }

  .cshero-mobile .dropdown-menu li a,
  #sticky-nav-wrap .sub-menu li a {
    color: var(--rr-cream) !important;
    padding: 10px 16px !important;
    border-bottom: 1px solid rgba(245,166,35,0.15) !important;
  }

  .cshero-mobile .dropdown-menu li a:hover,
  #sticky-nav-wrap .sub-menu li a:hover {
    color: var(--rr-saffron) !important;
    background: rgba(245,166,35,0.1) !important;
  }

  /* Open mobile nav panel */
  .cshero-mobile .collapse.in,
  .cshero-mobile .collapsing {
    background: var(--rr-dark-maroon) !important;
    border-top: 2px solid var(--rr-saffron) !important;
  }

  .cshero-mobile .nav-holder .cs_mega_menu > li {
    border-bottom: 1px solid rgba(245,166,35,0.2) !important;
  }

  .cshero-mobile .nav-holder .cs_mega_menu > li > a {
    color: var(--rr-cream) !important;
    padding: 12px 16px !important;
    font-size: 13px !important;
  }

  .cshero-mobile .nav-holder .cs_mega_menu > li > a:hover,
  .cshero-mobile .nav-holder .cs_mega_menu > li > a:focus {
    color: var(--rr-saffron) !important;
    background: rgba(245,166,35,0.1) !important;
  }

  /* Week/Weekend/Find Us boxes - stack on mobile */
  .vc_hidden-xs {
    display: block !important;
  }

  .ww-same-height .vc_column_container {
    width: 100% !important;
    margin-bottom: 12px !important;
  }

  /* Content sections */
  .wpb_row {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* Footer stacked layout */
  .footer-top-1,
  .footer-top-2,
  .footer-top-3,
  .footer-top-4 {
    width: 100% !important;
    float: none !important;
    padding: 16px !important;
    border-bottom: 1px solid rgba(245,166,35,0.2) !important;
  }

  /* Post grid - single column */
  .cs-post-block article,
  .home article.type-post {
    width: 100% !important;
    float: none !important;
    margin-bottom: 20px !important;
  }

  /* Images */
  img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* Text sizing */
  h1 { font-size: 26px !important; }
  h2 { font-size: 22px !important; }
  h3 { font-size: 18px !important; }

  /* Forms */
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  textarea,
  select {
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* Medium screens (768px - 991px) */
@media (min-width: 768px) and (max-width: 991px) {
  .header-top-3 .widget a,
  .header-top-3 a {
    font-size: 12px !important;
    padding: 6px 12px !important;
  }

  .cs_mega_menu > li > a {
    font-size: 11px !important;
    padding: 18px 10px !important;
  }

  .header .logo img {
    max-height: 70px !important;
  }
}

/* ============================================================
   SCROLL-TO-TOP BUTTON
   ============================================================ */
#back-to-top,
.scrollup,
.scroll-top {
  background: linear-gradient(135deg, var(--rr-saffron), var(--rr-amber)) !important;
  border: 2px solid var(--rr-gold) !important;
  color: var(--rr-dark-maroon) !important;
  border-radius: 50% !important;
}

/* ============================================================
   SLIDER TEXT OVERLAY
   ============================================================ */
.cs-slider-text h1,
.cs-slider-text h2,
.rev_slider h1,
.rev_slider h2 {
  font-family: 'Cinzel', serif !important;
  color: var(--rr-cream) !important;
  text-shadow: 2px 3px 10px rgba(0,0,0,0.7) !important;
}

/* ============================================================
   SOCIAL ICONS
   ============================================================ */
.social-links a,
.footer-social a {
  color: var(--rr-saffron) !important;
  border: 1px solid var(--rr-saffron) !important;
  border-radius: 50% !important;
  width: 32px !important;
  height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.3s ease !important;
}

.social-links a:hover,
.footer-social a:hover {
  background: var(--rr-saffron) !important;
  color: var(--rr-dark-maroon) !important;
}

/* ============================================================
   ADMIN BAR COMPENSATION (mobile)
   ============================================================ */
@media (max-width: 767px) {
  html.wp-toolbar {
    padding-top: 46px !important;
  }
}


/* ============================================================
   ADDITIONAL SPECIFICITY OVERRIDES
   (Overriding Visual Composer custom.css yellow nav)
   ============================================================ */

/* Main sticky/secondary header - override VC custom.css yellow */
#header-sticky,
header#header-sticky,
#header-sticky.sticky-header,
#header-sticky.cs-sticky {
  background: linear-gradient(90deg, #6B0F0F 0%, #A61B1C 100%) !important;
  background-color: #8B1A1A !important;
  border-bottom: 3px solid #F5A623 !important;
  box-shadow: 0 4px 20px rgba(107,15,15,0.4) !important;
}

/* Nav links inside sticky header */
#header-sticky .cs_mega_menu > li > a,
#header-sticky #sticky-nav-wrap > li > a,
#sticky-nav-wrap li > a,
.sticky-menu .cs_mega_menu li > a {
  color: #FDF5E6 !important;
  font-family: 'Cinzel', serif !important;
  font-size: 12px !important;
  letter-spacing: 0.1em !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
}

#header-sticky .cs_mega_menu > li > a:hover,
#sticky-nav-wrap li > a:hover {
  color: #F5A623 !important;
  background: rgba(245,166,35,0.12) !important;
}

/* Main logo area navigation row */
.header.header-v1 {
  background: transparent !important;
}

/* The header section (second row with logo + nav) */
.header-wrapper {
  background: linear-gradient(90deg, #6B0F0F 0%, #8B1A1A 100%) !important;
  border-bottom: 3px solid #F5A623 !important;
}

/* Override any inline-set white background on sticky header */
.header .sticky-header,
.sticky-header.cs-sticky {
  background: linear-gradient(90deg, #6B0F0F 0%, #A61B1C 100%) !important;
}

/* Nav holder row background */
.sticky-menu.col-xs-9,
.sticky-menu.col-sm-9,
.sticky-menu.col-md-9 {
  background: transparent !important;
}

/* Ensure logo row is transparent (inherits from sticky header) */
.cshero-logo.logo-sticky {
  background: transparent !important;
}

/* Secondary nav bar nav items */
nav#sticky-nav-wrap {
  background: transparent !important;
}

/* The mobile dropdown opened nav */
.cshero-mobile .cs_mega_menu,
.cshero-mobile #sticky-nav-wrap {
  background: #6B0F0F !important;
}


/* ============================================================
   MAIN NAV HEADER (#cshero-header) - Override white background
   ============================================================ */

#cshero-header,
header#cshero-header {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border-bottom: 3px solid #F5A623 !important;
  box-shadow: none !important;
}

/* Nav links inside cshero-header */
#cshero-header .cs_mega_menu > li > a,
#cshero-header nav a,
#cshero-header .nav-holder ul li a {
  color: #6B0F0F !important;
  font-family: 'Cinzel', serif !important;
  font-size: 12px !important;
  letter-spacing: 0.1em !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
}

#cshero-header .cs_mega_menu > li > a:hover,
#cshero-header nav a:hover {
  color: #F5A623 !important;
}

/* Logo in main header */
#cshero-header .logo a,
#cshero-header .cshero-logo a {
  display: inline-block !important;
}

/* Parallax wrapper background (white) */
.ww-parallax-bg {
  background-color: transparent !important;
}

/* Override the inline white on the sticky header nav row */
#header-sticky .row,
#header-sticky .container {
  background: transparent !important;
}

/* Ensure body background is cream/ivory not white */
body {
  background-color: #FDF5E6 !important;
}


/* ---- FIX HEADER TOP BUTTONS ALIGNMENT ---- */
/* Fix the delivery button container to align with other buttons */
.delivery-btn1 {
  background: linear-gradient(135deg, #F5A623, #E8961A) !important;
  display: inline-block !important;
  border: 1px solid #C8960C !important;
  border-radius: 20px !important;
  padding: 3px 4px !important;
  cursor: pointer !important;
  line-height: normal !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  font-family: 'Lato', sans-serif !important;
  color: #6B0F0F !important;
  vertical-align: middle !important;
  margin: 3px !important;
  box-shadow: 0 2px 8px rgba(200,150,12,0.3) !important;
  text-decoration: none !important;
}

.delivery-btn1 > a {
  color: #6B0F0F !important;
  text-decoration: none !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: normal !important;
  display: inline !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Fix the See Menu and Order Online button */
.delivery-btn {
  background: linear-gradient(135deg, #F5A623, #E8961A) !important;
  display: inline-block !important;
  border: 1px solid #C8960C !important;
  border-radius: 20px !important;
  padding: 6px 16px !important;
  cursor: pointer !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  font-family: 'Lato', sans-serif !important;
  color: #6B0F0F !important;
  vertical-align: middle !important;
  margin: 3px !important;
  box-shadow: 0 2px 8px rgba(200,150,12,0.3) !important;
  line-height: normal !important;
  text-decoration: none !important;
}

/* Make header-top-3 textwidget use flex for alignment */
.header-top-3 .textwidget {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 4px !important;
  height: 100% !important;
}

/* Ensure header-top-3 column aligns vertically */
.header-top-3 {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

#header-top .header-top-3 {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}
