/*
Theme Name: Doctor Bio
Theme URI: https://example.com/doctor-bio
Author: Doctor Bio Team
Author URI: https://example.com
Description: قالب اختصاصی وردپرس برای پلتفرم نوبت‌دهی پزشکی و سلامت دکتر بیو — شامل پروفایل پزشکان، مراکز درمانی، جست‌وجوی دارو، مجله سلامت و ابزارهای سلامت.
Version: 1.5.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: doctor-bio
Tags: rtl, custom-menu, custom-logo, translation-ready, medical
*/

/* ===================== Design tokens ===================== */
:root{
  --bg:#F5F8F7; --ink:#172A27; --ink-soft:#57706A;
  --primary:#0E5C54; --primary-dark:#0A423C; --primary-tint:#E3EFEC;
  --accent:#D9A441; --accent-dark:#B9832C;
  --card:#FFFFFF; --line:#E3E9E6; --danger:#C15B4A; --danger-tint:#FBEAE6;
  --success:#1F8A5F; --success-tint:#E3F4EC; --warning:#B9832C; --warning-tint:#FBF1DF;
  --radius:16px; --shadow:0 10px 30px rgba(14,92,84,.08);
}
*{box-sizing:border-box;}
body{
  font-family:'Vazirmatn',Tahoma,sans-serif;
  background:var(--bg); color:var(--ink); line-height:1.7; margin:0;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; height:auto; display:block;}
.wrap{max-width:1180px; margin:0 auto; padding:0 20px;}
ul{list-style:none; margin:0; padding:0;}
button, input, select, textarea{font-family:inherit;}

/* ===================== Navbar ===================== */
.site-header{position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid var(--line);}
.site-header-top .wrap{display:flex; align-items:center; justify-content:space-between; height:64px;}
.site-header-nav{background:var(--primary-tint); border-top:1px solid var(--line);}
.site-header-nav .wrap{display:flex; align-items:center; height:50px;}
.site-logo{display:flex; align-items:center; gap:10px; font-weight:800; font-size:19px; color:var(--primary-dark); white-space:nowrap;}
.site-logo img{width:38px; height:38px; border-radius:50%; border:2px solid var(--accent);}
.main-nav ul{display:flex; gap:4px; flex-wrap:wrap;}
.main-nav a{font-size:14px; font-weight:700; color:var(--ink-soft); padding:9px 14px; border-radius:10px; display:block; white-space:nowrap;}
.main-nav a:hover, .main-nav .current-menu-item a{background:#fff; color:var(--primary-dark);}
.nav-actions{display:flex; align-items:center; gap:10px; flex-shrink:0;}
.app-badge{font-size:12px; font-weight:700; color:var(--primary-dark); background:var(--primary-tint); padding:8px 12px; border-radius:20px; white-space:nowrap;}
.app-badge:hover{background:var(--primary); color:#fff;}
.nav-hello{font-size:12.5px; color:var(--ink-soft); font-weight:700; white-space:nowrap;}
.menu-toggle{display:none; background:none; border:none; font-size:22px; cursor:pointer; flex-shrink:0;}

/* ===================== Buttons ===================== */
.btn{display:inline-block; border:none; font-weight:800; cursor:pointer; border-radius:11px; padding:10px 18px; font-size:13.5px; white-space:nowrap;}
.btn-primary{background:var(--primary); color:#fff;}
.btn-outline{background:#fff; color:var(--primary); border:1.5px solid var(--primary);}
.btn-ghost{background:none; color:var(--ink-soft);}
.btn-danger{background:var(--danger); color:#fff;}
.btn-sm{padding:7px 12px; font-size:12px; border-radius:9px;}

/* ===================== Hero ===================== */
.hero{
  background:
    linear-gradient(120deg, rgba(10,66,60,.88) 0%, rgba(14,92,84,.55) 55%, rgba(14,92,84,.30) 100%),
    url('assets/images/hero-bg.jpg') center center / cover no-repeat;
  color:#fff; padding-top:70px; position:relative;
}
.hero > .wrap{padding-bottom:40px;}
.hero h1{font-size:34px; font-weight:900; max-width:640px; line-height:1.5; margin:0;}
.hero p{margin-top:14px; font-size:15px; opacity:.88; max-width:560px;}
.hero-actions{margin-top:26px; display:flex; gap:12px; flex-wrap:wrap;}
.hero-social{margin-top:24px; display:flex; gap:10px; flex-wrap:wrap;}
.social-btn{width:38px; height:38px; border-radius:50%; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.18); display:flex; align-items:center; justify-content:center; transition:transform .15s; overflow:hidden;}
.social-btn:hover{transform:translateY(-2px);}
.social-btn img{width:19px; height:19px; object-fit:contain;}
.social-fallback{display:none; align-items:center; justify-content:center; font-size:16px; width:100%; height:100%;}
.hero-resources{background:rgba(0,0,0,.16); border-top:1px solid rgba(255,255,255,.12); padding:12px 0;}
.hero-resources .wrap{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.hero-resources-label{font-size:12.5px; color:rgba(255,255,255,.75); font-weight:700; flex-shrink:0;}
.resource-pill{font-size:12.5px; font-weight:700; color:#fff; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.20); padding:6px 12px 6px 6px; border-radius:20px; white-space:nowrap; display:inline-flex; align-items:center; gap:7px;}
.resource-pill img{width:18px; height:18px; border-radius:50%; background:#fff; object-fit:contain; padding:2px;}
.resource-pill:hover{background:rgba(255,255,255,.22);}

/* ===================== HOME: single-line overlay nav ===================== */
.site-header--overlay{
  position:absolute; top:0; left:0; right:0; z-index:60;
  background:rgba(4,14,20,.55); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(11,207,176,.14); box-shadow:none;
}
.site-header--overlay-row{
  display:flex; align-items:center; justify-content:space-between; gap:18px; height:auto; padding:13px 20px;
}
.site-header--overlay .site-logo{color:#fff; flex-shrink:0;}
.site-header--overlay .site-logo img{border-color:var(--krc-teal2);}
.site-header--overlay .site-logo a{color:#fff;}
.main-nav--overlay ul{display:flex; gap:2px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none;}
.main-nav--overlay ul::-webkit-scrollbar{display:none;}
.main-nav--overlay a{color:rgba(220,240,235,.78); font-weight:600; padding:8px 12px; border-radius:8px; position:relative;}
.main-nav--overlay a:hover, .main-nav--overlay .current-menu-item a{background:rgba(11,207,176,.12); color:#fff;}
.site-header--overlay .nav-actions{flex-shrink:0;}
.site-header--overlay .app-badge{background:rgba(11,207,176,.1); border:1px solid rgba(11,207,176,.28); color:var(--krc-teal2);}
.site-header--overlay .app-badge:hover{background:rgba(11,207,176,.18); color:var(--krc-teal2);}
.site-header--overlay .nav-hello{color:rgba(220,240,235,.7);}
.site-header--overlay .btn-outline{background:transparent; border-color:rgba(220,240,235,.4); color:#fff;}
.site-header--overlay .btn-outline:hover{border-color:var(--krc-teal2); color:var(--krc-teal2);}
.site-header--overlay .btn-ghost{color:rgba(220,240,235,.55);}
.site-header--overlay .menu-toggle{color:#fff; display:none;}
@media (max-width:980px){
  .main-nav--overlay{display:none;}
  .site-header--overlay .app-badge-label{display:none;}
}
@media (max-width:640px){
  .site-header--overlay .nav-hello{display:none;}
}

/* ===================== HOME: aerial Iran map hero ===================== */
:root{
  --krc-teal2:#0bcfb0; --krc-dark:#04090c;
}
.hero--map{
  background:none; padding:0; overflow:hidden; position:relative;
  min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center;
}

/* Base stage — calm, cool, mostly-flat dark backdrop. Faint corner blooms give
   it depth without ever competing with the content; nothing bright sits center. */
.hero-stars{
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 55% 45% at 10% 8%,  rgba(13,72,100,.28) 0%, transparent 60%),
    radial-gradient(ellipse 55% 45% at 90% 92%, rgba(9,58,78,.26) 0%, transparent 60%),
    radial-gradient(ellipse 60% 50% at 92% 10%, rgba(11,207,176,.07) 0%, transparent 55%),
    radial-gradient(ellipse 60% 50% at 8% 90%,  rgba(11,207,176,.06) 0%, transparent 55%),
    linear-gradient(180deg, #060f14 0%, #050b10 45%, var(--krc-dark) 100%);
}

.hero-map-wrap{
  position:absolute; inset:0; z-index:1;
}
.hero-map-svg{ display:block; width:100%; height:100%; opacity:1; }
.hero-map-svg image{ pointer-events:none; }

/* Large soft radial "stage light" pool centered on the content panel. This is
   the main readability layer: it quietly lowers brightness/contrast of the
   network graphic right behind the headline and search box, while letting the
   map stay richer and more visible toward the outer edges of the hero. */
.hero-stage-glow{
  position:absolute; inset:0; z-index:4; pointer-events:none;
  background:radial-gradient(ellipse 62% 56% at 50% 44%,
      rgba(3,8,11,.4) 0%,
      rgba(3,8,11,.3) 30%,
      rgba(3,8,11,.16) 54%,
      rgba(3,8,11,.05) 74%,
      transparent 92%);
}

/* Faint edge framing — much lighter than before so corner detail survives */
.hero-vignette{
  position:absolute; inset:0; z-index:5; pointer-events:none;
  background:radial-gradient(ellipse at 50% 50%, transparent 55%, rgba(3,8,11,.4) 100%);
}

/* City dots: base + halo (soft glow) + ring (pulse ripple) + labels — kept
   deliberately quiet, more "distant lights" than decoration */
.hero-city-dot .dot-base{ fill:var(--krc-teal2); opacity:.75; }
.hero-city-dot .dot-ring{ fill:none; stroke:var(--krc-teal2); stroke-width:1.7; opacity:0; }
.hero-city-dot .dot-halo{ opacity:.12; }
.dot-label{ font-family:'Vazirmatn',Tahoma,sans-serif; font-size:15px; font-weight:600; fill:rgba(220,245,238,.7); text-anchor:middle; }
.dot-count{ font-family:'Vazirmatn',Tahoma,sans-serif; font-size:13px; fill:rgba(150,215,200,.42); text-anchor:middle; letter-spacing:.2px; }

/* Network connection lines — slow flowing light, unhurried */
.hero-network-links .link-line{
  animation: krcFlow 26s linear infinite;
}
@keyframes krcFlow{
  from{ stroke-dashoffset:0; }
  to{ stroke-dashoffset:-120; }
}

/* Data-wave layer behind the headline — a hint of motion, not a pattern */
.hero-data-waves{
  position:absolute; inset:0; z-index:2; pointer-events:none;
  width:100%; height:100%; opacity:.35; filter:blur(.5px);
}
.hero-data-waves .wave{ opacity:.55; }
.hero-data-waves .w1{ animation: krcWaveDrift 26s ease-in-out infinite; }
.hero-data-waves .w2{ animation: krcWaveDrift 31s ease-in-out infinite reverse; }
.hero-data-waves .w3{ animation: krcWaveDrift 36s ease-in-out infinite; }
@keyframes krcWaveDrift{
  0%,100%{ transform:translateX(0) translateY(0); }
  50%{ transform:translateX(-24px) translateY(6px); }
}

.hero-map-content{
  position:relative; z-index:10; max-width:800px; width:100%; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:0;
  padding:128px 20px 64px;
}

/* Glass contrast panel — guarantees the title/search stay readable over the moving map.
   Kept lighter than before: the background is already dimmed by the stage-glow layer,
   so the panel's job is spacing and a faint contrast lift, not a heavy card. */
.hero-content-panel{
  --hero-gap-title:40px;       /* headline → search: the big pause before the CTA */
  --hero-gap-search:28px;      /* search → secondary actions */
  --hero-gap-actions:36px;     /* actions → social */
  width:100%; display:flex; flex-direction:column; align-items:center;
  background:rgba(3,11,15,.3);
  backdrop-filter:blur(32px) saturate(1.15); -webkit-backdrop-filter:blur(32px) saturate(1.15);
  border:1px solid rgba(11,207,176,.16);
  border-radius:32px;
  padding:clamp(40px,6vw,72px) clamp(24px,6vw,64px) clamp(36px,5vw,56px);
  box-shadow:0 24px 70px rgba(0,0,0,.32);
}

.hero-content-panel .hero-title{
  font-size:clamp(15px,5.2vw,58px); font-weight:800; line-height:1.14;
  margin:0 0 var(--hero-gap-title);
  letter-spacing:-.02em; color:#fff; max-width:none;
  white-space:nowrap; text-wrap:nowrap;
  text-shadow:0 2px 4px rgba(0,0,0,.55), 0 0 40px rgba(11,207,176,.25);
}

/* Search — the primary call-to-action. Larger than every other control in the hero,
   with its own soft brand-colored glow so the eye lands here first. */
.hero-search{
  width:100%; max-width:600px; position:relative; margin-bottom:var(--hero-gap-search);
  display:flex; border-radius:18px;
  box-shadow:0 12px 40px rgba(0,0,0,.35), 0 0 0 1px rgba(11,207,176,.06), 0 0 48px rgba(11,207,176,.16);
  transition:box-shadow .3s;
}
.hero-search:focus-within{
  box-shadow:0 12px 40px rgba(0,0,0,.35), 0 0 0 1px rgba(11,207,176,.1), 0 0 64px rgba(11,207,176,.28);
}
.hero-search-input{
  width:100%; padding:19px 64px 19px 22px; border-radius:18px;
  border:1.5px solid rgba(11,207,176,.55); background:rgba(2,9,13,.94);
  font-family:'Vazirmatn',Tahoma,sans-serif; font-size:16px;
  color:#fff; outline:none; transition:border-color .3s, box-shadow .3s; text-align:right;
}
.hero-search-input::placeholder{ color:rgba(200,235,225,.42); }
.hero-search-input:focus{ border-color:var(--krc-teal2); }
.hero-search-btn{
  position:absolute; left:8px; top:50%; transform:translateY(-50%);
  width:44px; height:44px; border-radius:12px; border:none; cursor:pointer;
  background:linear-gradient(135deg,#0d9e8a,var(--krc-teal2));
  display:flex; align-items:center; justify-content:center; transition:opacity .2s, transform .2s;
}
.hero-search-btn:hover{ opacity:.88; transform:translateY(-50%) scale(1.04); }
.hero-search-btn svg{ width:19px; height:19px; stroke:#fff; fill:none; stroke-width:2.2; stroke-linecap:round; }

/* Secondary actions — deliberately quiet so they never compete with the search box */
.hero--map .hero-actions{
  margin-top:0; margin-bottom:var(--hero-gap-actions); justify-content:center; gap:10px;
}
.hero--map .hero-actions .btn{ font-size:13px; padding:9px 16px; }
.btn-hero-ghost{
  background:rgba(4,20,28,.4); border:1px solid rgba(200,235,225,.2); color:rgba(255,255,255,.82);
}
.btn-hero-ghost:hover{ border-color:rgba(11,207,176,.5); color:var(--krc-teal2); background:rgba(4,20,28,.6); }

/* Social row — smallest, quietest element in the hero; present but recessive */
.hero--map .hero-social{ margin-top:0; justify-content:center; gap:8px; opacity:.7; transition:opacity .25s; }
.hero--map .hero-social:hover{ opacity:1; }
.hero--map .social-btn{
  width:30px; height:30px; background:rgba(4,20,28,.55); border:1px solid rgba(200,235,225,.16);
  box-shadow:none;
}
.hero--map .social-btn img{ width:15px; height:15px; }
.hero--map .social-btn .social-fallback{ font-size:12px; }
.hero--map .social-btn:hover{ border-color:rgba(11,207,176,.5); background:rgba(11,207,176,.15); }

@media (max-width:640px){
  .hero-map-content{ padding:104px 16px 48px; }
  .hero-content-panel{ border-radius:24px; }
  .hero-search-input{ padding:16px 56px 16px 18px; font-size:15px; }
  .hero-search-btn{ width:40px; height:40px; }
  .hero--map .hero-actions .btn{ width:100%; text-align:center; }
  .hero--map .hero-actions{ flex-direction:column; }
}

.hero-scroll-hint{
  position:absolute; bottom:24px; left:50%; transform:translateX(-50%); z-index:10;
  opacity:.45; animation:krcBob 3s ease-in-out infinite;
}
.hero-scroll-hint svg{ width:20px; stroke:rgba(200,235,225,.6); fill:none; stroke-width:2; stroke-linecap:round; }
@keyframes krcBob{
  0%,100%{ opacity:.35; transform:translateX(-50%) translateY(0); }
  50%{ opacity:.65; transform:translateX(-50%) translateY(6px); }
}

/* Subtitle band — sits right below the hero, above the trusted-resources bar */
.hero-intro-text{
  background:var(--primary-dark);
  padding:34px 20px;
  text-align:center;
  border-top:1px solid rgba(11,207,176,.15);
}
.hero-intro-text p{
  font-size:clamp(13px,1.6vw,15px); font-weight:400; color:rgba(220,240,235,.82);
  line-height:2; margin:0 auto; max-width:760px;
}
.hero-intro-cursor{
  display:inline-block; width:2px; height:1em; margin-right:2px; vertical-align:-2px;
  background:var(--krc-teal2); animation:heroCursorBlink 1s step-end infinite;
}
.hero-intro-typewriter.is-done .hero-intro-cursor{ animation:heroCursorBlink 1s step-end infinite; opacity:.6; }
@keyframes heroCursorBlink{ 0%,50%{ opacity:1; } 50.01%,100%{ opacity:0; } }

.hero-resources--below{ background:var(--primary-dark); border-top:1px solid rgba(255,255,255,.12); padding:12px 0; }
.hero-resources--below .wrap{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }

/* ===================== Page banner (per-section hero image) ===================== */
.page-banner{
  position:relative; color:#fff; padding:46px 0; margin-bottom:0;
  background-size:cover; background-position:center;
}
.page-banner::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(120deg, rgba(10,66,60,.90) 0%, rgba(14,92,84,.62) 55%, rgba(14,92,84,.32) 100%);
}
.page-banner .wrap{position:relative; z-index:2;}
.page-banner h1,.page-banner h2{color:#fff; margin:0;}
.page-banner p{color:#E3F0ED; margin-top:8px; font-size:13.5px;}

/* ===================== Sections ===================== */
.section{padding:56px 0;}
.section-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:26px; flex-wrap:wrap; gap:10px;}
.section-head h2{font-size:23px; font-weight:800; color:var(--primary-dark); margin:0;}
.section-head p{font-size:13px; color:var(--ink-soft); margin-top:4px;}
.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:18px;}
.grid.cols-4{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));}
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:18px;}

/* ===================== Location picker ===================== */
.loc-bar{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:18px; margin-bottom:22px;}
.search-input{width:100%; border:1px solid var(--line); border-radius:11px; padding:11px 14px; font-size:13.5px; margin-top:10px;}
.province-grid{display:flex; flex-wrap:wrap; gap:7px; margin-top:14px; max-height:130px; overflow-y:auto;}
.chip{background:var(--bg); border:1px solid var(--line); padding:7px 14px; border-radius:20px; font-size:12.5px; font-weight:700; color:var(--ink-soft); cursor:pointer;}
.chip.active{background:var(--primary); color:#fff; border-color:var(--primary);}
.city-chip{background:var(--accent); color:var(--primary-dark);}
.city-chip.active{background:var(--primary-dark); color:#fff;}
.city-row{display:flex; flex-wrap:wrap; gap:7px; margin-top:12px; padding-top:12px; border-top:1px dashed var(--line);}
.loc-tag{display:inline-flex; align-items:center; gap:6px; background:var(--primary-tint); color:var(--primary-dark); font-size:12px; font-weight:800; padding:6px 12px; border-radius:20px; margin-bottom:10px;}
.loc-tag a{color:var(--danger);}

/* ===================== Ad banner ===================== */
.ad-banner{position:relative; background:linear-gradient(120deg,#FDF3E8,#F6E4C6); border:1.5px dashed var(--accent-dark); border-radius:var(--radius); padding:16px 18px; margin-bottom:26px;}
.ad-banner span.tag{position:absolute; top:-9px; right:16px; background:var(--accent-dark); color:#fff; font-size:10px; font-weight:800; padding:3px 10px; border-radius:8px;}
.ad-banner h4{font-size:14px; font-weight:800; color:var(--primary-dark); margin:0;}
.ad-banner p{font-size:12.5px; color:var(--ink-soft); margin-top:5px;}

/* ===================== Interactive facility map (Leaflet) ===================== */
.facility-map-wrap{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:14px; margin-bottom:26px;}
.facility-map-toolbar{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-bottom:12px;}
.facility-map-title{font-weight:800; color:var(--primary-dark); font-size:15px;}
.facility-map{width:100%; height:340px; border-radius:12px; overflow:hidden; z-index:1;}
.facility-map-note{font-size:12.5px; color:var(--ink-soft); margin-top:10px; font-weight:700;}
.fac-map-popup{font-family:inherit; min-width:180px;}
.fac-map-popup b{font-size:13.5px; color:var(--primary-dark);}
.fac-map-popup-type{font-size:11.5px; color:var(--ink-soft); margin-top:2px;}
.fac-map-popup-addr{font-size:11.5px; color:var(--ink-soft); margin-top:6px;}
.fac-map-popup-actions{display:flex; gap:10px; margin-top:8px;}
.fac-map-popup-actions a{font-size:12px; font-weight:700; color:var(--primary);}
.fac-map-you-icon{font-size:22px; text-align:center; line-height:26px; filter:drop-shadow(0 2px 2px rgba(0,0,0,.35));}

/* ===================== Doctor / facility cards ===================== */
.avatar{width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-weight:800; color:#fff; font-size:16px; flex-shrink:0; background:var(--primary); overflow:hidden;}
.avatar-photo{padding:0;}
.avatar-photo img{width:100%; height:100%; object-fit:cover; object-position:top center; border-radius:14px; margin:0;}
.doc-card,.fac-card{display:flex; gap:14px; align-items:flex-start;}
.doc-card h3,.fac-card h3{font-size:15px; font-weight:800; margin:0;}
.doc-card .spec,.fac-card .type{font-size:12px; color:var(--ink-soft); margin-top:3px;}
.doc-meta{display:flex; gap:10px; margin-top:8px; font-size:12px; color:var(--ink-soft);}
.rating{color:var(--accent-dark); font-weight:800;}
.verified-badge{display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:700; color:#0E7C4A; background:#E7F7EE; border:1px solid #BFEBD3; padding:4px 10px; border-radius:20px; margin-top:6px;}
.visit-type-toggle{display:flex; gap:8px;}
.visit-type-btn{flex:1; max-width:220px; padding:11px 16px; border-radius:12px; border:1.5px solid var(--line); background:#fff; font-weight:700; font-size:13px; cursor:pointer; color:var(--ink-soft);}
.visit-type-btn.active{border-color:var(--primary); background:var(--primary-tint); color:var(--primary-dark);}

/* ===================== Emergency FAB ===================== */
.emergency-fab-wrap{position:fixed; bottom:22px; left:22px; z-index:80;}
.emergency-fab{width:56px; height:56px; border-radius:50%; border:none; background:#D64545; color:#fff; font-size:24px; cursor:pointer; box-shadow:0 6px 18px rgba(214,69,69,.45); animation:emergencyPulse 2.4s infinite;}
@keyframes emergencyPulse{0%,100%{box-shadow:0 6px 18px rgba(214,69,69,.45);} 50%{box-shadow:0 6px 22px rgba(214,69,69,.75);}}
.emergency-panel{display:none; position:absolute; bottom:68px; left:0; width:280px; background:#fff; border-radius:16px; box-shadow:0 12px 32px rgba(0,0,0,.18); padding:16px; border:1px solid var(--line);}
.emergency-panel.open{display:block;}
.emergency-panel-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; font-size:14px;}
.emergency-panel-head button{background:none; border:none; font-size:15px; cursor:pointer; color:var(--ink-soft);}
.emergency-call{display:block; text-align:center; background:#D64545; color:#fff; font-weight:800; padding:11px; border-radius:10px; font-size:13.5px; margin-bottom:12px;}
.emergency-sub{font-size:11.5px; color:var(--ink-soft); font-weight:700; margin-bottom:8px;}
.emergency-facility{display:flex; align-items:center; justify-content:space-between; font-size:12.5px; font-weight:700; padding:9px 10px; border-radius:10px; background:var(--primary-tint); color:var(--primary-dark); margin-bottom:6px;}
@media (max-width:760px){
  .emergency-fab-wrap{bottom:16px; left:16px;}
  .emergency-panel{width:240px;}
}
.insurance-badges{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px;}
.insurance-pill{font-size:11px; font-weight:700; color:var(--primary-dark); background:var(--primary-tint); padding:4px 10px; border-radius:20px;}
.service-badges{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px;}
.service-pill{font-size:11px; font-weight:700; color:#8a5a00; background:#fff3d9; padding:4px 10px; border-radius:20px;}
.service-pill-more{color:var(--ink-soft); background:#f1f1f1;}
.rating-summary{display:flex; align-items:center; gap:8px; margin:16px 0 10px;}
.review-item{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px 16px; margin-bottom:10px;}
.insurance-filter{display:flex; flex-wrap:wrap; gap:8px; margin:14px 0;}
.insurance-filter a{font-size:12px; font-weight:700; padding:7px 14px; border-radius:20px; border:1px solid var(--line); color:var(--ink-soft);}
.insurance-filter a.active{background:var(--primary); color:#fff; border-color:var(--primary);}
.star-picker{display:flex; gap:4px; font-size:24px; cursor:pointer; color:#E0A527; user-select:none;}
.star-choice{transition:transform .1s;}
.star-choice:hover{transform:scale(1.15);}
.review-comment-input{width:100%; border:1px solid var(--line); border-radius:10px; padding:8px 10px; font-family:inherit; font-size:12.5px; resize:vertical;}
.symptom-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:12px;}
.symptom-tile{display:flex; flex-direction:column; align-items:center; gap:8px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:18px 10px; font-size:12.5px; font-weight:700; cursor:pointer; transition:border-color .15s, transform .15s;}
.symptom-tile:hover{transform:translateY(-2px); border-color:var(--primary);}
.symptom-tile.active{border-color:var(--primary); background:var(--primary-tint);}
.symptom-icon{font-size:26px;}
.fav-btn{margin-right:auto; cursor:pointer; font-size:17px; background:none; border:none;}
.card-foot{margin-top:14px; display:flex; gap:8px; flex-wrap:wrap;}

/* ===================== Meds / Magazine ===================== */
/* Modern grid card: icon medallion + title/category up top, color-coded
   rx-status badge pinned to the footer so the prescription requirement is
   scannable at a glance across a grid of cards. */
.med-card{display:flex; flex-direction:column; gap:10px; transition:transform .15s, border-color .15s;}
.med-card:hover{border-color:var(--primary); transform:translateY(-3px);}
.med-card .med-card-icon{width:44px; height:44px; border-radius:12px; background:var(--primary-tint); color:var(--primary-dark); display:flex; align-items:center; justify-content:center; font-size:20px; flex-shrink:0;}
.med-card h4{font-size:14px; font-weight:800; color:var(--primary-dark); margin:0;}
.med-card .cls{font-size:11px; font-weight:700; color:var(--accent-dark); margin:3px 0 0;}
.med-card .med-generic{font-size:11.5px; font-weight:700; color:var(--ink-soft); margin:2px 0 0;}
.med-card .med-brands{font-size:11px; color:var(--ink-soft); margin:4px 0 0; line-height:1.6;}
.med-card p{font-size:12.5px; color:var(--ink-soft); margin:0; line-height:1.6;}
.med-card-mini{display:flex; flex-direction:column; gap:8px; color:inherit; transition:transform .15s, border-color .15s;}
.med-card-mini h4{font-size:14px; font-weight:800; color:var(--primary-dark); margin:0;}
.med-card-mini .cls{font-size:11px; font-weight:700; color:var(--accent-dark); margin:3px 0 0;}
.med-card-mini p{font-size:12.5px; color:var(--ink-soft); margin:0; line-height:1.6;}
.med-card-mini:hover{border-color:var(--primary); transform:translateY(-3px);}

/* Color-coded prescription-status badge, shared by all medicine cards and
   the single medicine page. */
.rx-badge{display:inline-flex; align-items:center; gap:4px; font-size:10.5px; font-weight:800; padding:4px 10px; border-radius:8px; white-space:nowrap;}
.rx-badge--otc{background:var(--success-tint); color:var(--success);}
.rx-badge--rx{background:var(--danger-tint); color:var(--danger);}

/* Color-coded facility amenity chips (gym equipment, spa/wellness,
   nutrition, accessibility, etc.) — each keyword-matched category gets its
   own tint so a card's feature set reads visually, not just as text. */
.amenity-chips{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px;}
.amenity-chip{font-size:11px; font-weight:700; padding:4px 10px; border-radius:20px; white-space:nowrap;}
.amenity-chip--water{background:#E3F1FB; color:#1D6FA5;}
.amenity-chip--wellness{background:#FBE8F1; color:#B23E7B;}
.amenity-chip--fitness{background:#EFE7FB; color:#6A3FB0;}
.amenity-chip--food{background:var(--success-tint); color:var(--success);}
.amenity-chip--parking{background:#EEF0F2; color:#4A5560;}
.amenity-chip--kids{background:#FFF1DC; color:#B9832C;}
.amenity-chip--access{background:#E3F1FB; color:#1D6FA5;}
.amenity-chip--safety{background:var(--danger-tint); color:var(--danger);}
.amenity-chip--default{background:var(--primary-tint); color:var(--primary-dark);}

/* Color-coded open/closed status pill for facility hours. */
.status-pill{display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:800; padding:4px 10px; border-radius:8px; white-space:nowrap;}
.status-pill--open{background:var(--success-tint); color:var(--success);}
.status-pill--closed{background:var(--danger-tint); color:var(--danger);}

/* "سلامت من" boxed container on the homepage */
.home-health-box{background:linear-gradient(160deg, color-mix(in srgb, var(--primary) 6%, var(--card)), var(--card)); border:1px solid var(--line); border-radius:20px; padding:22px;}
.mag-cover{width:100%; height:170px; object-fit:cover; border-radius:12px; margin-bottom:12px;}
.doc-card-demo, .fac-card-demo{flex-direction:column; align-items:stretch;}
.doc-cover{width:100%; height:150px; object-fit:cover; border-radius:12px; margin-bottom:12px;}
.home-fac-search{display:flex; gap:10px; margin:4px 0 22px; flex-wrap:wrap;}
.home-fac-search .search-input{flex:1; min-width:220px; padding:12px 16px; border-radius:12px; border:1px solid var(--border); font-family:inherit; font-size:15px;}
.mag-cat{font-size:11px; font-weight:800; color:var(--accent-dark);}
.mag-card h3{font-size:15.5px; font-weight:800; margin-top:6px; line-height:1.6;}
.mag-card p{font-size:12.5px; color:var(--ink-soft); margin-top:6px;}
.article-body{font-size:14px; line-height:2.1; margin-top:16px;}

/* ===================== Forms ===================== */
.field{margin-bottom:14px;}
.field label{display:block; font-size:12.5px; font-weight:700; color:var(--ink-soft); margin-bottom:6px;}
.field input,.field select,.field textarea{width:100%; border:1px solid var(--line); border-radius:10px; padding:10px 12px; font-size:13.5px;}
.field textarea{min-height:90px; resize:vertical;}
.disclaimer{font-size:11px; color:var(--ink-soft); background:var(--primary-tint); border-radius:10px; padding:10px 12px; margin-top:12px; line-height:1.8;}
.empty-note{text-align:center; padding:30px; color:var(--ink-soft); font-size:13px;}
.row-item{display:flex; justify-content:space-between; align-items:center; background:var(--card); border:1px solid var(--line); border-radius:10px; padding:11px 14px; margin-bottom:8px; font-size:13px;}
.badge{font-size:10.5px; background:var(--primary-tint); color:var(--primary-dark); padding:3px 9px; border-radius:8px; font-weight:800;}

/* ===================== Tabs (health tools, account, admin-like screens) ===================== */
.tool-tabs{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px;}
.tool-panel{display:none;}
.tool-panel.active{display:block;}
.bmi-result{background:linear-gradient(120deg,var(--primary),#12756B); color:#fff; border-radius:var(--radius); padding:20px; text-align:center; margin-top:16px;}
.bmi-result .num{font-size:32px; font-weight:900;}
.metric-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px;}
.metric-box{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px; text-align:center;}
.metric-box .lb{font-size:11px; color:var(--ink-soft); font-weight:700;}
.metric-box .val{font-size:15px; font-weight:800; color:var(--primary-dark); margin-top:5px;}
.gender-row{display:flex; gap:10px; margin-bottom:14px;}
.gender-chip{flex:1; text-align:center; padding:11px; border-radius:10px; border:1.5px solid var(--line); font-weight:700; cursor:pointer;}
.gender-chip.active{background:var(--primary); color:#fff; border-color:var(--primary);}

/* ===================== Prescription reader (Rx) ===================== */
.upload-zone{border:2px dashed var(--primary); background:var(--primary-tint); border-radius:var(--radius); padding:40px 20px; text-align:center; cursor:pointer;}
.upload-zone .ic{font-size:38px; display:block; margin-bottom:12px;}
.upload-zone h3{font-size:16px; font-weight:800; color:var(--primary-dark); margin:0;}
.upload-zone p{font-size:12.5px; color:var(--ink-soft); margin-top:6px;}
.rx-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:20px; margin-top:20px;}
.rx-card .rx-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;}
.rx-card .rx-head h3{font-size:15px; font-weight:800; margin:0;}
.rx-item{padding:12px 0; border-top:1px dashed var(--line); font-size:13px;}
.rx-item:first-child{border-top:none;}
.rx-item-top{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.rx-item b{font-size:14px; display:block; margin-bottom:4px;}
.rx-item .dose{color:var(--ink-soft);}
.rx-note{margin-top:14px; background:#FDF3E8; border:1px solid #F0DCB9; border-radius:12px; padding:12px 14px; font-size:12px; color:#8A5A16; line-height:1.8;}

/* ===================== یادآوری مصرف دارو ===================== */
.rx-remind-btn{background:var(--primary-tint); color:var(--primary-dark); border:none; border-radius:20px; padding:6px 12px; font-size:11.5px; font-weight:700; cursor:pointer; white-space:nowrap;}
.rx-remind-btn:hover{background:var(--primary); color:#fff;}
.rx-remind-form{margin-top:10px; background:var(--bg); border:1px solid var(--line); border-radius:12px; padding:12px;}
.rx-remind-presets{display:flex; flex-wrap:wrap; gap:10px; font-size:12.5px;}
.rx-remind-presets label{display:flex; align-items:center; gap:5px; cursor:pointer;}
.rx-remind-custom{display:flex; align-items:center; gap:8px; margin-top:10px;}
.rx-remind-custom input[type="time"]{border:1px solid var(--line); border-radius:8px; padding:6px 8px; font-size:12.5px;}
.rx-remind-save{margin-top:10px;}
.rx-remind-msg{font-size:12px; color:var(--ink-soft); margin-top:8px;}
.rx-remind-msg--ok{color:var(--success);}
.rx-reminders{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:20px; margin-top:20px;}
.rx-reminders h3{font-size:15px; font-weight:800; margin:0 0 6px;}
.rx-reminders-note{font-size:11.5px; color:var(--warning); margin-bottom:14px; line-height:1.8;}
.rx-remind-row{display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-top:1px dashed var(--line); font-size:13px;}
.rx-remind-row:first-child{border-top:none;}
.rx-remind-times{margin-top:4px; display:flex; gap:6px; flex-wrap:wrap;}
.rx-remind-time-chip{background:var(--primary-tint); color:var(--primary-dark); border-radius:10px; padding:2px 8px; font-size:11px; font-weight:700;}
.rx-remind-remove{background:none; border:none; color:var(--danger); font-size:15px; cursor:pointer;}
.loading-box{text-align:center; padding:30px 10px; color:var(--ink-soft); font-size:13px;}
.spinner{width:28px; height:28px; border:3px solid var(--line); border-top-color:var(--primary); border-radius:50%; margin:0 auto 12px; animation:doctorbio-spin .8s linear infinite;}
@keyframes doctorbio-spin{to{transform:rotate(360deg);}}
.error-box{background:#FCEDEA; border:1px solid #F0C4BA; border-radius:12px; padding:14px 16px; font-size:12.5px; color:var(--danger); margin-top:16px; line-height:1.8;}

/* ===================== Footer ===================== */
.site-footer{background:var(--primary-dark); color:#fff; padding:44px 0 26px; margin-top:40px;}
.foot-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:26px;}
.site-footer h5{font-size:14px; font-weight:800; margin-bottom:12px;}
.site-footer a{display:block; font-size:12.5px; color:#CFE3DF; margin-bottom:8px;}
.foot-badges{display:flex; align-items:center; justify-content:center; gap:16px; flex-wrap:wrap; margin-top:34px;}
.badge-slot{display:flex; align-items:center; gap:8px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:12px; padding:8px 14px;}
.badge-slot img{height:56px; display:block;}
.badge-slot-empty{color:#9AB8B2; font-size:11.5px;}
.badge-slot-empty span{font-size:18px;}
.foot-bottom{text-align:center; font-size:11.5px; color:#9AB8B2; margin-top:20px; border-top:1px solid rgba(255,255,255,.1); padding-top:20px;}

/* ===================== Misc ===================== */
.toast{position:fixed; bottom:24px; left:50%; transform:translateX(-50%); background:var(--ink); color:#fff; padding:12px 22px; border-radius:12px; font-size:13px; font-weight:700; z-index:200; display:none;}
.pagination{display:flex; gap:8px; margin-top:30px; justify-content:center;}
.pagination a,.pagination span{padding:8px 14px; border-radius:8px; border:1px solid var(--line); font-size:13px;}
.pagination .current{background:var(--primary); color:#fff;}
.skip-link{position:absolute; right:-9999px; top:0; background:#fff; padding:10px; z-index:999;}
.skip-link:focus{right:10px;}

@media (max-width:760px){
  .site-header-top .wrap{height:58px;}
  .app-badge, .nav-hello{display:none;}
  .nav-actions{gap:6px;}
  .btn-sm{padding:7px 10px; font-size:11.5px;}
  .site-header-nav{padding:0; border-top:none;}
  .site-header-nav .wrap{height:auto; padding:0;}
  .main-nav{display:none; position:absolute; top:58px; right:0; left:0; background:#fff; flex-direction:column; padding:10px 20px; border-bottom:1px solid var(--line); z-index:60; box-shadow:0 8px 20px rgba(0,0,0,.08);}
  .main-nav.open{display:block;}
  .main-nav ul{flex-direction:column;}
  .menu-toggle{display:block;}
  .hero h1{font-size:26px;}
}

/* ===================== Pre-footer promo band (context-aware, replaces old raw widget dump) ===================== */
.footer-promo{
  position:relative; color:#fff; padding:64px 0 60px; margin-top:56px;
  background-size:cover; background-position:center;
}
.footer-promo::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(120deg, rgba(10,66,60,.93) 0%, rgba(14,92,84,.78) 55%, rgba(14,92,84,.48) 100%);
}
.footer-promo .wrap{position:relative; z-index:2;}
.footer-promo h2{font-size:clamp(22px,3vw,30px); font-weight:900; max-width:680px; margin:0 0 28px; line-height:1.5;}
.footer-promo .promo-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:16px;}
.footer-promo .promo-box{
  background:rgba(255,255,255,.10); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.25); border-radius:16px; padding:20px 22px;
}
.footer-promo .promo-box .ic{font-size:24px; margin-bottom:10px; display:block;}
.footer-promo .promo-box b{display:block; font-size:14.5px; font-weight:800; margin-bottom:5px;}
.footer-promo .promo-box span{font-size:12.5px; opacity:.88; line-height:1.7;}
.footer-promo .promo-cta{margin-top:30px;}

/* ===================== Bolder homepage sections (doctors / facilities / magazine) ===================== */
.section-eyebrow{
  display:inline-block; font-size:12px; font-weight:800; color:var(--primary);
  background:var(--primary-tint); padding:5px 14px; border-radius:20px; margin-bottom:10px;
}
.section-head h2{font-size:26px;}

.doc-card, .fac-card{
  border-top:4px solid var(--primary); transition:transform .22s ease, box-shadow .22s ease;
}
.doc-card:hover, .fac-card:hover{
  transform:translateY(-5px); box-shadow:0 18px 36px rgba(14,92,84,.18);
}
.doc-card h3 a, .fac-card h3 a{color:var(--primary-dark); font-weight:900;}
.doc-meta .rating{
  background:#FDF3E8; color:var(--accent-dark); padding:2px 9px; border-radius:8px; font-size:12.5px;
}

.mag-card{
  transition:transform .22s ease, box-shadow .22s ease; overflow:hidden;
}
.mag-card:hover{ transform:translateY(-5px); box-shadow:0 18px 36px rgba(14,92,84,.18); }
.mag-card .mag-cat{
  display:inline-block; background:var(--accent); color:#fff; font-weight:800;
  padding:3px 11px; border-radius:8px; font-size:10.5px; letter-spacing:.02em;
}
.mag-card h3{font-weight:900;}

@media (max-width:760px){
  .footer-promo{padding:46px 0 40px;}
}

/* ===================== Magazine two-column layout (fixes sidebar sitting oddly below content) ===================== */
.mag-layout{display:grid; grid-template-columns:1fr 300px; gap:34px; align-items:start;}
.widget-area{display:flex; flex-direction:column; gap:20px; position:sticky; top:90px;}
.side-block h5{font-size:14px; font-weight:800; color:var(--primary-dark); margin:0 0 14px;}
.side-search{display:flex; gap:8px;}
.side-search input{flex:1; border:1px solid var(--line); border-radius:10px; padding:10px 12px; font-size:13px;}
.side-search button{background:var(--primary); color:#fff; border:none; border-radius:10px; padding:0 16px; font-size:15px; cursor:pointer;}
.side-post-list li{border-top:1px dashed var(--line); padding:11px 0;}
.side-post-list li:first-child{border-top:none; padding-top:0;}
.side-post-list a{display:flex; gap:10px; align-items:flex-start;}
.side-post-list .num{font-family:monospace; font-weight:800; color:var(--accent-dark); font-size:13px; flex:none;}
.side-post-list .txt{font-size:13px; font-weight:700; line-height:1.6; color:var(--ink);}
.side-post-list a:hover .txt{color:var(--primary);}
.side-cat-chips{display:flex; flex-wrap:wrap; gap:8px;}
.side-cat-chips .chip{display:flex; align-items:center; gap:6px; cursor:pointer;}
.side-cat-chips .chip span{background:rgba(0,0,0,.08); border-radius:8px; padding:0 6px; font-size:10.5px;}
.side-cta{background:linear-gradient(135deg,var(--primary),var(--primary-dark)); color:#fff;}
.side-cta h5{color:#fff;}
.side-cta p{font-size:12.5px; opacity:.9; margin-bottom:14px; line-height:1.8;}

@media (max-width:900px){
  .mag-layout{grid-template-columns:1fr;}
  .widget-area{position:static;}
}

/* ===================== Page-banner medical icon texture (used until real photos are added) ===================== */
.page-banner{background-color:var(--primary-dark);}
.page-banner::after{
  content:""; position:absolute; inset:0; z-index:1; opacity:.7;
  background-image:url('assets/images/medical-pattern.svg'); background-size:220px; background-repeat:repeat;
}
.page-banner.has-photo::after{display:none;}
.page-banner.has-photo::before{background:linear-gradient(120deg, rgba(10,66,60,.82) 0%, rgba(14,92,84,.55) 55%, rgba(14,92,84,.30) 100%);}
.page-banner .wrap{z-index:3;}

/* ===================== Footer brand logo ===================== */
.foot-brand{display:flex; align-items:center; gap:10px; margin-bottom:14px;}
.foot-brand img{width:34px; height:34px; border-radius:50%;}

/* ===================== "Why Doctor Bio" homepage section ===================== */
.why-section{background:linear-gradient(180deg,var(--primary-tint) 0%, transparent 100%); border-radius:28px; padding:50px 26px;}
.why-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:20px; margin-top:10px;}
.why-box{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:24px 22px; box-shadow:var(--shadow); border-top:4px solid var(--accent);}
.why-box .ic{font-size:26px; margin-bottom:12px; display:block;}
.why-box h3{font-size:15.5px; font-weight:800; color:var(--primary-dark); margin:0 0 8px;}
.why-box p{font-size:13px; color:var(--ink-soft); line-height:1.9; margin:0;}

/* ===================== App download section ===================== */
.app-promo{
  display:grid; grid-template-columns:1.1fr .9fr; gap:36px; align-items:center;
  background:linear-gradient(120deg,var(--primary-dark),var(--primary)); color:#fff;
  border-radius:28px; padding:46px 40px; position:relative; overflow:hidden;
}
.app-promo::before{
  content:""; position:absolute; inset:0; opacity:.5;
  background-image:url('assets/images/medical-pattern.svg'); background-size:220px; background-repeat:repeat;
}
.app-promo > *{position:relative; z-index:2;}
.app-promo h2{font-size:24px; font-weight:900; margin:0 0 12px;}
.app-promo p{font-size:13.5px; opacity:.9; max-width:44ch; line-height:1.9; margin-bottom:22px;}
.app-store-badges{display:flex; gap:12px; flex-wrap:wrap;}
.app-store-badges a{
  display:flex; align-items:center; gap:8px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.3);
  border-radius:12px; padding:10px 18px; font-size:13px; font-weight:700; color:#fff;
}
.app-promo .app-icon-box{
  width:100%; aspect-ratio:1/1; max-width:220px; margin:0 auto; border-radius:34px; background:rgba(255,255,255,.12);
  display:flex; align-items:center; justify-content:center; padding:26px; border:1px solid rgba(255,255,255,.25);
}
.app-promo .app-icon-box img{width:100%; height:100%; object-fit:contain;}

/* ===================== Simple content pages (about / terms / contact) ===================== */
.content-page .lede{font-size:15px; color:var(--ink-soft); max-width:70ch; margin-bottom:10px;}
.content-page h2{font-size:19px; font-weight:800; color:var(--primary-dark); margin:34px 0 12px;}
.value-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-top:16px;}
.value-box{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px; box-shadow:var(--shadow);}
.value-box .ic{font-size:22px; margin-bottom:8px; display:block;}
.value-box h4{font-size:14px; font-weight:800; color:var(--primary-dark); margin:0 0 6px;}
.value-box p{font-size:12.5px; color:var(--ink-soft); margin:0; line-height:1.8;}
.founder-strip{
  display:flex; align-items:center; gap:16px; background:var(--primary-tint); border-radius:16px; padding:20px 22px; margin-top:24px;
}
.founder-strip .ic{font-size:28px;}
.founder-strip p{font-size:13px; color:var(--primary-dark); margin:0; line-height:2; font-weight:600;}

.terms-list{counter-reset:term; margin-top:10px;}
.terms-item{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px 22px; margin-bottom:14px; box-shadow:var(--shadow); position:relative;}
.terms-item h3{font-size:14.5px; font-weight:800; color:var(--primary-dark); margin:0 0 8px; display:flex; align-items:center; gap:10px;}
.terms-item h3::before{
  counter-increment:term; content:counter(term); background:var(--primary); color:#fff; width:24px; height:24px;
  border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:12px; flex:none;
}
.terms-item p{font-size:13px; color:var(--ink-soft); line-height:1.9; margin:0;}

.contact-methods{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin:24px 0 36px;}
.contact-method{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:22px; text-align:center; box-shadow:var(--shadow);}
.contact-method .ic{font-size:26px; margin-bottom:10px; display:block;}
.contact-method h4{font-size:13.5px; font-weight:800; color:var(--primary-dark); margin:0 0 6px;}
.contact-method a, .contact-method span{font-size:12.5px; color:var(--ink-soft);}
.contact-layout{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start;}

@media (max-width:860px){
  .app-promo{grid-template-columns:1fr;}
  .contact-layout{grid-template-columns:1fr;}
}

/* ===================== AI-powered guidance box (Health Tools) ===================== */
.ai-box{
  margin-top:18px; max-width:560px; border-top:3px solid var(--accent);
  background:linear-gradient(180deg, var(--primary-tint) 0%, var(--card) 40%);
}
.ai-box h4{font-size:14.5px; font-weight:800; color:var(--primary-dark); margin:0 0 6px; display:flex; align-items:center; gap:6px;}
.ai-box .ai-disclaimer{font-size:11.5px; color:var(--ink-soft); line-height:1.8; margin-bottom:12px;}
.ai-box textarea{
  width:100%; border:1px solid var(--line); border-radius:10px; padding:10px 12px; font-family:inherit;
  font-size:13px; resize:vertical; margin-bottom:10px;
}
.ai-box .btn{width:100%;}
.ai-answer{
  margin-top:14px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:16px;
  font-size:13.5px; line-height:2; color:var(--ink);
}

/* ===================== Medicine live search + filter bar ===================== */
.med-filter-bar{display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-bottom:26px;}
.med-filter-bar .search-input{flex:1; min-width:240px; margin-bottom:0;}
.med-filter-select{border:1px solid var(--line); border-radius:20px; padding:9px 14px; font-size:12.5px; font-weight:700; color:var(--ink-soft); background:#fff; font-family:inherit;}
.med-filter-chips{display:flex; gap:8px;}
#doctorbioMedResults[aria-busy="true"], #doctorbioSearchResults[aria-busy="true"]{opacity:.55; transition:opacity .15s;}
.search-section{margin-bottom:34px;}
.search-section-title{font-size:16px; font-weight:800; color:var(--primary-dark); margin:0 0 14px; display:flex; align-items:center; gap:8px;}
.search-section-count{font-size:11.5px; font-weight:700; color:var(--ink-soft); background:var(--primary-tint); border-radius:10px; padding:2px 9px;}

/* ===================== Medicine category browser (61 official categories) ===================== */
.med-cat-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px;
}
.med-cat-card{
  display:flex; flex-direction:column; gap:4px; background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:16px 18px; box-shadow:var(--shadow); border-inline-start:4px solid var(--primary);
  transition:transform .18s ease, box-shadow .18s ease;
}
.med-cat-card:hover{ transform:translateY(-3px); box-shadow:0 14px 28px rgba(14,92,84,.14); }
.med-cat-card .fa{font-size:13.5px; font-weight:800; color:var(--primary-dark); line-height:1.7;}
.med-cat-card .en{font-size:11px; color:var(--ink-soft); direction:ltr; text-align:right;}
.med-cat-card .count{
  margin-top:6px; align-self:flex-start; background:var(--primary-tint); color:var(--primary-dark);
  font-size:10.5px; font-weight:700; padding:2px 10px; border-radius:20px;
}

/* ===================== Community banner (homepage, bold + prominent) ===================== */
.community-banner{
  position:relative; overflow:hidden; margin:26px 0 6px; border-radius:28px; padding:34px 32px;
  background:linear-gradient(120deg,#6D28D9 0%,#D9376E 55%,#D9A441 100%);
  color:#fff; display:flex; align-items:center; justify-content:space-between; gap:26px; flex-wrap:wrap;
  box-shadow:0 18px 40px rgba(109,40,217,.28);
}
.community-banner::before{
  content:""; position:absolute; inset:0; opacity:.16; mix-blend-mode:overlay;
  background-image:url('assets/images/medical-pattern.svg'); background-size:200px; background-repeat:repeat;
}
.community-banner > *{position:relative; z-index:2;}
.community-banner-live{
  display:inline-flex; align-items:center; gap:7px; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.3);
  padding:5px 12px; border-radius:20px; font-size:11.5px; font-weight:800;
}
.community-banner-live .dot{width:8px; height:8px; border-radius:50%; background:#5CE87A; animation:communityPulse 1.6s infinite;}
@keyframes communityPulse{0%,100%{box-shadow:0 0 0 0 rgba(92,232,122,.65);} 70%{box-shadow:0 0 0 7px rgba(92,232,122,0);}}
.community-banner h2{font-size:24px; font-weight:900; margin:14px 0 8px; color:#fff;}
.community-banner p{font-size:13.5px; opacity:.92; max-width:46ch; line-height:1.9; margin:0 0 18px;}
.community-banner-actions{display:flex; align-items:center; gap:14px; flex-wrap:wrap;}
.community-banner-cta{
  background:#fff; color:#6D28D9; font-weight:900; padding:13px 26px; border-radius:14px; font-size:14px;
  box-shadow:0 8px 20px rgba(0,0,0,.18); display:inline-block;
}
.community-avatar-stack{display:flex; align-items:center;}
.community-avatar-stack span{
  width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.85); color:#6D28D9; font-weight:800; font-size:12.5px;
  display:flex; align-items:center; justify-content:center; border:2px solid #fff; margin-inline-start:-10px;
}
.community-avatar-stack span:first-child{margin-inline-start:0;}
.community-side{flex:0 0 auto; min-width:220px;}
.community-legend-preview{display:flex; flex-wrap:wrap; gap:8px; margin-top:16px;}
.community-legend-preview span{
  display:inline-flex; align-items:center; gap:5px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28);
  padding:5px 11px; border-radius:20px; font-size:11px; font-weight:700;
}
@media (max-width:760px){
  .community-banner{padding:26px 20px; flex-direction:column; align-items:stretch; text-align:center;}
  .community-banner-live{margin:0 auto;}
  .community-banner-actions{justify-content:center;}
  .community-banner p{max-width:none;}
  .community-side{margin:0 auto;}
}

/* ===================== Specialist badges (colored checkmarks) ===================== */
.specialist-badge{
  display:inline-flex; align-items:center; gap:5px; vertical-align:middle;
}
.specialist-badge .sb-tick{
  display:inline-flex; align-items:center; justify-content:center; width:17px; height:17px; border-radius:50%;
  background:var(--sb-color,#0E5C54); color:#fff; font-size:10.5px; font-weight:900; flex-shrink:0;
}
.specialist-badge.pending .sb-tick{opacity:.7;}
.specialist-badge .sb-label{font-size:12px; font-weight:700; color:var(--sb-color,#0E5C54);}

.badge-legend-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; margin-top:14px;}
.badge-legend-item{display:flex; align-items:flex-start; gap:12px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:14px 16px; box-shadow:var(--shadow);}
.badge-legend-item .specialist-badge{margin-top:2px;}
.badge-legend-item b{font-size:13px; color:var(--ink);}
.badge-legend-item p{font-size:11.5px; color:var(--ink-soft); margin:4px 0 0; line-height:1.8;}

.specialist-choice-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:10px;}
.specialist-choice{
  display:flex; align-items:center; gap:8px; border:1.5px solid var(--line); border-radius:12px; padding:10px 12px;
  font-size:12.5px; font-weight:700; cursor:pointer;
}
.specialist-choice:has(input:checked){border-color:var(--primary); background:var(--primary-tint);}
.specialist-choice input{margin:0;}

/* ===================== Community hub (topics, replies) ===================== */
.community-composer{max-width:520px;}
.topic-filter-chips{display:flex; flex-wrap:wrap; gap:8px;}
.topic-card{display:block;}
.topic-card-top{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px;}
.topic-cat-tag{font-size:10.5px; font-weight:800; color:var(--primary-dark); background:var(--primary-tint); padding:4px 10px; border-radius:20px;}
.topic-time{font-size:11px; color:var(--ink-soft); flex-shrink:0;}
.topic-card h3{font-size:15px; font-weight:800; margin:0 0 6px; line-height:1.6;}
.topic-card p{font-size:12.5px; color:var(--ink-soft); margin:0 0 12px; line-height:1.8;}
.topic-card-foot{display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:10px; border-top:1px dashed var(--line); flex-wrap:wrap;}
.topic-author{display:flex; align-items:center; gap:7px; font-size:12px; font-weight:700; color:var(--ink);}
.topic-stats{display:flex; gap:10px; font-size:11.5px; color:var(--ink-soft); font-weight:700;}
.avatar-sm{width:30px; height:30px; border-radius:9px; font-size:11.5px;}

.reply-item{display:flex; gap:10px; padding:14px 0; border-top:1px solid var(--line);}
.reply-item:first-child{border-top:none;}
.reply-body{flex:1;}
.reply-head{display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:12.5px;}
.reply-date{font-size:11px; color:var(--ink-soft); font-weight:400;}
.reply-item p{font-size:13px; color:var(--ink); margin:6px 0 0; line-height:1.9;}
.reply-form textarea{width:100%; border:1px solid var(--line); border-radius:10px; padding:10px 12px; font-family:inherit; font-size:13px; resize:vertical; min-height:80px;}

/* ===================== Electra app promo banner (homepage, top of page) ===================== */
.electra-banner{
  position:relative; display:block; overflow:hidden; margin:26px 0 6px; border-radius:28px; padding:30px 32px 26px;
  background:
    radial-gradient(circle at 15% 20%, rgba(201,162,39,.35) 0%, transparent 42%),
    radial-gradient(circle at 88% 82%, rgba(31,111,100,.35) 0%, transparent 42%),
    linear-gradient(135deg,#31122B 0%,#5B1F4E 65%,#7A2A55 100%);
  box-shadow:0 18px 40px rgba(49,18,43,.30);
}
.electra-banner-badge{
  position:absolute; top:18px; left:18px; z-index:3; background:#C9A227; color:#31122B; font-weight:900; font-size:11.5px;
  padding:6px 13px; border-radius:20px; box-shadow:0 4px 12px rgba(0,0,0,.2);
}
.electra-banner-main{position:relative; z-index:2; display:flex; align-items:flex-start; gap:18px; flex-wrap:wrap;}
.electra-banner-icon{
  flex-shrink:0; width:58px; height:58px; border-radius:50%; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.25);
  display:flex; align-items:center; justify-content:center; font-size:28px;
}
.electra-banner h2{color:#F7ECE7; font-size:21px; font-weight:800; margin:0 0 8px;}
.electra-banner p{color:#E9D7D3; font-size:13px; line-height:1.9; max-width:56ch; margin:0 0 14px; opacity:.94;}
.electra-banner-tags{display:flex; flex-wrap:wrap; gap:8px;}
.electra-banner-tags span{
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.22); color:#F7ECE7; font-size:11px; font-weight:700;
  padding:5px 11px; border-radius:20px;
}
.electra-banner-actions{position:relative; z-index:2; display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:20px;}
.electra-btn{
  display:inline-block; background:linear-gradient(120deg,#C9A227,#e0bc4c); color:#31122B; font-weight:900; font-size:13.5px;
  padding:12px 24px; border-radius:13px; box-shadow:0 8px 20px rgba(201,162,39,.35);
}
.electra-note{color:#D9C6C2; font-size:11.5px;}
@media (max-width:760px){
  .electra-banner{padding:56px 20px 22px; text-align:center;}
  .electra-banner-main{flex-direction:column; align-items:center; text-align:center;}
  .electra-banner p{max-width:none;}
  .electra-banner-tags{justify-content:center;}
  .electra-banner-actions{flex-direction:column; gap:10px;}
}

/* ===================== Three-app row (Electra · Nova · Eros) ===================== */
.apps-row-section{margin:26px 0 6px;}
.apps-row{
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px;
}
.app-card{
  position:relative; display:flex; flex-direction:column; overflow:hidden;
  border-radius:24px; padding:48px 22px 24px 22px; text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease;
}
.app-card:hover{transform:translateY(-4px); box-shadow:0 24px 48px rgba(0,0,0,.22);}
.app-card-badge{
  position:absolute; top:16px; left:16px; z-index:3;
  font-weight:900; font-size:11px; padding:5px 12px; border-radius:20px;
  box-shadow:0 4px 12px rgba(0,0,0,.18);
}
.app-card-icon{
  width:54px; height:54px; border-radius:50%; border:1px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center;
  font-size:26px; margin-bottom:14px; flex-shrink:0;
}
.app-card h3{font-size:20px; font-weight:900; margin:0 0 8px; color:#F7ECE7;}
.app-card p{font-size:12.5px; line-height:1.85; margin:0 0 14px; opacity:.9; flex:1;}
.app-card-tags{display:flex; flex-wrap:wrap; gap:7px; margin-bottom:18px;}
.app-card-tags span{
  font-size:10.5px; font-weight:700; padding:4px 10px; border-radius:18px;
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.2); color:#F7ECE7;
}
.app-card-btn{
  display:inline-block; font-weight:900; font-size:13px;
  padding:11px 20px; border-radius:12px; text-align:center; margin-top:auto;
}

/* Electra – purple/plum */
.app-card--electra{
  background:
    radial-gradient(circle at 15% 20%, rgba(201,162,39,.35) 0%, transparent 42%),
    radial-gradient(circle at 88% 82%, rgba(31,111,100,.35) 0%, transparent 42%),
    linear-gradient(135deg,#31122B 0%,#5B1F4E 65%,#7A2A55 100%);
  box-shadow:0 18px 40px rgba(49,18,43,.30);
}
.app-card--electra p{color:#E9D7D3;}
.app-card--electra .app-card-badge{background:#C9A227; color:#31122B;}
.app-card--electra .app-card-btn{background:linear-gradient(120deg,#C9A227,#e0bc4c); color:#31122B; box-shadow:0 8px 20px rgba(201,162,39,.35);}

/* Nova – warm rose/amber */
.app-card--nova{
  background:
    radial-gradient(circle at 20% 15%, rgba(181,41,75,.30) 0%, transparent 45%),
    radial-gradient(circle at 85% 85%, rgba(198,127,66,.30) 0%, transparent 45%),
    linear-gradient(135deg,#5C1A2B 0%,#7C2740 60%,#A0522D 100%);
  box-shadow:0 18px 40px rgba(92,26,43,.30);
}
.app-card--nova p{color:#F0D9CE;}
.app-card--nova .app-card-badge{background:#C67F42; color:#fff;}
.app-card--nova .app-card-btn{background:linear-gradient(120deg,#C67F42,#dea060); color:#fff; box-shadow:0 8px 20px rgba(198,127,66,.35);}

/* Eros – dark slate/berry */
.app-card--eros{
  background:
    radial-gradient(circle at 20% 20%, rgba(184,101,79,.25) 0%, transparent 45%),
    radial-gradient(circle at 80% 80%, rgba(184,101,79,.15) 0%, transparent 45%),
    linear-gradient(135deg,#0e0f12 0%,#1b1c20 60%,#212226 100%);
  box-shadow:0 18px 40px rgba(14,15,18,.50);
}
.app-card--eros p{color:#b5b6bc;}
.app-card--eros h3{color:#eeece8;}
.app-card--eros .app-card-badge{background:#b8654f; color:#fff;}
.app-card--eros .app-card-tags span{background:rgba(184,101,79,.15); border-color:rgba(184,101,79,.3); color:#d4bdb7;}
.app-card--eros .app-card-btn{background:linear-gradient(120deg,#b8654f,#cc7a62); color:#fff; box-shadow:0 8px 20px rgba(184,101,79,.35);}

@media (max-width:900px){
  .apps-row{grid-template-columns:1fr 1fr;}
  .app-card--eros{grid-column:1 / -1;}
}
@media (max-width:620px){
  .apps-row{grid-template-columns:1fr;}
  .app-card--eros{grid-column:auto;}
}

/* ===================== Home Doctor Cards (hdc) ===================== */
/* ===================== Homepage quick-tool tiles ===================== */
/* Apple-style "app icon" tiles: each tool gets its own two-tone gradient
   badge (--qt-a/--qt-b set inline per item in front-page.php) instead of a
   flat emoji sitting on plain white, plus a soft lift + icon "pop" on
   hover so the row feels tactile rather than static. */
.quick-tools-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
.quick-tool-card{
	position:relative; display:flex; flex-direction:column; align-items:center; gap:14px;
	text-align:center; background:var(--card); border-radius:24px; padding:28px 16px 24px;
	box-shadow:0 2px 10px rgba(23,42,39,.06);
	transition:transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s cubic-bezier(.16,1,.3,1);
}
.quick-tool-card:hover{transform:translateY(-6px); box-shadow:0 22px 44px -12px rgba(23,42,39,.22);}
.quick-tool-icon{
	width:64px; height:64px; border-radius:20px; display:flex; align-items:center; justify-content:center;
	font-size:30px; line-height:1; background:linear-gradient(135deg, var(--qt-a), var(--qt-b));
	box-shadow:inset 0 1.5px 2px rgba(255,255,255,.55), inset 0 -6px 10px rgba(0,0,0,.12), 0 12px 20px -8px var(--qt-b);
	transition:transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s;
}
.quick-tool-card:hover .quick-tool-icon{transform:scale(1.1) rotate(-4deg);}
.quick-tool-label{font-size:14px; font-weight:800; color:var(--ink);}
@media(max-width:720px){.quick-tools-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:420px){.quick-tool-icon{width:54px; height:54px; font-size:24px; border-radius:16px;}}

/* ===================== Homepage specialty browser ===================== */
/* Same tile language as the quick tools above: each specialty carries its
   own gradient (--sp-a/--sp-b, set inline in front-page.php from
   $spec_gradients) so twelve emoji don't collapse into one flat wash of
   white — every tile reads as a distinct, colorful destination. */
.specialty-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:16px;}
.specialty-pill{
	display:flex; flex-direction:column; align-items:center; text-align:center; gap:10px;
	background:var(--card); border-radius:22px; padding:26px 12px 20px;
	box-shadow:0 2px 10px rgba(23,42,39,.06);
	transition:transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s cubic-bezier(.16,1,.3,1);
}
.specialty-pill:hover{transform:translateY(-6px) scale(1.02); box-shadow:0 22px 44px -12px rgba(23,42,39,.22);}
.specialty-pill-icon{
	font-size:27px; width:56px; height:56px; display:flex; align-items:center; justify-content:center;
	border-radius:18px; line-height:1; background:linear-gradient(135deg, var(--sp-a,#2DD4BF), var(--sp-b,#0D9488));
	box-shadow:inset 0 1.5px 2px rgba(255,255,255,.55), inset 0 -6px 10px rgba(0,0,0,.12), 0 12px 20px -8px var(--sp-b,#0D9488);
	transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.specialty-pill:hover .specialty-pill-icon{transform:scale(1.1) rotate(-4deg);}
.specialty-pill-name{font-size:13px; font-weight:800; color:var(--ink);}
.specialty-pill-count{font-size:11px; color:var(--ink-soft); font-weight:600;}
@media(max-width:960px){.specialty-grid{grid-template-columns:repeat(4,1fr);}}
@media(max-width:600px){.specialty-grid{grid-template-columns:repeat(3,1fr);} .specialty-pill{padding:18px 8px;} .specialty-pill-icon{width:46px; height:46px; font-size:21px; border-radius:14px;}}

.hdc-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.hdc-card{background:var(--card); border-radius:20px; overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--line); transition:transform .2s ease, box-shadow .2s ease; display:flex; flex-direction:column; cursor:pointer;}
.hdc-card:hover{transform:translateY(-6px); box-shadow:0 20px 44px rgba(14,92,84,.16);}
.hdc-photo-wrap{position:relative; height:200px; background:color-mix(in srgb, var(--dc,#0E5C54) 12%, #f0f4f3);}
.hdc-photo{width:100%; height:100%; object-fit:cover; object-position:top center;}
.hdc-initials{width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:38px; font-weight:900; color:var(--dc,#0E5C54); opacity:.5;}
.hdc-rate-badge{position:absolute; bottom:10px; right:12px; background:rgba(0,0,0,.55); backdrop-filter:blur(6px); color:#FFD166; font-weight:900; font-size:12px; padding:4px 10px; border-radius:10px;}
.hdc-fav{position:absolute; top:10px; left:10px; background:rgba(255,255,255,.85); border:none; border-radius:50%; width:34px; height:34px; font-size:15px; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,.15);}
.hdc-body{padding:16px 16px 18px; flex:1; display:flex; flex-direction:column; gap:6px;}
.hdc-spec-tag{display:inline-block; font-size:11px; font-weight:800; padding:4px 12px; border-radius:20px; background:color-mix(in srgb,var(--dc,#0E5C54) 12%, white); color:var(--dc,#0E5C54); border:1px solid color-mix(in srgb,var(--dc,#0E5C54) 30%, transparent); margin-bottom:2px; align-self:flex-start;}
.hdc-name{font-size:15px; font-weight:900; margin:0; color:var(--ink);}
.hdc-name a{position:relative; z-index:2;}
.hdc-name a{color:inherit;}
.hdc-city{font-size:12px; color:var(--ink-soft);}
.hdc-visits-row{font-size:12px; color:var(--ink-soft);}
.hdc-visits-num{font-weight:800; color:var(--primary-dark);}
.hdc-book-btn{display:block; margin-top:auto; padding-top:6px; text-align:center; background:var(--primary); color:#fff; font-weight:800; font-size:13px; padding:10px 14px; border-radius:12px; transition:background .15s;}
.hdc-book-btn:hover{background:var(--primary-dark);}
@media(max-width:900px){.hdc-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:540px){.hdc-grid{grid-template-columns:1fr;}}

/* "سلامت من" — small clickable chips, all tools reachable straight from the homepage */
.home-health-pills{display:flex; flex-wrap:wrap; gap:8px;}
.home-health-pill{display:flex; align-items:center; gap:6px; background:var(--card); border:1px solid var(--line); border-radius:999px; padding:7px 14px 7px 8px; font-size:12px; font-weight:700; color:var(--ink); transition:background .15s, border-color .15s, transform .15s;}
.home-health-pill:hover{background:var(--primary-tint); border-color:var(--primary); transform:translateY(-2px);}
.home-health-pill-icon{font-size:15px;}
@media(max-width:600px){.home-health-pill{font-size:11.5px; padding:6px 12px 6px 7px;}}

/* ===================== Home Magazine Layout ===================== */
.home-mag-layout{display:grid; grid-template-columns:1fr 340px; gap:22px; align-items:start;}
.mag-featured{border-radius:20px; overflow:hidden; box-shadow:var(--shadow); height:420px; position:relative;}
.mag-feat-inner{display:block; width:100%; height:100%; position:relative;}
.mag-feat-img{width:100%; height:100%; object-fit:cover; display:block;}
.mag-feat-overlay{position:absolute; inset:0; background:linear-gradient(to top, rgba(10,33,30,.88) 0%, rgba(10,33,30,.3) 55%, transparent 100%); padding:28px 24px 24px; display:flex; flex-direction:column; justify-content:flex-end;}
.mag-feat-cat{display:inline-block; font-size:11px; font-weight:800; padding:4px 12px; border-radius:20px; background:var(--accent); color:#fff; margin-bottom:10px; align-self:flex-start;}
.mag-feat-title{font-size:19px; font-weight:900; color:#fff; margin:0 0 8px; line-height:1.5;}
.mag-feat-excerpt{font-size:12.5px; color:rgba(255,255,255,.82); margin:0 0 12px; line-height:1.7;}
.mag-feat-read{font-size:12px; font-weight:800; color:rgba(255,255,255,.7);}
.mag-side-list{display:flex; flex-direction:column; gap:14px;}
.mag-side-card{display:flex; gap:14px; align-items:flex-start; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:14px; box-shadow:var(--shadow); transition:transform .18s, box-shadow .18s; text-decoration:none; color:inherit;}
.mag-side-card:hover{transform:translateY(-3px); box-shadow:0 12px 28px rgba(14,92,84,.14);}
.mag-side-thumb{width:80px; height:70px; border-radius:12px; overflow:hidden; flex-shrink:0;}
.mag-side-img{width:100%; height:100%; object-fit:cover;}
.mag-side-body{flex:1; display:flex; flex-direction:column; gap:5px;}
.mag-side-cat{display:inline-block; font-size:10px; font-weight:800; padding:3px 9px; border-radius:12px; background:var(--accent); color:#fff; align-self:flex-start;}
.mag-side-body h4{font-size:13px; font-weight:800; margin:0; line-height:1.55; color:var(--ink);}
.mag-side-body p{font-size:11.5px; color:var(--ink-soft); margin:0; line-height:1.6;}
.mag-side-read{font-size:11px; color:var(--ink-soft);}
@media(max-width:820px){.home-mag-layout{grid-template-columns:1fr;} .mag-featured{height:300px;}}

/* ===================== Doctor Profile Page (dp) ===================== */
.dp-back{margin-bottom:18px; display:inline-flex;}
.dp-hero{background:var(--card); border:1px solid var(--line); border-radius:24px; overflow:hidden; box-shadow:var(--shadow); margin-bottom:28px;}
.dp-cover-strip{height:110px; background:linear-gradient(135deg, var(--dc,#0E5C54), color-mix(in srgb,var(--dc,#0E5C54) 60%,#000)); position:relative; overflow:hidden;}
.dp-cover-pattern{position:absolute; inset:0; background-image:radial-gradient(circle, rgba(255,255,255,.1) 1px, transparent 1px); background-size:22px 22px;}
.dp-info-row{display:flex; gap:22px; align-items:flex-start; padding:0 28px 28px; flex-wrap:wrap;}
.dp-avatar-wrap{width:100px; height:100px; border-radius:20px; overflow:hidden; border:4px solid var(--card); box-shadow:0 8px 24px rgba(0,0,0,.18); margin-top:-50px; flex-shrink:0; background:var(--card);}
.dp-avatar-img{width:100%; height:100%; object-fit:cover; object-position:top center; display:block;}
.dp-avatar-initials{width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:32px; font-weight:900; color:#fff;}
.dp-info-main{flex:1; min-width:220px; padding-top:12px;}
.dp-spec-badge{display:inline-block; font-size:12px; font-weight:800; padding:5px 14px; border-radius:20px; border:1px solid; margin-bottom:8px;}
.dp-name{font-size:24px; font-weight:900; margin:0 0 10px;}
.dp-meta-row{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:10px;}
.dp-meta-pill{font-size:12px; background:var(--bg); border:1px solid var(--line); padding:5px 12px; border-radius:20px; color:var(--ink-soft); font-weight:600;}
.dp-rating-pill{background:#FDF3E8; color:var(--accent-dark); border-color:var(--accent); font-weight:800;}
.dp-badges-row{display:flex; flex-wrap:wrap; gap:8px;}
.dp-actions{display:flex; flex-direction:column; gap:10px; padding-top:12px; min-width:160px;}
.dp-fav-btn{background:var(--bg); border:1px solid var(--line); border-radius:12px; padding:10px 14px; font-size:13px; cursor:pointer; font-weight:700; color:var(--ink);}
.dp-book-hero-btn{text-align:center;}
.dp-layout{display:grid; grid-template-columns:1fr 320px; gap:22px; align-items:start;}
.dp-main{display:flex; flex-direction:column; gap:20px;}
.dp-sidebar{display:flex; flex-direction:column; gap:18px; position:sticky; top:90px;}
.dp-card{background:var(--card); border:1px solid var(--line); border-radius:20px; padding:24px; box-shadow:var(--shadow);}
.dp-card-title{font-size:16px; font-weight:900; color:var(--primary-dark); margin:0 0 18px; padding-bottom:14px; border-bottom:1px dashed var(--line);}
.dp-bio{font-size:14px; line-height:1.9;}
.dp-gallery{display:grid; grid-template-columns:repeat(2,1fr); gap:14px;}
.dp-gallery-item{position:relative; border-radius:14px; overflow:hidden; aspect-ratio:4/3; display:block; cursor:zoom-in;}
.dp-gallery-item img{width:100%; height:100%; object-fit:cover; transition:transform .25s; display:block;}
.dp-gallery-item::after{content:"🔍"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:20px; background:rgba(14,92,84,.0); opacity:0; transition:opacity .2s, background .2s;}
.dp-gallery-item:hover img{transform:scale(1.08);}
.dp-gallery-item:hover::after{opacity:1; background:rgba(14,92,84,.32);}

/* Lightbox */
.dp-lightbox{position:fixed; inset:0; z-index:9999; background:rgba(10,14,13,.9); display:none; align-items:center; justify-content:center; padding:32px;}
.dp-lightbox.open{display:flex;}
.dp-lightbox-img{max-width:min(920px,92vw); max-height:88vh; border-radius:16px; box-shadow:0 30px 70px rgba(0,0,0,.5); animation:dpLightboxIn .18s ease;}
.dp-lightbox-close{position:absolute; top:20px; inset-inline-end:20px; width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.12); color:#fff; border:1px solid rgba(255,255,255,.25); font-size:18px; cursor:pointer; line-height:1;}
.dp-lightbox-close:hover{background:rgba(255,255,255,.22);}
@keyframes dpLightboxIn{from{opacity:0; transform:scale(.96);} to{opacity:1; transform:scale(1);}}
.dp-booking-card .visit-type-toggle{margin-bottom:14px;}
.dp-slots{display:flex; flex-direction:column; gap:10px; margin-top:4px;}
.dp-slot{display:flex; justify-content:space-between; align-items:center; padding:12px 14px; border:1px solid var(--line); border-radius:12px; font-size:13px; background:var(--bg);}
.dp-slot--booked{opacity:.55; background:#f8f8f8;}
.dp-stats-card .dp-card-title{margin-bottom:14px; padding-bottom:12px;}
.dp-stats-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.dp-stat{display:flex; flex-direction:column; gap:4px; background:var(--bg); border:1px solid var(--line); border-radius:14px; padding:12px 14px;}
.dp-stat--full{grid-column:1/-1;}
.dp-stat-val{font-size:20px; font-weight:900;}
.dp-stat-val-sm{font-size:14px; font-weight:800; color:var(--ink);}
.dp-stat-label{font-size:11px; color:var(--ink-soft);}

/* ===================== Useful links box (site + map apps) ===================== */
/* Used on doctor pages (dp-sidebar) and facility pages (which also cover
   gyms and beauty/nutrition centers, sharing the same CPT/template). */
.db-links-box{background:var(--card); border:1px solid var(--line); border-radius:20px; padding:20px 22px; box-shadow:var(--shadow); margin-top:16px;}
.db-links-title{font-size:15px; font-weight:900; color:var(--primary-dark); margin:0 0 14px;}
.db-links-grid{display:flex; flex-wrap:wrap; gap:10px;}
.db-link-pill{display:flex; align-items:center; gap:7px; background:var(--bg); border:1px solid var(--line); border-radius:14px; padding:9px 14px; font-size:12.5px; font-weight:700; color:var(--ink); transition:transform .15s, box-shadow .15s, border-color .15s;}
.db-link-pill:hover{transform:translateY(-2px); box-shadow:0 10px 22px rgba(0,0,0,.08); border-color:var(--primary); color:var(--primary-dark);}
.db-link-ic{font-size:15px;}

@media(max-width:860px){.dp-layout{grid-template-columns:1fr;} .dp-sidebar{position:static;} .dp-gallery{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.dp-info-row{flex-direction:column;} .dp-actions{flex-direction:row; min-width:auto;} .dp-gallery{grid-template-columns:1fr;}}

/* ===================== App Pages (aph) ===================== */
.app-page{padding-bottom:0;}
.aph-hero{position:relative; overflow:hidden; padding:0;}
.aph-hero-bg{position:absolute; inset:0; background-image:radial-gradient(circle at 20% 50%, rgba(255,255,255,.06) 0%, transparent 60%), radial-gradient(circle at 80% 20%, rgba(255,255,255,.06) 0%, transparent 60%);}
.aph-hero-inner{position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:30px; padding-top:60px; padding-bottom:60px; flex-wrap:wrap;}
.aph-hero-text{flex:1; min-width:280px;}
.aph-eyebrow{font-size:13px; font-weight:800; padding:6px 16px; border-radius:20px; background:rgba(255,255,255,.15); color:rgba(255,255,255,.9); display:inline-block; margin-bottom:18px;}
.aph-hero h1{font-size:38px; font-weight:900; color:#fff; margin:0 0 6px; line-height:1.2;}
.aph-hero-subtitle{display:block; font-size:20px; font-weight:600; opacity:.8; margin-top:4px;}
.aph-hero-desc{font-size:15px; color:rgba(255,255,255,.85); margin:16px 0 22px; line-height:1.9; max-width:50ch;}
.aph-hero-tags{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:28px;}
.aph-hero-tags span{font-size:12px; font-weight:700; padding:6px 14px; border-radius:20px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.25); color:#fff;}
.aph-hero-btns{display:flex; gap:12px; flex-wrap:wrap;}
.aph-btn-main{display:inline-block; font-weight:900; font-size:14px; padding:13px 28px; border-radius:14px; text-decoration:none;}
.aph-btn-ghost{display:inline-block; font-weight:700; font-size:14px; padding:13px 22px; border-radius:14px; border:2px solid rgba(255,255,255,.4); color:rgba(255,255,255,.9); text-decoration:none; transition:border-color .15s;}
.aph-btn-ghost:hover{border-color:rgba(255,255,255,.8);}
.aph-hero-icon{font-size:90px; flex-shrink:0; filter:drop-shadow(0 12px 32px rgba(0,0,0,.3));}

/* Electra */
.aph-hero--electra{background:linear-gradient(135deg,#31122B 0%,#5B1F4E 60%,#7A2A55 100%);}
.aph-icon--electra{animation:float 4s ease-in-out infinite;}
.aph-cta--electra{background:linear-gradient(135deg,#31122B,#5B1F4E); padding:56px 0;}
.aph-cta--electra .aph-btn-main{background:linear-gradient(120deg,#C9A227,#e0bc4c); color:#31122B;}
.app-page--electra .aph-btn-main{background:linear-gradient(120deg,#C9A227,#e0bc4c); color:#31122B;}

/* Nova */
.aph-hero--nova{background:linear-gradient(135deg,#5C1A2B 0%,#7C2740 60%,#A0522D 100%);}
.aph-icon--nova{animation:float 4s ease-in-out infinite 0.5s;}
.aph-cta--nova{background:linear-gradient(135deg,#5C1A2B,#7C2740); padding:56px 0;}
.aph-cta--nova .aph-btn-main{background:linear-gradient(120deg,#C67F42,#dea060); color:#fff;}
.app-page--nova .aph-btn-main{background:linear-gradient(120deg,#C67F42,#dea060); color:#fff;}

/* Eros */
.aph-hero--eros{background:linear-gradient(135deg,#0e0f12 0%,#1b1c20 60%,#2a1a15 100%);}
.aph-icon--eros{animation:float 4s ease-in-out infinite 1s;}
.aph-cta--eros{background:linear-gradient(135deg,#0e0f12,#2a1a15); padding:56px 0;}
.aph-cta--eros .aph-btn-main{background:linear-gradient(120deg,#b8654f,#cc7a62); color:#fff;}
.app-page--eros .aph-btn-main{background:linear-gradient(120deg,#b8654f,#cc7a62); color:#fff;}

/* Features grid */
.aph-features-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.aph-feat-card{background:var(--card); border:1px solid var(--line); border-radius:20px; padding:24px; box-shadow:var(--shadow); transition:transform .2s, box-shadow .2s;}
.aph-feat-card:hover{transform:translateY(-4px); box-shadow:0 16px 36px rgba(14,92,84,.14);}
.aph-feat-icon{font-size:34px; margin-bottom:14px;}
.aph-feat-card h3{font-size:15px; font-weight:900; color:var(--primary-dark); margin:0 0 8px;}
.aph-feat-card p{font-size:13px; color:var(--ink-soft); margin:0; line-height:1.8;}

/* CTA */
.aph-cta-inner{text-align:center; max-width:560px; margin:0 auto;}
.aph-cta h2{font-size:26px; font-weight:900; color:#fff; margin:0 0 10px;}
.aph-cta p{color:rgba(255,255,255,.8); font-size:15px; margin:0 0 24px;}

@keyframes float{0%,100%{transform:translateY(0);} 50%{transform:translateY(-12px);}}
@media(max-width:860px){.aph-features-grid{grid-template-columns:repeat(2,1fr);} .aph-hero h1{font-size:28px;} .aph-hero-icon{font-size:60px;}}
@media(max-width:540px){.aph-features-grid{grid-template-columns:1fr;} .aph-hero-inner{flex-direction:column; text-align:center;} .aph-hero-tags{justify-content:center;} .aph-hero-btns{justify-content:center;} .aph-hero-icon{display:none;}}

/* ===================== Account dashboard (modern) ===================== */
.account-guest{max-width:420px; margin:0 auto; text-align:center; background:var(--card); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); padding:40px 26px;}
.account-guest .ic{font-size:38px; margin-bottom:12px;}
.account-guest p{color:var(--ink-soft); font-size:13.5px; margin:0;}
.account-guest-actions{display:flex; gap:10px; justify-content:center; margin-top:22px;}

.account-shell{display:grid; grid-template-columns:272px 1fr; gap:24px; align-items:start;}

.account-sidebar{position:sticky; top:80px; display:flex; flex-direction:column; gap:14px;}

.account-profile-card{
  position:relative; overflow:hidden;
  background:linear-gradient(145deg, var(--primary) 0%, var(--primary-dark) 100%);
  border-radius:20px; padding:24px 20px; color:#fff; box-shadow:0 14px 32px rgba(14,92,84,.22);
}
.account-profile-card.has-cover{ background-size:cover; background-position:center; }
.account-profile-card::after{
  content:""; position:absolute; width:150px; height:150px; border-radius:50%;
  background:rgba(255,255,255,.08); top:-60px; left:-40px; pointer-events:none;
}
.account-avatar{
  position:relative; z-index:1; width:56px; height:56px; border-radius:16px;
  background:rgba(255,255,255,.16); border:1.5px solid rgba(255,255,255,.35);
  display:flex; align-items:center; justify-content:center;
  font-size:22px; font-weight:900; margin-bottom:14px; flex-shrink:0;
}
.account-avatar.avatar-photo img{ border-radius:14px; }

/* Larger avatar preview used in the "اطلاعات کاربری" (userinfo) profile-edit form */
.avatar-lg{ width:84px; height:84px; border-radius:20px; font-size:28px; }
.avatar-lg.avatar-photo img{ border-radius:20px; }

/* Header/cover image preview on the profile-edit form */
.profile-cover-preview{
  width:100%; height:120px; border-radius:14px; margin-bottom:16px;
  background-size:cover; background-position:center; background-color:var(--primary-tint);
  border:1px solid var(--line);
}
.account-profile-name{position:relative; z-index:1; font-size:16px; font-weight:800;}
.account-profile-email{position:relative; z-index:1; font-size:11.5px; opacity:.78; margin-top:4px; word-break:break-all;}
.account-profile-tag{
  position:relative; z-index:1; display:inline-flex; align-items:center; gap:5px;
  margin-top:14px; background:rgba(255,255,255,.16); padding:6px 13px;
  border-radius:20px; font-size:11px; font-weight:800;
}

.account-nav{display:flex; flex-direction:column; gap:3px; background:var(--card); border:1px solid var(--line); border-radius:18px; padding:8px; box-shadow:var(--shadow);}
.account-nav-item{display:flex; align-items:center; gap:11px; padding:10px 11px; border-radius:12px; font-size:13.5px; font-weight:700; color:var(--ink-soft); transition:background .15s, color .15s;}
.account-nav-item .ic{width:32px; height:32px; border-radius:9px; background:var(--primary-tint); display:flex; align-items:center; justify-content:center; font-size:15px; flex-shrink:0; transition:background .15s, color .15s;}
.account-nav-item:hover{background:var(--bg); color:var(--ink);}
.account-nav-item.active{background:var(--primary-tint); color:var(--primary-dark);}
.account-nav-item.active .ic{background:var(--primary); color:#fff;}

.account-logout{display:flex; align-items:center; justify-content:center; gap:8px; width:100%; text-align:center;}

.account-content{min-width:0;}

.account-welcome h2{font-size:20px; font-weight:900; color:var(--primary-dark); margin:0;}
.account-welcome p{font-size:13px; color:var(--ink-soft); margin:6px 0 22px;}

.account-tiles{display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:14px;}
.account-tile{
  background:var(--card); border:1px solid var(--line); border-radius:18px; padding:20px 16px;
  box-shadow:var(--shadow); display:block; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.account-tile:hover{transform:translateY(-4px); box-shadow:0 16px 34px rgba(14,92,84,.16); border-color:var(--primary);}
.account-tile-icon{width:46px; height:46px; border-radius:13px; background:var(--primary-tint); color:var(--primary-dark); display:flex; align-items:center; justify-content:center; font-size:21px; margin-bottom:14px;}
.account-tile-label{display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:13px; font-weight:800; color:var(--ink);}
.account-tile-label .arrow{color:var(--primary); opacity:0; transform:translateX(4px); transition:opacity .18s, transform .18s; font-weight:900;}
.account-tile:hover .arrow{opacity:1; transform:translateX(0);}

.account-tile:nth-child(5n+2) .account-tile-icon{background:#FDF0DD; color:var(--accent-dark);}
.account-tile:nth-child(5n+3) .account-tile-icon{background:#EAF3FF; color:#2A5C99;}
.account-tile:nth-child(5n+4) .account-tile-icon{background:#FBEAE7; color:var(--danger);}
.account-tile:nth-child(5n+5) .account-tile-icon{background:#EEF7ED; color:#3E8E52;}

.account-back-link{display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; color:var(--ink-soft); background:var(--card); border:1px solid var(--line); padding:8px 14px; border-radius:20px; margin-bottom:16px; transition:background .15s, color .15s;}
.account-back-link:hover{background:var(--primary-tint); color:var(--primary-dark);}

.account-view-card{animation:acctFadeIn .25s ease;}
@keyframes acctFadeIn{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);}}

/* ===================== Health Dashboard (account tab) ===================== */
.health-stat-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px; margin-bottom:20px;}
.health-stat-card{background:var(--card); border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); padding:16px;}
.health-stat-icon{width:38px; height:38px; border-radius:10px; background:var(--primary-tint); display:flex; align-items:center; justify-content:center; font-size:17px; margin-bottom:10px;}
.health-stat-label{font-size:12px; font-weight:700; color:var(--ink-soft);}
.health-stat-value{font-size:20px; font-weight:900; color:var(--primary-dark); margin-top:4px;}
.health-stat-value .unit{font-size:11px; font-weight:700; color:var(--ink-soft);}
.health-stat-empty{color:var(--ink-soft); font-weight:700;}
.health-stat-delta{font-size:11.5px; font-weight:800; margin-top:4px;}
.health-stat-delta.up{color:var(--danger);}
.health-stat-delta.down{color:var(--success);}

.health-chart-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; margin-bottom:20px;}
.health-chart-card{transition:transform .18s, box-shadow .18s;}
.health-chart-card:hover{transform:translateY(-3px); box-shadow:0 16px 34px rgba(14,92,84,.14);}
.health-chart-card h4{font-size:13.5px; font-weight:800; margin:0 0 10px;}
.trend-chart-wrap{width:100%;}
.chart-canvas-wrap{position:relative; width:100%; height:220px;}
.doctorbio-trend-chart{width:100% !important; height:100% !important;}
.chart-noscript-fallback{font-size:12px; color:var(--ink-soft); line-height:1.9;}
.chart-legend{display:flex; gap:14px; margin-bottom:8px;}
.chart-legend span{display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; color:var(--ink-soft);}
.chart-legend i{width:10px; height:10px; border-radius:50%; display:inline-block;}

.vital-form-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px 14px;}

.rx-timeline{position:relative; padding-right:4px;}
.rx-timeline-item{position:relative; display:flex; gap:14px; padding-bottom:20px; padding-right:20px; border-right:2px solid var(--line);}
.rx-timeline-item:last-child{padding-bottom:0;}
.rx-timeline-dot{position:absolute; right:-7px; top:2px; width:12px; height:12px; border-radius:50%; background:var(--primary); border:2px solid var(--card); box-shadow:0 0 0 2px var(--primary-tint);}
.rx-timeline-body{background:var(--card); border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow); padding:12px 14px; flex:1;}
.rx-timeline-date{font-size:11px; font-weight:700; color:var(--ink-soft);}
.rx-timeline-title{font-size:13.5px; font-weight:800; margin-top:4px;}

/* ===================== Nutrition tools (page-nutrition.php) ===================== */
.nutrition-tools-section{margin-bottom:28px;}
.nut-tool-tab{user-select:none;}

@media (max-width:900px){
  .account-shell{grid-template-columns:1fr;}
  .account-sidebar{position:static; flex-direction:column;}
  .account-nav{flex-direction:row; overflow-x:auto; -webkit-overflow-scrolling:touch; gap:6px; scrollbar-width:none;}
  .account-nav::-webkit-scrollbar{display:none;}
  .account-nav-item{flex-direction:column; gap:5px; flex-shrink:0; min-width:76px; text-align:center; padding:10px 8px; font-size:10.5px;}
  .account-nav-item .ic{width:38px; height:38px; font-size:17px;}
}
@media (max-width:600px){
  .account-tiles{grid-template-columns:repeat(2,1fr);}
  .account-tile{padding:16px 12px;}
  .account-tile-icon{width:40px; height:40px; font-size:18px; margin-bottom:10px;}
  .account-tile-label{font-size:12px;}
  .account-profile-card{padding:20px 18px;}
}

/* ===================== Hospital Browser ===================== */
.hosp-browser{
	margin-top:40px; border-radius:24px; border:2px solid var(--line);
	background:var(--card); overflow:hidden; box-shadow:var(--shadow);
}
.hosp-browser-header{
	display:flex; align-items:center; gap:18px; padding:28px 28px 24px;
	background:linear-gradient(135deg,#0E5C54 0%,#145f4a 100%);
}
.hosp-browser-icon{font-size:40px;}
.hosp-browser-header h2{color:#fff; font-size:20px; font-weight:900; margin:0 0 4px;}
.hosp-browser-header p{color:rgba(255,255,255,.8); font-size:13px; margin:0;}

.hosp-step{padding:24px 28px;}
.hosp-step + .hosp-step{border-top:1px solid var(--line);}
.hosp-step--hidden{display:none;}

.hosp-step-label{
	display:flex; align-items:center; gap:10px; margin-bottom:18px;
	font-size:15px; font-weight:800; color:var(--primary-dark);
}
.hosp-step-num{
	display:inline-flex; align-items:center; justify-content:center;
	width:28px; height:28px; border-radius:50%; background:var(--primary);
	color:#fff; font-size:13px; font-weight:900; flex-shrink:0;
}
.hosp-back-btn{
	margin-right:auto; background:var(--bg); border:1px solid var(--line);
	border-radius:20px; padding:5px 14px; font-size:12px; font-weight:700;
	color:var(--primary-dark); cursor:pointer; transition:background .15s;
}
.hosp-back-btn:hover{background:var(--line);}

/* Province grid */
.hosp-province-grid{
	display:grid; grid-template-columns:repeat(auto-fill, minmax(130px,1fr)); gap:10px;
}
.hosp-prov-btn{
	background:var(--bg); border:1.5px solid var(--line); border-radius:14px;
	padding:12px 10px; font-size:13px; font-weight:700; color:var(--ink);
	cursor:pointer; text-align:center; transition:all .18s; font-family:inherit;
}
.hosp-prov-btn:hover,.hosp-prov-btn.active{
	background:var(--primary); border-color:var(--primary); color:#fff;
	box-shadow:0 6px 18px rgba(14,92,84,.25);
}

/* City grid */
.hosp-city-grid{
	display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:10px;
}
.hosp-city-btn{
	background:var(--bg); border:1.5px solid var(--line); border-radius:14px;
	padding:14px 12px; font-size:13px; font-weight:700; color:var(--ink);
	cursor:pointer; text-align:center; display:flex; flex-direction:column; gap:4px;
	transition:all .18s; font-family:inherit;
}
.hosp-city-btn:hover{background:var(--primary); border-color:var(--primary); color:#fff;}
.hosp-city-count{font-size:11px; font-weight:600; opacity:.7;}

/* Search */
.hosp-search-wrap{margin-bottom:18px;}
.hosp-search-input{
	width:100%; padding:11px 16px; border:1.5px solid var(--line); border-radius:12px;
	font-size:14px; font-family:inherit; background:var(--bg); color:var(--ink);
	box-sizing:border-box; transition:border-color .15s;
}
.hosp-search-input:focus{outline:none; border-color:var(--primary);}

/* Hospital list */
.hosp-list{
	display:grid; grid-template-columns:repeat(auto-fill, minmax(300px,1fr)); gap:14px;
}
.hosp-card{
	background:var(--bg); border:1px solid var(--line); border-radius:16px;
	padding:18px; transition:box-shadow .18s, transform .18s;
}
.hosp-card:hover{box-shadow:0 10px 28px rgba(14,92,84,.14); transform:translateY(-3px);}
.hosp-card-top{display:flex; gap:12px; align-items:flex-start; margin-bottom:10px;}
.hosp-card-icon{font-size:28px; flex-shrink:0; margin-top:2px;}
.hosp-card-info h3{font-size:14px; font-weight:900; color:var(--ink); margin:0 0 4px; line-height:1.4;}
.hosp-card-type{font-size:11.5px; color:var(--primary-dark); font-weight:700; background:color-mix(in srgb,var(--primary) 10%,white); padding:3px 10px; border-radius:10px; display:inline-block;}
.hosp-card-meta{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px;}
.hosp-badge{font-size:11px; font-weight:700; padding:4px 10px; border-radius:10px; background:var(--line); color:var(--ink-soft);}
.hosp-badge--em{background:#FFF0EE; color:#C13B2E; border:1px solid #f5c6c0;}
.hosp-card-detail{display:flex; flex-direction:column; gap:6px; font-size:12.5px; color:var(--ink-soft); border-top:1px dashed var(--line); padding-top:10px;}
.hosp-card-phone{color:var(--primary); font-weight:700; text-decoration:none;}
.hosp-card-phone:hover{text-decoration:underline;}

@media(max-width:600px){
	.hosp-browser-header{padding:20px 18px;}
	.hosp-step{padding:18px 16px;}
	.hosp-province-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));}
	.hosp-list{grid-template-columns:1fr;}
}

/* ===================== AI Health Navigator ===================== */
.ai-nav{padding:0 0 60px;}
.ai-nav .wrap{max-width:760px;}
.ai-nav-box{
	background:linear-gradient(180deg,var(--primary-tint) 0%, var(--bg) 100%);
	border-radius:24px; padding:44px 32px 36px; text-align:center; position:relative; overflow:hidden;
}
.ai-nav-eyebrow{
	position:relative; display:inline-flex; align-items:center; gap:6px;
	background:var(--card); color:var(--primary); border:1px solid var(--line);
	font-size:13px; font-weight:600; padding:6px 14px; border-radius:999px; margin-bottom:18px;
}
.ai-nav-dot{width:6px; height:6px; border-radius:50%; background:var(--accent);}
.ai-nav-title{position:relative; margin:0 0 10px; font-size:28px; font-weight:800; color:var(--primary-dark); line-height:1.4;}
.ai-nav-sub{position:relative; margin:0 auto 18px; max-width:480px; color:var(--ink-soft); font-size:15px; line-height:1.9;}
.ai-nav-pipeline{position:relative; margin:-4px 0 18px; font-size:13px; font-weight:600; color:var(--primary-dark);}
.ai-nav-pipeline-strip{
	position:relative; display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
	gap:6px; margin:0 0 26px; font-size:11.5px; color:var(--ink-soft);
}
.ai-nav-pipeline-strip span{background:var(--card); border:1px solid var(--line); border-radius:999px; padding:4px 10px;}
.ai-nav-pipeline-arrow{background:none !important; border:none !important; padding:0 !important; color:#B7CBC7;}
.ai-nav-pipeline-final{background:var(--primary) !important; border-color:var(--primary) !important; color:#fff !important; font-weight:700;}
.ai-nav-input-box{
	position:relative; background:var(--card); border:1px solid var(--line);
	border-radius:18px; box-shadow:var(--shadow); padding:14px 16px; text-align:right;
}
.ai-nav-textarea{
	width:100%; border:none; outline:none; resize:none; font-family:inherit; font-size:15.5px;
	color:var(--ink); background:transparent; min-height:56px; line-height:1.8; display:block;
}
.ai-nav-input-actions{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; border-top:1px solid var(--line); padding-top:10px; margin-top:8px;}
.ai-nav-hint{font-size:12px; color:var(--ink-soft); opacity:.7;}
.ai-nav-location-btn{
	background:transparent; color:var(--primary-dark); border:1px solid var(--line); border-radius:20px;
	padding:6px 14px; font-size:12.5px; font-weight:600; font-family:inherit; cursor:pointer;
	display:inline-flex; align-items:center; gap:6px; transition:border-color .15s, background .15s;
}
.ai-nav-location-btn:hover{border-color:var(--primary);}
.ai-nav-location-btn:disabled{opacity:.6; cursor:not-allowed;}
.ai-nav-location-btn--active{border-color:var(--primary); background:var(--primary-tint); color:var(--primary-dark);}
.ai-nav-submit{
	background:var(--primary); color:#fff; border:none; border-radius:12px; padding:10px 22px;
	font-size:14.5px; font-weight:700; font-family:inherit; cursor:pointer;
	display:inline-flex; align-items:center; gap:8px; transition:background .15s, transform .1s;
}
.ai-nav-submit:hover{background:var(--primary-dark);}
.ai-nav-submit:active{transform:scale(.97);}
.ai-nav-submit:disabled{background:#B7CBC7; cursor:not-allowed;}
.ai-nav-chips{position:relative; display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-top:18px;}
.ai-nav-chip{
	background:var(--card); border:1px solid var(--line); color:var(--ink-soft); font-size:13px;
	padding:7px 14px; border-radius:999px; cursor:pointer; transition:border-color .15s, color .15s;
}
.ai-nav-chip:hover{border-color:var(--primary); color:var(--primary);}

.ai-nav-loading{display:none; align-items:center; gap:12px; justify-content:center; padding:36px 0; color:var(--ink-soft); font-size:14px;}
.ai-nav-spinner{width:20px; height:20px; border-radius:50%; border:3px solid var(--line); border-top-color:var(--primary); animation:aiNavSpin .8s linear infinite;}
@keyframes aiNavSpin{to{transform:rotate(360deg);}}

.ai-nav-results{display:none; margin-top:28px;}
.ai-nav-disclaimer{
	display:flex; gap:10px; align-items:flex-start; background:var(--card); border:1px solid var(--line);
	border-right:3px solid var(--accent); border-radius:12px; padding:12px 14px; font-size:12.5px;
	color:var(--ink-soft); line-height:1.8; margin-bottom:20px;
}
.ai-nav-disclaimer b{color:var(--accent-dark);}
.ai-nav-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:20px 22px; margin-bottom:18px;}
.ai-nav-card-label{display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700; color:var(--primary); margin-bottom:14px;}
.ai-nav-ico{width:22px; height:22px; border-radius:7px; background:var(--primary-tint); display:flex; align-items:center; justify-content:center; font-size:12px; color:var(--primary);}
.ai-nav-symptom-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px;}
.ai-nav-symptom-list li{display:flex; align-items:center; gap:10px; font-size:14.5px; color:var(--ink);}
.ai-nav-check{width:18px; height:18px; border-radius:50%; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; font-size:11px; flex:none;}
.ai-nav-next-title{font-size:15.5px; font-weight:700; color:var(--primary-dark); margin:0 0 6px;}
.ai-nav-next-text{font-size:14px; color:var(--ink-soft); line-height:1.9; margin:0;}

.ai-nav-emergency{background:#FBEAE6; border:1px solid #EFC9BC; border-radius:var(--radius); padding:20px 22px; margin-bottom:18px; text-align:center;}
.ai-nav-emergency-ico{font-size:26px; margin-bottom:8px;}
.ai-nav-emergency h3{margin:0 0 8px; color:var(--danger); font-size:16.5px; font-weight:800;}
.ai-nav-emergency p{margin:0 0 16px; color:#8A4536; font-size:14px; line-height:1.9;}
.ai-nav-emergency-btn{background:var(--danger); color:#fff; border:none; border-radius:12px; padding:11px 26px; font-size:14.5px; font-weight:700; font-family:inherit; cursor:pointer; display:inline-block; text-decoration:none;}

.ai-nav-section-title{font-size:15px; font-weight:700; color:var(--ink); margin:26px 0 12px;}
.ai-nav-doctor-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; margin-bottom:14px;}
.ai-nav-doctor-top{display:flex; align-items:center; gap:12px;}
.ai-nav-avatar{width:48px; height:48px; border-radius:50%; flex:none; object-fit:cover;}
.ai-nav-avatar-fallback{color:#fff; font-weight:700; font-size:16px; display:flex; align-items:center; justify-content:center;}
.ai-nav-doctor-info{flex:1; min-width:0;}
.ai-nav-doctor-name{font-size:15px; font-weight:700; color:var(--ink); margin:0;}
.ai-nav-doctor-meta{font-size:12.5px; color:var(--ink-soft); margin:3px 0 0;}
.ai-nav-doctor-rating{font-size:12px; color:var(--accent-dark); font-weight:700; flex:none;}
.ai-nav-service-chips{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px;}
.ai-nav-service-chip{font-size:11px; font-weight:700; color:#8a5a00; background:#fff3d9; padding:4px 10px; border-radius:20px;}
.ai-nav-why-toggle{
	margin-top:12px; width:100%; background:var(--primary-tint); border:none; border-radius:10px;
	padding:9px 12px; font-family:inherit; font-size:13px; font-weight:600; color:var(--primary-dark);
	cursor:pointer; display:flex; align-items:center; justify-content:space-between;
}
.ai-nav-arrow{transition:transform .2s;}
.ai-nav-why-toggle.open .ai-nav-arrow{transform:rotate(180deg);}
.ai-nav-why-panel{display:none; padding:14px 4px 2px;}
.ai-nav-why-panel.open{display:block;}
.ai-nav-why-text{font-size:13.5px; color:var(--ink-soft); line-height:1.9; margin:0 0 12px;}
.ai-nav-reasons{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.ai-nav-reasons li{display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink);}
.ai-nav-tick{color:var(--primary); font-weight:800;}
.ai-nav-book-btn{
	margin-top:14px; display:block; text-align:center; width:100%; background:var(--primary); color:#fff;
	border:none; border-radius:10px; padding:10px; font-family:inherit; font-size:13.5px; font-weight:700;
	cursor:pointer; text-decoration:none;
}
.ai-nav-facility-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; margin-bottom:14px;}
.ai-nav-facility-name{font-size:15px; font-weight:700; color:var(--ink); margin:0;}
.ai-nav-facility-meta{font-size:12.5px; color:var(--ink-soft); margin:4px 0 0;}
.ai-nav-facility-addr{font-size:12.5px; color:var(--ink-soft); margin:4px 0 0; opacity:.85;}
@media (max-width:640px){
	.ai-nav-box{padding:32px 18px 26px;}
	.ai-nav-title{font-size:23px;}
}
