/* ===== SBL v1.6.6 UI refresh: match approved myITS-like mockup ===== */
:root{
  --sbl-ui-blue:#0b63e5;
  --sbl-ui-blue-dark:#084db3;
  --sbl-ui-blue-soft:#eff6ff;
  --sbl-ui-line:#d9e5f2;
  --sbl-ui-line-2:#e7eef7;
  --sbl-ui-text:#1e293b;
  --sbl-ui-muted:#64748b;
  --sbl-ui-bg:#f8fbff;
  --sbl-ui-shadow:0 8px 28px rgba(15, 40, 80, 0.06);
}

.sbl-container{
  max-width:1180px !important;
  padding:20px 18px 28px !important;
  font-family: Inter, "Segoe UI", Roboto, Arial, sans-serif !important;
  color:var(--sbl-ui-text);
}

.sbl-card{
  background:#fff !important;
  border:1px solid var(--sbl-ui-line-2) !important;
  border-radius:20px !important;
  box-shadow:var(--sbl-ui-shadow) !important;
}

.sbl-history-card{
  position:relative;
  padding:26px 24px 22px !important;
  overflow:visible !important;
}
.sbl-history-card::before{
  content:"";
  position:absolute;
  left:-1px; right:-1px; top:-1px;
  height:4px;
  border-radius:20px 20px 0 0;
  background:var(--sbl-ui-blue);
}

.sbl-history-title{
  display:flex; align-items:center; gap:14px;
  margin:0 0 4px !important;
  color:#10233e !important;
  font-size:20px !important;
  font-weight:800 !important;
  line-height:1.3;
}
.sbl-history-title-icon{
  width:44px !important; height:44px !important;
  flex:0 0 44px !important;
  border-radius:12px !important;
  color:var(--sbl-ui-blue) !important;
  background:var(--sbl-ui-blue-soft) !important;
  border:1px solid #d6e5fb !important;
  font-size:22px !important;
}
.sbl-history-subtitle{
  margin:0 0 22px !important;
  padding:0 0 18px 58px !important;
  border-bottom:1px solid var(--sbl-ui-line-2) !important;
  color:var(--sbl-ui-muted) !important;
  font-size:14px !important;
  line-height:1.55 !important;
}

.sbl-field-group label,
.sbl-history-filter-field label{
  margin-bottom:8px !important;
  color:#425466 !important;
  font-size:13px !important;
  font-weight:700 !important;
}

.sbl-field-group input,
.sbl-field-group select,
.sbl-field-group textarea,
.sbl-history-filter-field input,
.sbl-history-filter-field select{
  min-height:50px !important;
  padding:12px 16px !important;
  border:1.5px solid #d8e3ef !important;
  border-radius:14px !important;
  box-shadow:none !important;
  color:var(--sbl-ui-text) !important;
  background:#fff !important;
  font-size:15px !important;
}
.sbl-field-group input::placeholder,
.sbl-history-filter-field input::placeholder{color:#94a3b8 !important;}

.sbl-history-filters{
  display:grid !important;
  grid-template-columns:minmax(150px,.88fr) minmax(150px,.88fr) minmax(250px,1.2fr) auto !important;
  gap:14px !important;
  align-items:end !important;
  margin:0 0 16px !important;
}
.sbl-history-filter-actions{
  display:grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap:10px !important;
}

.sbl-btn,
.sbl-history-filter-actions .sbl-btn,
.sbl-bulk-submit{
  min-height:50px !important;
  padding:12px 18px !important;
  border-radius:14px !important;
  border:1px solid transparent !important;
  font-size:15px !important;
  font-weight:700 !important;
  line-height:1.25 !important;
  box-shadow:none !important;
  text-decoration:none !important;
}
.sbl-btn{background:var(--sbl-ui-blue) !important; color:#fff !important;}
.sbl-btn:hover{background:var(--sbl-ui-blue-dark) !important;}
.sbl-btn-outline,
.sbl-history-reset{
  background:#fff !important;
  color:var(--sbl-ui-blue) !important;
  border-color:#9fc0f0 !important;
}
.sbl-btn-outline:hover,
.sbl-history-reset:hover{background:var(--sbl-ui-blue-soft) !important;}

.sbl-bulk-toolbar{
  display:grid !important;
  grid-template-columns:minmax(220px,1.2fr) minmax(220px,260px) auto !important;
  gap:14px !important;
  align-items:center !important;
  margin:0 0 16px !important;
  padding:14px 16px !important;
  border:1px solid var(--sbl-ui-line) !important;
  border-radius:16px !important;
  background:var(--sbl-ui-bg) !important;
}
.sbl-bulk-check-label,
.sbl-bulk-count{
  font-size:14px !important;
  color:#475569 !important;
}
.sbl-bulk-check-label{font-weight:700 !important; display:flex !important; align-items:center; gap:10px;}
.sbl-bulk-submit{min-height:46px !important; padding:10px 18px !important;}
.sbl-bulk-submit[disabled]{opacity:.55 !important; cursor:not-allowed;}

.sbl-history-card input[type="checkbox"]{
  width:22px !important; height:22px !important; accent-color:var(--sbl-ui-blue) !important;
  margin:0 !important; border-radius:6px !important;
}
.sbl-select-all, .sbl-row-select{cursor:pointer;}

.sbl-history-table-wrap{
  width:100% !important;
  overflow:hidden !important;
  border:1px solid var(--sbl-ui-line) !important;
  border-radius:18px !important;
  background:#fff !important;
}
.sbl-history-table{
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  table-layout:fixed !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
}
.sbl-history-table thead{background:#f5f8fc !important;}
.sbl-history-table th,
.sbl-history-table td{
  padding:14px 12px !important;
  min-width:0 !important;
  vertical-align:middle !important;
  border-bottom:1px solid #e9eff6 !important;
  overflow-wrap:anywhere !important;
}
.sbl-history-table th{
  color:#334155 !important;
  font-size:14px !important;
  font-weight:700 !important;
  line-height:1.35 !important;
  text-align:left;
}
.sbl-history-table td{
  color:#334155 !important;
  font-size:15px !important;
  line-height:1.5 !important;
}
.sbl-history-table tbody tr:last-child td{border-bottom:0 !important;}
.sbl-history-table tbody tr:hover{background:#fbfdff !important;}
.sbl-history-table th.sbl-select-col,
.sbl-history-table td.sbl-select-col{width:6% !important;}
.sbl-history-table .sbl-col-name{width:13% !important; font-weight:600;}
.sbl-history-table .sbl-col-nrp{width:13% !important;}
.sbl-history-table .sbl-col-lab{width:18% !important;}
.sbl-history-table .sbl-col-status{width:12% !important;}
.sbl-history-table .sbl-col-time{width:13% !important;}
.sbl-history-table .sbl-col-no-surat{width:8% !important;}
.sbl-history-table .sbl-col-link-surat{width:8% !important;}
.sbl-history-table .sbl-col-action{width:22% !important;}

.sbl-history-table .sbl-col-name,
.sbl-history-table .sbl-col-lab{word-break:break-word; white-space:normal !important;}
.sbl-history-table .sbl-col-status span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:5px 10px !important;
  border-radius:999px !important;
  font-size:12px !important;
  line-height:1.2 !important;
}

.sbl-history-table .sbl-action-group{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  align-items:center !important;
}
.sbl-history-table .sbl-col-action > .sbl-btn,
.sbl-history-table .sbl-action-group .sbl-btn,
.sbl-history-table .sbl-action-group .sbl-wa-btn,
.sbl-wa-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  width:auto !important;
  min-width:0 !important;
  min-height:36px !important;
  padding:8px 12px !important;
  border-radius:10px !important;
  font-size:14px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
  box-shadow:none !important;
}
.sbl-action-kalab{background:var(--sbl-ui-blue) !important; color:#fff !important;}
.sbl-chat-btn{background:#fff !important; color:var(--sbl-ui-blue) !important; border:1px solid #9fc0f0 !important;}
.sbl-wa-btn{background:#fff !important; color:var(--sbl-ui-blue) !important; border:1px solid #9fc0f0 !important; text-decoration:none !important;}
.sbl-wa-btn.disabled{opacity:.45; pointer-events:none;}
.sbl-action-icon{font-size:14px !important; line-height:1 !important;}

/* Tablet and mobile */
@media (max-width: 900px){
  .sbl-container{padding:16px 14px 24px !important;}
  .sbl-history-card{padding:22px 18px 18px !important;}
  .sbl-history-filters{grid-template-columns:1fr 1fr !important;}
  .sbl-history-search-field{grid-column:1 / -1;}
  .sbl-history-filter-actions{grid-column:1 / -1;}
  .sbl-bulk-toolbar{grid-template-columns:1fr !important;}
  .sbl-bulk-count{justify-self:start !important;}

  .sbl-history-table-wrap{overflow:visible !important; border:0 !important; background:transparent !important;}
  .sbl-history-table,
  .sbl-history-table tbody{display:block !important; width:100% !important; min-width:0 !important;}
  .sbl-history-table thead{display:none !important;}
  .sbl-history-table .sbl-history-row{
    position:relative !important;
    display:block !important;
    margin:0 0 14px !important;
    padding:16px !important;
    border:1px solid var(--sbl-ui-line) !important;
    border-radius:18px !important;
    background:#fff !important;
    box-shadow:var(--sbl-ui-shadow) !important;
  }
  .sbl-history-table .sbl-history-row.sbl-row-selected{background:#f4f8ff !important; border-color:#a5c5f1 !important;}
  .sbl-history-table .sbl-history-row td{
    display:grid !important;
    grid-template-columns:110px minmax(0,1fr) !important;
    gap:10px !important;
    padding:6px 0 !important;
    border:0 !important;
    background:transparent !important;
    font-size:15px !important;
  }
  .sbl-history-table .sbl-history-row td::before{
    content:attr(data-label) !important;
    color:#64748b !important;
    font-size:13px !important;
    font-weight:700 !important;
  }
  .sbl-history-table .sbl-history-row td.sbl-select-col{
    display:flex !important;
    flex-direction:row-reverse !important;
    justify-content:flex-end !important;
    align-items:center !important;
    gap:10px !important;
    padding:0 138px 12px 0 !important;
    margin-bottom:6px !important;
    border-bottom:1px solid #edf2f7 !important;
  }
  .sbl-history-table .sbl-history-row td.sbl-select-col::before{
    content:"Pilih pengajuan" !important;
    margin:0 !important;
  }
  .sbl-history-table .sbl-history-row .sbl-col-name{
    padding-top:8px !important;
    font-size:17px !important;
    font-weight:800 !important;
    color:#12263f !important;
  }
  .sbl-history-table .sbl-history-row .sbl-col-status{
    position:absolute !important;
    top:14px !important;
    right:14px !important;
    display:block !important;
    width:auto !important;
    max-width:130px !important;
    padding:0 !important;
  }
  .sbl-history-table .sbl-history-row .sbl-col-status::before{display:none !important;}
  .sbl-history-table .sbl-empty-cell{display:none !important;}
  .sbl-history-table .sbl-col-action{
    display:block !important;
    width:100% !important;
    margin-top:10px !important;
    padding-top:12px !important;
    border-top:1px solid #edf2f7 !important;
  }
  .sbl-history-table .sbl-col-action::before{display:block !important; margin-bottom:10px !important;}
  .sbl-history-table .sbl-action-group{
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
    gap:8px !important;
  }
  .sbl-history-table .sbl-action-group > :first-child{grid-column:auto !important;}
  .sbl-history-table .sbl-col-action > .sbl-btn,
  .sbl-history-table .sbl-action-group .sbl-btn,
  .sbl-history-table .sbl-action-group .sbl-wa-btn{
    width:100% !important;
    min-height:42px !important;
    padding:10px 8px !important;
    font-size:13.5px !important;
  }
}

@media (max-width: 640px){
  .sbl-container{padding:12px 10px 22px !important;}
  .sbl-card{border-radius:18px !important;}
  .sbl-history-card{padding:18px 14px 14px !important;}
  .sbl-history-title{font-size:18px !important; gap:12px !important;}
  .sbl-history-title-icon{width:40px !important; height:40px !important; flex-basis:40px !important;}
  .sbl-history-subtitle{padding-left:0 !important; font-size:13px !important;}
  .sbl-history-filters{grid-template-columns:1fr !important; gap:12px !important;}
  .sbl-history-filter-actions{grid-template-columns:1fr 1fr !important;}
  .sbl-field-group input,
  .sbl-field-group select,
  .sbl-history-filter-field input,
  .sbl-history-filter-field select,
  .sbl-btn,
  .sbl-history-filter-actions .sbl-btn,
  .sbl-bulk-submit{min-height:48px !important; font-size:14px !important;}
  .sbl-bulk-toolbar{padding:12px !important; gap:10px !important;}
  .sbl-bulk-check-label{font-size:13.5px !important;}
  .sbl-history-table .sbl-history-row{padding:14px !important; border-radius:16px !important;}
  .sbl-history-table .sbl-history-row td{grid-template-columns:96px minmax(0,1fr) !important; gap:8px !important; font-size:14px !important;}
  .sbl-history-table .sbl-history-row td::before{font-size:12px !important;}
  .sbl-history-table .sbl-history-row td.sbl-select-col{padding-right:118px !important;}
  .sbl-history-table .sbl-history-row .sbl-col-name{font-size:16px !important;}
  .sbl-history-table .sbl-history-row .sbl-col-status{max-width:112px !important; top:12px !important; right:12px !important;}
  .sbl-history-table .sbl-col-status span{font-size:11px !important; padding:5px 9px !important;}
  .sbl-history-table .sbl-action-group{grid-template-columns:repeat(3, minmax(0,1fr)) !important;}
  .sbl-history-table .sbl-col-action > .sbl-btn,
  .sbl-history-table .sbl-action-group .sbl-btn,
  .sbl-history-table .sbl-action-group .sbl-wa-btn{font-size:13px !important; min-height:40px !important; padding:9px 6px !important;}
}

@media (max-width: 420px){
  .sbl-history-filter-actions{grid-template-columns:1fr 1fr !important;}
  .sbl-history-table .sbl-history-row td.sbl-select-col{padding-right:104px !important;}
  .sbl-history-table .sbl-history-row .sbl-col-status{max-width:98px !important;}
  .sbl-history-table .sbl-action-group{gap:6px !important;}
  .sbl-history-table .sbl-col-action > .sbl-btn,
  .sbl-history-table .sbl-action-group .sbl-btn,
  .sbl-history-table .sbl-action-group .sbl-wa-btn{font-size:12.5px !important;}
  .sbl-action-icon{font-size:13px !important;}
}

/* ===== SBL v1.6.7 action layout correction ===== */
/* All three technician actions use one consistent blue treatment. */
.sbl-history-table .sbl-action-group .sbl-btn,
.sbl-history-table .sbl-action-group .sbl-wa-btn,
.sbl-history-table .sbl-col-action > .sbl-btn,
.sbl-wa-btn {
    background: var(--sbl-ui-blue) !important;
    color: #ffffff !important;
    border: 1px solid var(--sbl-ui-blue) !important;
    text-decoration: none !important;
}

.sbl-history-table .sbl-action-group .sbl-btn:hover,
.sbl-history-table .sbl-action-group .sbl-wa-btn:hover,
.sbl-history-table .sbl-col-action > .sbl-btn:hover,
.sbl-wa-btn:hover {
    background: var(--sbl-ui-blue-dark) !important;
    color: #ffffff !important;
    border-color: var(--sbl-ui-blue-dark) !important;
}

/* Desktop: vertical action stack, neat and compact. */
@media (min-width: 901px) {
    .sbl-history-table .sbl-action-group {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 7px !important;
        width: 100% !important;
    }

    .sbl-history-table .sbl-col-action > .sbl-btn,
    .sbl-history-table .sbl-action-group .sbl-btn,
    .sbl-history-table .sbl-action-group .sbl-wa-btn {
        width: 100% !important;
        min-height: 38px !important;
        padding: 8px 10px !important;
        justify-content: center !important;
    }
}

/* Mobile/tablet: stack KaLab, Chat, WA vertically. */
@media (max-width: 900px) {
    .sbl-history-table .sbl-action-group {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 9px !important;
        width: 100% !important;
    }

    .sbl-history-table .sbl-action-group > :first-child {
        grid-column: auto !important;
    }

    .sbl-history-table .sbl-col-action > .sbl-btn,
    .sbl-history-table .sbl-action-group .sbl-btn,
    .sbl-history-table .sbl-action-group .sbl-wa-btn {
        width: 100% !important;
        min-height: 46px !important;
        padding: 11px 14px !important;
        border-radius: 12px !important;
        justify-content: center !important;
        font-size: 14px !important;
    }
}

@media (max-width: 640px) {
    .sbl-history-table .sbl-col-action {
        padding-top: 14px !important;
    }

    .sbl-history-table .sbl-action-group {
        gap: 8px !important;
    }

    .sbl-history-table .sbl-col-action > .sbl-btn,
    .sbl-history-table .sbl-action-group .sbl-btn,
    .sbl-history-table .sbl-action-group .sbl-wa-btn {
        min-height: 48px !important;
        font-size: 14px !important;
    }
}


/* v1.6.8 better action icons */
.sbl-action-icon-svg{display:inline-flex !important; align-items:center; justify-content:center;}
.sbl-action-icon-svg svg{width:18px; height:18px; display:block;}
.sbl-history-table .sbl-col-action > .sbl-btn,
.sbl-history-table .sbl-action-group .sbl-btn,
.sbl-history-table .sbl-action-group .sbl-wa-btn,
.sbl-wa-btn{background:#0b63e5 !important; color:#ffffff !important; border:1px solid #0b63e5 !important;}
.sbl-history-table .sbl-action-group .sbl-btn:hover,
.sbl-history-table .sbl-action-group .sbl-wa-btn:hover,
.sbl-wa-btn:hover{background:#084db3 !important; border-color:#084db3 !important; color:#fff !important;}
.sbl-chat-btn, .sbl-wa-btn{box-shadow:none !important;}
@media (max-width:900px){
  .sbl-history-table .sbl-col-action > .sbl-btn,
  .sbl-history-table .sbl-action-group .sbl-btn,
  .sbl-history-table .sbl-action-group .sbl-wa-btn{font-size:14px !important;}
  .sbl-action-icon-svg svg{width:19px; height:19px;}
}



/* ===== SBL v1.6.9 mobile action stack hard override ===== */
.sbl-action-icon-svg{display:inline-flex !important;align-items:center !important;justify-content:center !important;}
.sbl-action-icon-svg svg{width:18px !important;height:18px !important;display:block !important;}
.sbl-history-table .sbl-action-group .sbl-btn,
.sbl-history-table .sbl-action-group .sbl-wa-btn,
.sbl-history-table .sbl-col-action > .sbl-btn,
.sbl-wa-btn{
    background:#0b63e5 !important;
    color:#ffffff !important;
    border:1px solid #0b63e5 !important;
}
.sbl-history-table .sbl-action-group .sbl-btn:hover,
.sbl-history-table .sbl-action-group .sbl-wa-btn:hover,
.sbl-history-table .sbl-col-action > .sbl-btn:hover,
.sbl-wa-btn:hover{
    background:#084db3 !important;
    color:#ffffff !important;
    border-color:#084db3 !important;
}
@media (max-width: 900px){
    .sbl-history-table .sbl-col-action{
        display:block !important;
        width:100% !important;
    }
    .sbl-history-table .sbl-action-group{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:8px !important;
        width:100% !important;
    }
    .sbl-history-table .sbl-action-group > *{
        width:100% !important;
        grid-column:1 / -1 !important;
    }
    .sbl-history-table .sbl-col-action > .sbl-btn,
    .sbl-history-table .sbl-action-group .sbl-btn,
    .sbl-history-table .sbl-action-group .sbl-wa-btn,
    .sbl-wa-btn{
        width:100% !important;
        min-height:46px !important;
        padding:11px 14px !important;
        justify-content:center !important;
        border-radius:12px !important;
        font-size:14px !important;
    }
}
@media (max-width: 640px){
    .sbl-history-table .sbl-action-group{
        display:flex !important;
        flex-direction:column !important;
        gap:8px !important;
    }
    .sbl-history-table .sbl-action-group > *{
        width:100% !important;
        flex:0 0 auto !important;
    }
}



/* ===== SBL v1.7.0 precise mobile action layout ===== */
@media (max-width: 900px) {
    .sbl-history-table .sbl-history-row td.sbl-col-action {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        grid-template-columns: none !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 14px 0 0 !important;
        margin: 10px 0 0 !important;
        border-top: 1px solid #e7eef7 !important;
        box-sizing: border-box !important;
    }

    .sbl-history-table .sbl-history-row td.sbl-col-action::before {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        color: #64748b !important;
        font-size: 13px !important;
        font-weight: 700 !important;
    }

    .sbl-history-table .sbl-history-row td.sbl-col-action .sbl-action-group {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
        width: clamp(170px, 56vw, 220px) !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    .sbl-history-table .sbl-history-row td.sbl-col-action .sbl-action-group > * {
        display: inline-flex !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 44px !important;
        margin: 0 !important;
        padding: 10px 14px !important;
        justify-content: center !important;
        box-sizing: border-box !important;
        border-radius: 11px !important;
        font-size: 14px !important;
    }

    .sbl-history-table .sbl-history-row .sbl-col-status {
        max-width: 128px !important;
    }

    .sbl-history-table .sbl-history-row .sbl-col-status span {
        max-width: 128px !important;
        padding: 5px 8px !important;
        font-size: 10.5px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

@media (max-width: 430px) {
    .sbl-history-table .sbl-history-row td.sbl-col-action .sbl-action-group {
        width: min(200px, 100%) !important;
    }
}



/* ===== SBL v1.7.1 clean send icon + true mobile fit ===== */
.sbl-action-kalab .sbl-action-icon-svg svg{
    fill:none !important;
    overflow:visible !important;
}
@media (max-width: 900px){
    html, body{
        max-width:100% !important;
        overflow-x:hidden !important;
    }
    .sbl-container,
    .sbl-container *,
    .sbl-history-card,
    .sbl-history-filters,
    .sbl-history-filter-actions,
    .sbl-bulk-toolbar,
    .sbl-history-table-wrap,
    .sbl-history-table,
    .sbl-history-table tbody,
    .sbl-history-table .sbl-history-row,
    .sbl-history-table .sbl-history-row td,
    .sbl-history-table .sbl-action-group{
        box-sizing:border-box !important;
        max-width:100% !important;
        min-width:0 !important;
    }
    .sbl-container{
        width:100% !important;
        overflow-x:clip !important;
    }
    .sbl-history-card{
        width:100% !important;
        overflow:hidden !important;
    }
    .sbl-history-filters{
        width:100% !important;
        grid-template-columns:1fr !important;
    }
    .sbl-history-search-field,
    .sbl-history-filter-actions{
        grid-column:1 !important;
        width:100% !important;
    }
    .sbl-history-filter-actions{
        grid-template-columns:1fr 1fr !important;
    }
    .sbl-history-filter-actions > *{
        width:100% !important;
        min-width:0 !important;
    }
    .sbl-bulk-toolbar{
        display:flex !important;
        flex-direction:column !important;
        align-items:stretch !important;
        width:100% !important;
        gap:10px !important;
    }
    .sbl-bulk-check-label,
    .sbl-bulk-submit,
    .sbl-bulk-count{
        width:100% !important;
        max-width:100% !important;
    }
    .sbl-bulk-count{
        text-align:center !important;
        justify-self:center !important;
    }
    .sbl-history-table-wrap{
        width:100% !important;
        overflow:visible !important;
    }
    .sbl-history-table .sbl-history-row{
        width:100% !important;
        overflow:hidden !important;
    }
    .sbl-history-table .sbl-history-row td{
        width:100% !important;
    }
    .sbl-history-table .sbl-history-row td.sbl-select-col{
        padding-right:0 !important;
        padding-inline-end:0 !important;
        margin-right:138px !important;
        width:auto !important;
    }
    .sbl-history-table .sbl-history-row .sbl-col-status{
        right:12px !important;
        max-width:118px !important;
        overflow:hidden !important;
    }
    .sbl-history-table .sbl-history-row .sbl-col-status span{
        max-width:118px !important;
        overflow:hidden !important;
        text-overflow:ellipsis !important;
        white-space:nowrap !important;
    }
    .sbl-history-table .sbl-history-row td.sbl-col-action{
        width:100% !important;
        overflow:hidden !important;
    }
    .sbl-history-table .sbl-history-row td.sbl-col-action .sbl-action-group{
        width:min(200px, 100%) !important;
        max-width:100% !important;
    }
    .sbl-history-table .sbl-history-row td.sbl-col-action .sbl-action-group > *{
        width:100% !important;
        max-width:100% !important;
    }
}
@media (max-width: 430px){
    .sbl-container{padding-left:8px !important;padding-right:8px !important;}
    .sbl-history-card{padding-left:12px !important;padding-right:12px !important;}
    .sbl-history-filter-actions{gap:8px !important;}
    .sbl-history-table .sbl-history-row td{
        grid-template-columns:88px minmax(0,1fr) !important;
    }
    .sbl-history-table .sbl-history-row td.sbl-select-col{
        margin-right:106px !important;
    }
    .sbl-history-table .sbl-history-row .sbl-col-status,
    .sbl-history-table .sbl-history-row .sbl-col-status span{
        max-width:96px !important;
    }
}



/* ===== SBL v1.7.2 ITS portal auth + chat refresh ===== */
.sbl-container:has(.sbl-auth-wrapper){
    background:linear-gradient(180deg,#f8fbff 0%,#eef5ff 100%) !important;
    border-radius:24px !important;
    padding:28px 24px 36px !important;
    box-shadow:none !important;
}
.sbl-container:has(.sbl-auth-wrapper)::before,
.sbl-container:has(.sbl-auth-wrapper)::after{
    display:none !important;
    content:none !important;
}
.sbl-auth-wrapper{
    max-width:1160px !important;
    margin:0 auto !important;
    padding:8px 0 10px !important;
}
.sbl-auth-brand{
    margin-bottom:24px !important;
    text-align:center !important;
}
.sbl-auth-brand-logo{
    width:60px !important;height:60px !important;border-radius:18px !important;
    background:#0b63e5 !important;color:#fff !important;
    box-shadow:0 12px 28px rgba(11,99,229,.18) !important;
}
.sbl-auth-brand h1{
    color:#10233e !important;
    font-size:28px !important;
    font-weight:800 !important;
    text-shadow:none !important;
}
.sbl-auth-brand p{
    color:#64748b !important;
    font-size:14px !important;
}
.sbl-auth-grid{gap:24px !important; align-items:stretch !important;}
.sbl-auth-card{
    background:#ffffff !important;
    border:1px solid #dbe7f5 !important;
    border-radius:22px !important;
    padding:26px 24px !important;
    box-shadow:0 12px 30px rgba(15,40,80,.08) !important;
}
.sbl-auth-card::before{
    height:4px !important;
    background:#0b63e5 !important;
    border-radius:22px 22px 0 0 !important;
}
.sbl-auth-card::after{display:none !important;content:none !important;}
.sbl-auth-card:hover{transform:none !important; box-shadow:0 14px 30px rgba(15,40,80,.10) !important;}
.sbl-auth-header{gap:14px !important; margin-bottom:18px !important;}
.sbl-auth-icon,
.sbl-auth-icon.signin,
.sbl-auth-icon.forgot{
    width:52px !important;height:52px !important;border-radius:16px !important;
    background:#eef5ff !important;color:#0b63e5 !important;
    box-shadow:none !important;
    font-size:23px !important;
}
.sbl-auth-header-text h2{
    color:#10233e !important;
    font-size:28px !important;
    line-height:1.15 !important;
    margin:0 !important;
}
.sbl-auth-header-text span{
    color:#7b8ba1 !important;
    font-size:12px !important;
    letter-spacing:.06em !important;
}
.sbl-auth-divider{height:1px !important; background:#e7eef7 !important; margin:18px 0 !important;}
.sbl-auth-card label{color:#425466 !important; font-size:13px !important; font-weight:700 !important; margin-bottom:8px !important;}
.sbl-auth-card input[type="text"],
.sbl-auth-card input[type="password"],
.sbl-auth-card input[type="email"],
.sbl-auth-card input[type="tel"],
.sbl-auth-card input[type="date"],
.sbl-auth-card select{
    min-height:50px !important;
    padding:12px 14px !important;
    border:1.5px solid #d8e3ef !important;
    border-radius:14px !important;
    background:#fff !important;
    color:#1e293b !important;
    box-shadow:none !important;
}
.sbl-auth-card input:focus,
.sbl-auth-card select:focus{
    border-color:#0b63e5 !important;
    box-shadow:0 0 0 4px rgba(11,99,229,.10) !important;
}
.sbl-auth-card input::placeholder{color:#94a3b8 !important;}
.sbl-auth-btn{
    min-height:50px !important;
    border-radius:14px !important;
    font-size:15px !important;
    font-weight:700 !important;
    box-shadow:none !important;
}
.sbl-auth-btn::before{display:none !important;}
.sbl-auth-btn.primary,
.sbl-auth-btn.warning{
    background:#0b63e5 !important;
    color:#fff !important;
    border:1px solid #0b63e5 !important;
}
.sbl-auth-btn.primary:hover,
.sbl-auth-btn.warning:hover{
    background:#084db3 !important;
    border-color:#084db3 !important;
}
.sbl-auth-btn.secondary{
    background:#fff !important;
    color:#0b63e5 !important;
    border:1px solid #a8c5ef !important;
}
.sbl-auth-btn.secondary:hover{background:#eff6ff !important;}
.sbl-auth-info,
.sbl-auth-verified{
    background:#eef5ff !important;
    color:#355070 !important;
    border:1px solid #d9e8fb !important;
    box-shadow:none !important;
}
.sbl-auth-info strong,
.sbl-auth-verified strong{color:#123a68 !important;}
.sbl-auth-step-num{background:#e6eef8 !important;color:#6b7f96 !important;}
.sbl-auth-step.active .sbl-auth-step-num,
.sbl-auth-step.completed .sbl-auth-step-num{background:#0b63e5 !important;color:#fff !important; box-shadow:none !important;}
.sbl-auth-step.active,
.sbl-auth-step.completed{color:#0b63e5 !important;}
.sbl-auth-step-line{background:#d9e5f2 !important;}
.sbl-auth-step-line.completed{background:#0b63e5 !important;}
.sbl-auth-back{color:#0b63e5 !important;}
.sbl-auth-back:hover{color:#084db3 !important;}
.sbl-auth-field small{color:#7c8da4 !important;}

/* Chat modal refreshed */
.sbl-chat-overlay{background:rgba(15,23,42,.32) !important;backdrop-filter:blur(3px);}
.sbl-chat-modal{
    border:1px solid #dce8f4 !important;
    border-radius:22px !important;
    box-shadow:0 24px 60px rgba(15,40,80,.18) !important;
    background:#fff !important;
}
.sbl-chat-header{
    padding:18px 20px !important;
    background:#0b63e5 !important;
    color:#fff !important;
}
.sbl-chat-title{font-size:18px !important; font-weight:800 !important; letter-spacing:.01em !important;}
.sbl-chat-close{
    background:rgba(255,255,255,.12) !important;
    border:1px solid rgba(255,255,255,.28) !important;
    border-radius:12px !important;
    padding:9px 14px !important;
    font-weight:700 !important;
}
.sbl-chat-body{
    padding:18px 20px !important;
    background:#f8fbff !important;
}
.sbl-chat-msg{
    max-width:80% !important;
    padding:12px 14px !important;
    border-radius:18px !important;
    box-shadow:0 6px 16px rgba(15,40,80,.06) !important;
}
.sbl-chat-msg.me{
    background:#0b63e5 !important;
    color:#fff !important;
    border-bottom-right-radius:8px !important;
}
.sbl-chat-msg.them{
    background:#ffffff !important;
    color:#1e293b !important;
    border:1px solid #dce7f5 !important;
    border-bottom-left-radius:8px !important;
}
.sbl-chat-meta{font-size:12px !important; opacity:.82 !important;}
.sbl-chat-footer{
    gap:12px !important;
    padding:14px 18px calc(14px + env(safe-area-inset-bottom, 0px)) !important;
    border-top:1px solid #e7eef7 !important;
    background:#fff !important;
}
.sbl-chat-input{
    min-height:48px !important;
    border:1.5px solid #d8e3ef !important;
    border-radius:14px !important;
    padding:12px 14px !important;
    font-size:14px !important;
}
.sbl-chat-input:focus{border-color:#0b63e5 !important; box-shadow:0 0 0 4px rgba(11,99,229,.10) !important;}
.sbl-chat-send{
    min-width:86px !important;
    min-height:48px !important;
    border-radius:14px !important;
    background:#0b63e5 !important;
    color:#fff !important;
    border:1px solid #0b63e5 !important;
}
.sbl-chat-send:hover{background:#084db3 !important;border-color:#084db3 !important;}
.sbl-chat-btn.sbl-chat-unread{background:#0b63e5 !important;color:#fff !important;border-color:#0b63e5 !important;}
.sbl-chat-badge{background:#ef4444 !important; box-shadow:0 8px 18px rgba(239,68,68,.24) !important;}

@media (max-width: 900px){
    .sbl-auth-wrapper{padding:2px 0 6px !important;}
    .sbl-auth-grid{gap:18px !important;}
    .sbl-auth-card{padding:22px 18px !important;border-radius:20px !important;}
    .sbl-auth-header-text h2{font-size:24px !important;}
}
@media (max-width: 640px){
    .sbl-container:has(.sbl-auth-wrapper){padding:16px 12px 24px !important;border-radius:18px !important;}
    .sbl-auth-brand-logo{width:54px !important;height:54px !important;border-radius:16px !important;}
    .sbl-auth-brand h1{font-size:24px !important;}
    .sbl-auth-grid{grid-template-columns:1fr !important;gap:16px !important;}
    .sbl-auth-card{padding:20px 16px !important;border-radius:18px !important;}
    .sbl-auth-header{margin-bottom:16px !important;}
    .sbl-auth-header-text h2{font-size:22px !important;}
    .sbl-auth-grid-inner{grid-template-columns:1fr !important;}
    .sbl-chat-modal{width:min(100vw,100vw) !important;height:calc(var(--sbl-vh, 1vh) * 100) !important;border-radius:0 !important;}
    .sbl-chat-header{padding:16px 14px calc(14px + env(safe-area-inset-top, 0px)) !important;}
    .sbl-chat-title{font-size:16px !important;}
    .sbl-chat-body{padding:14px !important;}
    .sbl-chat-msg{max-width:88% !important;}
    .sbl-chat-footer{padding:12px 14px calc(12px + env(safe-area-inset-bottom,0px)) !important;gap:10px !important;}
    .sbl-chat-send{min-width:76px !important;}
}



/* ===== SBL v1.7.3 clean ITS typography refresh ===== */
.sbl-container:has(.sbl-auth-wrapper),
.sbl-container:has(.sbl-auth-wrapper) *{
    box-sizing:border-box;
}
.sbl-container:has(.sbl-auth-wrapper),
.sbl-auth-wrapper,
.sbl-auth-card,
.sbl-chat-modal{
    font-family:"Roboto","Segoe UI Variable","Segoe UI",Arial,sans-serif !important;
}
.sbl-auth-brand h1,
.sbl-auth-header-text h2,
.sbl-auth-signup-box h3,
.sbl-chat-title{
    font-family:"Poppins","Segoe UI Variable","Segoe UI",Arial,sans-serif !important;
}
.sbl-container:has(.sbl-auth-wrapper){
    background:#f5f8fc !important;
    padding:34px 26px 42px !important;
}
.sbl-auth-wrapper{
    max-width:1080px !important;
    padding:0 !important;
}
.sbl-auth-brand{
    margin-bottom:28px !important;
}
.sbl-auth-brand-logo{
    width:56px !important;
    height:56px !important;
    margin-bottom:14px !important;
    border-radius:16px !important;
    background:#eef5ff !important;
    color:#0a5fb8 !important;
    border:1px solid #d7e6f7 !important;
    box-shadow:none !important;
    animation:none !important;
}
.sbl-auth-brand-logo svg,
.sbl-auth-icon svg{
    width:25px !important;
    height:25px !important;
    display:block !important;
}
.sbl-auth-brand h1{
    color:#14253d !important;
    font-size:27px !important;
    font-weight:600 !important;
    letter-spacing:-.025em !important;
    line-height:1.25 !important;
}
.sbl-auth-brand p{
    margin-top:7px !important;
    color:#75869a !important;
    font-size:14px !important;
    font-weight:400 !important;
}
.sbl-auth-grid{
    gap:22px !important;
}
.sbl-auth-card{
    padding:28px 26px !important;
    border:1px solid #e0e8f1 !important;
    border-radius:18px !important;
    box-shadow:0 8px 24px rgba(29,58,94,.07) !important;
}
.sbl-auth-card::before{
    height:3px !important;
    background:#0a66c2 !important;
    border-radius:18px 18px 0 0 !important;
}
.sbl-auth-header{
    gap:13px !important;
    margin-bottom:22px !important;
    padding-bottom:18px !important;
    border-bottom:1px solid #e8eef5 !important;
}
.sbl-auth-icon,
.sbl-auth-icon.signin,
.sbl-auth-icon.forgot{
    width:46px !important;
    height:46px !important;
    border-radius:13px !important;
    background:#eef5ff !important;
    color:#0a66c2 !important;
    border:1px solid #d9e7f7 !important;
}
.sbl-auth-header-text h2{
    color:#17283f !important;
    font-size:23px !important;
    font-weight:600 !important;
    letter-spacing:-.025em !important;
}
.sbl-auth-header-text span{
    margin-top:4px !important;
    color:#8291a4 !important;
    font-size:11px !important;
    font-weight:500 !important;
    letter-spacing:.055em !important;
}
.sbl-auth-card label{
    color:#45566c !important;
    font-size:13px !important;
    font-weight:500 !important;
    letter-spacing:0 !important;
}
.sbl-auth-card input[type="text"],
.sbl-auth-card input[type="password"],
.sbl-auth-card input[type="email"],
.sbl-auth-card input[type="tel"],
.sbl-auth-card input[type="date"],
.sbl-auth-card select{
    min-height:48px !important;
    padding:12px 14px !important;
    border:1px solid #dbe4ee !important;
    border-radius:10px !important;
    background:#fff !important;
    color:#1d2d42 !important;
    font-size:14px !important;
    font-weight:400 !important;
}
.sbl-auth-card input:focus,
.sbl-auth-card select:focus{
    border-color:#0a66c2 !important;
    box-shadow:0 0 0 3px rgba(10,102,194,.10) !important;
}
.sbl-auth-field{
    margin-bottom:16px !important;
}
.sbl-auth-field small{
    margin-top:6px !important;
    color:#8594a7 !important;
    font-size:11.5px !important;
}
.sbl-auth-btn{
    min-height:48px !important;
    border-radius:10px !important;
    font-family:"Poppins","Segoe UI Variable","Segoe UI",Arial,sans-serif !important;
    font-size:14px !important;
    font-weight:500 !important;
    letter-spacing:0 !important;
    transition:background .18s ease,border-color .18s ease,box-shadow .18s ease !important;
}
.sbl-auth-btn:hover{
    transform:none !important;
}
.sbl-auth-btn.primary,
.sbl-auth-btn.warning{
    background:#0875d1 !important;
    border-color:#0875d1 !important;
    box-shadow:none !important;
}
.sbl-auth-btn.primary:hover,
.sbl-auth-btn.warning:hover{
    background:#0563b2 !important;
    border-color:#0563b2 !important;
    box-shadow:0 5px 14px rgba(8,117,209,.18) !important;
}
.sbl-auth-btn.secondary{
    background:#fff !important;
    color:#0875d1 !important;
    border:1px solid #b9d2ec !important;
}
.sbl-auth-btn.secondary:hover{
    background:#f2f8fe !important;
    border-color:#0875d1 !important;
    color:#0563b2 !important;
    box-shadow:none !important;
}
.sbl-auth-btn-icon{
    font-family:"Roboto",Arial,sans-serif !important;
    font-weight:500 !important;
}
.sbl-auth-divider{
    margin:18px 0 !important;
    background:#e8eef5 !important;
}
.sbl-auth-info,
.sbl-auth-verified{
    background:#f1f7fd !important;
    border:1px solid #d9e8f7 !important;
    border-left:3px solid #0875d1 !important;
    color:#405b76 !important;
    border-radius:10px !important;
}
.sbl-auth-steps{
    padding:11px 12px !important;
    background:#f7f9fc !important;
    border:1px solid #e1e8f0 !important;
    border-radius:10px !important;
}
.sbl-auth-step{
    color:#8795a7 !important;
    font-size:10px !important;
}
.sbl-auth-step.active,
.sbl-auth-step.completed{
    color:#0875d1 !important;
}
.sbl-auth-step-num{
    background:#e8eef5 !important;
    color:#718196 !important;
}
.sbl-auth-step.active .sbl-auth-step-num,
.sbl-auth-step.completed .sbl-auth-step-num{
    background:#0875d1 !important;
    color:#fff !important;
}
.sbl-auth-step-line.completed{
    background:#0875d1 !important;
}
.sbl-auth-signup-box h3{
    color:#17283f !important;
    font-size:17px !important;
    font-weight:600 !important;
}

/* Chat follows the same typography */
.sbl-chat-modal,
.sbl-chat-input,
.sbl-chat-send{
    font-family:"Roboto","Segoe UI Variable","Segoe UI",Arial,sans-serif !important;
}
.sbl-chat-title{
    font-weight:600 !important;
    letter-spacing:-.015em !important;
}
.sbl-chat-header{
    background:#0875d1 !important;
}
.sbl-chat-input{
    border-radius:10px !important;
}
.sbl-chat-send{
    border-radius:10px !important;
    background:#0875d1 !important;
}
.sbl-chat-msg{
    font-size:14px !important;
    line-height:1.5 !important;
}

@media (max-width:768px){
    .sbl-container:has(.sbl-auth-wrapper){padding:22px 14px 30px !important;}
    .sbl-auth-brand{margin-bottom:20px !important;}
    .sbl-auth-brand h1{font-size:24px !important;}
    .sbl-auth-grid{gap:16px !important;}
    .sbl-auth-card{padding:22px 18px !important;border-radius:16px !important;}
    .sbl-auth-card::before{border-radius:16px 16px 0 0 !important;}
    .sbl-auth-header-text h2{font-size:21px !important;}
}



/* ===== SBL v1.7.4 verified portal refresh ===== */
.sbl-auth-wrapper,
.sbl-auth-wrapper *,
.sbl-chat-modal,
.sbl-chat-modal *{
    font-family:"Inter","Segoe UI Variable","Segoe UI",Roboto,Arial,sans-serif !important;
}
.sbl-bg-grid,.sbl-bg-particles{display:none !important;}
.sbl-container:has(.sbl-auth-wrapper){
    background:#f6f9fd !important;
    padding:30px 28px 40px !important;
    border-radius:24px !important;
}
.sbl-auth-wrapper{max-width:1120px !important;margin:0 auto !important;padding:0 !important;}
.sbl-auth-brand{margin:0 0 26px !important;}
.sbl-auth-brand-logo{
    width:56px !important;height:56px !important;border-radius:16px !important;
    background:#0a67d8 !important;color:#fff !important;
    box-shadow:0 10px 25px rgba(10,103,216,.20) !important;
    animation:none !important;
}
.sbl-auth-brand-logo svg{width:28px !important;height:28px !important;display:block !important;}
.sbl-auth-brand h1{
    margin:14px 0 0 !important;color:#182b45 !important;
    font-size:28px !important;font-weight:700 !important;letter-spacing:-.035em !important;
    text-shadow:none !important;
}
.sbl-auth-brand p{margin-top:7px !important;color:#6c7f96 !important;font-size:14px !important;font-weight:400 !important;}
.sbl-auth-grid{grid-template-columns:1fr 1fr !important;gap:24px !important;align-items:stretch !important;}
.sbl-auth-card{
    padding:26px 24px !important;background:#fff !important;
    border:1px solid #dce6f2 !important;border-radius:20px !important;
    box-shadow:0 10px 28px rgba(30,56,87,.07) !important;
    transform:none !important;
}
.sbl-auth-card::before{height:3px !important;background:#0a67d8 !important;border-radius:20px 20px 0 0 !important;}
.sbl-auth-card::after{display:none !important;content:none !important;}
.sbl-auth-header{display:flex !important;align-items:center !important;gap:14px !important;margin-bottom:20px !important;}
.sbl-auth-icon,.sbl-auth-icon.signin,.sbl-auth-icon.forgot{
    width:48px !important;height:48px !important;flex:0 0 48px !important;
    border-radius:14px !important;background:#edf5ff !important;color:#0a67d8 !important;
    box-shadow:none !important;font-size:0 !important;
}
.sbl-auth-icon svg{width:25px !important;height:25px !important;display:block !important;}
.sbl-auth-header-text h2{
    margin:0 !important;color:#182b45 !important;font-size:24px !important;
    line-height:1.2 !important;font-weight:700 !important;letter-spacing:-.025em !important;
}
.sbl-auth-header-text span{display:block !important;margin-top:4px !important;color:#7a8da5 !important;font-size:11px !important;font-weight:600 !important;letter-spacing:.07em !important;text-transform:uppercase !important;}
.sbl-auth-divider{margin:20px 0 !important;background:#e8eef6 !important;}
.sbl-auth-card label{margin-bottom:8px !important;color:#40556d !important;font-size:13px !important;font-weight:600 !important;}
.sbl-auth-card input[type="text"],.sbl-auth-card input[type="password"],.sbl-auth-card input[type="email"],.sbl-auth-card input[type="tel"],.sbl-auth-card input[type="date"],.sbl-auth-card select{
    min-height:50px !important;padding:12px 14px !important;background:#fff !important;
    border:1.5px solid #d7e2ef !important;border-radius:13px !important;
    color:#1f334c !important;font-size:14px !important;box-shadow:none !important;
}
.sbl-auth-card input:focus,.sbl-auth-card select:focus{border-color:#0a67d8 !important;box-shadow:0 0 0 4px rgba(10,103,216,.10) !important;}
.sbl-auth-btn{
    min-height:50px !important;padding:12px 18px !important;border-radius:13px !important;
    font-size:14px !important;font-weight:700 !important;box-shadow:none !important;letter-spacing:0 !important;
}
.sbl-auth-btn::before{display:none !important;}
.sbl-auth-btn.primary,.sbl-auth-btn.warning{background:#0a67d8 !important;border:1px solid #0a67d8 !important;color:#fff !important;}
.sbl-auth-btn.primary:hover,.sbl-auth-btn.warning:hover{background:#0755b5 !important;border-color:#0755b5 !important;}
.sbl-auth-btn.secondary{background:#fff !important;color:#0a67d8 !important;border:1px solid #a9c6eb !important;}
.sbl-auth-btn.secondary:hover{background:#f0f6ff !important;}
.sbl-auth-info,.sbl-auth-verified{background:#f0f6ff !important;border:1px solid #d8e7fa !important;color:#425d7b !important;border-radius:12px !important;box-shadow:none !important;}
.sbl-auth-step-num{background:#e8eef6 !important;color:#71849b !important;box-shadow:none !important;}
.sbl-auth-step.active .sbl-auth-step-num,.sbl-auth-step.completed .sbl-auth-step-num{background:#0a67d8 !important;color:#fff !important;}
.sbl-auth-step.active,.sbl-auth-step.completed{color:#0a67d8 !important;}
.sbl-auth-step-line{background:#dbe5f0 !important;}
.sbl-auth-step-line.completed{background:#0a67d8 !important;}

.sbl-chat-overlay{background:rgba(15,31,50,.34) !important;backdrop-filter:blur(3px) !important;}
.sbl-chat-modal{border:1px solid #dbe6f2 !important;border-radius:20px !important;box-shadow:0 24px 60px rgba(20,43,70,.20) !important;}
.sbl-chat-header{background:#0a67d8 !important;padding:18px 20px !important;}
.sbl-chat-title{font-size:17px !important;font-weight:700 !important;letter-spacing:-.01em !important;}
.sbl-chat-close{border-radius:10px !important;font-weight:600 !important;}
.sbl-chat-body{background:#f7faff !important;padding:18px 20px !important;}
.sbl-chat-msg{padding:12px 14px !important;border-radius:16px !important;box-shadow:none !important;}
.sbl-chat-msg.me{background:#0a67d8 !important;color:#fff !important;}
.sbl-chat-msg.them{background:#fff !important;color:#243a54 !important;border:1px solid #dce6f2 !important;}
.sbl-chat-footer{padding:14px 18px calc(14px + env(safe-area-inset-bottom,0px)) !important;gap:10px !important;border-top:1px solid #e6edf6 !important;}
.sbl-chat-input{min-height:48px !important;border:1.5px solid #d7e2ef !important;border-radius:13px !important;padding:12px 14px !important;}
.sbl-chat-input:focus{border-color:#0a67d8 !important;box-shadow:0 0 0 4px rgba(10,103,216,.10) !important;}
.sbl-chat-send{min-height:48px !important;min-width:82px !important;border-radius:13px !important;background:#0a67d8 !important;border-color:#0a67d8 !important;}

@media (max-width:768px){
    .sbl-container:has(.sbl-auth-wrapper){padding:18px 12px 28px !important;border-radius:18px !important;}
    .sbl-auth-grid{grid-template-columns:1fr !important;gap:16px !important;}
    .sbl-auth-card{padding:21px 17px !important;border-radius:18px !important;}
    .sbl-auth-brand h1{font-size:24px !important;}
    .sbl-auth-header-text h2{font-size:22px !important;}
    .sbl-chat-modal{border-radius:0 !important;}
}



/* ===== SBL v1.7.5 mobile signup repair + clean auth actions ===== */
.sbl-auth-btn-icon{display:none !important;}
.sbl-auth-btn{gap:0 !important;}
.sbl-auth-signup-box,
.sbl-auth-signup-box form,
.sbl-auth-signup-box .sbl-auth-grid-inner,
.sbl-auth-signup-box .sbl-auth-field{
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
}
.sbl-auth-signup-box .sbl-auth-field{
    width:100% !important;
}
.sbl-auth-signup-box input,
.sbl-auth-signup-box select,
.sbl-auth-signup-box textarea{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
}
.sbl-auth-signup-box input[type="file"]{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-height:46px !important;
    padding:8px !important;
    border:1.5px solid #d7e2ef !important;
    border-radius:12px !important;
    background:#fff !important;
    color:#40556d !important;
    font-size:13px !important;
    overflow:hidden !important;
}
.sbl-auth-signup-box input[type="file"]::file-selector-button{
    margin-right:10px !important;
    padding:8px 12px !important;
    border:0 !important;
    border-radius:8px !important;
    background:#edf5ff !important;
    color:#0a67d8 !important;
    font-weight:700 !important;
    cursor:pointer !important;
}
.sbl-auth-signup-box .sbl-ktm-camera .button{
    border:1px solid #a9c6eb !important;
    border-radius:10px !important;
    background:#fff !important;
    color:#0a67d8 !important;
    box-shadow:none !important;
    font-weight:600 !important;
}

@media (max-width:768px){
    .sbl-auth-signup-box{
        width:100% !important;
        margin-top:18px !important;
        padding-top:20px !important;
        overflow:visible !important;
    }
    .sbl-auth-signup-box h3{
        margin:0 0 18px !important;
        font-size:19px !important;
        line-height:1.35 !important;
    }
    .sbl-auth-signup-box .sbl-auth-grid-inner{
        display:flex !important;
        flex-direction:column !important;
        gap:16px !important;
        width:100% !important;
    }
    .sbl-auth-signup-box .sbl-auth-field,
    .sbl-auth-signup-box .sbl-auth-field[style]{
        display:block !important;
        width:100% !important;
        max-width:100% !important;
        margin:0 !important;
        grid-column:auto !important;
    }
    .sbl-auth-signup-box .sbl-auth-field label{
        display:block !important;
        width:100% !important;
        margin:0 0 8px !important;
        padding:0 !important;
        line-height:1.35 !important;
        white-space:normal !important;
        position:static !important;
    }
    .sbl-auth-signup-box input[type="text"],
    .sbl-auth-signup-box input[type="password"],
    .sbl-auth-signup-box input[type="email"],
    .sbl-auth-signup-box input[type="tel"],
    .sbl-auth-signup-box input[type="date"],
    .sbl-auth-signup-box select,
    .sbl-auth-signup-box textarea{
        display:block !important;
        width:100% !important;
        max-width:100% !important;
        min-height:50px !important;
        margin:0 !important;
        position:static !important;
        transform:none !important;
    }
    .sbl-auth-signup-box .sbl-auth-field small{
        display:block !important;
        width:100% !important;
        margin:6px 0 0 !important;
        line-height:1.45 !important;
        position:static !important;
    }
    .sbl-auth-signup-box .sbl-extra{
        width:100% !important;
        max-width:100% !important;
        box-sizing:border-box !important;
    }
    .sbl-auth-signup-box .sbl-handover-key,
    .sbl-auth-signup-box .sbl-handover-item{
        display:flex !important;
        flex-direction:column !important;
        gap:14px !important;
    }
    .sbl-auth-signup-box .sbl-auth-btn{
        width:100% !important;
        margin-top:4px !important;
    }
}

@media (max-width:420px){
    .sbl-auth-card{padding-left:15px !important;padding-right:15px !important;}
    .sbl-auth-signup-box h3{font-size:18px !important;}
    .sbl-auth-signup-box .sbl-auth-grid-inner{gap:14px !important;}
}


/* ===== SBL v1.7.6 action column centering ===== */
@media (min-width: 901px){
  .sbl-history-table td.sbl-col-action{
    text-align:center !important;
    padding-left:16px !important;
    padding-right:16px !important;
  }
  .sbl-history-table td.sbl-col-action .sbl-action-group{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    width:fit-content !important;
    margin-left:auto !important;
    margin-right:auto !important;
    gap:8px !important;
  }
  .sbl-history-table td.sbl-col-action .sbl-action-group > *{
    width:108px !important;
    max-width:108px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .sbl-history-table td.sbl-col-action .sbl-btn,
  .sbl-history-table td.sbl-col-action .sbl-wa-btn{
    padding-left:16px !important;
    padding-right:16px !important;
    justify-content:center !important;
  }
}



/* ===== SBL v1.7.7 final action alignment + focused login flow ===== */
body.sbl-page-active .entry-title,
body.sbl-page-active .wp-block-post-title,
body.sbl-page-active .page-title,
body.sbl-page-active main > header.entry-header{
    display:none !important;
}

/* Desktop table widths total exactly 100%, preventing the action column from escaping. */
@media (min-width:901px){
    .sbl-history-table th.sbl-select-col,
    .sbl-history-table td.sbl-select-col{width:5% !important;}
    .sbl-history-table .sbl-col-name{width:12% !important;}
    .sbl-history-table .sbl-col-nrp{width:13% !important;}
    .sbl-history-table .sbl-col-lab{width:16% !important;}
    .sbl-history-table .sbl-col-status{width:11% !important;}
    .sbl-history-table .sbl-col-time{width:13% !important;}
    .sbl-history-table .sbl-col-no-surat{width:7% !important;}
    .sbl-history-table .sbl-col-link-surat{width:7% !important;}
    .sbl-history-table .sbl-col-action{width:16% !important;}

    .sbl-history-table thead th:last-child{
        text-align:center !important;
    }
    .sbl-history-table td.sbl-col-action{
        padding-left:18px !important;
        padding-right:18px !important;
        text-align:center !important;
        overflow:hidden !important;
    }
    .sbl-history-table td.sbl-col-action .sbl-action-group{
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:center !important;
        gap:8px !important;
        width:108px !important;
        max-width:108px !important;
        margin:0 auto !important;
    }
    .sbl-history-table td.sbl-col-action .sbl-action-group > *,
    .sbl-history-table td.sbl-col-action .sbl-btn,
    .sbl-history-table td.sbl-col-action .sbl-wa-btn{
        width:108px !important;
        max-width:108px !important;
        min-width:108px !important;
        margin:0 auto !important;
        padding-left:14px !important;
        padding-right:14px !important;
        justify-content:center !important;
        box-sizing:border-box !important;
    }
}

/* Login is intentionally a single centered card; forgot password opens only after clicking the link. */
.sbl-auth-grid{
    grid-template-columns:minmax(0,620px) !important;
    justify-content:center !important;
    align-items:start !important;
}
.sbl-auth-card{
    width:100% !important;
    max-width:620px !important;
    margin:0 auto !important;
}
.sbl-auth-forgot-link-wrap{
    display:flex !important;
    justify-content:flex-end !important;
    margin-top:8px !important;
}
.sbl-auth-text-link{
    appearance:none !important;
    border:0 !important;
    background:transparent !important;
    padding:4px 0 !important;
    color:#0a67d8 !important;
    font:inherit !important;
    font-size:13px !important;
    font-weight:600 !important;
    cursor:pointer !important;
    text-decoration:none !important;
}
.sbl-auth-text-link:hover{
    color:#0755b5 !important;
    text-decoration:underline !important;
}
.sbl-auth-back-login-wrap{
    display:flex !important;
    justify-content:center !important;
    margin-top:18px !important;
    padding-top:16px !important;
    border-top:1px solid #e8eef6 !important;
}

@media (max-width:768px){
    .sbl-auth-grid{grid-template-columns:1fr !important;}
    .sbl-auth-card{max-width:100% !important;}
}



/* ===== SBL v1.8.3 myITS card redesign ===== */
.sbl-container{
  max-width:1180px !important;
  padding:20px 18px 30px !important;
  background:transparent !important;
}

.sbl-container .sbl-topbar{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:16px !important;
  padding:18px 22px !important;
  margin-bottom:28px !important;
  background:#ffffff !important;
  color:#0f172a !important;
  border:1px solid #e6edf5 !important;
  border-radius:22px !important;
  box-shadow:0 10px 30px rgba(15,23,42,.05) !important;
  overflow:visible !important;
}
.sbl-container .sbl-topbar::before{display:none !important;content:none !important;}
.sbl-container .sbl-topbar div:first-child{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  font-size:16px !important;
  font-weight:700 !important;
  color:#10233e !important;
}
.sbl-container .sbl-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:34px !important;
  padding:6px 14px !important;
  background:#eef5ff !important;
  color:#0b63e5 !important;
  border:1px solid #d7e5fb !important;
  border-radius:999px !important;
  font-size:12px !important;
  font-weight:700 !important;
  letter-spacing:.04em !important;
  box-shadow:none !important;
}
.sbl-container .sbl-topbar .sbl-btn-outline{
  min-width:88px !important;
  min-height:44px !important;
  padding:10px 18px !important;
  border:1px solid #cfe0f4 !important;
  border-radius:16px !important;
  background:#ffffff !important;
  color:#0b63e5 !important;
  box-shadow:none !important;
}
.sbl-container .sbl-topbar .sbl-btn-outline:hover{
  background:#f7fbff !important;
  border-color:#9fc0f0 !important;
}

.sbl-container .sbl-card:not(.sbl-auth-card){
  position:relative !important;
  background:#ffffff !important;
  border:1px solid #e7eef6 !important;
  border-radius:24px !important;
  box-shadow:0 12px 30px rgba(15,23,42,.04) !important;
  padding:28px !important;
  margin-bottom:28px !important;
  overflow:hidden !important;
  transform:none !important;
}
.sbl-container .sbl-card:not(.sbl-auth-card)::before{
  display:none !important;
  content:none !important;
}
.sbl-container .sbl-card:not(.sbl-auth-card):hover{
  transform:none !important;
  box-shadow:0 14px 32px rgba(15,23,42,.05) !important;
}

.sbl-container .sbl-card > h2,
.sbl-container .sbl-card > h3{
  margin:0 0 22px !important;
  padding:0 0 18px !important;
  border-bottom:1px solid #ebf1f7 !important;
  color:#10233e !important;
  background:none !important;
  -webkit-background-clip:initial !important;
  -webkit-text-fill-color:currentColor !important;
  background-clip:initial !important;
}
.sbl-container .sbl-card > h2{
  font-size:18px !important;
  line-height:1.4 !important;
  font-weight:800 !important;
}
.sbl-container .sbl-card > h3{
  font-size:18px !important;
  line-height:1.4 !important;
  font-weight:800 !important;
}

.sbl-container .sbl-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0,1fr)) !important;
  gap:16px !important;
  margin:0 !important;
}
.sbl-container .sbl-card > .sbl-grid > .sbl-field-group{
  margin:0 !important;
  padding:16px 18px !important;
  background:#fbfdff !important;
  border:1px solid #edf2f7 !important;
  border-radius:18px !important;
}
.sbl-container .sbl-card > .sbl-grid > .sbl-field-group label{
  margin:0 0 8px !important;
  color:#64748b !important;
  font-size:13px !important;
  font-weight:700 !important;
}
.sbl-container .sbl-card > .sbl-grid > .sbl-field-group .sbl-muted,
.sbl-container .sbl-card > .sbl-grid > .sbl-field-group div:not(label){
  color:#10233e !important;
  font-size:15px !important;
  font-weight:600 !important;
  line-height:1.55 !important;
}

.sbl-container .sbl-history-card{
  padding:28px !important;
}
.sbl-container .sbl-history-title{
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  margin:0 0 4px !important;
  padding:0 !important;
  border:0 !important;
  color:#10233e !important;
  font-size:18px !important;
  font-weight:800 !important;
}
.sbl-container .sbl-history-title-icon{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:46px !important;
  height:46px !important;
  flex:0 0 46px !important;
  border-radius:14px !important;
  background:#eff6ff !important;
  color:#0b63e5 !important;
  border:1px solid #d9e8fb !important;
  font-size:21px !important;
}
.sbl-container .sbl-history-subtitle{
  margin:0 0 22px !important;
  padding:0 0 18px 60px !important;
  border-bottom:1px solid #ebf1f7 !important;
  color:#64748b !important;
  font-size:14px !important;
  line-height:1.55 !important;
}

.sbl-container .sbl-history-filters{
  gap:14px !important;
  margin:0 0 16px !important;
}
.sbl-container .sbl-bulk-toolbar{
  gap:14px !important;
  margin:0 0 18px !important;
  padding:14px 16px !important;
  background:#f8fbff !important;
  border:1px solid #e6edf5 !important;
  border-radius:18px !important;
}
.sbl-container .sbl-bulk-check-label,
.sbl-container .sbl-bulk-count{
  color:#475569 !important;
  font-size:14px !important;
}

.sbl-container .sbl-history-table-wrap{
  border:1px solid #e7eef6 !important;
  border-radius:20px !important;
  background:#ffffff !important;
}
.sbl-container .sbl-history-table{
  width:100% !important;
  table-layout:fixed !important;
}
.sbl-container .sbl-history-table thead{
  background:#f8fafc !important;
}
.sbl-container .sbl-history-table th{
  padding:16px 14px !important;
  color:#475569 !important;
  font-size:13px !important;
  font-weight:700 !important;
  line-height:1.4 !important;
  border-bottom:1px solid #ebf1f7 !important;
}
.sbl-container .sbl-history-table td{
  padding:22px 14px !important;
  color:#334155 !important;
  font-size:14px !important;
  line-height:1.6 !important;
  border-bottom:1px solid #edf2f7 !important;
}
.sbl-container .sbl-history-table tbody tr:hover{
  background:#fbfdff !important;
}
.sbl-container .sbl-history-table th.sbl-col-action,
.sbl-container .sbl-history-table td.sbl-col-action{
  text-align:center !important;
  width:16% !important;
}
.sbl-container .sbl-history-table td.sbl-col-action{
  padding-left:10px !important;
  padding-right:10px !important;
}
.sbl-container .sbl-history-table .sbl-col-status span{
  padding:6px 10px !important;
  border-radius:999px !important;
  font-size:11px !important;
  font-weight:700 !important;
}
.sbl-container .sbl-history-table .sbl-col-name{font-weight:700 !important;}
.sbl-container .sbl-history-table .sbl-col-name,
.sbl-container .sbl-history-table .sbl-col-lab{
  white-space:normal !important;
  word-break:break-word !important;
}

.sbl-container .sbl-history-table .sbl-action-group{
  align-items:center !important;
}
.sbl-container .sbl-history-table .sbl-col-action > .sbl-btn,
.sbl-container .sbl-history-table .sbl-action-group .sbl-btn,
.sbl-container .sbl-history-table .sbl-action-group .sbl-wa-btn,
.sbl-container .sbl-wa-btn{
  min-height:40px !important;
  padding:9px 14px !important;
  border-radius:12px !important;
  font-size:14px !important;
  font-weight:700 !important;
  gap:8px !important;
}

@media (min-width: 901px){
  .sbl-container .sbl-history-table .sbl-action-group{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
    width:100% !important;
    max-width:110px !important;
    margin:0 auto !important;
  }
  .sbl-container .sbl-history-table .sbl-col-action > .sbl-btn,
  .sbl-container .sbl-history-table .sbl-action-group .sbl-btn,
  .sbl-container .sbl-history-table .sbl-action-group .sbl-wa-btn{
    width:100% !important;
    justify-content:center !important;
  }
}

@media (max-width: 900px){
  .sbl-container{padding:16px 14px 24px !important;}
  .sbl-container .sbl-topbar{
    flex-direction:column !important;
    align-items:flex-start !important;
    padding:18px !important;
  }
  .sbl-container .sbl-topbar div:last-child{width:100% !important;}
  .sbl-container .sbl-topbar .sbl-btn-outline{width:100% !important;}
  .sbl-container .sbl-grid{grid-template-columns:repeat(2, minmax(0,1fr)) !important;}
  .sbl-container .sbl-history-subtitle{padding-left:0 !important;}
}

@media (max-width: 640px){
  .sbl-container .sbl-card:not(.sbl-auth-card),
  .sbl-container .sbl-history-card{padding:20px !important; border-radius:20px !important;}
  .sbl-container .sbl-grid{grid-template-columns:1fr !important; gap:14px !important;}
  .sbl-container .sbl-card > h2,
  .sbl-container .sbl-card > h3{font-size:17px !important; margin-bottom:18px !important; padding-bottom:14px !important;}
  .sbl-container .sbl-history-title{font-size:17px !important; gap:12px !important;}
  .sbl-container .sbl-history-title-icon{width:42px !important;height:42px !important;flex-basis:42px !important;}
  .sbl-container .sbl-history-table-wrap{border:0 !important; background:transparent !important;}
}


/* ===== SBL v1.8.4 readable status badges ===== */
.sbl-container .sbl-history-table th.sbl-col-status,
.sbl-container .sbl-history-table td.sbl-col-status{
  width:14% !important;
  text-align:left !important;
  overflow:visible !important;
}
.sbl-container .sbl-history-table .sbl-status-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:max-content !important;
  max-width:none !important;
  min-height:30px !important;
  padding:6px 11px !important;
  border-radius:999px !important;
  border:1px solid transparent !important;
  box-shadow:none !important;
  font-size:11.5px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  text-overflow:clip !important;
}
.sbl-container .sbl-status-info{
  background:#eaf3ff !important;
  color:#0b63e5 !important;
  border-color:#cfe2ff !important;
}
.sbl-container .sbl-status-warning{
  background:#fff7df !important;
  color:#9a6700 !important;
  border-color:#f6dfa2 !important;
}
.sbl-container .sbl-status-success{
  background:#eaf8f0 !important;
  color:#16794a !important;
  border-color:#c8ead8 !important;
}
.sbl-container .sbl-status-purple{
  background:#f3efff !important;
  color:#6d4ed6 !important;
  border-color:#ddd2ff !important;
}
.sbl-container .sbl-status-danger{
  background:#fff0f0 !important;
  color:#c43d3d !important;
  border-color:#f3cdcd !important;
}
.sbl-container .sbl-status-neutral{
  background:#f1f5f9 !important;
  color:#526276 !important;
  border-color:#dde5ee !important;
}
@media (max-width:900px){
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-status{
    max-width:none !important;
    overflow:visible !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-status .sbl-status-badge{
    max-width:none !important;
    white-space:nowrap !important;
    overflow:visible !important;
  }
}


/* ===== SBL v1.8.5 mobile history card repair ===== */
@media (max-width: 900px){
  .sbl-container .sbl-history-card{
    overflow:hidden !important;
  }
  .sbl-container .sbl-history-table-wrap,
  .sbl-container .sbl-history-table,
  .sbl-container .sbl-history-table tbody{
    width:100% !important;
    max-width:100% !important;
    overflow:visible !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row{
    position:relative !important;
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 0 16px !important;
    padding:16px !important;
    border:1px solid #e6edf5 !important;
    border-radius:18px !important;
    background:#fff !important;
    box-shadow:0 8px 22px rgba(15,23,42,.04) !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
  }

  /* Header card: checkbox left, status safely inside the card on the right. */
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-select-col{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    flex-direction:row-reverse !important;
    gap:10px !important;
    width:auto !important;
    min-height:42px !important;
    margin:0 132px 6px 0 !important;
    padding:0 0 12px !important;
    border-bottom:1px solid #edf2f7 !important;
    box-sizing:border-box !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-select-col::before{
    content:"Pilih pengajuan" !important;
    display:block !important;
    margin:0 !important;
    color:#526276 !important;
    font-size:13px !important;
    font-weight:700 !important;
    white-space:nowrap !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-status{
    position:absolute !important;
    top:16px !important;
    right:16px !important;
    display:block !important;
    width:auto !important;
    max-width:124px !important;
    padding:0 !important;
    margin:0 !important;
    overflow:hidden !important;
    z-index:2 !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-status::before{
    display:none !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-status .sbl-status-badge{
    display:inline-flex !important;
    width:auto !important;
    max-width:124px !important;
    min-height:28px !important;
    padding:5px 9px !important;
    font-size:10.5px !important;
    line-height:1.15 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    box-sizing:border-box !important;
  }

  /* Compact information rows. */
  .sbl-container .sbl-history-table .sbl-history-row td:not(.sbl-select-col):not(.sbl-col-status):not(.sbl-col-action){
    display:grid !important;
    grid-template-columns:118px minmax(0,1fr) !important;
    align-items:start !important;
    gap:12px !important;
    width:100% !important;
    padding:11px 0 !important;
    margin:0 !important;
    border-bottom:1px solid #f0f3f7 !important;
    color:#334155 !important;
    font-size:14px !important;
    line-height:1.5 !important;
    box-sizing:border-box !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row td:not(.sbl-select-col):not(.sbl-col-status):not(.sbl-col-action)::before{
    content:attr(data-label) !important;
    color:#64748b !important;
    font-size:12.5px !important;
    font-weight:700 !important;
    line-height:1.5 !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-name{
    padding-top:12px !important;
    color:#10233e !important;
    font-size:15px !important;
    font-weight:700 !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-lab,
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-time{
    overflow-wrap:anywhere !important;
    word-break:normal !important;
  }

  /* Empty document fields do not need to consume space on mobile. */
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-empty-cell{
    display:none !important;
  }

  /* Action area remains vertical but proportionate and centered. */
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-col-action{
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:15px 0 0 !important;
    border-top:0 !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-col-action::before{
    content:"Aksi" !important;
    display:block !important;
    margin:0 0 10px !important;
    color:#64748b !important;
    font-size:12.5px !important;
    font-weight:700 !important;
    text-align:left !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-col-action .sbl-action-group{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:8px !important;
    width:min(220px,100%) !important;
    max-width:100% !important;
    margin:0 auto !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-col-action .sbl-action-group > *{
    width:100% !important;
    max-width:100% !important;
    min-height:44px !important;
    padding:10px 14px !important;
    margin:0 !important;
    border-radius:12px !important;
    justify-content:center !important;
    box-sizing:border-box !important;
  }
}

@media (max-width: 430px){
  .sbl-container .sbl-history-table .sbl-history-row{
    padding:14px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-select-col{
    margin-right:112px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-status{
    top:14px !important;
    right:14px !important;
    max-width:106px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-status .sbl-status-badge{
    max-width:106px !important;
    font-size:10px !important;
    padding:5px 8px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row td:not(.sbl-select-col):not(.sbl-col-status):not(.sbl-col-action){
    grid-template-columns:104px minmax(0,1fr) !important;
    gap:10px !important;
  }
}


/* ===== SBL v1.8.6 mobile checkbox-only header ===== */
@media (max-width: 900px){
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-select-col{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:0 !important;
    width:100% !important;
    min-height:42px !important;
    margin:0 0 6px 0 !important;
    padding:0 140px 12px 0 !important;
    border-bottom:1px solid #edf2f7 !important;
    box-sizing:border-box !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-select-col::before{
    display:none !important;
    content:none !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-select-col .sbl-row-select{
    display:block !important;
    flex:0 0 auto !important;
    margin:0 !important;
  }
}
@media (max-width: 430px){
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-select-col{
    margin:0 0 6px 0 !important;
    padding-right:118px !important;
  }
}


/* ===== SBL v1.8.9 consistent filter action buttons ===== */
.sbl-container .sbl-history-filter-actions{
  display:grid !important;
  grid-template-columns:repeat(2, 124px) !important;
  gap:10px !important;
  align-items:end !important;
  justify-content:start !important;
}
.sbl-container .sbl-history-filter-actions .sbl-btn,
.sbl-container .sbl-history-filter-actions .sbl-history-reset{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:124px !important;
  min-width:124px !important;
  max-width:124px !important;
  height:50px !important;
  min-height:50px !important;
  padding:0 18px !important;
  margin:0 !important;
  border-radius:14px !important;
  font-size:15px !important;
  font-weight:700 !important;
  line-height:1 !important;
  text-decoration:none !important;
  box-sizing:border-box !important;
  box-shadow:none !important;
}
.sbl-container .sbl-history-filter-actions button.sbl-btn{
  background:#0b63e5 !important;
  color:#ffffff !important;
  border:1px solid #0b63e5 !important;
}
.sbl-container .sbl-history-filter-actions button.sbl-btn:hover{
  background:#084db3 !important;
  border-color:#084db3 !important;
}
.sbl-container .sbl-history-filter-actions .sbl-history-reset{
  background:#ffffff !important;
  color:#0b63e5 !important;
  border:1px solid #9fc0f0 !important;
}
.sbl-container .sbl-history-filter-actions .sbl-history-reset:hover,
.sbl-container .sbl-history-filter-actions .sbl-history-reset:focus{
  background:#eff6ff !important;
  color:#084db3 !important;
  border-color:#0b63e5 !important;
}
@media (max-width:640px){
  .sbl-container .sbl-history-filter-actions{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    width:100% !important;
  }
  .sbl-container .sbl-history-filter-actions .sbl-btn,
  .sbl-container .sbl-history-filter-actions .sbl-history-reset{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:48px !important;
    min-height:48px !important;
  }
}


/* ===== SBL v1.9.3 mahasiswa mobile status spacing ===== */
@media (max-width:640px){
  /* For cards without a selectable checkbox (mahasiswa history cards),
     reserve a dedicated header area so the status badge does not overlap the name. */
  .sbl-container .sbl-history-table .sbl-history-row:not(:has(td.sbl-select-col .sbl-row-select)) td.sbl-select-col{
    display:none !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row:not(:has(td.sbl-select-col .sbl-row-select)) .sbl-col-status{
    top:14px !important;
    right:14px !important;
    max-width:124px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row:not(:has(td.sbl-select-col .sbl-row-select)) .sbl-col-status .sbl-status-badge{
    max-width:124px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row:not(:has(td.sbl-select-col .sbl-row-select)) .sbl-col-name{
    padding-top:40px !important;
    padding-right:126px !important;
    min-height:56px !important;
    align-items:start !important;
  }
}
@media (max-width:430px){
  .sbl-container .sbl-history-table .sbl-history-row:not(:has(td.sbl-select-col .sbl-row-select)) .sbl-col-status{
    top:12px !important;
    right:12px !important;
    max-width:112px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row:not(:has(td.sbl-select-col .sbl-row-select)) .sbl-col-status .sbl-status-badge{
    max-width:112px !important;
    font-size:10px !important;
    padding:5px 8px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row:not(:has(td.sbl-select-col .sbl-row-select)) .sbl-col-name{
    padding-top:38px !important;
    padding-right:114px !important;
    min-height:54px !important;
  }
}

/* ===== SBL v1.9.4 mahasiswa mobile name + status cleanup ===== */
@media (max-width: 900px){
  /* Keep the top checkbox row ending before the status badge, so no divider line appears under the badge. */
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-select-col{
    width:auto !important;
    margin:0 0 8px 0 !important;
    padding:0 136px 12px 0 !important;
    border-bottom:1px solid #edf2f7 !important;
  }

  /* Lift the status badge slightly and make it cleaner. */
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-status{
    top:10px !important;
    right:14px !important;
    max-width:132px !important;
    background:#fff !important;
    padding-left:6px !important;
    z-index:3 !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-status .sbl-status-badge{
    min-height:30px !important;
    max-width:132px !important;
    padding:6px 10px !important;
    box-shadow:none !important;
  }

  /* Keep the student name horizontal on one line when possible. */
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-name{
    grid-template-columns:104px minmax(0,1fr) !important;
    padding-top:14px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-name:not(.sbl-empty-cell){
    overflow:visible !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-name:not(.sbl-empty-cell) > *:last-child,
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-col-name{
    white-space:nowrap !important;
    word-break:normal !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
}

@media (max-width: 430px){
  .sbl-container .sbl-history-table .sbl-history-row td.sbl-select-col{
    padding-right:126px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-status{
    top:10px !important;
    right:12px !important;
    max-width:118px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-status .sbl-status-badge{
    max-width:118px !important;
    font-size:10.5px !important;
    padding:6px 10px !important;
  }
  .sbl-container .sbl-history-table .sbl-history-row .sbl-col-name{
    grid-template-columns:96px minmax(0,1fr) !important;
  }
}