/* STODA RC7.1.27 · Production Readiness P0
 * Last-loaded stabilization layer. It intentionally does not consolidate the
 * historical CSS stack; that refactor is deferred until after P0 UAT.
 */

/* ---------- BAN detail ---------- */
.r727-ban-stepper{margin-bottom:14px}
.r727-ban-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px}
.r727-ban-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:10px;margin-bottom:10px}
.r727-capability-list{display:grid;gap:0}
.r727-capability-list>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--s-line-soft,#edf1f5)}
.r727-capability-list>div:last-child{border-bottom:0}
.r727-capability-list span{font-size:12px;color:var(--s-muted,#6f8093)}
.r727-capability-list b{font-size:12px}.r727-capability-list .ok{color:#16865b}.r727-capability-list .warn{color:#b66b00}.r727-capability-list .muted{color:#7b8a9a}
.r727-ban-note{margin:8px 0 0;padding:8px 10px;border-radius:10px;background:#f7f9fc;color:#536a82;font-size:12px;line-height:1.5}
.r727-ban-table{min-width:720px}.r727-ban-table td small{display:block;margin-top:3px;color:var(--s-muted,#738397)}
.r727-doc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.r727-doc-card{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;border:1px solid var(--s-line-soft,#e8edf3);border-radius:12px;background:#fbfdff}
.r727-doc-card b,.r727-doc-card small{display:block}.r727-doc-card small{margin-top:3px;color:var(--s-muted,#738397);font-size:12px}
.r727-attachment-row{align-items:center}.r727-attachment-row>.sv2-btn{flex:0 0 auto}
.r727-approval-list{display:grid;gap:0}.r727-approval-item{display:grid;grid-template-columns:14px minmax(0,1fr);gap:10px;padding:10px 0;border-bottom:1px solid var(--s-line-soft,#edf1f5)}.r727-approval-item:last-child{border-bottom:0}
.r727-timeline-dot{width:10px;height:10px;margin-top:5px;border-radius:50%;background:#2457f5;box-shadow:0 0 0 4px #edf2ff}
.r727-approval-head{display:flex;justify-content:space-between;gap:12px}.r727-approval-head strong{font-size:13px}.r727-approval-head span,.r727-approval-item small{color:var(--s-muted,#738397);font-size:11px}.r727-approval-item p{margin:5px 0 0;color:#445c75;font-size:12px;line-height:1.5}
.r727-workflow-actions{display:grid;gap:10px}.r727-checklist{display:grid!important;gap:8px!important;font-size:12px!important}.r727-checklist label{display:flex;align-items:center;gap:8px}.r727-align-end{display:flex;align-items:end}

/* ---------- Notification settings ---------- */
.r727-notification-tabs{display:flex;gap:6px;margin:0 0 12px}.r727-notification-tabs a{display:inline-flex;align-items:center;min-height:38px;padding:0 12px;border:1px solid var(--s-line,#dfe7ef);border-radius:10px;background:#fff;color:#29445f;font-size:12px;font-weight:750;text-decoration:none}.r727-notification-tabs a:hover{background:#f5f8fc}
.r727-notification-row{width:100%;text-align:left;background:transparent;border:0;cursor:pointer}.r727-notification-row.unread{background:var(--s-blue-soft,#edf5ff)}
.r727-notification-settings{display:grid;gap:12px;margin-top:20px;scroll-margin-top:12px}.r727-settings-form{display:grid;gap:16px}.r727-channel-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.r727-toggle-card{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid var(--s-line,#dfe7ef);border-radius:12px;background:#fff;cursor:pointer}.r727-toggle-card.locked{background:#f7f9fb;cursor:default}.r727-toggle-card input{flex:0 0 auto;width:18px;height:18px;margin-top:1px}.r727-toggle-card strong,.r727-toggle-card small{display:block}.r727-toggle-card strong{font-size:13px;color:#203d59}.r727-toggle-card small{margin-top:3px;font-size:11px;line-height:1.4;color:var(--s-muted,#738397)}
.r727-settings-title{font-size:12px;font-weight:800;color:#354f69;text-transform:uppercase;letter-spacing:.05em}.r727-category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.r727-category-item{display:flex;align-items:center;gap:8px;min-height:42px;padding:8px 10px;border:1px solid var(--s-line,#dfe7ef);border-radius:10px;background:#fff;font-size:12px;font-weight:700;color:#36506a}.r727-category-item input{width:18px;height:18px}.r727-settings-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:4px}.r727-device-row{align-items:center}.r727-device-row form{flex:0 0 auto}

/* ---------- Minimum readable control typography ---------- */
.sv2-field input,.sv2-field select,.sv2-field textarea,.s-field input,.s-field select,.s-field textarea,
.sv2-search input,.s-search input{font-size:14px}

/* Manager surfaces carried very small hardcoded text in legacy visual patches.
 * Raise decision-support text without changing layout architecture. */
.ma721-dashboard small,.ma721-dashboard em,.ma721-dashboard p,.ma721-dashboard th,.ma721-dashboard td,
.ma721-dashboard .ma721-see-all,.ma721-dashboard .ma721-axis,
.dt-head p,.dt-filter-form label>span,.dt-table th,.dt-table td,.dt-table td>small,.dt-table td>em,
.dt-pill,.dt-severity,.dt-site-link small,.dt-site-link em,.dt-domain-row small,.dt-finding-list small,
.ma722-profile small,.ma722-profile dt,.ma722-profile dd,.ma722-profile li,.ma722-profile time,
.ma722-profile .ma722-btn,.ma722-profile .ma722-action,.ma722-profile .ma722-tabs>button,.ma722-profile .ma722-more-trigger,.ma722-profile .ma722-more-menu button{
  font-size:11px!important;
  line-height:1.4!important;
}
.ma721-dashboard h2,.dt-panel-head h2,.dt-side-card h3,.ma722-profile h3{font-size:14px!important;line-height:1.3!important}
.dt-filter-form input,.dt-filter-form select{font-size:14px!important}

/* ---------- Mobile: iOS no-auto-zoom + readable cards ---------- */
@media(max-width:900px){
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body.stoda-v2{font-size:14px}
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea{
    font-size:16px!important;
  }
  .sv2-btn,.ma722-btn,.ma722-action,.dt-mobile-actions .sv2-btn{font-size:12px!important;line-height:1.25!important}
  .sv2-chip,[data-status],.dt-pill,.dt-severity{font-size:11px!important;line-height:1.25!important}
  .sv2-card-caption,.s-list-row small,.s-kpi-label,.sv2-field>label,.s-field>label{font-size:12px!important;line-height:1.4!important}
  .sv2-content p,.sv2-content li,.sv2-content label,.sv2-content th,.sv2-content td{font-size:12px;line-height:1.45}
  .sv2-content small,.sv2-content .sv2-card-caption,.sv2-content .s-list-row small{font-size:12px!important;line-height:1.45!important}
  .sv2-page-subtitle,.sv2-card-body>p,.sv2-hub-card p{font-size:13px!important;line-height:1.5!important}

  .ma721-dashboard small,.ma721-dashboard em,.ma721-dashboard p,.ma721-dashboard th,.ma721-dashboard td,
  .ma721-dashboard .ma721-see-all,.ma721-dashboard .ma721-axis,
  .dt-head p,.dt-filter-form label>span,.dt-mobile-site small,.dt-mobile-domain small,.dt-mobile-domain strong,
  .dt-mobile-card>p,.dt-mobile-metrics small,.dt-mobile-metrics b,.dt-status-card small,
  .ma722-profile small,.ma722-profile dt,.ma722-profile dd,.ma722-profile li,.ma722-profile time,
  .ma722-profile .ma722-location,.ma722-profile .ma722-severity,.ma722-profile .ma722-status,
  .ma722-profile .ma722-more-menu button{
    font-size:12px!important;
    line-height:1.45!important;
  }
  .ma721-dashboard h2,.dt-panel-head h2,.dt-side-card h3,.ma722-profile h3{font-size:15px!important}
  .ma722-title-line h1{font-size:17px!important}
  .ma722-mobile-mini-metrics small{font-size:11px!important}.ma722-mobile-mini-metrics b{font-size:12px!important}

  .r727-ban-summary{grid-template-columns:1fr 1fr}
  .r727-ban-grid{grid-template-columns:1fr}
  .r727-doc-grid{grid-template-columns:1fr}
  .r727-doc-card{grid-template-columns:38px minmax(0,1fr)}.r727-doc-card>.sv2-btn,.r727-doc-card>.sv2-chip{grid-column:2;justify-self:start}
  .r727-channel-grid{grid-template-columns:1fr}.r727-category-grid{grid-template-columns:1fr 1fr}.r727-settings-actions{justify-content:stretch}.r727-settings-actions .sv2-btn{width:100%;justify-content:center}
  .r727-device-row{align-items:flex-start;flex-wrap:wrap}.r727-device-row form{width:100%}.r727-device-row form .sv2-btn{width:100%;justify-content:center}
}

@media(max-width:480px){
  .r727-category-grid{grid-template-columns:1fr}
  .r727-ban-summary{grid-template-columns:1fr 1fr}
}
.r727-hub-subnav{display:flex;gap:6px;flex-wrap:wrap;margin:-4px 0 14px}.r727-hub-subnav a{display:inline-flex!important;align-items:center;gap:6px;min-height:38px;padding:0 11px!important;border:1px solid var(--s-line,#dfe7ef);border-radius:10px;background:#fff;color:#4b6178!important;font-size:12px!important;text-decoration:none}.r727-hub-subnav a.active{background:#edf5ff;color:#145ecb!important;border-color:#c8dcf7}.r727-hub-subnav .sv2-icon{width:15px;height:15px}


/* ---------- Global Laravel paginator root fix ---------- */
/* =========================================================================
   1. PAGINASI
   Struktur DOM pada resources/views/vendor/pagination/stoda.blade.php sengaja
   meniru view Tailwind bawaan, sehingga patch lama .dt-pagination dan
   .r720-pagination tetap berlaku persis seperti sebelumnya. Blok di bawah ini
   hanya memberi gaya dasar untuk paginator yang TIDAK berada di dalam kedua
   pembungkus tersebut (BAN, Tasks, Audit Trail, Notifikasi).
   ========================================================================= */
nav.s-pg { margin: 14px 0 4px; color: #6d7f92; }
nav.s-pg .s-pg-compact { display: none; }
nav.s-pg .s-pg-full { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
nav.s-pg .s-pg-summary { margin: 0; font-size: 12px; color: var(--s-muted, #718096); }
nav.s-pg .s-pg-summary strong { color: var(--s-ink, #0b1f3a); font-weight: 800; }
nav.s-pg .s-pg-list { display: inline-flex; align-items: center; border: 1px solid var(--s-line, #e5ebf3); border-radius: 11px; overflow: hidden; background: #fff; }
nav.s-pg .s-pg-page,
nav.s-pg .s-pg-nav,
nav.s-pg .s-pg-gap {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; height: 36px; padding: 0 10px;
  font-size: 12px; font-weight: 800; line-height: 1;
  color: var(--s-ink, #0b1f3a); text-decoration: none;
  border-right: 1px solid var(--s-line-soft, #eef3f9); background: #fff;
}
nav.s-pg .s-pg-list > :last-child { border-right: 0; }
nav.s-pg .s-pg-page:hover,
nav.s-pg .s-pg-nav:hover { background: var(--s-blue-soft, #edf5ff); }
nav.s-pg .s-pg-page.is-current { background: var(--s-blue, #0968f5); color: #fff; }
nav.s-pg .is-disabled { color: #9aa8b7; background: #f7f9fb; cursor: default; }
nav.s-pg .s-pg-gap { color: #9aa8b7; }

@media (max-width: 820px) {
  /* Deret nomor halaman tidak muat dan tidak berguna di layar sempit. */
  nav.s-pg .s-pg-full { display: none; }
  nav.s-pg .s-pg-compact { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
  nav.s-pg .s-pg-btn {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 44px; padding: 0 16px;
    border: 1px solid var(--s-line, #e5ebf3); border-radius: 12px; background: #fff;
    color: var(--s-ink, #0b1f3a); font-size: 13px; font-weight: 800; text-decoration: none;
  }
  nav.s-pg .s-pg-btn.is-disabled { color: #9aa8b7; background: #f7f9fb; }
  nav.s-pg .s-pg-position { font-size: 12px; font-weight: 800; color: var(--s-muted, #718096); }
}



/* ---------- CRM compare tables ---------- */
/* =========================================================================
   3. TABEL .sv2-compare
   Kelas ini dipakai crm/tenants-v2, crm/contracts/index, dan crm/bapt/index-v2
   tetapi TIDAK PERNAH didefinisikan di stylesheet mana pun, sehingga ketiga
   halaman itu menampilkan tabel HTML mentah tanpa gaya.
   ========================================================================= */
.sv2-compare { width: 100%; border-collapse: collapse; }
.sv2-compare thead th {
  text-align: left; background: #f8fafc; color: #687b90;
  font-size: 10px; text-transform: uppercase; letter-spacing: .04em; font-weight: 900;
  padding: 10px 12px; border-bottom: 1px solid var(--s-line, #e5ebf3); white-space: nowrap;
}
.sv2-compare tbody td {
  padding: 11px 12px; border-bottom: 1px solid var(--s-line-soft, #eef3f9);
  vertical-align: top; color: var(--s-ink, #0b1f3a); font-size: 12px; line-height: 1.45;
}
.sv2-compare tbody tr:last-child td { border-bottom: 0; }
.sv2-compare tbody tr:hover td { background: #fbfdff; }
.sv2-compare tfoot td {
  padding: 11px 12px; border-top: 2px solid var(--s-line, #e5ebf3);
  font-size: 12px; color: var(--s-ink, #0b1f3a); background: #fbfdff;
}
.sv2-compare small { display: block; margin-top: 3px; color: var(--s-muted, #718096); font-size: 11px; }


.r727-notification-tabs a.active{background:#edf5ff;color:#145ecb;border-color:#c8dcf7}