/*
Theme Name: Flatsome Child
Description: Abba Hotel – Hebrew RTL design system (Jaffa boutique: stone, brass, deep green)
Author: UX Themes / Abba Hotel
Template: flatsome
Version: 5.1
*/

/* =========================================================
   ABBA HOTEL DESIGN TOKENS
   Palette drawn from Jaffa: limestone, brass, shutter-green
   ========================================================= */
:root{
  --abba-ink:    #23211c;   /* warm charcoal text */
  --abba-ink-2:  #4d483f;   /* secondary text */
  --abba-stone:  #f6f3ec;   /* page background */
  --abba-sand:   #ebe4d3;   /* alternate section bg */
  --abba-brass:  #c08a76;   /* copper-rose accent – matched to the logo */
  --abba-brass-d:#a56e59;   /* copper hover */
  --abba-dark:   #141311;   /* near-black – top bar, footer */
  --abba-dark-d: #0b0a09;
  --abba-white:  #ffffff;
  --abba-line:   rgba(35,33,28,.12);
  --abba-radius: 6px;
  --abba-shadow: 0 10px 30px rgba(35,33,28,.10);
  --abba-font-display: 'Frank Ruhl Libre', 'David Libre', serif;
  --abba-font-body: 'Heebo', 'Assistant', sans-serif;
}

/* =========================================================
   BASE / TYPOGRAPHY
   ========================================================= */
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001s !important; transition-duration:.001s !important; }
}

body{
  font-family: var(--abba-font-body);
  color: var(--abba-ink);
  background: var(--abba-stone);
  font-size: 17px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

h1,h2,h3,h4,.heading-font,.section-title span{
  font-family: var(--abba-font-display);
  color: var(--abba-ink);
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.25;
}
h1{ font-size: clamp(2rem, 4.5vw, 3.1rem); }
h2{ font-size: clamp(1.6rem, 3.2vw, 2.3rem); }
h3{ font-size: clamp(1.25rem, 2.2vw, 1.6rem); }

p{ color: var(--abba-ink-2); }
.entry-content a:not(.button), .col a:not(.button), p a{ color: var(--abba-brass-d) !important; text-decoration-color: rgba(192,138,118,.4); transition: color .18s ease; }
a:hover{ color: var(--abba-dark); }

/* Signature: short brass rule under section titles */
.section-title-normal{ border-bottom: 0; }
.section-title-normal span{ border-bottom: 0; padding-bottom: 14px; position: relative; }
.section-title-normal span::after{
  content:""; position:absolute; bottom:0; inset-inline-start:0;
  width:56px; height:2px;
  background: linear-gradient(90deg, var(--abba-brass), rgba(192,138,118,.15));
}

::selection{ background: var(--abba-brass); color:#fff; }

/* =========================================================
   HEADER / NAVIGATION
   ========================================================= */
.header-main{ background: var(--abba-dark) !important; box-shadow: none; }
.header-wrapper, .header{ background: transparent; }
#top-bar, .header-top{ background: var(--abba-dark) !important; }
#top-bar .html, #top-bar a, .header-top a{ color: #e5e0d3 !important; font-size:.82rem; letter-spacing:.02em; }

.header .nav > li > a{
  font-family: var(--abba-font-body);
  font-weight: 500;
  font-size: .98rem;
  letter-spacing:.01em;
  color: #efeae0 !important;
  padding-inline: 14px;
}
.header .nav > li > a:hover,
.header .nav > li.current-menu-item > a{ color: var(--abba-brass) !important; }
.header .icon-search, .header .header-button a, .header i{ color: #efeae0; }

/* brass underline on hover / active */
.header .nav > li > a::after{
  content:""; display:block; height:2px; background: var(--abba-brass);
  transform: scaleX(0); transform-origin: center; transition: transform .22s ease;
  margin-top:4px;
}
.header .nav > li > a:hover::after,
.header .nav > li.current-menu-item > a::after{ transform: scaleX(1); }

/* sticky header polish */
.stuck .header-main{ background: var(--abba-dark) !important; box-shadow: 0 6px 24px rgba(0,0,0,.35); }

/* dropdowns */
.nav-dropdown{
  border: 1px solid var(--abba-line);
  border-radius: var(--abba-radius);
  box-shadow: var(--abba-shadow);
  padding: 10px 0;
}
.nav-dropdown > li > a{ padding: 8px 18px; }

/* =========================================================
   LANGUAGE SWITCHER (injected by functions.php)
   ========================================================= */
.abba-lang{ display:flex; align-items:center; gap:2px; }
.abba-lang a, .abba-lang span{
  display:inline-block; padding: 3px 10px; border-radius: 999px;
  font-size:.82rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  line-height:1.6;
}
.abba-lang span.abba-lang-current{
  background: var(--abba-brass); color:#fff;
}
.abba-lang a{
  color: #efeae0; background: transparent; border:1px solid rgba(255,255,255,.3);
  transition: all .18s ease;
}
/* בתפריט צד מובייל (רקע בהיר) */
.mobile-sidebar .abba-lang a{ color: var(--abba-ink); border-color: var(--abba-line); }
.abba-lang a:hover{ border-color: var(--abba-brass); color: var(--abba-brass); }
li.menu-item.abba-lang{ padding-inline-start: 10px; }
li.menu-item.abba-lang::after{ display:none !important; }

/* =========================================================
   BUTTONS
   ========================================================= */
.button, button, input[type="submit"]{
  font-family: var(--abba-font-body);
  font-weight: 600;
  letter-spacing: .03em;
  border-radius: 999px !important;
  padding-inline: 30px;
  text-transform: none;
}
.button.primary, .button:not(.is-outline):not(.alt):not(.white):not(.secondary){
  background-color: var(--abba-brass) !important;
}
.button.primary:hover,
.button:not(.is-outline):not(.alt):not(.white):not(.secondary):hover{
  background-color: var(--abba-brass-d);
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(192,138,118,.28);
}
.button.secondary, .button.alt{ background-color: var(--abba-dark); }
.button.secondary:hover, .button.alt:hover{ background-color: var(--abba-dark-d); }
.button.is-outline{ border:1.5px solid var(--abba-brass); color: var(--abba-brass-d); }
.button.is-outline:hover{ background: var(--abba-brass); border-color: var(--abba-brass); color:#fff; }

/* =========================================================
   SECTIONS, CARDS, IMAGES
   ========================================================= */
.section{ padding-top: 56px; padding-bottom: 56px; }
.section.abba-sand, .abba-sand{ background: var(--abba-sand) !important; }

.box, .col-inner .box-shadow, .box-shadow{
  border-radius: var(--abba-radius);
  box-shadow: var(--abba-shadow);
}
.box-image img, .img-inner img{ border-radius: var(--abba-radius); }
.box-text h3, .box-text .box-title{ font-family: var(--abba-font-display); }

/* room / feature cards */
.box:hover .box-image img{ transform: scale(1.03); transition: transform .5s ease; }
.box .box-image{ overflow:hidden; border-radius: var(--abba-radius); }

/* banners: soften overlays for readable Hebrew over photos */
.banner .overlay{ background: linear-gradient(180deg, rgba(35,33,28,.15), rgba(35,33,28,.55)); }
.banner h1, .banner h2, .banner h3, .banner p{ color:#fff; }
.banner h1, .banner h2{ text-shadow: 0 2px 18px rgba(0,0,0,.35); }

/* dividers */
hr, .divider{ background: var(--abba-line); }

/* breadcrumbs */
.breadcrumbs{ font-size:.85rem; color: var(--abba-ink-2); text-transform:none; }

/* =========================================================
   FORMS (CF7 / booking)
   ========================================================= */
input[type="text"],input[type="email"],input[type="tel"],input[type="date"],
input[type="number"],select,textarea{
  border:1px solid var(--abba-line);
  border-radius: var(--abba-radius);
  background:#fff;
  box-shadow:none;
  padding: 10px 14px;
  font-family: var(--abba-font-body);
}
input:focus,select:focus,textarea:focus{
  border-color: var(--abba-brass);
  box-shadow: 0 0 0 3px rgba(192,138,118,.18);
}

/* SimpleBooking iframe wrapper */
[id^="sbe-"][id$="-wrap"]{
  border-radius: var(--abba-radius);
  overflow:hidden;
  box-shadow: var(--abba-shadow);
  background:#fff;
}

/* =========================================================
   FOOTER
   ========================================================= */
.footer-wrapper, .footer-1, .footer-2, footer .section{
  background-color: var(--abba-dark) !important;
  color: #d9d4c8;
}
footer h3, footer h4, footer .widget-title{
  font-family: var(--abba-font-display);
  color:#fff; letter-spacing:.02em;
}
footer a{ color:#cfc6b3 !important; }
footer a:hover{ color: #fff; }
.absolute-footer{ background: var(--abba-dark-d) !important; color:#bfb89f; font-size:.8rem; }
.absolute-footer a{ color:#cfc6b3 !important; }

/* =========================================================
   WHATSAPP / CALL BUTTONS (plugins) – keep above booking iframe
   ========================================================= */
.ht-ctc, #cnb{ z-index: 99998 !important; }

/* =========================================================
   ACCESSIBILITY
   ========================================================= */
a:focus-visible, button:focus-visible, .button:focus-visible{
  outline: 3px solid var(--abba-brass);
  outline-offset: 2px;
}

/* =========================================================
   MOBILE
   ========================================================= */
@media only screen and (max-width: 48em){
  body{ font-size: 16px; }
  .section{ padding-top: 40px; padding-bottom: 40px; }
  h1{ font-size: 1.9rem; }
  h2{ font-size: 1.5rem; }
  .banner h1, .banner h2{ line-height: 1.3; }
  .button{ width: 100%; text-align: center; }
  .header .flex-row{ min-height: 62px; }
  /* mobile menu */
  .mobile-sidebar .nav > li > a{ font-size: 1.05rem; padding: 12px 18px; }
  .abba-lang{ justify-content: flex-start; padding: 10px 18px; }
}

/* =========================================================
   LOGO
   ========================================================= */
.header .logo img{ max-height: 60px; width:auto; padding: 6px 0; }
.header .logo a{ font-family: var(--abba-font-display); font-size: 1.5rem; color: #fff; letter-spacing:.02em; }
@media (max-width:48em){ .header .logo img{ max-height: 46px; } }


/* =========================================================
   WHATSAPP BUTTON & FORM
   ========================================================= */
.abba-wa-btn{
  display:inline-flex; align-items:center; gap:10px;
  background:#25D366; color:#fff !important;
  padding: 13px 26px; border-radius: 999px; border:0; cursor:pointer;
  font-family: var(--abba-font-body); font-weight:600; font-size:1.02rem;
  transition: all .18s ease; box-shadow: 0 6px 18px rgba(37,211,102,.30);
}
.abba-wa-btn:hover{ background:#1fb958; transform: translateY(-1px); color:#fff; }
.abba-wa-btn svg{ flex:0 0 auto; }

.abba-wa-form{
  max-width: 520px; margin-inline:auto;
  background:#fff; border:1px solid var(--abba-line); border-radius: var(--abba-radius);
  box-shadow: var(--abba-shadow); padding: 28px;
  display:flex; flex-direction:column; gap:14px; text-align:center;
}
.abba-wa-form h3{ margin:0 0 4px; }
.abba-wa-form input, .abba-wa-form textarea{ width:100%; text-align:right; }
.abba-wa-form .abba-wa-btn{ justify-content:center; width:100%; }

/* =========================================================
   v5.1 – FOOTER READABILITY + BOOKING SECTION POLISH
   ========================================================= */

/* Footer: force light, readable text over black */
footer p, footer .widget, footer .textwidget, footer li, footer span,
footer .widget_text, .footer-widgets, .footer-widgets p{
  color:#e8e3d8 !important;
}
footer h3, footer h4, footer .widget-title, footer strong{ color:#ffffff !important; }
footer a{ color: var(--abba-brass) !important; }
footer a:hover{ color:#fff !important; }
footer .widget-title{ font-size:1.1rem; letter-spacing:.04em; margin-bottom:14px; }
footer .widget-title + div, footer .is-divider{ background: var(--abba-brass); }

/* Footer tag cloud – compact, subtle pills */
footer .tagcloud a, footer .wp-block-tag-cloud a{
  display:inline-block; margin:3px 2px; padding:4px 12px;
  font-size:.78rem !important; line-height:1.5;
  color:#d9d4c8 !important; background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14); border-radius:999px;
  transition:all .15s ease;
}
footer .tagcloud a:hover{ background:var(--abba-brass); border-color:var(--abba-brass); color:#fff !important; }

/* Footer blog dates */
footer .badge, footer .post-date{ background:rgba(255,255,255,.08); color:#e8e3d8; border-radius:4px; }

/* Social icons in footer */
footer .social-icons a, footer .icon-instagram, footer .icon-facebook{ color:#e8e3d8 !important; }

/* =========================================================
   BOOKING ENGINE FRAME
   ========================================================= */
/* Center + frame the SimpleBooking iframe as a card */
[id^="sbe-"][id$="-wrap"]{
  max-width: 1140px;
  margin-inline: auto;
  border-radius: 14px;
  border: 1px solid rgba(192,138,118,.35);
  box-shadow: 0 18px 50px rgba(0,0,0,.18);
}
[id^="sbe-"][id$="-wrap"] iframe{ border-radius: 14px; }

/* Decorative heading helper – wrap the shortcode section with class abba-booking */
.abba-booking{ background: var(--abba-stone); }
.abba-booking h2{ text-align:center; }
.abba-booking .abba-booking-sub{ text-align:center; color:var(--abba-ink-2); margin:-6px 0 26px; }
