/* =========================================================
   Cultural Group Registration — rules & acceptance page
   Builds on home.css (header, footer, buttons)
   ========================================================= */
.cg-body{font-family:"Hind",var(--font-base)}
.cg-body main{outline:0}

/* ---------- Page title band ---------- */
.cg-hero{background:linear-gradient(135deg, var(--sky-900) 0%, var(--h-nav) 100%); color:#fff; padding:28px 0 32px}
.cg-hero h1{color:#fff; font-size:1.75rem; font-weight:700; margin:6px 0 2px}
.cg-hero-en{font-size:1rem; font-weight:600; color:#fed7aa; margin:0 0 10px}
.cg-hero-lead{max-width:760px; margin:0; color:rgba(255,255,255,.9)}
.cg-crumb{display:flex; flex-wrap:wrap; gap:6px; list-style:none; margin:0; padding:0; font-size:.8rem; color:rgba(255,255,255,.75)}
.cg-crumb li + li::before{content:"/"; margin-right:6px; opacity:.6}
.cg-crumb a{color:#fff}
.cg-crumb a:hover{text-decoration:underline}

.cg-wrap{padding-top:28px; padding-bottom:28px}

/* ---------- Contents ---------- */
.cg-toc{position:sticky; top:16px; background:#fff; border:1px solid var(--h-border); border-radius:12px; padding:16px}
.cg-toc h2{font-size:.95rem; font-weight:700; margin:0 0 10px; padding-bottom:8px; border-bottom:2px solid var(--orange-500)}
.cg-toc ol{list-style:none; margin:0; padding:0; counter-reset:toc}
.cg-toc li{counter-increment:toc}
.cg-toc a{display:flex; gap:8px; padding:6px 8px; border-radius:6px; color:var(--h-text); font-size:.875rem; line-height:1.4}
.cg-toc a::before{content:counter(toc); flex:0 0 18px; color:var(--sky-700); font-weight:700}
.cg-toc a:hover, .cg-toc a:focus{background:var(--sky-50); color:var(--sky-700)}

/* ---------- Document ---------- */
.cg-doc{background:#fff; border:1px solid var(--h-border); border-radius:12px; padding:28px 32px}
.cg-sec{scroll-margin-top:16px}
.cg-sec + .cg-sec{margin-top:28px; padding-top:24px; border-top:1px dashed var(--h-border)}
.cg-h{display:flex; align-items:center; gap:10px; font-size:1.25rem; font-weight:700; margin:0 0 14px}
.cg-h span{display:inline-grid; place-items:center; width:30px; height:30px; flex:0 0 30px; border-radius:50%; background:var(--sky-700); color:#fff; font-size:.9rem}

.cg-go{background:var(--sky-50); border:1px solid var(--sky-200); border-left:4px solid var(--orange-500); border-radius:10px; padding:18px 20px}
.cg-go h2{font-size:1.15rem; font-weight:700; margin:6px 0 12px}
.cg-go-tag{display:inline-block; font-size:.75rem; font-weight:600; color:var(--orange-800); background:var(--orange-100); border-radius:4px; padding:1px 8px}
.cg-go-meta{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px 20px; margin:0 0 12px; font-size:.875rem}
.cg-go-meta div{display:flex; gap:8px; min-width:0}
.cg-go-meta dt{flex:0 0 64px; font-weight:600; color:var(--h-muted)}
.cg-go-meta dd{margin:0; min-width:0}
.cg-note{font-size:.85rem; color:var(--orange-800)}

.cg-def{margin:0 0 14px}
.cg-def div{display:flex; gap:12px; padding:8px 0}
.cg-def dt{flex:0 0 96px; font-weight:700; color:var(--sky-700)}
.cg-def dd{margin:0}

.cg-list{margin:0; padding-left:1.6rem}
.cg-list > li{padding-left:4px; margin-bottom:10px}
.cg-list > li::marker{font-weight:700; color:var(--sky-700)}
.cg-list-hi{list-style-type:devanagari}
.cg-list .cg-list{margin-top:8px}

.cg-cap{margin:10px 0 6px; font-size:.85rem; font-weight:600; color:var(--h-muted)}
.cg-table{margin:6px 0 4px; font-size:.875rem; background:#fff}
.cg-table thead th{background:var(--sky-50); color:var(--navy-900); font-weight:700; vertical-align:middle}
.cg-table tbody th{font-weight:600}
.cg-table-narrow{max-width:560px}
.cg-table-fee{min-width:640px; text-align:center}
.cg-table-fee tbody th{text-align:left}
.cg-table-fee thead tr:last-child th:nth-child(even){color:var(--orange-800)}
.cg-table-fee tbody td:nth-child(5), .cg-table-fee tbody td:nth-child(7), .cg-table-fee tbody td:nth-child(9){font-weight:700; color:var(--orange-800)}
.cg-grade{display:inline-grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--orange-100); color:var(--orange-800); font-weight:700}

.cg-committee{list-style:none; margin:10px 0 0; padding:0; border:1px solid var(--h-border); border-radius:8px; overflow:hidden}
.cg-committee li{display:flex; justify-content:space-between; gap:12px; padding:8px 12px; font-size:.9rem}
.cg-committee li + li{border-top:1px solid var(--h-border)}
.cg-committee em{flex:0 0 auto; font-style:normal; font-size:.8rem; font-weight:600; color:var(--sky-700); background:var(--sky-50); border-radius:4px; padding:1px 8px; align-self:center}
.cg-committee li:first-child em{color:var(--orange-800); background:var(--orange-100)}

.cg-chips{display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:10px 0 0; padding:0}
.cg-chips li{background:var(--sky-50); border:1px solid var(--sky-200); border-radius:999px; padding:3px 12px; font-size:.85rem}

.cg-source{margin:20px 0 0; font-size:.8rem; color:var(--h-muted)}
.cg-source a{color:var(--sky-700)}

/* ---------- Acceptance bar ---------- */
.cg-accept{position:sticky; bottom:0; z-index:20; background:#fff; border-top:3px solid var(--orange-500); box-shadow:0 -6px 20px rgba(12,74,110,.12); padding:14px 0}
.cg-accept-inner{display:flex; align-items:center; flex-wrap:wrap; gap:10px 24px; margin:0}
.cg-check{flex:1 1 420px; margin:0; display:flex; gap:10px; align-items:flex-start; padding-left:0}
.cg-check .form-check-input{float:none; margin:3px 0 0; flex:0 0 auto; width:1.35em; height:1.35em; border:2px solid var(--sky-600); cursor:pointer}
.cg-check .form-check-input:checked{background-color:var(--sky-700); border-color:var(--sky-700)}
.cg-check .form-check-label{font-weight:600; line-height:1.5; cursor:pointer}
.cg-check-en{display:block; font-weight:400; font-size:.85rem; color:var(--h-muted)}
.cg-accept-actions{display:flex; gap:10px; margin-left:auto}
.cg-accept-actions .btn{padding:8px 20px; font-weight:600}
.cg-accept-actions .btn:disabled{background:var(--gray-200); border-color:var(--gray-200); color:var(--gray-500); opacity:1; cursor:not-allowed}
.cg-hint{flex:1 0 100%; margin:0; font-size:.78rem; color:var(--h-muted)}
.cg-accept.is-agreed .cg-hint{visibility:hidden}

.cg-body .h-footer{padding-top:0}
.cg-body .h-ft-bottom{margin-top:0}

@media (max-width: 767.98px){
  .cg-hero h1{font-size:1.4rem}
  .cg-doc{padding:20px 16px}
  .cg-go-meta{grid-template-columns:1fr}
  .cg-def div{flex-direction:column; gap:2px}
  .cg-def dt{flex:none}
  .cg-committee li{flex-direction:column; gap:4px}
  .cg-committee em{align-self:flex-start}
  .cg-accept-actions{width:100%; margin-left:0}
  .cg-accept-actions .btn{flex:1 1 0}
  .cg-hint{display:none}
}
.cg-login-line{flex:1 0 100%; margin:0; font-size:.8rem; color:var(--h-muted)}
.cg-login-line a{font-weight:600; color:var(--sky-700)}

/* ---------- Inside the Cultural Group Portal layout (js/cg-shell.js) ---------- */
.cg-in-shell #app-main .container{max-width:none; padding-left:0; padding-right:0}
.cg-in-shell .cg-wrap{padding-top:0}
.cg-in-shell .cg-form-wrap{max-width:1100px; margin-left:0; padding-top:0}
.cg-in-shell .cg-toc{top:calc(var(--header-h) + 16px)}
.cg-in-shell .cg-sec, .cg-in-shell .cg-steps{scroll-margin-top:calc(var(--header-h) + 16px)}
.cg-in-shell .cg-accept{margin:0 -28px -40px; padding:14px 28px; border-radius:0}
.cg-head-en{font-size:.62em; font-weight:600; color:var(--gray-500)}
.cg-head-kicker{margin:2px 0 0; font-size:.8rem; color:var(--gray-500)}
@media (max-width: 767.98px){
  .cg-in-shell .cg-accept{margin:0 -14px -40px; padding:12px 14px}
}