@charset "UTF-8";
/* ==========================================================================
   Kolkata Kiddathon 2026 — INNER PAGES (WS4c)
   Loaded from header.php on every NON-home page, next to kd-header.css.
   kd-home.css and kd-home.js are homepage-only (leaf canvas, hero, companions);
   the shared components the inner pages need are duplicated here.

   Two jobs:
     1. the kd-* component set (band, card, form, table, accordion, prose)
     2. a BRIDGE layer that repaints the legacy Bootstrap/style.css classes the
        inner-page JS depends on (.form-control, .card-radio-btn, .form-check,
        .btn.reg-btn ...) WITHOUT any markup or JS change. Every bridge rule is
        scoped under body.kd-page so the homepage and the admin side are safe.

   .kd-btn / .kd-btn-primary / .kd-btn-secondary / .kd-btn-call / .kd-btn-sm are
   NOT duplicated here: they live in kd-header.css, which is loaded on every
   page including this one.
   ========================================================================== */

/* ---------- page ground ---------- */
body.kd-page{
  background:var(--kd-cream);
  background-image:none;
  background-attachment:scroll;
  color:var(--kd-ink);
  font-family:var(--kd-body);
  font-size:17px;line-height:1.6;
  overflow-x:hidden;
}
body.kd-page::after{content:none;display:none}
/* zero-specificity base element styles (same trick as kd-home.css) */
:where(body.kd-page) :where(img){max-width:100%;display:block}
:where(body.kd-page) :where(h1,h2,h3,h4,h5){
  font-family:var(--kd-display);font-weight:400;letter-spacing:.5px;line-height:1.06;margin:0}
:where(body.kd-page) :where(p){margin:0 0 var(--kd-s3)}
:where(body.kd-page) :where(a){color:var(--kd-canopy)}
body.kd-page :focus-visible{outline:4px solid var(--kd-gold);outline-offset:3px;border-radius:6px}
body.kd-page main{display:block}

/* ---------- .kd-page wrapper (the :not(body) keeps it off the body class) ---------- */
.kd-page:not(body){
  width:min(100% - 32px,1100px);margin-inline:auto;box-sizing:border-box;
  padding:var(--kd-s4) 0 var(--kd-s6);
}
.kd-page:not(body) *,.kd-page:not(body) *::before,.kd-page:not(body) *::after{box-sizing:border-box}

/* ==========================================================================
   PAGE TITLE BAND — small wooden plank, no art (the homepage owns the art)
   ========================================================================== */
.kd-band{
  background:linear-gradient(180deg,var(--kd-wood-light) 0%,var(--kd-wood-dark) 100%);
  border-bottom:4px solid #5A3514;
  box-shadow:inset 0 -6px 0 rgba(0,0,0,.12);
  padding:var(--kd-s3) 0;
  color:var(--kd-cream);
}
.kd-band-in{width:min(100% - 32px,1100px);margin-inline:auto;box-sizing:border-box}
.kd-band h1{
  font-family:var(--kd-display);font-size:clamp(1.55rem,6.2vw,2.4rem);line-height:1.05;
  color:var(--kd-cream);text-shadow:0 2px 0 rgba(0,0,0,.28);margin:0}
.kd-band p{margin:6px 0 0;font-size:.95rem;font-weight:600;color:#FBE8CB}
.kd-crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;list-style:none;margin:0 0 6px;padding:0;
  font-size:.78rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.kd-crumbs li{display:inline-flex;align-items:center;gap:6px;color:#F6DCB4}
.kd-crumbs li+li::before{content:"›";color:#F6DCB4;opacity:.8}
.kd-crumbs a{color:var(--kd-gold);text-decoration:none}
.kd-crumbs a:hover,.kd-crumbs a:focus{text-decoration:underline}

/* ==========================================================================
   CARDS
   ========================================================================== */
.kd-card{
  background:var(--kd-cream);border:3px solid var(--kd-wood-dark);border-radius:var(--kd-r-l);
  padding:var(--kd-s3);box-shadow:var(--kd-shadow-card);margin:0 0 var(--kd-s4);
}
.kd-card-green{border-color:var(--kd-canopy)}
.kd-card>:last-child{margin-bottom:0}
.kd-card-h{
  font-family:var(--kd-display);font-size:1.25rem;color:var(--kd-canopy);
  margin:0 0 var(--kd-s3);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.kd-card-h .kd-amt{margin-left:auto;font-family:var(--kd-display);color:var(--kd-track);white-space:nowrap}
.kd-center{text-align:center}
.kd-art{width:96px;height:auto;margin:0 auto var(--kd-s3);
  filter:drop-shadow(0 10px 12px rgba(15,42,20,.28))}
.kd-art-lg{width:140px}

/* section heads (duplicated from kd-home.css) */
.kd-section-head{text-align:center;max-width:760px;margin:0 auto var(--kd-s4)}
.kd-section-head h2{font-size:clamp(1.6rem,6vw,2.4rem);color:var(--kd-canopy)}
.kd-section-head p{margin-top:var(--kd-s2);color:var(--kd-ink-soft);font-size:.98rem}
.kd-kicker{display:inline-block;font-weight:800;font-size:.76rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--kd-red-ink);margin-bottom:var(--kd-s2)}

/* tiles (duplicated from kd-home.css) */
.kd-tiles{display:grid;grid-template-columns:1fr 1fr;gap:var(--kd-s2);margin:0 0 var(--kd-s4)}
.kd-tile{background:var(--kd-cream);border:3px solid var(--kd-canopy);border-radius:var(--kd-r-m);
  padding:var(--kd-s3) var(--kd-s2);text-align:center;box-shadow:var(--kd-shadow-card)}
.kd-tile h3{font-size:1rem;color:var(--kd-canopy);margin-bottom:4px}
.kd-tile p{margin:0;font-size:.86rem;color:var(--kd-ink-soft)}
.kd-tile .kd-map{display:inline-flex;align-items:center;min-height:44px;font-weight:800;font-size:.9rem;color:var(--kd-canopy)}

/* ==========================================================================
   PROSE — legal pages, about copy. max 70ch, display-face headings.
   ========================================================================== */
.kd-prose{max-width:70ch;margin-inline:auto;color:var(--kd-ink);font-size:1rem;line-height:1.7}
.kd-prose h2{font-family:var(--kd-display);font-size:clamp(1.4rem,5vw,1.9rem);color:var(--kd-canopy);margin:var(--kd-s5) 0 var(--kd-s2)}
.kd-prose h3{font-family:var(--kd-display);font-size:1.18rem;color:var(--kd-track);margin:var(--kd-s4) 0 var(--kd-s2)}
.kd-prose h2:first-child,.kd-prose h3:first-child{margin-top:0}
.kd-prose p{margin:0 0 var(--kd-s3)}
.kd-prose b,.kd-prose strong{font-weight:800;color:var(--kd-ink)}
.kd-prose ul,.kd-prose ol{margin:0 0 var(--kd-s3);padding-left:1.25em}
.kd-prose li{margin-bottom:8px;display:list-item;list-style:disc}
.kd-prose ol li{list-style:decimal}
.kd-prose a{color:var(--kd-canopy);font-weight:700}
.kd-prose hr{border:0;border-top:2px dashed rgba(122,74,31,.4);margin:var(--kd-s4) 0}
.kd-updated{display:inline-block;background:rgba(123,192,67,.18);border:2px solid var(--kd-canopy);
  border-radius:999px;padding:4px 14px;font-size:.82rem;font-weight:800;color:var(--kd-canopy);margin-bottom:var(--kd-s3)}

/* ==========================================================================
   TABLES
   ========================================================================== */
.kd-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--kd-r-m);
  border:2px solid rgba(122,74,31,.35);background:rgba(255,255,255,.4)}
.kd-table{width:100%;border-collapse:collapse;font-size:.92rem;background:transparent;margin:0}
.kd-table th,.kd-table td{padding:10px 12px;text-align:left;vertical-align:middle;
  border-bottom:2px dashed rgba(122,74,31,.3);color:var(--kd-ink);white-space:nowrap}
.kd-table thead th,.kd-table tr:first-child th{
  background:var(--kd-wood-dark);color:var(--kd-cream);font-family:var(--kd-display);
  font-weight:400;letter-spacing:.6px;border-bottom:0;white-space:nowrap}
.kd-table tbody tr:nth-child(even),.kd-table tr:nth-child(even){background:rgba(123,192,67,.1)}
.kd-table tfoot td{font-weight:800;background:rgba(242,178,51,.14)}
.kd-table tfoot tr:last-child td{font-family:var(--kd-display);font-size:1.05rem;color:var(--kd-track)}
.kd-table .kd-num{text-align:right}

/* summary rows (order summary card) */
.kd-sum{list-style:none;margin:0 0 var(--kd-s3);padding:0}
.kd-sum li{display:flex;gap:var(--kd-s3);align-items:baseline;justify-content:space-between;
  padding:10px 0;border-bottom:2px dashed rgba(122,74,31,.3);font-weight:600}
.kd-sum li:last-child{border-bottom:0}
.kd-sum .kd-k{color:var(--kd-ink-soft)}
.kd-sum .kd-v{font-weight:800;white-space:nowrap}
.kd-sum .kd-minus .kd-v{color:var(--kd-red-ink)}
.kd-sum-total{display:flex;justify-content:space-between;align-items:center;gap:var(--kd-s3);
  background:rgba(242,178,51,.2);border:3px solid var(--kd-wood-dark);border-radius:var(--kd-r-m);
  padding:12px var(--kd-s3);margin:0 0 var(--kd-s3)}
.kd-sum-total span{font-family:var(--kd-display);font-size:1.05rem;color:var(--kd-ink)}
.kd-sum-total b{font-family:var(--kd-display);font-size:1.5rem;color:var(--kd-track);font-weight:400}
.kd-trust{margin:var(--kd-s2) 0 0;text-align:center;font-size:.84rem;font-weight:700;color:var(--kd-ink-3)}

/* ---------- status badges ---------- */
.kd-badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 14px;
  font-family:var(--kd-body);font-weight:800;font-size:.82rem;letter-spacing:.04em;text-transform:uppercase;
  border:2px solid transparent;white-space:nowrap}
.kd-badge-paid{background:rgba(31,107,46,.16);border-color:var(--kd-canopy);color:#14561F}
.kd-badge-pending{background:rgba(242,178,51,.28);border-color:#B07A12;color:#7A5208}
.kd-badge-failed{background:rgba(215,38,30,.14);border-color:var(--kd-red);color:var(--kd-red-ink)}

/* style.css paints .counter-value #f6f6f6 (near white) — invisible on cream */
body.kd-page .counter-value{
  font-family:var(--kd-display);font-weight:400;font-size:2.4rem;line-height:1.15;
  color:var(--kd-track);display:block;width:100%;text-align:center}

/* ---------- big copyable code ---------- */
.kd-code{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--kd-display);font-size:clamp(1.05rem,5vw,1.9rem);letter-spacing:.04em;
  background:var(--kd-cream);border:3px dashed var(--kd-canopy);border-radius:var(--kd-r-m);
  padding:12px var(--kd-s3);margin:0 auto var(--kd-s2);color:var(--kd-track);
  user-select:all;-webkit-user-select:all;word-break:break-all;max-width:100%}
.kd-code-lbl{display:block;font-size:.76rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;
  color:var(--kd-ink-3);margin-bottom:6px;font-family:var(--kd-body)}

/* ---------- link row ---------- */
.kd-actions{display:flex;flex-direction:column;gap:var(--kd-s2);margin:var(--kd-s4) 0 0}
.kd-actions .kd-btn{width:100%}
.kd-btn-wa{background:#25D366;color:var(--kd-shadow);box-shadow:0 5px 0 #128C7E,0 10px 18px rgba(15,42,20,.18)}
.kd-btn-wa:hover,.kd-btn-wa:focus{background:#3BE07A;color:var(--kd-shadow);transform:translateY(-2px)}

/* ==========================================================================
   FORMS — duplicated from kd-home.css so the inner pages get the same card
   ========================================================================== */
.kd-form-card{background:var(--kd-cream);border:3px solid var(--kd-wood-dark);border-radius:var(--kd-r-l);
  padding:var(--kd-s3);box-shadow:var(--kd-shadow-card);max-width:760px;margin-inline:auto}
.kd-f-grid{display:grid;grid-template-columns:1fr;gap:var(--kd-s3)}
.kd-field{display:flex;flex-direction:column;gap:6px}
.kd-field label{
  font-family:var(--kd-body);font-weight:700;font-size:13px;line-height:1.2;
  text-transform:uppercase;letter-spacing:.06em;color:var(--kd-canopy);
}
.kd-field .kd-hint{font-family:var(--kd-body);font-weight:600;font-size:13px;color:var(--kd-ink-3);text-transform:none;letter-spacing:0}
.kd-field input,.kd-field select,.kd-field textarea{
  min-height:48px;padding:12px 14px;border-radius:var(--kd-r-s);
  border:2px solid var(--kd-wood-dark);background:var(--kd-cream);
  font-family:var(--kd-body);font-size:16px;font-weight:600;color:var(--kd-ink);width:100%;
  box-shadow:inset 0 2px 0 rgba(122,74,31,.08);
  transition:border-color .16s,box-shadow .16s;
}
.kd-field input::placeholder,.kd-field textarea::placeholder{color:var(--kd-ink-3);font-weight:600;opacity:1}
.kd-field select{appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='M2 5l5 5 5-5' stroke='%231F6B2E' stroke-width='2.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
.kd-field textarea{min-height:130px;resize:vertical}
.kd-field input:focus,.kd-field select:focus,.kd-field textarea:focus{
  border-color:var(--kd-canopy);outline:3px solid var(--kd-gold);outline-offset:1px;
  box-shadow:inset 0 2px 0 rgba(31,107,46,.10)}
.kd-req{color:var(--kd-red);font-weight:800}
.kd-field .error-message{font-family:var(--kd-body);font-weight:600;font-size:13px;color:var(--kd-red-ink);line-height:1.3}
.kd-field .error-message:empty{display:none}
.kd-f-actions{display:grid;grid-template-columns:1fr;gap:var(--kd-s2)}
.kd-f-actions .kd-btn{width:100%}
.kd-form-note{margin:var(--kd-s3) 0 0}
.kd-form-note:empty{display:none}
.kd-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
/* style.css ships "#contactForm{padding:0}" inside a max-width:768px block —
   an ID beats our class, so re-assert the card padding at (1,1,0). */
#contactForm.kd-form-card{padding:var(--kd-s3)}

/* ==========================================================================
   ACCORDION (duplicated from kd-home.css) + the legacy .faq_question widget
   ========================================================================== */
.kd-faq{max-width:860px;margin-inline:auto}
.kd-qa{background:var(--kd-cream);border:3px solid var(--kd-canopy);border-radius:var(--kd-r-m);
  margin-bottom:var(--kd-s2);overflow:hidden}
.kd-qa h3{margin:0}
.kd-qa button,body.kd-page .kd-qa .faq_question{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--kd-s3);
  min-height:56px;padding:14px var(--kd-s3);background:transparent;border:0;cursor:pointer;
  font-family:var(--kd-display);font-size:1rem;letter-spacing:.4px;color:var(--kd-canopy);text-align:left}
.kd-qa button:hover,body.kd-page .kd-qa .faq_question:hover{background:rgba(123,192,67,.14)}
.kd-qa .kd-chev{flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:var(--kd-leaf);
  display:grid;place-items:center;transition:transform .25s var(--kd-ease-out)}
.kd-qa button[aria-expanded="true"] .kd-chev{transform:rotate(180deg)}
.kd-qa .kd-panel,body.kd-page .kd-qa .faq_answer{
  padding:0 var(--kd-s3) var(--kd-s3);color:var(--kd-ink-soft);font-size:.98rem;font-family:var(--kd-body)}
.kd-qa .kd-panel p:last-child{margin-bottom:0}
.kd-qa .kd-panel ul,body.kd-page .kd-qa .faq_answer ul{margin:0 0 var(--kd-s2);padding-left:1.15em}
.kd-qa .kd-panel li,body.kd-page .kd-qa .faq_answer li{margin-bottom:6px;display:list-item;list-style:disc}
/* the footer's slideToggle widget opens the first answer itself; the arrow is
   a pure-CSS affordance driven by the .active class it toggles. */
body.kd-page .kd-qa .faq_question::after{
  content:"";flex:0 0 auto;width:12px;height:12px;margin-left:auto;
  border-right:3px solid var(--kd-canopy);border-bottom:3px solid var(--kd-canopy);
  transform:rotate(45deg) translateY(-3px);transition:transform .25s var(--kd-ease-out)}
body.kd-page .kd-qa .faq_question.active::after{transform:rotate(225deg) translateY(-3px)}

/* ==========================================================================
   BRIDGE — legacy classes the inner-page JS still writes / reads.
   Appearance only. No markup, name, id or handler is touched.
   ========================================================================== */

/* The old full-bleed photo banner is replaced by .kd-band in the restyled
   views. Pages that still carry one (photos, the legacy bulk views) get the
   plank look instead of 200px of empty dark space — never display:none, so a
   page title can't silently disappear. */
body.kd-page .banner_title{
  background:linear-gradient(180deg,var(--kd-wood-light) 0%,var(--kd-wood-dark) 100%);
  border-bottom:4px solid #5A3514;box-shadow:inset 0 -6px 0 rgba(0,0,0,.12);
  padding:var(--kd-s3) 0;margin:0;color:var(--kd-cream);display:block}
body.kd-page .banner_title h2{
  font-family:var(--kd-display);font-size:clamp(1.55rem,6.2vw,2.4rem);line-height:1.05;
  color:var(--kd-cream);text-shadow:0 2px 0 rgba(0,0,0,.28);margin:0}
body.kd-page .banner_title .breadcrumb{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 6px;padding:0;
  font-size:.78rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
body.kd-page .banner_title .breadcrumb-item{color:#F6DCB4}
body.kd-page .banner_title a{color:var(--kd-gold);text-decoration:none}
body.kd-page .banner_title .breadcrumb-item.active{color:#F6DCB4}
body.kd-page .current_event,body.kd-page .contact_body,
body.kd-page .about_section,body.kd-page .faq_section,
body.kd-page .reg-bg,body.kd-page .about_us_panel{background:transparent;padding:0;margin:0}

/* inputs: 48px tall, 16px text (no iOS zoom), wooden border, cream fill */
body.kd-page .form-control,body.kd-page .form-select{
  display:block;width:100%;min-height:48px;height:auto;
  padding:12px 14px;border-radius:var(--kd-r-s);
  border:2px solid var(--kd-wood-dark);background-color:var(--kd-cream);
  font-family:var(--kd-body);font-size:16px;font-weight:600;color:var(--kd-ink);
  box-shadow:inset 0 2px 0 rgba(122,74,31,.08);transition:border-color .16s,box-shadow .16s}
body.kd-page .form-control::placeholder{color:var(--kd-ink-3);font-weight:600;opacity:1}
body.kd-page .form-control:focus,body.kd-page .form-select:focus{
  border-color:var(--kd-canopy);outline:3px solid var(--kd-gold);outline-offset:1px;
  background-color:var(--kd-cream);color:var(--kd-ink);
  box-shadow:inset 0 2px 0 rgba(31,107,46,.10)}
body.kd-page select.form-control,body.kd-page .form-select{
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='M2 5l5 5 5-5' stroke='%231F6B2E' stroke-width='2.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
body.kd-page select.form-control:disabled{opacity:.55;cursor:not-allowed}
body.kd-page textarea.form-control{min-height:130px}
/* the inline style="color:red" error divs keep their colour; give them type */
body.kd-page [id^="error_"],body.kd-page [id^="error-message"],
body.kd-page #coupon-status,body.kd-page .error{
  font-family:var(--kd-body);font-weight:700;font-size:13px;line-height:1.3;margin-top:4px}

/* legacy buttons -> kd pill buttons */
body.kd-page .btn.reg-btn,body.kd-page .btn-red,body.kd-page .btn.add_morebtn,
body.kd-page input.add_morebtn,body.kd-page .appointment_btn.btn,
body.kd-page .btn.rem-btn,body.kd-page .btn.dino-mite{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:48px;padding:12px 24px;border-radius:999px;border:0;
  font-family:var(--kd-display);font-size:1rem;letter-spacing:.6px;
  text-decoration:none;cursor:pointer;box-sizing:border-box;
  background:var(--kd-red);color:var(--kd-cream);
  box-shadow:0 5px 0 #7E130E,0 12px 22px rgba(15,42,20,.28);
  transition:transform .16s var(--kd-ease-out),box-shadow .16s var(--kd-ease-out),background-color .16s}
body.kd-page .btn.reg-btn:hover,body.kd-page .btn-red:hover,body.kd-page .btn.add_morebtn:hover,
body.kd-page input.add_morebtn:hover,body.kd-page .appointment_btn.btn:hover{
  background:#E32E25;color:var(--kd-cream);transform:translateY(-2px)}
/* secondary-weight legacy buttons */
body.kd-page .btn.dino-mite,body.kd-page .btn.add-row{
  background:var(--kd-canopy);color:var(--kd-cream);box-shadow:0 5px 0 #14471F,0 10px 18px rgba(15,42,20,.2)}
body.kd-page .btn.dino-mite:hover,body.kd-page .btn.add-row:hover{background:#2A8039;color:var(--kd-cream)}
body.kd-page .btn.rem-btn{
  background:transparent;color:var(--kd-red-ink);border:2px solid var(--kd-red);
  box-shadow:none;min-height:44px;padding:8px 18px;font-size:.9rem}
body.kd-page .btn.rem-btn:hover{background:rgba(215,38,30,.1);color:var(--kd-red-ink)}
body.kd-page .btn.btn-secondary{background:var(--kd-ink-soft);border-color:var(--kd-ink-soft)}

/* legacy bootstrap tables inside a kd page */
body.kd-page .table{width:100%;border-collapse:collapse;font-size:.92rem;color:var(--kd-ink);margin:0 0 var(--kd-s3);
  --bs-table-bg:transparent;--bs-table-color:var(--kd-ink)}
body.kd-page .table th,body.kd-page .table td{
  padding:10px 12px;vertical-align:middle;background:transparent;color:var(--kd-ink);
  border-bottom:2px dashed rgba(122,74,31,.3);box-shadow:none}
body.kd-page .table th{background:var(--kd-wood-dark);color:var(--kd-cream);
  font-family:var(--kd-display);font-weight:400;letter-spacing:.6px;border-bottom:0;text-align:left}
body.kd-page .table tfoot td{font-weight:800;background:rgba(242,178,51,.12);border-left:0!important;border-right:0!important}
body.kd-page .table .badge.bg-success{background:var(--kd-canopy)!important;color:var(--kd-cream)}

/* ---------- radio PILL toggles (donation: label.card-radio-btn) ----------
   The inputs keep their name/value/checked exactly; only the visual card is
   restyled. style.css sets width:123px!important under 1480px, so the width
   here has to be !important too. */
body.kd-page .card-radio-btn{display:inline-block;margin:0 8px 8px 0;position:relative;cursor:pointer}
body.kd-page .card-input-element+.card{
  width:auto!important;min-width:104px;height:auto;min-height:48px;margin:0;padding:10px 18px;
  display:flex;align-items:center;justify-content:center;
  background:var(--kd-cream);border:3px solid var(--kd-wood-dark);border-radius:999px;
  box-shadow:0 3px 0 rgba(122,74,31,.35);color:var(--kd-ink);
  transition:background-color .16s,border-color .16s,transform .16s,box-shadow .16s}
body.kd-page .card-input-element+.card:hover{background:#fff;cursor:pointer;transform:translateY(-1px)}
body.kd-page .card-radio-btn .content_head{
  font-family:var(--kd-display);font-size:1rem;font-weight:400;line-height:1.1;letter-spacing:.4px;color:inherit}
body.kd-page .card-input-element:checked+.card{
  background:var(--kd-canopy);border-color:#14471F;color:var(--kd-cream);
  box-shadow:0 3px 0 #14471F,0 8px 16px rgba(15,42,20,.22)}
body.kd-page .card-input-element:checked+.card::after{
  content:"";position:static;background:none;color:inherit;font-size:0;line-height:0;margin:0}
body.kd-page .card-input-element:focus-visible+.card{outline:4px solid var(--kd-gold);outline-offset:3px}

/* ---------- radio PILL toggles (eco park: .form-check-inline > label > input) ---------- */
body.kd-page .form-check.form-check-inline{margin:0 8px 8px 0;padding:0;display:inline-block}
body.kd-page .form-check-inline .form-check-label{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;min-width:96px;padding:10px 18px;margin:0;cursor:pointer;
  background:var(--kd-cream);border:3px solid var(--kd-wood-dark);border-radius:999px;
  box-shadow:0 3px 0 rgba(122,74,31,.35);
  font-family:var(--kd-display);font-size:1rem;font-weight:400;letter-spacing:.4px;color:var(--kd-ink);
  transition:background-color .16s,border-color .16s,color .16s,box-shadow .16s}
body.kd-page .form-check-inline .form-check-label:hover{background:#fff}
body.kd-page .form-check-inline .form-check-input{
  width:20px;height:20px;margin:0;flex:0 0 auto;accent-color:var(--kd-canopy)}
/* on the selected (dark green) pill the native blue dot would disappear */
body.kd-page .form-check-inline .form-check-label:has(.form-check-input:checked) .form-check-input{
  accent-color:var(--kd-gold)}
body.kd-page .form-check-inline .form-check-label:has(.form-check-input:checked){
  background:var(--kd-canopy);border-color:#14471F;color:var(--kd-cream);
  box-shadow:0 3px 0 #14471F,0 8px 16px rgba(15,42,20,.22)}
body.kd-page .form-check-inline .form-check-label:has(.form-check-input:focus-visible){
  outline:4px solid var(--kd-gold);outline-offset:3px}

/* ==========================================================================
   REGISTER — participant cards + sticky wooden total bar
   ========================================================================== */
.kd-part-card{
  background:var(--kd-cream);border:3px solid var(--kd-wood-dark);border-radius:var(--kd-r-l);
  padding:var(--kd-s3);box-shadow:var(--kd-shadow-card);margin:0 0 var(--kd-s3);position:relative}
body.kd-page .kd-part-card .section_heading h5,
body.kd-page .kd-block-h h5{
  font-family:var(--kd-display);font-size:1.12rem;color:var(--kd-canopy);margin:0;letter-spacing:.4px}
body.kd-page .kd-part-card .section_heading .col-auto h5,
body.kd-page .kd-block-h .col-auto h5{color:var(--kd-track);white-space:nowrap}
body.kd-page .kd-part-card .sl_no{
  display:inline-grid;place-items:center;width:28px;height:28px;margin-right:8px;border-radius:50%;
  background:var(--kd-gold);color:var(--kd-shadow);font-size:.9rem;vertical-align:middle}
/* the block headings on the non-participant sections (tickets/donation/eco/coupon) */
body.kd-page .kd-block{
  background:var(--kd-cream);border:3px solid var(--kd-canopy);border-radius:var(--kd-r-l);
  padding:var(--kd-s3);box-shadow:var(--kd-shadow-card);margin:0 0 var(--kd-s3)}
body.kd-page .kd-block h5{font-family:var(--kd-display);font-size:1.12rem;color:var(--kd-canopy);margin:0}
body.kd-page .kd-block p{margin:4px 0 0;font-size:.9rem;color:var(--kd-ink-soft)}
body.kd-page .kd-block .text-dark{color:var(--kd-ink-soft)!important}
body.kd-page .kd-block a.text-info{color:var(--kd-canopy)!important;font-weight:800;text-decoration:underline}

/* sticky wooden total bar (mobile). This IS the legacy .final_row — same
   #total_price span, same #FormSubmit button, so no JS changes hands. */
body.kd-page .final_row{
  position:fixed;left:0;right:0;bottom:0;z-index:1028;margin:0;
  display:flex;align-items:center;gap:var(--kd-s2);
  padding:8px 16px calc(8px + env(safe-area-inset-bottom,0px));
  background:linear-gradient(180deg,var(--kd-wood-light) 0%,var(--kd-wood-dark) 100%);
  border-top:4px solid #5A3514;box-shadow:0 -8px 24px rgba(15,42,20,.28)}
body.kd-page .final_row>div{padding:0;margin:0;width:auto;flex:0 0 auto;text-align:left}
body.kd-page .final_row .kd-bar-note{display:none}
body.kd-page .final_row h5{
  margin:0!important;font-family:var(--kd-display);font-size:1.15rem;color:var(--kd-cream)!important;
  text-shadow:0 2px 0 rgba(0,0,0,.28);white-space:nowrap}
body.kd-page .final_row .form-group{margin:0!important;flex:1 1 auto}
body.kd-page .final_row #FormSubmit{width:100%;min-height:48px;font-size:1rem;padding:10px 18px}
/* the bar floats over the page, so the page needs room under it */
body.kd-page:has(.final_row){padding-bottom:96px}

/* coupon row: input + status inline */
body.kd-page .kd-coupon-row{display:flex;gap:var(--kd-s2);align-items:flex-start;flex-wrap:wrap}
body.kd-page .kd-coupon-row .form-control{flex:1 1 180px;min-width:0}

/* Bootstrap's .row gutters inside our wooden cards */
body.kd-page .kd-part-card .form-group,body.kd-page .kd-block .form-group{margin-bottom:var(--kd-s3)!important}
body.kd-page .kd-part-card .row:last-child .form-group:last-child{margin-bottom:0!important}

/* ==========================================================================
   >=768px
   ========================================================================== */
@media (min-width:768px){
  .kd-page:not(body){padding:var(--kd-s5) 0 var(--kd-s7)}
  .kd-band{padding:var(--kd-s4) 0}
  .kd-card,.kd-part-card,body.kd-page .kd-block{padding:var(--kd-s4)}
  .kd-form-card,#contactForm.kd-form-card{padding:var(--kd-s4)}
  .kd-f-grid{grid-template-columns:1fr 1fr}
  .kd-field.kd-full{grid-column:1/-1}
  .kd-f-actions{grid-template-columns:auto auto;justify-content:start}
  .kd-f-actions .kd-btn{width:auto}
  .kd-tiles{gap:var(--kd-s3);grid-template-columns:repeat(4,1fr)}
  .kd-tile{border-radius:var(--kd-r-l);padding:var(--kd-s4)}
  .kd-actions{flex-direction:row;flex-wrap:wrap}
  .kd-actions .kd-btn{width:auto}
  .kd-art{width:120px}
  .kd-art-lg{width:190px}
  .kd-table th,.kd-table td{padding:12px 16px}

  /* the total bar stops being sticky and becomes a wooden footer plank */
  body.kd-page .final_row{
    position:static;border-radius:var(--kd-r-l);border:3px solid #5A3514;border-top-width:3px;
    padding:var(--kd-s3) var(--kd-s4);margin:0 0 var(--kd-s4);box-shadow:var(--kd-shadow-card);
    justify-content:flex-end;gap:var(--kd-s4)}
  body.kd-page .final_row .kd-bar-note{display:block;margin:0;margin-right:auto;color:#FBE8CB;font-size:.92rem;font-weight:700}
  body.kd-page .final_row h5{font-size:1.35rem}
  body.kd-page .final_row .form-group{flex:0 0 auto}
  body.kd-page .final_row #FormSubmit{width:auto}
  body.kd-page:has(.final_row){padding-bottom:0}
}

@media (min-width:1024px){
  body.kd-page .table td,body.kd-page .table th{white-space:normal}
}

/* ---------- motion guard ---------- */
@media (prefers-reduced-motion:reduce){
  body.kd-page *{animation:none!important;transition:none!important}
}