/* Morocco Host Experts — shared styles */
:root{
  --brand:#b5452b; --brand-dark:#8f331d; --brand-soft:#f7e4dc;
  --teal:#1e6f6a; --teal-soft:#dcefed;
  --ink:#1f1a17; --muted:#6f655e; --line:#ece4db;
  --sand:#f6f1ea; --card:#ffffff; --gold:#c9962f;
  --radius:16px; --shadow:0 8px 30px rgba(60,30,10,.07);
  --bs-primary:var(--brand); --bs-primary-rgb:181,69,43;
  --bs-link-color:var(--brand); --bs-link-hover-color:var(--brand-dark);
  --bs-body-font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
}
html[dir=rtl]{ --bs-body-font-family:"Cairo","Plus Jakarta Sans",system-ui,sans-serif; }
body{color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
a{text-decoration:none}
.text-muted{color:var(--muted)!important}
.fw-800{font-weight:800}

/* Buttons */
.btn{border-radius:12px;font-weight:600;padding:.6rem 1.15rem}
.btn-sm{border-radius:9px;padding:.35rem .75rem}
.btn-brand{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-brand:hover,.btn-brand:focus{background:var(--brand-dark);border-color:var(--brand-dark);color:#fff}
.btn-outline-brand{border:1.5px solid var(--brand);color:var(--brand);background:transparent}
.btn-outline-brand:hover{background:var(--brand);color:#fff}
.btn-teal{background:var(--teal);color:#fff;border-color:var(--teal)}
.btn-teal:hover{background:#155551;color:#fff}
.btn-light-soft{background:var(--sand);border-color:var(--line);color:var(--ink)}
.btn-light-soft:hover{background:#efe6da}

/* Forms */
.form-control,.form-select{border-radius:12px;border-color:var(--line);padding:.65rem .9rem}
.form-control:focus,.form-select:focus{border-color:var(--brand);box-shadow:0 0 0 .2rem rgba(181,69,43,.12)}
.form-label{font-weight:600;font-size:.9rem;margin-bottom:.35rem}
.form-check-input:checked{background-color:var(--brand);border-color:var(--brand)}

/* Cards / badges */
.card-soft{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.badge-soft{font-weight:600;padding:.4em .7em;border-radius:999px;font-size:.75rem}
.bs-active,.bs-published,.bs-confirmed,.bs-completed{background:#e3f4ea;color:#1c7a45}
.bs-pending,.bs-draft{background:#fff4dc;color:#99690b}
.bs-suspended,.bs-rejected,.bs-cancelled{background:#fde6e3;color:#b3261e}
.bs-archived{background:#eee;color:#666}
.bs-paid{background:#e3f4ea;color:#1c7a45}
.bs-partial{background:#e6f0fb;color:#1f5d99}
.bs-unpaid{background:#f1eeea;color:#6b625a}
.bs-failed{background:#fde6e3;color:#b3261e}
.bs-refunded{background:#eee;color:#666}
.bs-admin{background:var(--brand-soft);color:var(--brand-dark)}
.bs-owner{background:var(--teal-soft);color:var(--teal)}
.bs-guest{background:#eef0f7;color:#44507a}

/* ============ PUBLIC ============ */
.site-nav{background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.site-nav .nav-link{color:var(--ink);font-weight:600;font-size:.95rem}
.site-nav .nav-link:hover{color:var(--brand)}
.logo{display:flex;align-items:center;gap:.55rem;color:var(--ink);font-weight:800;letter-spacing:-.02em;font-size:1.1rem}
.logo-mark{width:38px;height:38px;border-radius:11px;background:var(--brand);display:grid;place-items:center;color:#fff}
.logo small{display:block;font-size:.66rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:-2px}

.hero{position:relative;min-height:620px;display:flex;align-items:center;color:#fff;background:#6d3a24;overflow:hidden;isolation:isolate}
.cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero::before,.city-hero.has-img::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(25,14,8,.45),rgba(25,14,8,.62))}
.city-hero.has-img{position:relative;overflow:hidden;isolation:isolate;background:#3b2418}
.city-hero.has-img::before{background:linear-gradient(90deg,rgba(20,12,8,.82) 0%,rgba(20,12,8,.55) 55%,rgba(20,12,8,.3) 100%)}
html[dir=rtl] .city-hero.has-img::before{background:linear-gradient(270deg,rgba(20,12,8,.82) 0%,rgba(20,12,8,.55) 55%,rgba(20,12,8,.3) 100%)}
@media(max-width:767px){.city-hero.has-img::before{background:rgba(20,12,8,.66)}}
.hero h1{font-weight:800;font-size:clamp(2rem,4.6vw,3.6rem);letter-spacing:-.03em;line-height:1.08}
.hero p.lead{opacity:.92;max-width:620px}
.search-box{background:#fff;border-radius:22px;padding:.6rem;box-shadow:0 20px 50px rgba(0,0,0,.18);color:var(--ink)}
.search-box .col-field{padding:.45rem 1rem;border-inline-end:1px solid var(--line)}
.search-box label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0}
.search-box input,.search-box select{border:0;padding:0;font-weight:600;background:transparent;box-shadow:none!important;width:100%;outline:0}
@media(max-width:991px){.search-box .col-field{border-inline-end:0;border-bottom:1px solid var(--line)}}

.section{padding:90px 0}
.section-sand{background:var(--sand)}
.eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--brand)}
.section-title{font-weight:800;letter-spacing:-.025em;font-size:clamp(1.6rem,3vw,2.4rem)}

.type-card{display:flex;flex-direction:column;align-items:center;gap:.6rem;padding:1.6rem 1rem;border-radius:var(--radius);
  background:#fff;border:1px solid var(--line);color:var(--ink);font-weight:700;transition:.2s}
.type-card i{font-size:1.9rem;color:var(--brand)}
.type-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--brand-soft);color:var(--brand)}

.city-card{position:relative;display:block;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/5;color:#fff;
  background:linear-gradient(160deg,#c46a45,#6b2f1c)}
.city-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(0,0,0,.7))}
.city-card .cover-img{z-index:0;transition:transform .5s}
.city-card:hover .cover-img{transform:scale(1.06)}
.city-thumb{position:relative;display:block;border-radius:14px;overflow:hidden;aspect-ratio:16/10;color:#fff}
.city-thumb .cover-img{z-index:0;transition:transform .4s}
.city-thumb:hover .cover-img{transform:scale(1.05)}
.city-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.65))}
.city-thumb span{position:absolute;bottom:10px;inset-inline-start:12px;z-index:2;font-weight:700}
.city-thumb:hover{color:#fff}
.city-card .pattern{position:absolute;inset:0;opacity:.18;background-image:radial-gradient(circle at 20% 20%,#fff 2px,transparent 2.5px);background-size:22px 22px}
.city-card span{position:absolute;bottom:18px;inset-inline-start:20px;z-index:2;font-weight:800;font-size:1.25rem}
.city-card:hover{color:#fff;transform:translateY(-3px);transition:.2s}

.feature{display:flex;gap:1rem}
.feature .ico{flex:0 0 52px;height:52px;border-radius:14px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-size:1.35rem}
.step-num{width:44px;height:44px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:800}

.host-band{background:var(--ink);color:#fff;border-radius:28px;padding:56px;position:relative;overflow:hidden}
.host-band::before{content:"";position:absolute;inset-inline-end:-80px;top:-80px;width:320px;height:320px;border-radius:50%;background:var(--brand);opacity:.35}
.host-band .feature .ico{background:rgba(255,255,255,.08);color:#f3b9a4}
@media(max-width:767px){.host-band{padding:32px 22px}}

.stay-card{display:block;color:var(--ink)}
.stay-card .ph{aspect-ratio:1/1;border-radius:var(--radius);overflow:hidden;background:var(--sand)}
.stay-card .ph img{width:100%;height:100%;object-fit:cover;transition:.4s}
.stay-card:hover .ph img{transform:scale(1.04)}

.site-footer{background:#15110e;color:#cfc6bd;padding:64px 0 28px}
.site-footer a{color:#cfc6bd}.site-footer a:hover{color:#fff}
.site-footer h6{color:#fff;font-weight:700;margin-bottom:1rem}

/* Auth */
.auth-wrap{min-height:calc(100vh - 72px);display:flex;align-items:center;background:var(--sand);padding:48px 0}
.auth-card{max-width:480px;margin:auto;width:100%}
.role-pick{position:relative}
.role-pick input{position:absolute;opacity:0}
.role-pick label{display:block;padding:1rem;border:1.5px solid var(--line);border-radius:14px;cursor:pointer;height:100%;transition:.15s}
.role-pick label i{font-size:1.5rem;color:var(--brand)}
.role-pick input:checked+label{border-color:var(--brand);background:var(--brand-soft)}

/* WhatsApp floating */
.wa-float{position:fixed;bottom:22px;inset-inline-end:22px;width:56px;height:56px;border-radius:50%;background:#25d366;color:#fff;
  display:grid;place-items:center;font-size:1.7rem;box-shadow:0 10px 25px rgba(37,211,102,.4);z-index:1030}
.wa-float:hover{color:#fff;transform:scale(1.06)}

/* ============ DASHBOARD ============ */
.dash-body{background:#f7f4f0}
.dash-sidebar{width:260px;background:#1c1714;color:#d8cfc7;position:fixed;top:0;bottom:0;inset-inline-start:0;z-index:1040;display:flex;flex-direction:column}
.dash-sidebar .logo{color:#fff;padding:1.3rem 1.4rem}
.dash-sidebar .logo small{color:#9c9189}
.dash-menu{padding:.5rem .8rem;flex:1;overflow-y:auto}
.dash-menu .menu-label{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#877b72;padding:1rem .8rem .4rem}
.dash-menu a{display:flex;align-items:center;gap:.75rem;padding:.65rem .85rem;border-radius:11px;color:#d8cfc7;font-weight:600;font-size:.92rem;margin-bottom:2px}
.dash-menu a i{font-size:1.1rem;opacity:.85}
.dash-menu a:hover{background:rgba(255,255,255,.06);color:#fff}
.dash-menu a.active{background:var(--brand);color:#fff}
.dash-menu a .badge{margin-inline-start:auto}
.dash-main{margin-inline-start:260px;min-height:100vh}
.dash-top{height:68px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 1.5rem;gap:1rem;position:sticky;top:0;z-index:1020}
.dash-content{padding:1.75rem 1.5rem 3rem}
.page-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}
.page-head h1{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;margin:0}
@media(max-width:991px){
  .dash-sidebar{transform:translateX(-100%);transition:transform .25s}
  html[dir=rtl] .dash-sidebar{transform:translateX(100%)}
  .dash-sidebar.show{transform:none!important}
  .dash-main{margin-inline-start:0}
  .dash-backdrop.show{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:1035}
}
.avatar{width:38px;height:38px;border-radius:50%;object-fit:cover;background:var(--brand-soft);color:var(--brand-dark);display:inline-grid;place-items:center;font-weight:800;font-size:.85rem;flex:0 0 auto}
.avatar-lg{width:88px;height:88px;font-size:1.6rem}

.stat{padding:1.25rem;display:flex;gap:1rem;align-items:center}
.stat .ico{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;font-size:1.35rem;flex:0 0 auto}
.stat .val{font-size:1.55rem;font-weight:800;line-height:1.1;letter-spacing:-.02em}
.stat .lbl{font-size:.82rem;color:var(--muted);font-weight:600}
.ico-brand{background:var(--brand-soft);color:var(--brand)}
.ico-teal{background:var(--teal-soft);color:var(--teal)}
.ico-gold{background:#f8efd9;color:#9a7118}
.ico-blue{background:#e6ecfb;color:#3553a8}

.table-soft{margin:0}
.table-soft thead th{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700;background:#faf8f5;border-bottom:1px solid var(--line);white-space:nowrap;padding:.8rem 1rem}
.table-soft td{padding:.85rem 1rem;vertical-align:middle;border-color:var(--line)}
.table-soft tbody tr:hover{background:#fcfaf8}
.empty{padding:3rem 1rem;text-align:center;color:var(--muted)}
.empty i{font-size:2.4rem;display:block;margin-bottom:.6rem;opacity:.5}

.filters{display:flex;flex-wrap:wrap;gap:.5rem}
.filters .form-control,.filters .form-select{max-width:220px}
.nav-pills-soft .nav-link{color:var(--muted);font-weight:600;border-radius:10px;padding:.45rem .9rem}
.nav-pills-soft .nav-link.active{background:var(--ink);color:#fff}

.alert{border-radius:14px;border:0}
.dropdown-menu{border-radius:14px;border-color:var(--line);box-shadow:var(--shadow)}
.pagination .page-link{border-radius:9px!important;margin:0 2px;color:var(--ink);border-color:var(--line)}
.pagination .active .page-link{background:var(--ink);border-color:var(--ink);color:#fff}
.site-flash .alert{margin-top:1rem}

/* ============ PROPERTY MANAGER ============ */
.min-w-0{min-width:0}
.dropzone{border:2px dashed #dccfc2;border-radius:var(--radius);background:#fcfaf7;cursor:pointer;transition:.15s}
.dropzone:hover,.dropzone.over{border-color:var(--brand);background:var(--brand-soft)}
.photo-item{cursor:grab}
.photo-item.dragging{opacity:.4}
.photo-card{position:relative;aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--sand)}
.photo-card img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.photo-actions{position:absolute;bottom:8px;inset-inline-end:8px;display:flex;gap:6px;opacity:0;transition:.15s}
.photo-card:hover .photo-actions{opacity:1}
@media(hover:none){.photo-actions{opacity:1}}
.nav-tabs .nav-link{color:var(--muted);font-weight:600}
.nav-tabs .nav-link.active{color:var(--ink)}

/* Calendar */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;user-select:none}
.cal-head{font-size:.72rem;font-weight:700;text-transform:uppercase;color:var(--muted);text-align:center;padding:4px 0}
.cal-day{position:relative;min-height:74px;border:1px solid var(--line);border-radius:12px;padding:6px 8px;background:#fff;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;transition:.1s}
.cal-day .num{font-weight:700;font-size:.9rem}
.cal-day .price{font-size:.72rem;color:var(--muted);font-weight:600}
.cal-day.empty{border:0;background:transparent;cursor:default}
.cal-day.past{opacity:.4;cursor:not-allowed}
.cal-day.today .num{color:var(--brand)}
.cal-day.blocked{background:repeating-linear-gradient(135deg,#f3eee8,#f3eee8 6px,#ebe3da 6px,#ebe3da 12px)}
.cal-day.blocked .price{text-decoration:line-through}
.cal-day.booked{background:var(--teal-soft);border-color:#b9dcd8;cursor:not-allowed}
.cal-day.ical{background:#fde8e4;border-color:#f3c6bb;cursor:not-allowed}
.cal-day.custom .price{color:var(--brand)}
.cal-day.sel{outline:2px solid var(--brand);outline-offset:-2px;background:var(--brand-soft)}
.cal-legend span{display:inline-flex;align-items:center;gap:6px;margin-inline-end:14px;font-size:.8rem}
.cal-legend i{width:14px;height:14px;border-radius:4px;display:inline-block;border:1px solid var(--line)}
@media(max-width:576px){.cal{gap:3px}.cal-day{min-height:54px;padding:4px 5px;border-radius:8px}.cal-day .price{font-size:.6rem}}

/* ============ STAY PAGE ============ */
.stay-gallery{position:relative;display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:200px 200px;gap:8px;border-radius:20px;overflow:hidden}
.stay-gallery .g-item{display:block;overflow:hidden;background:var(--sand)}
.stay-gallery .g-item img{width:100%;height:100%;object-fit:cover;transition:.3s}
.stay-gallery .g-item:hover img{transform:scale(1.03);filter:brightness(.92)}
.stay-gallery .g-0{grid-row:span 2}
.stay-gallery.few{grid-template-columns:2fr 1fr;grid-template-rows:200px 200px}
.stay-gallery.few .g-3,.stay-gallery.few .g-4{display:none}
.stay-gallery .g-all{position:absolute;bottom:14px;inset-inline-end:14px}
@media(max-width:767px){
  .stay-gallery,.stay-gallery.few{grid-template-columns:1fr;grid-template-rows:260px;border-radius:14px}
  .stay-gallery .g-item:not(.g-0){display:none}
}
.stay-chip{display:inline-flex;align-items:center;gap:6px;background:var(--sand);border:1px solid var(--line);border-radius:999px;padding:.4rem .85rem;font-size:.88rem;font-weight:600}
.stay-desc{line-height:1.75}
.stay-desc.clamp{max-height:10.5em;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent)}
.book-box{position:sticky;top:90px}
.date-fields .form-control:focus,.date-fields .form-select:focus{box-shadow:none}
.mobile-book{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--line);padding:.7rem 1rem;display:flex;justify-content:space-between;align-items:center;z-index:1030;box-shadow:0 -6px 20px rgba(0,0,0,.06)}
@media(max-width:991px){.book-box{position:static}.wa-float{bottom:84px}}

/* Picker */
.pk-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}
.pk-months{display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:768px){.pk-months{grid-template-columns:1fr 1fr}}
@media(min-width:992px){.pk-months{grid-template-columns:1fr}.pk-months>.d-md-block{display:none!important}}
@media(min-width:1400px){.pk-months{grid-template-columns:1fr 1fr}.pk-months>.d-md-block{display:block!important}}
.pk-title{text-align:center;font-weight:700;margin-bottom:.4rem}
.pk-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.pk-dow{text-align:center;font-size:.68rem;font-weight:700;color:var(--muted);text-transform:uppercase;padding:2px 0}
.pk-day{border:0;background:transparent;border-radius:9px;padding:4px 0;display:flex;flex-direction:column;align-items:center;line-height:1.1;min-height:42px;justify-content:center;font-weight:600;font-size:.88rem;color:var(--ink)}
.pk-day small{font-size:.6rem;color:var(--muted);font-weight:600}
.pk-day:hover:not(:disabled){background:var(--sand)}
.pk-day:disabled{color:#c9bfb6;cursor:not-allowed}
.pk-day.blocked span{text-decoration:line-through}
.pk-day.tooshort{opacity:.55}
.pk-day.inrange{background:var(--brand-soft);border-radius:0}
.pk-day.start,.pk-day.end{background:var(--brand)!important;color:#fff}
.pk-day.start small,.pk-day.end small{color:#fbe0d6}
.hp-field{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}

/* ============ CMS / MARKETING PAGES ============ */
.cms-content{line-height:1.8;font-size:1.02rem}
.cms-content h2{font-size:1.35rem;font-weight:800;margin:2rem 0 .8rem;letter-spacing:-.01em}
.cms-content h3{font-size:1.1rem;font-weight:700;margin:1.6rem 0 .5rem}
.cms-content ul,.cms-content ol{padding-inline-start:1.3rem}
.cms-content li{margin-bottom:.35rem}
.cms-content a{text-decoration:underline}
.cms-content img{max-width:100%;height:auto;border-radius:var(--radius)}
.faq-content h3{background:var(--sand);border-radius:12px;padding:.9rem 1.1rem;margin:1rem 0 .4rem;font-size:1.02rem}
.faq-content h3+p{padding:0 1.1rem}
.price-card{border:2px solid var(--brand);border-radius:24px;padding:2rem;background:#fff;position:relative}
.price-card .big{font-size:3.2rem;font-weight:800;letter-spacing:-.03em;color:var(--brand);line-height:1}
.check-list{list-style:none;padding:0;margin:0}
.check-list li{display:flex;gap:.6rem;margin-bottom:.6rem}
.check-list li::before{content:"\F26E";font-family:"bootstrap-icons";color:var(--teal);font-weight:700}
.city-hero{background:linear-gradient(135deg,var(--ink),#3b2418);color:#fff;padding:70px 0 60px}
.city-hero .lead{opacity:.85;max-width:720px}

/* Payments */
.pay-box{border:1px solid var(--line,#eadfd3);border-radius:18px;padding:1.25rem 1.25rem;background:#fff}
.pay-opt{display:block;border:1.5px solid var(--line,#eadfd3);border-radius:14px;padding:.75rem 1rem;cursor:pointer;transition:.15s}
.btn-check:checked + .pay-opt{border-color:var(--brand);background:var(--brand-soft)}
.stat-mini{border-radius:16px;padding:1rem 1.1rem;background:#fff;border:1px solid var(--line,#eadfd3)}
.stat-mini .v{font-weight:800;font-size:1.35rem;letter-spacing:-.02em}
