/* CLENA SPORTS • CONFIGURAÇÕES
   Modelo visual unificado com sports/agenda.html.
   Camada exclusivamente visual/responsiva. */

:root{
  --cfg-ink:#241b15;
  --cfg-muted:#60544b;
  --cfg-line:#e9dfd6;
  --cfg-line-strong:#d9ccc0;
  --cfg-paper:#fff;
  --cfg-soft:#fffaf6;
  --cfg-accent:#b83b0c;
  --cfg-accent-dark:#9a3412;
  --cfg-orange-soft:#fff0e2;
  --cfg-green:#166534;
  --cfg-green-soft:#edf8f0;
  --cfg-warn:#8a4505;
  --cfg-warn-soft:#fff5df;
  --cfg-purple:#6e46b6;
  --cfg-purple-soft:#f3edfc;
  --cfg-red:#a71931;
  --cfg-red-soft:#fff0f2;
  --cfg-shadow:0 14px 42px rgb(81 43 18 / 7%);
}

html{font-size:16px!important}
body{background:linear-gradient(180deg,#fffaf6,#fff 760px)!important;color:var(--cfg-ink)!important;overflow-x:hidden!important}
.ambient{display:none!important}

/* Cabeçalho */
.config-page.page{padding:28px 0 56px!important}
.config-page .page-top{align-items:center!important;gap:28px!important;margin-bottom:22px!important}
.config-page .page-kicker.kicker{font-size:1rem!important;line-height:1.5!important;letter-spacing:.045em!important;color:var(--cfg-accent)!important}
.config-page .page-top h1{font-size:clamp(1.875rem,2.6vw,2.75rem)!important;line-height:1.15!important;letter-spacing:-.04em!important;margin:10px 0 12px!important;color:var(--cfg-ink)!important}
.config-page .page-top p{font-size:1.0625rem!important;line-height:1.65!important;color:var(--cfg-muted)!important;max-width:78ch!important}
.config-page .page-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:10px!important;flex-wrap:wrap!important}

/* Resumo: idêntico à linguagem da Agenda */
.config-stats.stats-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;margin:0 0 22px!important}
.config-stats .stat-card{min-width:0!important;min-height:110px!important;padding:18px!important;display:grid!important;grid-template-columns:44px minmax(0,1fr)!important;grid-template-rows:auto auto auto!important;align-content:center!important;column-gap:13px!important;border:1px solid var(--cfg-line)!important;border-radius:16px!important;background:#fff!important;box-shadow:none!important}
.config-stats .stat-head{grid-row:1/4!important;align-self:center!important;display:flex!important;align-items:center!important}
.config-stats .stat-icon{width:44px!important;height:44px!important;display:grid!important;place-items:center!important;border:1px solid #f0d2bc!important;border-radius:12px!important;background:#fff2e8!important;color:var(--cfg-accent)!important;font-size:20px!important}
.config-stats .stat-icon.green{color:var(--cfg-green)!important;background:var(--cfg-green-soft)!important;border-color:#cce5d5!important}
.config-stats .stat-icon.warn{color:var(--cfg-warn)!important;background:var(--cfg-warn-soft)!important;border-color:#edcd91!important}
.config-stats .stat-icon.purple{color:var(--cfg-purple)!important;background:var(--cfg-purple-soft)!important;border-color:#ddcdf3!important}
.config-stats .stat-dot{display:none!important}
.config-stats .stat-card>small{grid-column:2!important;grid-row:1!important;font-size:1rem!important;line-height:1.35!important;font-weight:550!important;letter-spacing:0!important;text-transform:none!important;color:var(--cfg-muted)!important}
.config-stats .stat-card>strong{grid-column:2!important;grid-row:2!important;margin-top:4px!important;font-size:clamp(1.45rem,1.7vw,1.875rem)!important;line-height:1.2!important;letter-spacing:-.035em!important;font-weight:750!important;color:var(--cfg-ink)!important;overflow-wrap:anywhere!important}
.config-stats .stat-card>p{grid-column:2!important;grid-row:3!important;margin:4px 0 0!important;font-size:1rem!important;line-height:1.35!important;color:var(--cfg-muted)!important}

/* Grade principal */
.config-grid{display:grid!important;grid-template-columns:minmax(360px,.75fr) minmax(0,1.55fr)!important;gap:16px!important;align-items:start!important}
.left-column,.right-column{display:grid!important;gap:16px!important;min-width:0!important}
.panel{min-width:0!important;border:1px solid var(--cfg-line)!important;border-radius:20px!important;background:#fff!important;box-shadow:var(--cfg-shadow)!important;overflow:hidden!important}
.panel-head{min-height:76px!important;padding:14px 18px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;border-bottom:1px solid var(--cfg-line)!important;background:#fff!important}
.panel-title{display:flex!important;align-items:center!important;gap:12px!important;min-width:0!important}
.panel-icon{width:44px!important;height:44px!important;flex:0 0 44px!important;display:grid!important;place-items:center!important;border:1px solid #f0d2bc!important;border-radius:12px!important;background:#fff2e8!important;color:var(--cfg-accent)!important;font-size:19px!important}
.panel-icon.mp{background:linear-gradient(135deg,#f06d2f,#b83b0c)!important;color:#fff!important;border-color:#b83b0c!important}
.panel-title h2{margin:0!important;font-size:1.25rem!important;line-height:1.3!important;letter-spacing:-.02em!important;color:var(--cfg-ink)!important}
.panel-title p{margin:4px 0 0!important;font-size:1rem!important;line-height:1.45!important;color:var(--cfg-muted)!important}
.panel-body{padding:18px!important;background:#fff!important}

/* Status */
.status-pill,.realtime-chip{display:inline-flex!important;align-items:center!important;gap:7px!important;min-height:34px!important;padding:6px 10px!important;border:1px solid var(--cfg-line-strong)!important;border-radius:9px!important;background:#fffaf6!important;color:#655247!important;font-size:1rem!important;line-height:1.3!important;font-weight:650!important;white-space:normal!important}
.status-pill.connected,.realtime-chip.live,.realtime-chip.connected{border-color:#bedec9!important;background:var(--cfg-green-soft)!important;color:var(--cfg-green)!important}
.status-pill i,.realtime-chip i{font-size:8px!important}

/* Mercado Pago */
.mp-status{margin-bottom:16px!important;padding:14px!important;border:1px solid var(--cfg-line)!important;border-radius:12px!important;background:#fffaf6!important}
.mp-status.connected{border-color:#bedec9!important;background:var(--cfg-green-soft)!important}
.mp-status-copy{display:flex!important;align-items:center!important;gap:11px!important}
.mp-status-icon{width:40px!important;height:40px!important;flex:0 0 40px!important;display:grid!important;place-items:center!important;border:1px solid #e5d8ce!important;border-radius:10px!important;background:#fff!important;color:#705342!important;font-size:17px!important}
.mp-status-copy b{display:block!important;font-size:1rem!important;line-height:1.4!important;color:var(--cfg-ink)!important}
.mp-status-copy small{display:block!important;margin-top:3px!important;font-size:1rem!important;line-height:1.45!important;color:var(--cfg-muted)!important}
.field{display:grid!important;gap:6px!important;margin-top:14px!important}
.field>span{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;font-size:1rem!important;line-height:1.4!important;font-weight:650!important;color:#514135!important}
.field>span small{font-size:.875rem!important;color:var(--cfg-muted)!important}
.input{min-height:48px!important;display:flex!important;align-items:center!important;border:1px solid #d6c5b7!important;border-radius:10px!important;background:#fff!important;overflow:hidden!important}
.input>i{width:42px!important;flex:0 0 42px!important;text-align:center!important;color:#755645!important;font-size:18px!important}
.input input{height:46px!important;min-width:0!important;flex:1!important;border:0!important;background:transparent!important;color:var(--cfg-ink)!important;font-size:1rem!important}
.input input:focus{outline:none!important}
.eye{width:46px!important;height:46px!important;display:grid!important;place-items:center!important;border:0!important;background:transparent!important;color:#73594a!important;font-size:18px!important}
.field-help{font-size:.9375rem!important;line-height:1.55!important;color:var(--cfg-muted)!important}
.mp-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin-top:16px!important}
.mp-actions .disconnect{grid-column:1/-1!important}
.security-note{margin-top:12px!important;padding:12px!important;display:flex!important;align-items:flex-start!important;gap:9px!important;border:1px solid #bedec9!important;border-radius:11px!important;background:var(--cfg-green-soft)!important;color:var(--cfg-green)!important;font-size:.9375rem!important;line-height:1.55!important}
.security-note i{margin-top:3px!important}

/* Link público */
.public-link-card{padding:16px!important;border:1px solid #efd2bd!important;border-radius:13px!important;background:#fff8f2!important}
.public-link-card h3{margin:0!important;font-size:1.125rem!important;line-height:1.35!important;color:var(--cfg-ink)!important}
.public-link-card p{margin:7px 0 14px!important;font-size:1rem!important;line-height:1.55!important;color:var(--cfg-muted)!important}
.link-row{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important}
.link-row input{min-width:0!important;height:48px!important;padding:0 12px!important;border:1px solid #d6c5b7!important;border-radius:10px!important;background:#fff!important;color:#49392f!important;font-size:1rem!important}
.link-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin-top:8px!important}

/* Pagamentos */
.payments-panel{min-height:600px!important}
.payments-panel .panel-body{padding:0!important}
.table-tools{display:grid!important;grid-template-columns:minmax(240px,1.4fr) minmax(150px,.65fr) minmax(145px,.55fr) minmax(145px,.55fr) auto!important;gap:10px!important;padding:14px 16px!important;border-bottom:1px solid var(--cfg-line)!important;background:#fffaf6!important}
.table-tools .search{height:48px!important;width:100%!important;display:flex!important;align-items:center!important;border:1px solid #d6c5b7!important;border-radius:10px!important;background:#fff!important;overflow:hidden!important}
.table-tools .search i{width:42px!important;flex:0 0 42px!important;text-align:center!important;color:#6c5445!important;font-size:18px!important}
.table-tools .search input{height:46px!important;min-width:0!important;flex:1!important;border:0!important;background:transparent!important;color:var(--cfg-ink)!important;font-size:1rem!important}
.table-tools .search input::placeholder{color:#706357!important;opacity:1!important}
.filter{width:100%!important;min-width:0!important;height:48px!important;padding:0 10px!important;border:1px solid #d6c5b7!important;border-radius:10px!important;background:#fff!important;color:var(--cfg-ink)!important;font-size:1rem!important}
.export-btn{height:48px!important}
.table-wrap{position:relative!important;width:100%!important;max-width:100%!important;min-height:410px!important;overflow:auto!important;overscroll-behavior-x:contain!important;background:#fff!important}
.payments-table{width:100%!important;min-width:950px!important;border-collapse:collapse!important}
.payments-table th{position:sticky!important;top:0!important;z-index:2!important;padding:13px 14px!important;border-bottom:1px solid var(--cfg-line)!important;background:#fbf5ef!important;color:#584637!important;font-size:1rem!important;line-height:1.4!important;text-align:left!important;white-space:nowrap!important}
.payments-table td{padding:13px 14px!important;border-bottom:1px solid var(--cfg-line)!important;color:#40332c!important;font-size:1rem!important;line-height:1.45!important;vertical-align:middle!important}
.table-main{display:block!important;font-size:1rem!important;color:var(--cfg-ink)!important}
.table-sub{display:block!important;margin-top:3px!important;font-size:.9375rem!important;color:var(--cfg-muted)!important}
.payment-status{display:inline-flex!important;align-items:center!important;gap:6px!important;min-height:30px!important;padding:5px 8px!important;border-radius:8px!important;font-size:.9375rem!important;line-height:1.25!important;font-weight:650!important;text-transform:none!important;letter-spacing:0!important}
.table-actions{display:flex!important;justify-content:flex-end!important;gap:6px!important}
.table-action{width:38px!important;height:38px!important;display:grid!important;place-items:center!important;border:1px solid var(--cfg-line)!important;border-radius:9px!important;background:#fff!important;color:#654838!important;font-size:16px!important}
.table-empty{position:absolute!important;inset:0!important;display:grid!important;place-items:center!important;padding:32px!important;background:#fff!important}
.table-empty.hidden{display:none!important}
.table-empty>div{text-align:center!important;max-width:520px!important}
.table-empty i{font-size:36px!important;color:var(--cfg-accent)!important;margin-bottom:10px!important}
.table-empty b{display:block!important;font-size:1.25rem!important;line-height:1.35!important;color:var(--cfg-ink)!important}
.table-empty small{display:block!important;margin-top:6px!important;font-size:1rem!important;line-height:1.5!important;color:var(--cfg-muted)!important}
.table-footer{min-height:64px!important;padding:10px 14px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;border-top:1px solid var(--cfg-line)!important;background:#fff!important}
.table-footer>small{font-size:1rem!important;color:var(--cfg-muted)!important}
.pager{display:flex!important;align-items:center!important;gap:5px!important}
.pager button{min-width:40px!important;height:40px!important;border:1px solid var(--cfg-line)!important;border-radius:9px!important;background:#fff!important;color:#604638!important;font-size:1rem!important}
.pager button.active{background:var(--cfg-accent)!important;border-color:var(--cfg-accent)!important;color:#fff!important}

/* Modal de pagamento */
.modal{padding:24px!important;align-items:center!important;justify-content:center!important}
.modal-bg{background:rgb(36 27 21 / 42%)!important;backdrop-filter:blur(4px)!important}
.modal-card{width:min(96vw,820px)!important;max-height:calc(100dvh - 48px)!important;border:1px solid var(--cfg-line)!important;border-radius:20px!important;background:#fff!important;box-shadow:0 24px 70px rgb(36 27 21 / 18%)!important;overflow:hidden!important}
.modal-head{min-height:76px!important;padding:14px 18px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;border-bottom:1px solid var(--cfg-line)!important;background:#fff!important}
.modal-title{display:flex!important;align-items:center!important;gap:12px!important;min-width:0!important}
.modal-title-icon{width:44px!important;height:44px!important;flex:0 0 44px!important;display:grid!important;place-items:center!important;border-radius:12px!important;background:#fff2e8!important;color:var(--cfg-accent)!important;font-size:19px!important}
.modal-title h3{margin:0!important;font-size:1.375rem!important;line-height:1.3!important;color:var(--cfg-ink)!important}
.modal-title p{margin:4px 0 0!important;font-size:1rem!important;line-height:1.4!important;color:var(--cfg-muted)!important}
.modal-close{width:42px!important;height:42px!important;display:grid!important;place-items:center!important;border:1px solid var(--cfg-line)!important;border-radius:11px!important;background:#fff!important;color:#4d3d33!important;font-size:18px!important}
.modal-body{max-height:calc(100dvh - 190px)!important;padding:18px!important;overflow-y:auto!important;overscroll-behavior:contain!important;background:#fff!important}
.modal-footer{min-height:72px!important;padding:12px 16px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;flex-wrap:wrap!important;border-top:1px solid var(--cfg-line)!important;background:#fff!important}
.modal-footer>small{font-size:1rem!important;line-height:1.45!important;color:var(--cfg-muted)!important}
.footer-actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
.detail-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
.detail-card,.detail-item{padding:12px!important;border:1px solid var(--cfg-line)!important;border-radius:11px!important;background:#fffaf6!important}
.detail-card span,.detail-item span{font-size:.9375rem!important;color:var(--cfg-muted)!important}
.detail-card b,.detail-item b{display:block!important;margin-top:4px!important;font-size:1rem!important;line-height:1.45!important;color:var(--cfg-ink)!important}
.detail-qr{display:grid!important;place-items:center!important;padding:16px!important;border:1px solid var(--cfg-line)!important;border-radius:13px!important;background:#fff!important}
.detail-qr img{max-width:250px!important;width:100%!important;height:auto!important}
.detail-qr-empty{font-size:1rem!important;color:var(--cfg-muted)!important}

/* Feedback e drawer */
.drawer-panel{background:#fff!important;color:var(--cfg-ink)!important}
.drawer-head{border-bottom:1px solid var(--cfg-line)!important}
.drawer-nav a{min-height:50px!important;font-size:1rem!important;border-radius:10px!important}
.drawer-nav a.active,.drawer-nav a:hover{background:#fff0e2!important;color:var(--cfg-accent)!important}
.toast{font-size:1rem!important}

/* Responsividade */
@media(max-width:1280px){
  .config-stats.stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .config-grid{grid-template-columns:minmax(330px,.85fr) minmax(0,1.35fr)!important}
  .table-tools{grid-template-columns:minmax(230px,1.2fr) minmax(150px,.7fr) repeat(2,minmax(140px,.65fr))!important}
  .table-tools .export-btn{grid-column:1/-1!important;justify-self:end!important}
}
@media(max-width:1000px){
  .config-page .page-top{align-items:flex-start!important}
  .config-page .page-actions{width:100%!important;justify-content:flex-start!important}
  .config-grid{grid-template-columns:1fr!important}
  .left-column{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .payments-panel{min-height:560px!important}
}
@media(max-width:760px){
  .config-page{padding-top:20px!important}
  .config-page .page-top{display:grid!important;gap:18px!important}
  .config-page .page-top h1{font-size:1.875rem!important}
  .config-page .page-top p{font-size:1rem!important}
  .config-page .page-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .config-page .page-actions .btn{width:100%!important}
  .config-stats.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  .config-stats .stat-card{min-height:96px!important;padding:13px!important;grid-template-columns:38px minmax(0,1fr)!important;column-gap:10px!important}
  .config-stats .stat-icon{width:38px!important;height:38px!important;font-size:17px!important}
  .config-stats .stat-card>strong{font-size:1.45rem!important}
  .left-column{grid-template-columns:1fr!important}
  .panel{border-radius:16px!important}
  .panel-head{padding:12px 14px!important}
  .panel-body{padding:14px!important}
  .mp-actions,.link-actions{grid-template-columns:1fr!important}
  .mp-actions .disconnect{grid-column:auto!important}
  .link-row{grid-template-columns:1fr!important}
  .table-tools{grid-template-columns:1fr!important;padding:12px!important}
  .table-tools .export-btn{grid-column:auto!important;width:100%!important;justify-self:stretch!important}
  .table-wrap{min-height:380px!important}
  .modal{padding:0!important;align-items:flex-end!important}
  .modal-card{width:100%!important;max-width:100%!important;max-height:96dvh!important;border-radius:20px 20px 0 0!important;border-left:0!important;border-right:0!important;border-bottom:0!important}
  .modal-head{padding:12px 14px!important}
  .modal-body{max-height:calc(96dvh - 170px)!important;padding:14px!important}
  .modal-footer{padding:10px 12px!important}
  .footer-actions{width:100%!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .footer-actions .btn{width:100%!important}
  .detail-grid{grid-template-columns:1fr!important}
}
@media(max-width:430px){
  .config-page .page-actions{grid-template-columns:1fr!important}
  .config-stats.stats-grid{grid-template-columns:1fr!important}
  .config-stats .stat-card{min-height:86px!important}
  .footer-actions{grid-template-columns:1fr!important}
}
@media(prefers-reduced-motion:reduce){
  .panel,.stat-card,.btn{transition:none!important}
}


/* ==========================================================
   FULL-WIDTH PARITY WITH AGENDA / ESPACOS
   Overrides legacy max-width rules embedded in config.html.
   ========================================================== */
.sports-navbar .nav-shell,
main.config-page.page{
  width:calc(100% - 56px)!important;
  max-width:2400px!important;
  margin-inline:auto!important;
}

main.config-page.page{
  padding-left:0!important;
  padding-right:0!important;
}

.config-grid{
  width:100%!important;
  max-width:none!important;
  grid-template-columns:minmax(380px,.72fr) minmax(0,1.55fr)!important;
}

.config-stats.stats-grid,
.config-page .page-top{
  width:100%!important;
  max-width:none!important;
}

@media(max-width:1200px){
  .sports-navbar .nav-shell,
  main.config-page.page{
    width:calc(100% - 40px)!important;
    max-width:none!important;
  }
  .config-grid{
    grid-template-columns:minmax(340px,.78fr) minmax(0,1.35fr)!important;
  }
}

@media(max-width:1000px){
  .config-grid{grid-template-columns:1fr!important}
}

@media(max-width:760px){
  .sports-navbar .nav-shell,
  main.config-page.page{
    width:calc(100% - 24px)!important;
  }
}

@media(max-width:430px){
  .sports-navbar .nav-shell,
  main.config-page.page{
    width:calc(100% - 20px)!important;
  }
}