/* Page identity: each public section has its own job and look, so Help, Yuva,
   Contact and Events stop reading as the same complaint form. header.php puts
   page-<section> on <body>; this file loads last so these skins win over the
   shared hero and layout rules. Colours come from the party theme variables
   (--orange primary, --bjp-green secondary), so branding stays intact.
   JanSampark Bold keeps its dark hero; only the page accents apply there. */

:root{--pi-help:#1f3b63;--pi-help-soft:#e6edf6;--pi-ink:#16121f}

/* ---------- Help desk (/complaint): calm, service-like, track first ---------- */
body.page-complaint:not(.tpl-jansampark-bold) .page-hero.help-hero{background-image:linear-gradient(135deg,rgba(245,248,252,.97),rgba(230,237,246,.94)),var(--site-hero-bg,none);background-size:cover;background-position:center;border-bottom:1px solid #d9e2ee}
body.page-complaint:not(.tpl-jansampark-bold) .page-hero.help-hero h1{color:#12263f}
body.page-complaint .page-hero.help-hero:after{display:none}
.help-kicker{display:inline-flex;align-items:center;gap:7px;margin:0 0 10px;padding:6px 12px;border-radius:999px;background:var(--pi-help-soft);color:var(--pi-help);font-size:12px;font-weight:900;letter-spacing:.03em}
.help-steps{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0;list-style:none}
.help-steps li{display:inline-flex;align-items:center;gap:8px;padding:8px 13px 8px 8px;border:1px solid #d5dfeb;border-radius:999px;background:#fff;color:#22324a;font-size:13px;font-weight:800}
.help-steps li span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--orange);color:#fff;font-size:12px}
.help-track-link{display:inline-flex;align-items:center;gap:7px;margin-top:14px;color:var(--pi-help);font-size:14px;font-weight:900;text-decoration:underline;text-underline-offset:3px}
body.tpl-jansampark-bold .help-track-link{color:#ffbd89}
body.tpl-jansampark-bold .help-kicker{background:#ffffff1a;color:#fff}
body.page-complaint .contact-form-card{border-color:#d9e2ee;box-shadow:0 18px 45px rgba(18,38,63,.08)}
body.page-complaint .tracking-panel{background:#f3f7fc;border-color:#d5dfeb;box-shadow:0 14px 34px rgba(18,38,63,.07)}

/* ---------- Yuva and GenZ: a dark, energetic youth space ---------- */
body:is(.page-yuva,.page-genz) .modern-hero.genz-hero{background:radial-gradient(circle at 88% 12%,color-mix(in srgb,var(--orange) 46%,transparent),transparent 46%),radial-gradient(circle at 6% 96%,color-mix(in srgb,var(--bjp-green) 34%,transparent),transparent 52%),var(--pi-ink);color:#fff;border-bottom:4px solid var(--orange)}
body:is(.page-yuva,.page-genz) .modern-hero.genz-hero:is(:before,:after){display:none}
body:is(.page-yuva,.page-genz) .genz-hero h1{color:#fff}
body:is(.page-yuva,.page-genz) .genz-hero h1 span{color:color-mix(in srgb,var(--orange) 55%,#fff)}
body:is(.page-yuva,.page-genz) .genz-hero :is(.modern-hero-lead,.modern-stat small){color:#d9d4e3}
body:is(.page-yuva,.page-genz) .genz-hero :is(.modern-breadcrumbs,.modern-breadcrumbs span){color:#b9b2c7}
body:is(.page-yuva,.page-genz) .genz-hero :is(.modern-breadcrumbs a,.modern-kicker){color:color-mix(in srgb,var(--orange) 60%,#fff)}
body:is(.page-yuva,.page-genz) .genz-hero .modern-btn-soft{background:#ffffff14;border-color:#ffffff38;color:#fff}
body:is(.page-yuva,.page-genz) .genz-hero .modern-stat{background:#ffffff10;border-color:#ffffff26;color:#fff}
body:is(.page-yuva,.page-genz) .genz-youth-art:before{color:rgba(255,255,255,.07)}
body:is(.page-yuva,.page-genz) .genz-youth-card{border-color:#ffffff30;background:#fff;color:#18140f}
body.page-yuva .genz-form-card{border:2px solid color-mix(in srgb,var(--orange) 28%,#e4def0);box-shadow:0 18px 45px rgba(22,18,31,.08)}
body.page-yuva .genz-benefits{grid-template-columns:repeat(3,minmax(0,1fr))}
/* One-box quick ask in the Yuva hero. */
.yuva-quick{display:grid;gap:10px;max-width:640px;margin-top:22px;padding:16px;border:1px solid #ffffff2e;border-radius:20px;background:#ffffff12;backdrop-filter:blur(4px)}
.yuva-quick-label{color:#fff;font-size:15px;font-weight:900}
.yuva-quick textarea{width:100%;min-height:96px;padding:12px 14px;border:0;border-radius:14px;background:#fff;color:#18140f;font:inherit;font-size:16px;line-height:1.5;resize:vertical}
.yuva-quick-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.yuva-quick-row>small{flex-basis:100%;color:#d9d4e3;font-size:12px}
.yuva-quick-mic{display:inline-flex;align-items:center;gap:6px;min-height:46px;padding:10px 16px;border:1px solid #ffffff40;border-radius:999px;background:#ffffff1f;color:#fff;font-weight:900;cursor:pointer}
.yuva-quick-area{flex:1 1 140px;min-width:0;min-height:46px;padding:10px 14px;border:0;border-radius:12px;background:#fff;color:#18140f;font:inherit;font-size:16px}
.yuva-quick-send{min-height:46px;border-radius:12px}
.yuva-quick-note{color:#cfc8dc;font-size:12px;line-height:1.5}
@media (max-width:767px){.yuva-quick-send{flex:1 1 100%}}
.yuva-grievance-link{margin:18px 0 0;color:var(--pm-muted,#6f675f);font-size:14px}
.yuva-grievance-link a{color:var(--deep,#d94700);font-weight:800}

/* ---------- Contact: the office front desk, actions first ---------- */
body.page-contact:not(.tpl-jansampark-bold) .page-hero.office-hero{background-image:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,245,242,.95)),var(--site-hero-bg,none);background-size:cover;border-bottom:1px solid #ebe5de}
body.page-contact .page-hero.office-hero:after{display:none}
.office-kicker{display:inline-flex;align-items:center;gap:7px;margin:0 0 10px;color:var(--deep,#d94700);font-size:12px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}
.office-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:22px}
.office-action{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 14px;border:1px solid #e6dfd7;border-radius:16px;background:#fff;color:#1d1915;text-decoration:none;box-shadow:0 8px 22px rgba(30,20,10,.05)}
.office-action>.ui-icon,.office-action>svg{flex:none;color:var(--orange)}
.office-action span{display:grid;gap:2px;min-width:0}
.office-action b{font-size:15px}
.office-action small{overflow:hidden;color:#6f675f;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.office-action.is-call{border-color:var(--orange);background:var(--orange);color:#fff}
.office-action.is-call>.ui-icon,.office-action.is-call small{color:#fff}
.office-action.is-whatsapp>svg{color:#128c4a}
.contact-write-card{border:1px solid #e6dfd7;border-radius:20px;background:#fff;box-shadow:0 12px 30px rgba(30,20,10,.05)}
.contact-write-card>.form-success,.contact-write-card>.form-errors{margin:16px 16px 0}
.contact-write>summary{display:flex;align-items:center;gap:14px;min-height:72px;padding:14px 18px;cursor:pointer;list-style:none}
.contact-write>summary::-webkit-details-marker{display:none}
.contact-write>summary .modern-icon{margin:0}
.contact-write>summary>span:last-child{display:grid;gap:2px}
.contact-write>summary small{color:#6f675f;font-size:12px;font-weight:800}
.contact-write>summary b{font-size:18px}
.contact-write>summary:after{content:"+";margin-left:auto;display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:#f5f1ec;font-size:18px;font-weight:800}
.contact-write[open]>summary:after{content:"−"}
.contact-write>p,.contact-write>form{margin:0;padding:0 18px 18px}
.contact-write>p{color:#6f675f}

/* ---------- Events (/community): date first, secondary colour ---------- */
body.page-community:not(.tpl-jansampark-bold) .page-hero.events-hero{background-image:linear-gradient(135deg,color-mix(in srgb,var(--bjp-green) 9%,#fff),color-mix(in srgb,var(--bjp-green) 17%,#fff)),var(--site-hero-bg,none);background-size:cover;border-bottom:1px solid color-mix(in srgb,var(--bjp-green) 22%,#fff)}
body.page-community:not(.tpl-jansampark-bold) .page-hero.events-hero h1{color:color-mix(in srgb,var(--bjp-green) 55%,#111)}
body.page-community .page-hero.events-hero:after{display:none}
body.page-community .events-hero .section-kicker{display:inline-flex;align-items:center;gap:7px;color:color-mix(in srgb,var(--bjp-green) 75%,#111)}
body.page-community .outreach-card{border-color:color-mix(in srgb,var(--bjp-green) 18%,#eee);box-shadow:0 14px 34px rgba(20,40,25,.07)}
body.page-community .outreach-date{background:var(--bjp-green);color:#fff}
.outreach-meta{display:flex;flex-wrap:wrap;gap:6px 16px;color:#5f5a55;font-size:14px;font-weight:700}
.outreach-meta span{display:inline-flex;align-items:center;gap:6px}

/* ---------- Mobile bottom bar: Yuva raised in the centre, accents per item ---------- */
.mobile-quickbar a.qb-help.active{color:var(--pi-help)}
.mobile-quickbar a.qb-help.active .ui-icon{color:var(--pi-help)}
.mobile-quickbar a.qb-events.active,.mobile-quickbar a.qb-events.active .ui-icon{color:color-mix(in srgb,var(--bjp-green) 80%,#111)}
.mobile-quickbar a.qb-yuva{position:relative;color:var(--pi-ink);font-weight:800}
.mobile-quickbar .qb-raise{display:grid;place-items:center;width:48px;height:48px;margin-top:-24px;border:3px solid #fff;border-radius:50%;background:var(--pi-ink);color:#fff;box-shadow:0 8px 20px rgba(22,18,31,.28)}
.mobile-quickbar a.qb-yuva .qb-raise .ui-icon{color:#fff}
.mobile-quickbar a.qb-yuva.active .qb-raise{background:var(--orange)}

@media (max-width:900px){.office-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){
  body.page-yuva .genz-benefits{grid-template-columns:1fr}
  body:is(.page-yuva,.page-genz) .genz-youth-art{display:none}
  .help-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .help-steps li{flex-direction:column;justify-content:flex-start;gap:6px;padding:10px 6px;border-radius:14px;font-size:12px;line-height:1.3;text-align:center}
  .office-action{min-height:58px;padding:10px 12px}
  .contact-write>summary b{font-size:16px}
}

/* Welcome pop-up without real art: one column of text, no placeholder panel. */
.site-splash.no-art .splash-dialog{grid-template-columns:1fr;width:min(560px,100%);min-height:0}

/* Request a meeting: a calm green-tinted hero so it reads as an invitation, not a complaint desk. */
body.page-meeting:not(.tpl-jansampark-bold) .page-hero.meeting-hero{background-image:linear-gradient(135deg,rgba(244,250,246,.97),rgba(228,242,233,.94)),var(--site-hero-bg,none);background-size:cover;background-position:center;border-bottom:1px solid #d3e6d9}
body.page-meeting:not(.tpl-jansampark-bold) .page-hero.meeting-hero h1{color:#123a24}
body.page-meeting .page-hero.meeting-hero:after{display:none}
body.page-meeting .help-kicker{background:#e3f2e8;color:#17603a}
body.page-meeting .help-track-link{color:#17603a}
body.tpl-jansampark-bold.page-meeting .help-kicker{background:#ffffff1a;color:#fff}
body.tpl-jansampark-bold.page-meeting .help-track-link{color:#ffbd89}
body.page-meeting .contact-form-card{border-color:#d3e6d9;box-shadow:0 18px 45px rgba(18,58,36,.08)}
body.page-meeting .tracking-panel{background:#f2f9f4;border-color:#d3e6d9;box-shadow:0 14px 34px rgba(18,58,36,.07)}
.meeting-first-note{margin:0 0 18px;padding:12px 14px;border:1px solid #d9e2ee;border-radius:14px;background:#f3f7fc;color:#22324a}
.meeting-first-note b{display:inline-flex;align-items:center;gap:6px;font-size:14.5px}
.meeting-first-note p{margin:4px 0 0;font-size:14px;line-height:1.55}
.meeting-first-note a{color:var(--pi-help);font-weight:900;white-space:nowrap}
.meeting-office-note{display:flex;align-items:flex-start;gap:8px;margin:0 0 14px;padding:10px 12px;border-radius:12px;background:#f2f9f4;color:#17603a;font-size:14px;font-weight:700}
.meeting-result p{margin:8px 0 0}