/* ==================================================================
   SHAHMIE TRAVEL & TOURS — V22 TYPOGRAPHY, NAV & PANEL SLIDE FIXES
   1) Saiz tulisan kecil diseragamkan pada halaman awam dan panel.
   2) Garisan kuning menu aktif dibuang sepenuhnya.
   3) Slide pakej panel ditinggikan supaya butang sentiasa kelihatan.
   4) Kontras tulisan popup WhatsApp dibetulkan.
   ================================================================== */
:root{
  --v22-maroon-950:#2b0309;
  --v22-maroon-900:#43070f;
  --v22-maroon-800:#64101b;
  --v22-maroon-700:#7e1425;
  --v22-gold:#d9a93e;
  --v22-gold-soft:#f3d67e;
  --v22-cream:#fffaf1;
  --v22-paper:#ffffff;
  --v22-ink:#2f2427;
  --v22-muted:#6f6065;
  --v22-line:rgba(103,16,31,.16);
}

/* ---------- 1. Standard typography: public pages ---------- */
html body[data-layout="public"]{
  font-size:16px!important;
  line-height:1.6!important;
}
html body[data-layout="public"] small,
html body[data-layout="public"] .small,
html body[data-layout="public"] .form-help,
html body[data-layout="public"] .finder-note,
html body[data-layout="public"] .choice-chip small,
html body[data-layout="public"] .trust-ribbon small,
html body[data-layout="public"] .package-card small,
html body[data-layout="public"] .package-card .small,
html body[data-layout="public"] .package-meta,
html body[data-layout="public"] .package-meta span,
html body[data-layout="public"] .news-meta,
html body[data-layout="public"] .card-meta,
html body[data-layout="public"] .footer small,
html body[data-layout="public"] .footer .small{
  font-size:.92rem!important;
  line-height:1.55!important;
}
html body[data-layout="public"] p,
html body[data-layout="public"] li,
html body[data-layout="public"] label,
html body[data-layout="public"] .text-muted,
html body[data-layout="public"] .section-heading p,
html body[data-layout="public"] .card p{
  font-size:1rem!important;
  line-height:1.65!important;
}
html body[data-layout="public"] .eyebrow,
html body[data-layout="public"] .badge,
html body[data-layout="public"] .package-badge,
html body[data-layout="public"] .package-slots{
  font-size:.86rem!important;
  line-height:1.35!important;
}
html body[data-layout="public"] .btn,
html body[data-layout="public"] button,
html body[data-layout="public"] input,
html body[data-layout="public"] select,
html body[data-layout="public"] textarea{
  font-size:.98rem!important;
}
html body[data-layout="public"] .main-nav-clean a{
  font-size:1rem!important;
}

/* ---------- 2. Remove active-menu yellow underline ---------- */
html body[data-layout="public"] .main-nav-clean a::before,
html body[data-layout="public"] .main-nav-clean a::after,
html body[data-layout="public"] .main-nav a::before,
html body[data-layout="public"] .main-nav a::after{
  content:none!important;
  display:none!important;
  width:0!important;
  height:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  transform:none!important;
}
html body[data-layout="public"] .main-nav-clean a,
html body[data-layout="public"] .main-nav-clean a:hover,
html body[data-layout="public"] .main-nav-clean a.active{
  border-bottom-color:transparent!important;
  text-decoration:none!important;
}

/* ---------- 3. Standard typography: admin, agent & customer panels ---------- */
html body.panel-body{
  font-size:16px!important;
  line-height:1.58!important;
}
html body.panel-body p,
html body.panel-body li,
html body.panel-body label,
html body.panel-body .text-muted{
  font-size:.98rem!important;
  line-height:1.6!important;
}
html body.panel-body small,
html body.panel-body .small,
html body.panel-body .form-help,
html body.panel-body .stat-label,
html body.panel-body .stat-trend,
html body.panel-body .panel-title p,
html body.panel-body .panel-help,
html body.panel-body .panel-user-copy .small,
html body.panel-body .quick-action-card small,
html body.panel-body .activity-item small,
html body.panel-body .table-card small,
html body.panel-body .table-card .small{
  font-size:.88rem!important;
  line-height:1.5!important;
}
html body.panel-body #panel-sidebar .sidebar-role span,
html body.panel-body #panel-sidebar .sidebar-role strong{
  font-size:.86rem!important;
}
html body.panel-body #panel-sidebar .sidebar-section{
  font-size:.79rem!important;
  line-height:1.4!important;
}
html body.panel-body #panel-sidebar .sidebar-nav a{
  font-size:.96rem!important;
}
html body.panel-body .table th,
html body.panel-body .table td,
html body.panel-body table th,
html body.panel-body table td{
  font-size:.91rem!important;
  line-height:1.5!important;
}
html body.panel-body .badge{
  font-size:.82rem!important;
  line-height:1.3!important;
}
html body.panel-body .btn,
html body.panel-body button,
html body.panel-body input,
html body.panel-body select,
html body.panel-body textarea{
  font-size:.94rem!important;
}

/* ---------- 4. Taller package slides in every panel ---------- */
html body.panel-body .panel-content>.panel-campaign{
  margin-top:14px!important;
  margin-bottom:32px!important;
}
html body.panel-body .panel-campaign,
html body.panel-body .panel-campaign .carousel-track,
html body.panel-body .panel-campaign-slide{
  min-height:510px!important;
  height:510px!important;
}
html body.panel-body .panel-campaign-slide{
  display:flex!important;
  align-items:center!important;
  background-position:center 46%!important;
}
html body.panel-body .panel-campaign-copy{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  width:min(860px,78%)!important;
  max-width:860px!important;
  min-height:100%!important;
  padding:58px 54px 126px!important;
}
html body.panel-body .panel-campaign-copy .eyebrow{
  font-size:.88rem!important;
}
html body.panel-body .panel-campaign-copy h2{
  margin:13px 0!important;
  font-size:clamp(2.55rem,4vw,4.2rem)!important;
  line-height:1.04!important;
}
html body.panel-body .panel-campaign-copy p{
  max-width:760px!important;
  margin:0 0 16px!important;
  font-size:1.03rem!important;
  line-height:1.62!important;
}
html body.panel-body .panel-campaign-meta{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:10px 16px!important;
  margin:2px 0 18px!important;
}
html body.panel-body .panel-campaign-meta strong,
html body.panel-body .panel-campaign-meta span{
  font-size:.94rem!important;
}
html body.panel-body .panel-campaign-copy>.btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:46px!important;
  margin-top:0!important;
  padding:11px 18px!important;
  flex:0 0 auto!important;
  opacity:1!important;
  visibility:visible!important;
}
html body.panel-body .panel-campaign .carousel-controls{
  right:24px!important;
  bottom:22px!important;
  z-index:8!important;
}

/* Dashboard mini package slider */
html body.panel-body .dashboard-mini-wrap,
html body.panel-body .dashboard-mini-carousel,
html body.panel-body .dashboard-mini-carousel .carousel-track,
html body.panel-body .dashboard-mini-slide{
  min-height:430px!important;
  height:430px!important;
}
html body.panel-body .dashboard-mini-slide{
  display:flex!important;
  align-items:flex-end!important;
  padding:32px 30px 76px!important;
}
html body.panel-body .dashboard-mini-slide>div{
  width:100%!important;
  max-width:96%!important;
}
html body.panel-body .dashboard-mini-slide small{font-size:.92rem!important}
html body.panel-body .dashboard-mini-slide p{font-size:1rem!important;margin-bottom:18px!important}
html body.panel-body .dashboard-mini-slide .btn{
  min-height:44px!important;
  padding:10px 17px!important;
  opacity:1!important;
  visibility:visible!important;
}

/* ---------- 5. WhatsApp popup contrast & readable type ---------- */
html body[data-layout="public"] .whatsapp-card{
  background:#fff!important;
  color:var(--v22-ink)!important;
  border:1px solid rgba(100,16,27,.16)!important;
}
html body[data-layout="public"] .whatsapp-card-head{
  background:linear-gradient(135deg,#43070f,#7e1425)!important;
  color:#fff!important;
  border-bottom:1px solid rgba(255,255,255,.12)!important;
}
html body[data-layout="public"] .whatsapp-card-head strong,
html body[data-layout="public"] .whatsapp-card-head>div>strong,
html body[data-layout="public"] .whatsapp-card-head .small,
html body[data-layout="public"] .whatsapp-card-head span,
html body[data-layout="public"] .whatsapp-card-head i{
  color:#fff!important;
  opacity:1!important;
  visibility:visible!important;
  text-shadow:none!important;
}
html body[data-layout="public"] .whatsapp-card-head strong,
html body[data-layout="public"] .whatsapp-card-head>div>strong{
  font-size:1.05rem!important;
  line-height:1.3!important;
  font-weight:800!important;
}
html body[data-layout="public"] .whatsapp-card-head .small{
  margin-top:4px!important;
  color:#f5dfe4!important;
  font-size:.92rem!important;
  line-height:1.4!important;
}
html body[data-layout="public"] .whatsapp-close{
  display:grid!important;
  place-items:center!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#3b0710!important;
}
html body[data-layout="public"] .whatsapp-close i{color:#3b0710!important}
html body[data-layout="public"] .whatsapp-card-body{
  background:#fff!important;
  color:var(--v22-ink)!important;
  padding:22px!important;
}
html body[data-layout="public"] .whatsapp-greeting{
  display:block!important;
  color:#241b1e!important;
  font-size:1.16rem!important;
  line-height:1.4!important;
  font-weight:900!important;
}
html body[data-layout="public"] .whatsapp-card-body p{
  color:#6b5b60!important;
  font-size:1rem!important;
  line-height:1.62!important;
}
html body[data-layout="public"] .whatsapp-quick span{
  color:#34282b!important;
  background:#fff9f1!important;
  border-color:#e7d3b7!important;
  font-size:.9rem!important;
  line-height:1.35!important;
  font-weight:600!important;
}
html body[data-layout="public"] .whatsapp-quick span i{color:#4a1019!important}
html body[data-layout="public"] .whatsapp-card-body .btn-whatsapp{
  color:#fff!important;
  font-size:1rem!important;
  font-weight:800!important;
}

/* ---------- Responsive balance ---------- */
@media(max-width:1280px){
  html body[data-layout="public"] .main-nav-clean a{font-size:.94rem!important}
}
@media(max-width:920px){
  html body[data-layout="public"] #main-nav.main-nav-clean>a{font-size:1rem!important}
}
@media(max-width:760px){
  html body.panel-body .panel-campaign,
  html body.panel-body .panel-campaign .carousel-track,
  html body.panel-body .panel-campaign-slide{
    min-height:480px!important;
    height:480px!important;
  }
  html body.panel-body .panel-campaign-copy{
    width:100%!important;
    max-width:100%!important;
    padding:42px 24px 116px!important;
  }
  html body.panel-body .panel-campaign-copy h2{
    font-size:2.25rem!important;
    line-height:1.08!important;
  }
  html body.panel-body .panel-campaign-copy p{font-size:1rem!important}
  html body.panel-body .dashboard-mini-wrap,
  html body.panel-body .dashboard-mini-carousel,
  html body.panel-body .dashboard-mini-carousel .carousel-track,
  html body.panel-body .dashboard-mini-slide{
    min-height:405px!important;
    height:405px!important;
  }
  html body.panel-body .dashboard-mini-slide{padding:28px 24px 70px!important}
}
@media(max-width:520px){
  html body[data-layout="public"] small,
  html body[data-layout="public"] .small{font-size:.9rem!important}
  html body[data-layout="public"] .whatsapp-card-body{padding:20px!important}
  html body[data-layout="public"] .whatsapp-card-head{padding:16px!important}
  html body[data-layout="public"] .whatsapp-greeting{font-size:1.1rem!important}

  html body.panel-body .panel-campaign,
  html body.panel-body .panel-campaign .carousel-track,
  html body.panel-body .panel-campaign-slide{
    min-height:460px!important;
    height:460px!important;
  }
  html body.panel-body .panel-campaign-copy{padding:36px 20px 110px!important}
  html body.panel-body .panel-campaign-copy h2{font-size:2rem!important}
  html body.panel-body .panel-campaign-copy p{font-size:.96rem!important;line-height:1.55!important}
  html body.panel-body .dashboard-mini-wrap,
  html body.panel-body .dashboard-mini-carousel,
  html body.panel-body .dashboard-mini-carousel .carousel-track,
  html body.panel-body .dashboard-mini-slide{
    min-height:385px!important;
    height:385px!important;
  }
}
