/* =====================================================================
   LDP v9.4 — deep UI/UX proportional + mobile hardening
   Public profile, LMS participant, admin panel, payment portal.
   ===================================================================== */
:root{--v94-content:1180px;--v94-reading:860px;--v94-admin:1440px;--v94-gap:clamp(14px,2vw,24px)}
html{overflow-x:hidden} body{overflow-x:hidden}
.container{width:min(calc(100% - 32px),var(--v94-content))!important;margin-inline:auto!important}
.narrow{width:min(calc(100% - 32px),var(--v94-reading))!important;margin-inline:auto!important}
section>.container,.dash>.container{margin-inline:auto!important}
.section-head{width:min(100%,820px)!important;margin-inline:auto!important;text-align:center!important}
.section-head .eyebrow{margin-inline:auto}
.card,.panel,.form-card,.adm-panel{min-width:0}
img,video,iframe{max-width:100%}

/* Public registration/payment */
.contact-layout{grid-template-columns:minmax(0,1fr) minmax(280px,340px)!important;gap:var(--v94-gap)!important}
.form-card{width:100%;max-width:100%}
.fieldset-pay{min-width:0;margin-top:20px;padding:clamp(16px,2vw,24px);border-radius:16px}
.payment-methods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:10px 0 18px}
.pay-option{display:flex!important;align-items:flex-start;gap:10px;margin:0!important;padding:14px;border:1.5px solid var(--line);border-radius:14px;background:#fff;cursor:pointer}
.pay-option:has(input:checked){border-color:var(--maroon);box-shadow:0 0 0 3px rgba(225,30,22,.08)}
.pay-option input{width:auto!important;margin:4px 0 0!important;accent-color:var(--maroon)}
.pay-option span{display:grid;gap:2px}.pay-option small{font-weight:500;color:var(--muted);line-height:1.45}
.manual-transfer-fields[hidden]{display:none!important}
.payment-status-card{margin-inline:auto;max-width:760px}
.payment-status-head{display:flex;justify-content:space-between;gap:20px;align-items:center;padding-bottom:18px;border-bottom:1px solid var(--line)}
.payment-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}
.payment-summary>div{padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--bg-alt)}
.payment-summary span{display:block;font-size:.78rem;color:var(--muted);margin-bottom:3px}.payment-summary b{display:block;overflow-wrap:anywhere}

/* LMS catalog */
.lms-catalog-nav,.kelas-tabs{overflow-x:auto;scrollbar-width:thin;display:flex!important;white-space:nowrap}
.filterbar,.lms-filter,.catalog-filter{display:grid!important;grid-template-columns:minmax(180px,1.2fr) minmax(180px,.9fr) auto auto;align-items:center!important;gap:10px!important}
.filterbar>*{min-width:0!important;margin:0!important}
.filterbar label:has(input[type="checkbox"]){display:flex!important;align-items:center!important;justify-content:center;gap:8px;line-height:1.3;font-size:.84rem;margin:0!important}
.filterbar input[type="checkbox"]{width:20px!important;height:20px!important;flex:0 0 20px;margin:0!important}

/* LMS learning screen */
.learn{padding-block:28px 48px!important}
.learn-layout{grid-template-columns:minmax(220px,280px) minmax(0,1fr)!important;gap:20px!important;max-width:var(--v94-content);margin-inline:auto}
.learn-main{min-width:0;padding:clamp(18px,2.5vw,32px)!important}
.learn-main .video-frame,.learn-main .player{width:100%;margin-inline:auto}
.learn-foot{gap:12px!important}.learn-foot-right{gap:8px!important}

/* Dashboard participant */
.dash{min-height:calc(100vh - 120px)}
.dash-head{max-width:none!important}
.stats.stats-sm .stat{min-height:112px}
.dash .table-wrap{overflow:auto!important}
.dash table.data{min-width:760px}
.resume-card{overflow:hidden}

/* Public schedule: real mobile card layout, no hidden values */
@media(max-width:720px){
  .table-wrap:has(.table-batch){border:0!important;background:transparent!important;overflow:visible!important}
  .table-batch{display:block!important;width:100%!important;min-width:0!important;overflow:visible!important}
  .table-batch tbody{display:grid!important;gap:12px!important;width:100%!important}
  .table-batch tr{display:block!important;width:100%!important;margin:0!important;padding:4px 0!important;border:1px solid var(--line)!important;border-radius:14px!important;box-shadow:var(--shadow-sm)}
  .table-batch td{display:grid!important;grid-template-columns:minmax(88px,38%) minmax(0,1fr)!important;width:100%!important;gap:12px!important;align-items:start!important;padding:10px 12px!important;text-align:left!important;white-space:normal!important;min-width:0!important}
  .table-batch td::before{display:block!important;content:attr(data-label)!important;position:static!important;width:auto!important;height:auto!important;clip:auto!important;overflow:visible!important;font-weight:700!important;color:#5c6377!important}
  .table-batch td>*{min-width:0}.table-batch td.col-aksi{align-items:center!important}.table-batch td.col-aksi .btn{justify-self:start}
}

/* Admin — desktop centered, mobile horizontal tables instead of broken pseudo cards */
body.admin .adm-content{max-width:var(--v94-admin)!important;margin-inline:auto!important}
.admin .adm-panel{overflow:hidden}
.admin .table-wrap{max-width:100%;overflow-x:auto!important;-webkit-overflow-scrolling:touch}
.admin table.data{display:table!important;width:100%!important;min-width:780px!important;border-collapse:collapse!important}
.admin table.data thead{display:table-header-group!important;position:static!important;width:auto!important;height:auto!important;clip:auto!important;overflow:visible!important}
.admin table.data tbody{display:table-row-group!important}.admin table.data tr{display:table-row!important}.admin table.data th,.admin table.data td{display:table-cell!important}
.admin .toolbar,.admin .adm-filter{flex-wrap:wrap!important}
.admin .form-row{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important}

@media(max-width:1024px){
  .contact-layout{grid-template-columns:1fr!important}.sidebar{position:static!important}
  .learn-layout{grid-template-columns:1fr!important}.learn-nav{position:static!important;max-height:none!important}
  .filterbar,.lms-filter,.catalog-filter{grid-template-columns:1fr 1fr!important}
}
@media(max-width:760px){
  .container,.narrow{width:calc(100% - 28px)!important}
  section{padding-block:36px!important}
  .page-hero{padding-block:36px 30px!important}.page-hero .container{text-align:center!important}.page-hero h1,.page-hero p{margin-inline:auto}
  .payment-methods,.payment-summary{grid-template-columns:1fr!important}
  .filterbar,.lms-filter,.catalog-filter{grid-template-columns:1fr!important;padding:12px!important}
  .filterbar .btn,.lms-filter .btn,.catalog-filter .btn{width:100%!important}
  .learn-main{padding:16px!important}.learn-foot{display:grid!important;grid-template-columns:1fr!important}.learn-foot>a,.learn-foot .btn,.learn-foot-right,.learn-foot-right .btn{width:100%!important}.learn-foot-right{display:grid!important;grid-template-columns:1fr!important}
  .dash{padding-block:30px 42px!important}.dash-head{text-align:center!important;align-items:center!important}.dash-head .eyebrow{text-align:center!important}.dash-actions{justify-content:center!important}
  .stats.stats-sm{grid-template-columns:repeat(2,minmax(0,1fr))!important}.lms-steps{grid-template-columns:1fr 1fr!important}
  .lms-subnav-in{padding-inline:14px!important}
  body.admin .adm-content{padding:14px!important}.admin .adm-panel{border-radius:12px!important}.admin table.data{min-width:720px!important;font-size:.84rem!important}
  .admin .toolbar,.admin .adm-filter{align-items:stretch!important;flex-direction:column!important}.admin .toolbar>*,.admin .adm-filter>*{width:100%!important;max-width:none!important}
}
@media(max-width:480px){
  .container,.narrow{width:calc(100% - 24px)!important}
  .site-header .brand-text small{display:none!important}.site-header .brand-logo{max-height:32px!important}
  .stats.stats-sm,.lms-steps{grid-template-columns:1fr!important}
  .lms-subnav-in{gap:4px!important}.lms-subnav-in>a{padding:8px 9px!important;font-size:.8rem!important}
  .dash .lms-nav{padding:6px!important}.dash .lms-nav-item{font-size:.82rem;padding:8px 10px!important}
  .form-card,.panel{padding:16px!important}.fieldset-pay{padding:14px!important}
  .wa-float{max-width:calc(100vw - 24px);right:12px!important;bottom:12px!important}
}
