/* =====================================================================
   LilBooking — site-wide theme (same look as the home page)
   Loaded LAST on every page of home_base.html: it restyles the legacy
   Bootstrap template (dark booking boxes, green headings, Nunito font...)
   without touching each page. Navy #0a2d63 + lime #8cbf1f, Poppins.
   ===================================================================== */
:root {
    --lb-navy:#0a2d63; --lb-navy-2:#0f3f86; --lb-lime:#8cbf1f; --lb-lime-d:#78a614;
    --lb-ink:#16213b; --lb-muted:#5d6b82; --lb-line:#e3e8f0; --lb-soft:#f4f7fb;
    --primary:#8cbf1f; --dark:#16213b;
}

/* ---------- base ---------- */
body { font-family:'Poppins','Heebo',sans-serif; color:var(--lb-ink); background:#fff; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family:'Poppins',sans-serif; color:var(--lb-navy); letter-spacing:-.01em; }
h1.text-white, h2.text-white, h3.text-white, h4.text-white, h5.text-white, h6.text-white,
.text-white h1, .text-white h2, .text-white h3, .text-white h4, .text-white h5 { color:#fff; }
.text-primary { color:var(--lb-navy-2) !important; }
a { color:var(--lb-navy-2); }
a:hover { color:var(--lb-navy); }
.text-muted { color:var(--lb-muted) !important; }
#spinner .spinner-border { color:var(--lb-lime) !important; }
.container-xxl.py-5 { padding-top:2.2rem !important; }

/* section kicker ("— PAIEMENT —") -> small lime label, no lines */
.section-title { font-family:'Poppins',sans-serif !important; font-size:13px !important; font-weight:600 !important; letter-spacing:.12em;
    color:var(--lb-lime-d) !important; background:transparent !important; padding:0 !important; }
.section-title::before, .section-title::after { display:none !important; }
.section-title + h1, .section-title + h2 { margin-top:4px; }

/* ---------- buttons ---------- */
.btn { font-family:'Poppins',sans-serif; font-weight:600; border-radius:10px; transition:.2s; }
.btn-primary, .btn.btn-primary { background:var(--lb-lime); border-color:var(--lb-lime); color:#fff; box-shadow:0 6px 14px rgba(140,191,31,.25); }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active { background:var(--lb-lime-d) !important; border-color:var(--lb-lime-d) !important; color:#fff; }
.btn-outline-primary { color:var(--lb-navy); border-color:var(--lb-navy); background:#fff; }
.btn-outline-primary:hover { background:var(--lb-navy); border-color:var(--lb-navy); color:#fff; }
.btn-secondary, .btn-dark { background:var(--lb-navy); border-color:var(--lb-navy); color:#fff; }
.btn-secondary:hover, .btn-dark:hover { background:var(--lb-navy-2); border-color:var(--lb-navy-2); }
.btn-success { background:var(--lb-lime); border-color:var(--lb-lime); }
.btn-success:hover { background:var(--lb-lime-d); border-color:var(--lb-lime-d); }
.btn.rounded-pill { border-radius:999px; }

/* ---------- forms ---------- */
.form-control, .form-select { border:1px solid var(--lb-line); border-radius:10px; color:var(--lb-ink); font-family:'Poppins',sans-serif; font-size:15px; }
.form-control:focus, .form-select:focus { border-color:var(--lb-navy); box-shadow:0 0 0 3px rgba(10,45,99,.08); }
.form-control::placeholder { color:#8a96aa; }
.form-floating > .form-control, .form-floating > .form-select { min-height:58px; }
.form-floating > label { color:var(--lb-muted); text-shadow:none; }
.form-check-input:checked { background-color:var(--lb-navy); border-color:var(--lb-navy); }
.invalid-feedback, .error-message { color:#d1343a !important; }

/* legacy dark "booking" boxes (photo + dark overlay, white text) -> white card */
.booking { background:#fff !important; height:auto !important; border:1px solid var(--lb-line); border-radius:18px !important;
    box-shadow:0 22px 50px rgba(10,45,99,.12); overflow:hidden; }
.booking .form-scroll-container { position:static; padding:2rem 2rem 2.2rem; overflow:visible; }
.booking .text-white, .booking h1, .booking h2, .booking h3, .booking h4, .booking h5, .booking h6,
.booking p, .booking li, .booking span:not(.badge), .booking strong { color:var(--lb-ink) !important; }
.booking h1, .booking h2 { color:var(--lb-navy) !important; font-weight:700; }
.booking h1 { font-size:1.6rem; }
.booking label, .booking .form-floating label { color:var(--lb-muted) !important; text-shadow:none !important; }
.booking .form-control, .booking .form-select, .booking .form-control.bg-transparent, .booking .form-select.bg-transparent,
.booking textarea, .booking input:not([type=checkbox]):not([type=radio]):not([type=submit]) {
    background:#fff !important; color:var(--lb-ink) !important; -webkit-text-fill-color:var(--lb-ink); border:1px solid var(--lb-line) !important; backdrop-filter:none; }
.booking .form-control:focus, .booking .form-select:focus { border-color:var(--lb-navy) !important; }
.booking .btn-outline-light, .booking .btn-light { background:var(--lb-lime) !important; border-color:var(--lb-lime) !important; color:#fff !important; }
.booking .btn-outline-light:hover { background:var(--lb-lime-d) !important; }
.booking .border-light { border-color:var(--lb-line) !important; }
.booking a { color:var(--lb-navy-2) !important; }
.form-control.bg-transparent, .form-select.bg-transparent { backdrop-filter:none; }

/* ---------- cards, tables, lists ---------- */
.card { border:1px solid var(--lb-line); border-radius:14px; }
.card.border-0 { border:1px solid var(--lb-line) !important; }
.card-header { background:var(--lb-soft); border-bottom:1px solid var(--lb-line); font-weight:600; color:var(--lb-navy); }
.shadow, .shadow-sm { box-shadow:0 10px 26px rgba(10,45,99,.08) !important; }
.table { color:var(--lb-ink); }
.table > thead > tr > th, .table thead th { background:var(--lb-soft); color:var(--lb-navy); font-weight:600; border-bottom:1px solid var(--lb-line); }
.table-dark, .table .table-dark, thead.table-dark th { background:var(--lb-navy) !important; color:#fff !important; }
.alert { border-radius:12px; }
.badge.bg-primary { background:var(--lb-navy) !important; }
.page-link { color:var(--lb-navy); border-color:var(--lb-line); }
.page-item.active .page-link { background:var(--lb-navy); border-color:var(--lb-navy); color:#fff; }
.bg-light { background:var(--lb-soft) !important; }
.nav-pills .nav-link.active, .nav-tabs .nav-link.active { background:var(--lb-navy); color:#fff; border-color:var(--lb-navy); }
.nav-tabs .nav-link { color:var(--lb-ink); }

/* ---------- page band under the header (all inner pages) ---------- */
.lbp-hero { position:relative; height:150px; color:#fff;
    background:
      linear-gradient(90deg, rgba(10,45,99,.97) 0%, rgba(13,58,120,.9) 38%, rgba(13,58,120,.45) 62%, rgba(13,58,120,.2) 100%),
      var(--lbp-img) right center / cover no-repeat, #0c2e62; }
.lbp-hero-in { max-width:1440px; margin:0 auto; padding:34px 56px 0; }
.lbp-crumb { font-size:13.5px; color:#cfdaf0; margin-bottom:6px; font-family:'Poppins',sans-serif; }
.lbp-crumb a { color:#fff; text-decoration:none; }
.lbp-title { font-family:'Poppins',sans-serif; color:#fff !important; font-weight:700; font-size:clamp(1.5rem, 2.4vw, 2.1rem); margin:0; letter-spacing:-.02em; }
.lbp-hero::after { content:""; position:absolute; left:56px; bottom:26px; width:56px; height:5px; border-radius:5px; background:var(--lb-lime); }
@media (max-width: 991px) {
    .lbp-hero { height:126px; }
    .lbp-hero-in { padding:24px 18px 0; }
    .lbp-hero::after { left:18px; bottom:20px; }
}

/* ---------- footer ---------- */
.footer.bg-dark { background:#0b1f45 !important; }
.footer h4 { color:#fff !important; }
.footer .btn.btn-link { color:#c9d4e8; }
.footer .btn.btn-link:hover { color:#fff; letter-spacing:0; box-shadow:none; }
.footer .btn.btn-social { border-color:rgba(255,255,255,.35); border-radius:50%; }
.footer .btn.btn-social:hover { background:var(--lb-lime); border-color:var(--lb-lime); color:#fff; }
.footer .copyright { border-top-color:rgba(255,255,255,.12) !important; }

/* ---------- trip / Omra booking form (legacy dark calculator) ---------- */
.trip-booking-page .bg-gradient-primary, .bg-gradient-primary { background:linear-gradient(135deg, var(--lb-navy-2) 0%, var(--lb-navy) 100%) !important; }
.trip-booking-page .bg-gradient-success, .bg-gradient-success { background:linear-gradient(135deg, var(--lb-lime) 0%, var(--lb-lime-d) 100%) !important; }
.trip-booking-page .bg-dark-transparent, .bg-dark-transparent { background:var(--lb-soft) !important; backdrop-filter:none; border:1px solid var(--lb-line); }
.trip-booking-page .bg-dark-transparent .text-white, .trip-booking-page .bg-dark-transparent .text-light,
.bg-dark-transparent .text-white, .bg-dark-transparent .text-light { color:var(--lb-ink) !important; }
.trip-booking-page .h1-forms, .booking .h1-forms, .booking h1 { text-shadow:none !important; }
.trip-booking-page .price-calculator-integrated .card-header:hover { box-shadow:0 8px 22px rgba(10,45,99,.2); }
.trip-booking-page .guest-form-card { border:1px solid var(--lb-line); border-radius:14px; background:#fff; }
.trip-booking-page .card.bg-transparent { background:#fff !important; }
.booking .text-light { color:var(--lb-muted) !important; }
.booking .bg-gradient-primary *, .booking .bg-gradient-success * { color:#fff !important; }

/* ---------- banner slideshow (several pictures for one banner, see lb_slides.js) ---------- */
.lb-slides { position:relative; overflow:hidden; }
.lb-slide-layer { position:absolute; inset:0; z-index:0; opacity:0; transition:opacity 1.2s ease; pointer-events:none; }
.lb-slide-layer.on { opacity:1; }
.lb-slides .lbp-hero-in, .lb-slides .lb-hero-inner, .lb-slides .lbv-hero-inner { position:relative; z-index:500; }
.lbp-hero.lb-slides::after { z-index:500; }
.lb-slide-dots { position:absolute; z-index:501; right:22px; bottom:14px; display:flex; gap:7px; }
[dir="rtl"] .lb-slide-dots { right:auto; left:22px; }
/* home page and service pages: the search card covers the bottom of the banner */
.lb-hero > .lb-slide-dots, .lbv-hero > .lb-slide-dots { top:16px; bottom:auto; }
.lb-slide-dots button { width:9px; height:9px; padding:0; border:0; border-radius:9px; background:rgba(255,255,255,.55);
    cursor:pointer; transition:width .3s, background .3s; }
.lb-slide-dots button.on { width:24px; background:var(--lb-lime, #c6f432); }
.lb-slide-dots button:focus-visible { outline:2px solid #fff; outline-offset:2px; }
@media (prefers-reduced-motion: reduce) { .lb-slide-layer { transition:none; } }
