/* ═══════════════════════════════════════════════════════════════
   SNLM Portal Styles
   ═══════════════════════════════════════════════════════════════ */

/* ── Toast notification ───────────────────────────────────────── */
.snlm-toast {
    position: fixed;
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    background: #1e293b;
    color: #f1f5f9;
    padding: 12px 22px;
    border-radius: 10px;
    font-size: 0.88rem;
    max-width: 88vw;
    text-align: center;
    box-shadow: 0 8px 32px rgba(0,0,0,.35);
    opacity: 0;
    transition: opacity .3s ease, transform .3s ease;
    z-index: 10000001;
    pointer-events: none;
}
.snlm-toast.snlm-toast-show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* ── Reset / Base ─────────────────────────────────────────────── */
.snlm-portal *,
.snlm-portal *::before,
.snlm-portal *::after {
    box-sizing: border-box;
}

.snlm-portal {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    max-width: 1040px;
    margin: 0 auto;
    color: #1e293b;
    font-size: 0.95rem;
    line-height: 1.5;
}

/* ── Sticky Header (portal header + tabs together) ────────────── */
.snlm-sticky-header {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 200 !important;
    background: #fff !important;
}

/* ── Portal Header ────────────────────────────────────────────── */
.snlm-portal-header {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    padding: 14px 0 10px;
    border-bottom: none;
    margin-bottom: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.snlm-portal-header::-webkit-scrollbar {
    display: none;
}

.snlm-portal-header h2 {
    margin: 0;
    font-size: clamp(1rem, 2.5vw, 1.5rem);
    font-weight: 700;
    color: #0f172a;
    white-space: nowrap;
}

/* ── Badges ───────────────────────────────────────────────────── */
.snlm-badge {
    background: #1e293b;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 999px;
    letter-spacing: .03em;
    flex-shrink: 0;
    white-space: nowrap;
}

.snlm-badge-warning {
    background: #f59e0b;
}

.snlm-tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ef4444;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    margin-left: 5px;
}

/* ── Tabs ─────────────────────────────────────────────────────── */
.snlm-tabs-wrapper {
    display: flex;
    align-items: flex-end;
    gap: 6px;
    border-bottom: 2px solid #e2e8f0;
    margin-bottom: 24px;
    padding-top: 6px;
    background: #fff;
}

.snlm-portal .snlm-tabs-arrow,
.snlm-portal .snlm-tabs-arrow:visited {
    flex-shrink: 0 !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.75) !important;
    backdrop-filter: blur(4px);
    border: 1px solid #cbd5e1 !important;
    color: #475569 !important;
    font-size: 20px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    display: none;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1) !important;
    padding: 0 !important;
    margin-bottom: 6px !important;
    transition: background .15s !important;
    text-decoration: none !important;
}

.snlm-portal .snlm-tabs-arrow:hover {
    background: rgba(226, 232, 240, 0.9) !important;
    color: #0f172a !important;
}

.snlm-portal .snlm-tabs-arrow.snlm-arrow-visible {
    display: flex !important;
}

.snlm-tabs {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 4px;
}

.snlm-tabs::-webkit-scrollbar {
    display: none;
}

.snlm-tab-btn {
    background: none;
    border: none;
    padding: 10px 18px;
    font-size: 0.88rem;
    font-weight: 600;
    color: #64748b;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    border-radius: 6px 6px 0 0;
    transition: color .15s, border-color .15s;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    white-space: nowrap;
}

.snlm-tab-btn:hover {
    color: #0f3460;
}

.snlm-tab-btn.active {
    color: #0f3460;
    border-bottom-color: #0f3460;
    background: #f8fafc;
}

.snlm-tab-content {
    display: none;
}

.snlm-tab-content.active {
    display: block;
}

/* ── Cards & Grid ─────────────────────────────────────────────── */
.snlm-portal-body {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-height: 60vh;
    padding-bottom: 60px;
}

.snlm-cards-grid {
    display: grid;
    grid-template-columns: repeat( auto-fill, minmax( 260px, 1fr ) );
    gap: 20px;
}

.snlm-cards-grid.snlm-col-2 {
    grid-template-columns: repeat( 2, 1fr );
}

@media ( max-width: 640px ) {
    .snlm-cards-grid,
    .snlm-cards-grid.snlm-col-2 {
        grid-template-columns: 1fr;
    }
}

.snlm-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px 24px;
    box-shadow: 0 1px 4px rgba( 0,0,0,.05 );
}

.snlm-card-title {
    margin: 0 0 16px;
    font-size: 0.78rem;
    font-weight: 700;
    color: #0f3460;
    text-transform: uppercase;
    letter-spacing: .06em;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ── Stat Cards ───────────────────────────────────────────────── */
.snlm-stats-grid {
    display: grid;
    grid-template-columns: repeat( auto-fill, minmax( 180px, 1fr ) );
    gap: 16px;
}

.snlm-stat-card {
    text-align: center;
    padding: 28px 16px;
}

.snlm-stat-value {
    font-size: 1.75rem;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.1;
    margin-bottom: 6px;
}

.snlm-stat-label {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.snlm-stat-blue   { border-top: 4px solid #3b82f6 !important; }
.snlm-stat-green  { border-top: 4px solid #22c55e !important; }
.snlm-stat-orange { border-top: 4px solid #f97316 !important; }
.snlm-stat-teal   { border-top: 4px solid #14b8a6 !important; }
.snlm-stat-yellow { border-top: 4px solid #eab308 !important; }
.snlm-stat-purple { border-top: 4px solid #a855f7 !important; }
.snlm-stat-red    { border-top: 4px solid #ef4444 !important; }

/* ── Tables ───────────────────────────────────────────────────── */
.snlm-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.snlm-table {
    width: 100%;
    min-width: max-content;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.snlm-table th,
.snlm-table td {
    padding: 10px 14px;
    text-align: left;
    border-bottom: 1px solid #f1f5f9;
    white-space: nowrap;
}

.snlm-table th {
    font-size: 0.73rem;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: .05em;
    white-space: nowrap;
    background: #f8fafc;
}

.snlm-table tbody tr:hover {
    background: #f8fafc;
}

tr.snlm-client-row {
    cursor: pointer;
}

.snlm-table tfoot tr {
    background: #f1f5f9;
    font-weight: 700;
}

.snlm-total-row td,
.snlm-total-row th {
    font-weight: 700;
    border-top: 2px solid #e2e8f0;
    color: #0f172a;
}

.snlm-preview-table th {
    width: 50%;
    background: none;
    color: #64748b;
    text-transform: none;
    letter-spacing: 0;
    font-size: 0.875rem;
    font-weight: 600;
}

/* ── Status Badges ────────────────────────────────────────────── */
.snlm-status {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.snlm-status-pending    { background: #fef3c7; color: #92400e; }
.snlm-status-approved   { background: #dbeafe; color: #1e40af; }
.snlm-status-active     { background: #dcfce7; color: #166534; }
.snlm-status-rejected   { background: #fee2e2; color: #991b1b; }
.snlm-status-completed  { background: #f1f5f9; color: #475569; }
.snlm-status-overdue    { background: #fee2e2; color: #991b1b; }
.snlm-status-processing { background: #dbeafe; color: #1e40af; }
.snlm-status-on-hold    { background: #ede9fe; color: #5b21b6; }
.snlm-status-failed     { background: #fee2e2; color: #991b1b; }
.snlm-col-due-today   { background: #fef9c3; color: #713f12; }

/* ── Desktop More Dropdown ────────────────────────────────────── */
.snlm-desktop-more-wrap { position: relative; display: inline-flex; align-items: stretch; }
.snlm-desktop-more-btn {
    background: #dc2626;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 6px 16px;
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    align-self: center;
    transition: background .15s;
    letter-spacing: .04em;
}
.snlm-desktop-more-btn:hover { background: #b91c1c; }
.snlm-desktop-dropdown  {
    position: fixed;   /* escapes overflow:auto on .snlm-tabs */
    min-width: 200px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0,0,0,.15);
    padding: 6px 0;
    z-index: 99999;
}
.snlm-desktop-dd-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 16px;
    background: none;
    border: none;
    cursor: pointer;
    font-size: .88rem;
    color: #0f172a;
    text-align: left;
    transition: background .15s;
}
.snlm-desktop-dd-item:hover { background: #f1f5f9; }
.snlm-desktop-dd-divider    { height: 1px; background: #e2e8f0; margin: 4px 0; }

[data-kenta-theme="dark"] .snlm-desktop-dropdown { background:#1e293b; border-color:#334155; }
[data-kenta-theme="dark"] .snlm-desktop-dd-item  { color:#e2e8f0; }
[data-kenta-theme="dark"] .snlm-desktop-dd-item:hover { background:#243044; }
[data-kenta-theme="dark"] .snlm-desktop-dd-divider    { background:#334155; }

/* ── Transaction Type Badges ──────────────────────────────────── */
.snlm-tx-type {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.snlm-tx-disbursement { background: #dcfce7; color: #166534; }
.snlm-tx-repayment    { background: #dbeafe; color: #1e40af; }
.snlm-tx-fee          { background: #fef3c7; color: #92400e; }
.snlm-tx-adjustment   { background: #f3e8ff; color: #6b21a8; }
.snlm-tx-penalty      { background: #fee2e2; color: #991b1b; }

/* ── Forms ────────────────────────────────────────────────────── */
.snlm-form-row {
    margin-bottom: 16px;
}

.snlm-form-row label {
    display: block;
    font-size: 0.82rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 6px;
}

.snlm-form-row input[type="text"],
.snlm-form-row input[type="number"],
.snlm-form-row input[type="tel"],
.snlm-form-row input[type="email"],
.snlm-form-row select {
    width: 100%;
    padding: 9px 12px;
    border: 1.5px solid #cbd5e1;
    border-radius: 7px;
    font-size: 0.9rem;
    color: #1e293b;
    background: #fff;
    transition: border-color .15s;
    appearance: auto;
}

.snlm-form-row input:focus,
.snlm-form-row select:focus {
    outline: none;
    border-color: #0f3460;
    box-shadow: 0 0 0 3px rgba( 15,52,96,.1 );
}

.snlm-hint {
    font-size: 0.78rem;
    color: #94a3b8;
    margin-top: 4px;
    display: block;
}

.snlm-hint-text {
    font-size: 0.82rem;
    color: #94a3b8;
    margin: 0 0 16px;
}

.snlm-inline-input {
    width: 90px !important;
    padding: 5px 8px !important;
    display: inline-block;
}

.snlm-rate-row {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* ── Buttons ──────────────────────────────────────────────────── */
.snlm-btn {
    display: inline-block;
    padding: 10px 24px;
    border: none;
    border-radius: 7px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: opacity .15s;
    line-height: 1;
}

.snlm-btn:hover {
    opacity: .88;
}

.snlm-btn:disabled {
    opacity: .5;
    cursor: not-allowed;
}

.snlm-btn-sm {
    padding: 6px 14px;
    font-size: 0.78rem;
}


/* ── Actions Cell ─────────────────────────────────────────────── */
.snlm-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

/* ── Back Button ──────────────────────────────────────────────── */
.snlm-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #64748b !important;
    text-decoration: none;
    padding: 6px 12px;
    border: 1.5px solid #e2e8f0;
    border-radius: 7px;
    transition: border-color .15s, color .15s;
}

.snlm-back-btn:hover {
    border-color: #0f3460;
    color: #0f3460 !important;
}

/* ── Settings Footer ──────────────────────────────────────────── */
.snlm-settings-footer {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 16px;
}

/* ── Form Message ─────────────────────────────────────────────── */
.snlm-form-msg {
    font-size: 0.85rem;
    font-weight: 600;
}

/* ── Empty / Access States ────────────────────────────────────── */
.snlm-placeholder {
    color: #94a3b8;
    font-style: italic;
    margin: 0;
}

.snlm-login-notice,
.snlm-access-denied {
    text-align: center;
    padding: 56px 24px;
    border: 1.5px dashed #cbd5e1;
    border-radius: 12px;
    color: #64748b;
}

/* ── Modal ────────────────────────────────────────────────────── */
.snlm-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.snlm-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba( 0,0,0,.5 );
}

.snlm-modal-box {
    position: relative;
    z-index: 1;
    background: #fff;
    border-radius: 14px;
    padding: 32px;
    width: 100%;
    max-width: 460px;
    margin: 16px;
    box-shadow: 0 20px 60px rgba( 0,0,0,.2 );
    animation: snlmSlideIn .2s ease;
}

@keyframes snlmSlideIn {
    from { transform: translateY( -20px ); opacity: 0; }
    to   { transform: translateY( 0 );    opacity: 1; }
}

.snlm-modal-box h3 {
    margin: 0 0 6px;
    font-size: 1.2rem;
    font-weight: 700;
}

.snlm-modal-actions {
    display: flex;
    gap: 10px;
    margin-top: 20px;
}

.snlm-modal-actions .snlm-btn {
    flex: 1;
    text-align: center;
}

/* ── Bar Chart ────────────────────────────────────────────────── */
.snlm-bar-chart {
    padding-top: 8px;
}

.snlm-bars {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    height: 120px;
    padding-bottom: 24px;
    position: relative;
    border-bottom: 2px solid #e2e8f0;
}

.snlm-bar-wrap {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
}

.snlm-bar {
    width: 100%;
    max-width: 48px;
    background: linear-gradient( 180deg, #3b82f6, #0f3460 );
    border-radius: 4px 4px 0 0;
    min-height: 4px;
    transition: opacity .15s;
    cursor: default;
}

.snlm-bar:hover {
    opacity: .8;
}

.snlm-bar-label {
    position: absolute;
    bottom: 0;
    font-size: 0.72rem;
    color: #94a3b8;
    font-weight: 600;
    margin-top: 4px;
}

/* ═══════════════════════════════════════════════════════════════
   NEW: Client ID Badge
   ═══════════════════════════════════════════════════════════════ */
.snlm-id-badge {
    display: inline-block;
    font-family: monospace;
    font-size: 0.78rem;
    font-weight: 700;
    background: rgba( 15, 52, 96, .08 );
    color: #0f3460;
    padding: 2px 9px;
    border-radius: 5px;
    border: 1px solid rgba( 15, 52, 96, .2 );
    letter-spacing: .03em;
}

.snlm-unset {
    color: #94a3b8;
    font-style: italic;
}

/* ═══════════════════════════════════════════════════════════════
   NEW: Filter Bar
   ═══════════════════════════════════════════════════════════════ */
.snlm-filter-bar {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}

.snlm-filter-input {
    flex: 1;
    min-width: 200px;
    padding: 9px 12px;
    border: 1.5px solid #e2e8f0;
    border-radius: 7px;
    font-size: 0.875rem;
    color: #1e293b;
    background: #f8fafc;
    outline: none;
    transition: border-color .15s;
}

.snlm-filter-input:focus {
    border-color: #0f3460;
    background: #fff;
}

.snlm-filter-select {
    padding: 9px 12px;
    border: 1.5px solid #e2e8f0;
    border-radius: 7px;
    font-size: 0.875rem;
    color: #1e293b;
    background: #f8fafc;
    outline: none;
    cursor: pointer;
    transition: border-color .15s;
}

.snlm-filter-select:focus {
    border-color: #0f3460;
}

/* ═══════════════════════════════════════════════════════════════
   NEW: Client Popup
   ═══════════════════════════════════════════════════════════════ */
body.snlm-popup-open {
    overflow: hidden;
}

.snlm-popup {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 16px;
    overflow-y: auto;
}

.snlm-popup-overlay {
    position: fixed;
    inset: 0;
    background: rgba( 0, 0, 0, .55 );
    backdrop-filter: blur( 2px );
}

.snlm-popup-box {
    position: relative;
    z-index: 1;
    background: #fff;
    border-radius: 16px;
    width: 100%;
    max-width: 860px;
    margin: auto;
    box-shadow: 0 24px 80px rgba( 0, 0, 0, .25 );
    animation: snlmPopupIn .2s ease;
    overflow: hidden;
}

@keyframes snlmPopupIn {
    from { transform: translateY( -24px ); opacity: 0; }
    to   { transform: translateY( 0 );    opacity: 1; }
}

/* Popup Header */
.snlm-popup-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 20px 24px 16px;
    border-bottom: 1px solid #f1f5f9;
    background: linear-gradient( 135deg, #0f172a, #1e3a5f );
}

.snlm-popup-head-info h3 {
    margin: 0 0 6px;
    font-size: 1.15rem;
    font-weight: 700;
    color: #fff;
}

.snlm-popup-head .snlm-id-badge {
    background: rgba( 255, 255, 255, .12 );
    color: #7dd3fc;
    border-color: rgba( 125, 211, 252, .3 );
}

.snlm-popup-close {
    background: rgba( 255, 255, 255, .12 );
    border: none;
    color: #fff;
    font-size: 1.3rem;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .15s;
    flex-shrink: 0;
    margin-top: 2px;
}

.snlm-popup-close:hover {
    background: rgba( 255, 255, 255, .25 );
}

/* Popup Tabs */
.snlm-popup-tabs {
    display: flex;
    gap: 0;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    overflow-x: auto;
}

.snlm-ptab-btn {
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 12px 18px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #64748b;
    cursor: pointer;
    white-space: nowrap;
    transition: color .15s, border-color .15s;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.snlm-ptab-btn:hover { color: #0f172a; }
.snlm-ptab-btn.active {
    color: #0f3460;
    border-bottom-color: #0f3460;
    background: #fff;
}

/* ── Full Profile Tab ─────────────────────────────────────────────── */

/* Hero strip at the top */
.snlm-fp-hero {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 20px 16px;
    background: linear-gradient( 135deg, #0f3460 0%, #1a4a8a 100% );
    color: #fff;
    border-radius: 0;
}
.snlm-fp-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid rgba(255,255,255,.4);
    flex-shrink: 0;
}
.snlm-fp-avatar-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.2);
    color: #fff;
    font-size: 1.4rem;
    font-weight: 700;
}
.snlm-fp-hero-text { display: flex; flex-direction: column; gap: 3px; }
.snlm-fp-hero-text strong { font-size: 1.05rem; }
.snlm-fp-hero-text span  { font-size: .8rem; opacity: .85; }
.snlm-fp-hero-text .snlm-badge { align-self: flex-start; margin-top: 4px; background: rgba(255,255,255,.2); color: #fff; border: none; }

/* Info grid */
.snlm-fp-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 16px;
}
@media ( max-width: 560px ) { .snlm-fp-grid { grid-template-columns: 1fr; } }

.snlm-fp-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    overflow: hidden;
}
.snlm-fp-card-head {
    background: #fff;
    border-bottom: 1px solid #e2e8f0;
    padding: 8px 14px;
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: #0f3460;
}
.snlm-fp-dl {
    margin: 0;
    padding: 10px 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.snlm-fp-dl > div { display: grid; grid-template-columns: 110px 1fr; gap: 6px; align-items: baseline; }
.snlm-fp-dl dt { font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: #64748b; }
.snlm-fp-dl dd { margin: 0; font-size: .88rem; color: #0f172a; word-break: break-word; }
.snlm-fp-dl dd em { color: #94a3b8; font-style: normal; }

/* ID card thumbnails */
.snlm-fp-id-images { display: flex; gap: 10px; padding: 10px 14px; flex-wrap: wrap; }
.snlm-fp-id-thumb {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-decoration: none;
}
.snlm-fp-id-thumb img {
    width: 110px;
    height: 70px;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    transition: opacity .15s;
}
.snlm-fp-id-thumb:hover img { opacity: .85; }
.snlm-fp-id-thumb span { font-size: .7rem; color: #64748b; font-weight: 600; }

/* ID thumb as link + avatar link */
a.snlm-fp-id-thumb { text-decoration: none; }
.snlm-fp-avatar-btn {
    display: inline-block;
    border-radius: 50%;
    cursor: pointer;
    text-decoration: none;
    line-height: 0;
}
.snlm-fp-avatar-btn:hover img { opacity: .85; }

/* Image lightbox overlay */
@keyframes snlmLightboxIn {
    from { opacity: 0; transform: scale(.88); }
    to   { opacity: 1; transform: scale(1);   }
}
#snlm-img-lightbox {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.88);
    z-index: 10000000;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: zoom-out;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}
#snlm-img-lightbox img {
    max-width: 92vw;
    max-height: 88vh;
    border-radius: 10px;
    box-shadow: 0 32px 80px rgba(0,0,0,.7);
    cursor: default;
    animation: snlmLightboxIn .2s ease;
}
#snlm-img-lightbox-close {
    position: absolute;
    top: 18px;
    right: 22px;
    background: rgba(255,255,255,.18);
    border: 1px solid rgba(255,255,255,.25);
    color: #fff;
    font-size: 1.5rem;
    line-height: 1;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .15s;
}
#snlm-img-lightbox-close:hover { background: rgba(255,255,255,.32); }

/* Footer */
.snlm-fp-footer { padding: 0 16px 16px; }

/* Dark mode */
[data-kenta-theme="dark"] .snlm-fp-card           { background: #162032; border-color: #334155; }
[data-kenta-theme="dark"] .snlm-fp-card-head       { background: #1e293b; border-color: #334155; color: #93c5fd; }
[data-kenta-theme="dark"] .snlm-fp-dl dt           { color: #64748b; }
[data-kenta-theme="dark"] .snlm-fp-dl dd           { color: #e2e8f0; }
[data-kenta-theme="dark"] .snlm-fp-id-thumb img    { border-color: #334155; }

/* Popup Body */
.snlm-popup-body {
    padding: 0;
    max-height: 72vh;
    overflow-y: auto;
    overflow-x: hidden; /* clips sliding tab panels during swipe */
}

.snlm-ptab-content {
    display: none;
    padding: 20px 24px;
}

.snlm-ptab-content.active {
    display: block;
    will-change: transform; /* smooth GPU-accelerated slide */
}

/* Stats Strip inside popup */
.snlm-popup-stats {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 20px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 14px 18px;
}

.snlm-popup-stat {
    flex: 1;
    min-width: 100px;
    text-align: center;
}

.snlm-popup-stat .val {
    display: block;
    font-size: 1.05rem;
    font-weight: 800;
    color: #0f172a;
}

.snlm-popup-stat .lbl {
    display: block;
    font-size: 0.68rem;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-top: 2px;
}

.snlm-popup-stat.snlm-stat-green .val { color: #16a34a; }
.snlm-popup-stat.snlm-stat-red .val   { color: #dc2626; }

/* Two-column grid inside popup */
.snlm-popup-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

@media ( max-width: 600px ) {
    .snlm-popup-two-col { grid-template-columns: 1fr; }
}

/* Stacked info list (Client Info inside popup) */
.snlm-info-stack {
    margin: 0;
    padding: 0;
    list-style: none;
}

.snlm-info-row {
    display: flex;
    flex-direction: column;
    padding: 8px 0;
    border-bottom: 1px solid #f1f5f9;
}

.snlm-info-row:last-child {
    border-bottom: none;
}

.snlm-info-row dt {
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: 2px;
}

.snlm-info-row dd {
    margin: 0;
    font-size: 0.9rem;
    color: #0f172a;
    word-break: break-word;
}

/* Logout tab styling */
.snlm-tab-btn.snlm-logout-tab {
    background: #dc2626 !important;
    color: #fff !important;
    border-radius: 6px 6px 0 0;
    border-bottom-color: #dc2626 !important;
}

.snlm-tab-btn.snlm-logout-tab:hover {
    background: #b91c1c !important;
    color: #fff !important;
    border-bottom-color: #b91c1c !important;
}

/* Loading state */
.snlm-popup-loading {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 40px 24px;
    color: #64748b;
    font-size: 0.9rem;
}

.snlm-spinner {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid #e2e8f0;
    border-top-color: #0f3460;
    border-radius: 50%;
    animation: snlmSpin .7s linear infinite;
    flex-shrink: 0;
}

@keyframes snlmSpin {
    to { transform: rotate( 360deg ); }
}


/* ── Link-style button ────────────────────────────────────────── */
.snlm-link-btn {
    background: none;
    border: none;
    padding: 0;
    color: inherit;
    font-weight: 600;
    font-size: 0.875rem;
    cursor: pointer;
    text-decoration: none;
}

.snlm-link-btn:hover {
    text-decoration: underline;
}

/* ── Tab swipe transition ─────────────────────────────────────── */
.snlm-portal-body {
    position: relative;
    overflow-x: hidden; /* clips sliding tabs */
}

/* ── Pagination ───────────────────────────────────────────────── */
.snlm-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 12px 0 4px;
}

.snlm-page-btn {
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    color: #475569;
    transition: background .12s;
}

.snlm-page-btn:hover { background: #e2e8f0; }
.snlm-page-btn.active { background: #0f3460; color: #fff; border-color: #0f3460; }

/* ── Autocomplete list (payments tab client search) ───────────── */
.snlm-autocomplete-list {
    position: absolute;
    z-index: 300;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,.1);
    max-height: 220px;
    overflow-y: auto;
    width: 100%;
}

.snlm-autocomplete-item {
    padding: 9px 14px;
    cursor: pointer;
    font-size: 0.88rem;
    color: #1e293b;
    transition: background .1s;
}

.snlm-autocomplete-item:hover { background: #f1f5f9; }
.snlm-autocomplete-item small { color: #64748b; }

/* ── Warning button variant (filled) ─────────────────────────── */
.snlm-btn-warning {
    background: #f59e0b;
    color: #fff;
    border-color: #f59e0b;
}

.snlm-btn-warning:hover { background: #d97706; border-color: #d97706; }

/* ── Print / PDF ──────────────────────────────────────────────── */
/* No global print overrides — Ctrl+P prints the full page normally.
   Stats-only PDF is handled via a dedicated JS popup window. */

/* ═══════════════════════════════════════════════════════════════
   Fee Status / Loan Repayment Card
   ═══════════════════════════════════════════════════════════════ */
.snlm-fee-status-card {
    max-width: 480px;
    padding: 28px 28px;
    margin-bottom: 24px;
    box-shadow: 0 6px 24px rgba( 0, 0, 0, .10 ), 0 1px 4px rgba( 0, 0, 0, .06 );
    border-radius: 16px;
}

/* Card header */
.snlm-fee-card-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
}

.snlm-fee-card-icon {
    font-size: 1.1rem;
    line-height: 1;
}

.snlm-fee-card-title {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -.01em;
}

/* Reference line (#ID + description) */
.snlm-fee-ref {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #f1f5f9;
}

.snlm-fee-ref-id {
    font-size: 0.78rem;
    color: #94a3b8;
    font-weight: 600;
}

.snlm-fee-ref-desc {
    font-size: 0.88rem;
    font-weight: 600;
    color: #475569;
}

/* Detail rows */
.snlm-fee-details {
    margin-bottom: 4px;
}

.snlm-fee-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 0;
    border-bottom: 1px solid #f8fafc;
    font-size: 0.9rem;
}

.snlm-fee-row-label {
    color: #64748b;
}

.snlm-fee-row-value {
    font-weight: 600;
    color: #1e293b;
}

.snlm-fee-row-strong .snlm-fee-row-label,
.snlm-fee-row-strong .snlm-fee-row-value {
    font-weight: 700;
    color: #0f172a;
}

.snlm-fee-row-repaid .snlm-fee-row-label,
.snlm-fee-row-repaid .snlm-fee-row-value {
    color: #16a34a;
}

/* Balance Due box */
.snlm-balance-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff1f2;
    border: 1.5px solid #fecdd3;
    border-radius: 10px;
    padding: 15px 18px;
    margin: 20px 0 16px;
}

.snlm-balance-label {
    font-size: 0.95rem;
    font-weight: 700;
    color: #be123c;
}

.snlm-balance-amount {
    font-size: 1.4rem;
    font-weight: 800;
    color: #be123c;
    letter-spacing: -.02em;
}

.snlm-balance-box-paid {
    background: #f0fdf4;
    border-color: #bbf7d0;
    margin-bottom: 12px;
}

.snlm-balance-box-paid .snlm-balance-label,
.snlm-balance-box-paid .snlm-balance-amount {
    color: #15803d;
}

/* Full-width button */
.snlm-btn-full {
    display: block;
    width: 100%;
    text-align: center;
    padding: 13px 20px;
    font-size: 0.95rem;
    margin-bottom: 0;
}

/* Custom installment section */
.snlm-installment-section {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 16px;
    margin-top: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.snlm-installment-label {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin: 0;
}

.snlm-installment-input {
    width: 100%;
    padding: 12px 14px;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    font-size: 1rem;
    color: #1e293b;
    background: #fff;
    box-sizing: border-box;
    transition: border-color .15s;
    appearance: auto;
}

.snlm-installment-input:focus {
    outline: none;
    border-color: #0f3460;
    box-shadow: 0 0 0 3px rgba( 15, 52, 96, .1 );
}

.snlm-repay-complete {
    text-align: center;
    color: #15803d;
    padding: 12px 0 4px;
    margin: 0;
    font-size: 0.95rem;
}

/* ═══════════════════════════════════════════════════════════════
   Apply Card & Notice
   ═══════════════════════════════════════════════════════════════ */
.snlm-apply-card {
    max-width: 540px;
}

.snlm-apply-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 20px;
}

@media ( max-width: 520px ) {
    .snlm-apply-fields { grid-template-columns: 1fr; }
}

.snlm-notice {
    border-radius: 8px;
    padding: 11px 16px;
    font-size: 0.85rem;
    font-weight: 500;
    margin-bottom: 18px;
    line-height: 1.5;
}

.snlm-notice-warning {
    background: #fffbeb;
    border: 1px solid #fde68a;
    color: #92400e;
}

/* ═══════════════════════════════════════════════════════════════
   Loan Preview Modal (improved)
   ═══════════════════════════════════════════════════════════════ */
.snlm-loan-modal-box {
    max-width: 520px;
}

.snlm-modal-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}

.snlm-modal-head h3 {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a;
}

.snlm-modal-x {
    background: #f1f5f9;
    border: none;
    font-size: 1.2rem;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #64748b;
    line-height: 1;
    flex-shrink: 0;
    transition: background .15s;
}

.snlm-modal-x:hover {
    background: #e2e8f0;
    color: #0f172a;
}

.snlm-modal-sub {
    font-size: 0.82rem;
    color: #94a3b8;
    margin: 0 0 16px;
    line-height: 1.5;
}

.snlm-modal-client-strip {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 14px;
    margin-bottom: 16px;
}

.snlm-modal-client-name {
    font-weight: 700;
    font-size: 0.95rem;
    color: #0f172a;
    flex: 1;
}

/* Breakdown rows */
.snlm-modal-breakdown {
    margin-bottom: 4px;
}

.snlm-modal-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 0;
    border-bottom: 1px solid #f1f5f9;
    font-size: 0.9rem;
}

.snlm-modal-row-label {
    color: #64748b;
}

.snlm-modal-row-value {
    font-weight: 600;
    color: #1e293b;
}

.snlm-modal-row-highlight {
    color: #0f3460;
}

/* Total callout */
.snlm-modal-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #eff6ff;
    border: 1.5px solid #bfdbfe;
    border-radius: 9px;
    padding: 14px 16px;
    margin: 16px 0;
}

.snlm-modal-total-label {
    font-size: 0.92rem;
    font-weight: 700;
    color: #1e40af;
}

.snlm-modal-total-value {
    font-size: 1.3rem;
    font-weight: 800;
    color: #1e40af;
}

/* Confirm notice */
.snlm-tc-notice {
    font-size: 0.8rem;
    color: #94a3b8;
    margin: 0 0 16px;
    line-height: 1.5;
    font-style: italic;
}

.snlm-tc-notice a {
    color: #2563eb;
    text-decoration: underline;
}

/* ═══════════════════════════════════════════════════════════════
   Scroll Lock (modal + popup)
   ═══════════════════════════════════════════════════════════════ */
body.snlm-modal-open {
    overflow: hidden;
}

/* Make loan modal scroll internally on small screens */
.snlm-loan-modal-box {
    max-height: 90vh;
    overflow-y: auto;
    max-width: 560px;
}

/* ═══════════════════════════════════════════════════════════════
   Apply Tab — Receiving Account Section
   ═══════════════════════════════════════════════════════════════ */
.snlm-apply-account-section {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 20px;
}

.snlm-apply-account-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.snlm-apply-account-label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #64748b;
}

.snlm-account-summary {
    font-size: 0.9rem;
    color: #1e293b;
    font-weight: 500;
}

.snlm-account-tag {
    display: inline-block;
    background: #dbeafe;
    color: #1e40af;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 999px;
    margin-right: 6px;
    letter-spacing: .02em;
}

.snlm-apply-divider {
    border: none;
    border-top: 1px solid #e2e8f0;
    margin: 20px 0;
}

/* ═══════════════════════════════════════════════════════════════
   Guarantor Section in Modal
   ═══════════════════════════════════════════════════════════════ */
.snlm-guarantor-section {
    border: 1.5px solid #e2e8f0;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 16px;
    background: #fafafa;
}

.snlm-guarantor-section-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.snlm-guarantor-section-head strong {
    font-size: 0.875rem;
    color: #0f172a;
}

.snlm-guarantor-required {
    font-size: 0.72rem;
    color: #dc2626;
    font-weight: 600;
    background: #fee2e2;
    padding: 2px 8px;
    border-radius: 999px;
}

.snlm-guarantor-item {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 14px;
    margin-bottom: 10px;
}

.snlm-guarantor-item-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f1f5f9;
}

.snlm-guarantor-item-head strong {
    font-size: 0.82rem;
    color: #475569;
}

.snlm-guarantor-item .snlm-form-row {
    margin-bottom: 10px;
}

.snlm-guarantor-item .snlm-form-row label {
    font-size: 0.78rem;
}

/* ═══════════════════════════════════════════════════════════════
   Print Agreement Link
   ═══════════════════════════════════════════════════════════════ */
.snlm-print-link {
    color: #16a34a !important;
    font-weight: 700;
    text-decoration: none;
    margin-left: 4px;
}

.snlm-print-link:hover {
    text-decoration: underline;
}

.snlm-link-sm {
    font-size: 0.75rem;
    color: #2563eb;
    text-decoration: none;
    font-weight: 600;
}

.snlm-link-sm:hover { text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════════
   Settings Sections
   ═══════════════════════════════════════════════════════════════ */
.snlm-settings-section {
    margin-bottom: 32px;
}

.snlm-settings-section-title {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #64748b;
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 2px solid #e2e8f0;
}

/* ═══════════════════════════════════════════════════════════════
   Dynamic Lists (branches, networks, banks)
   ═══════════════════════════════════════════════════════════════ */
.snlm-dynamic-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 24px;
}

.snlm-list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 12px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    font-size: 0.875rem;
}

.snlm-list-item-label {
    flex: 1;
    color: #1e293b;
    word-break: break-word;
}

/* ═══════════════════════════════════════════════════════════════
   Transaction Description Cell
   ═══════════════════════════════════════════════════════════════ */
.snlm-table td.snlm-tx-desc {
    max-width: 220px;
    white-space: normal;
    font-size: 0.82rem;
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════════════
   Communication / Support
   ═══════════════════════════════════════════════════════════════ */

/* Toolbar row above inbox */
.snlm-comm-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    gap: 12px;
    flex-wrap: wrap;
}

.snlm-comm-filter-tabs {
    display: flex;
    gap: 4px;
}

.snlm-comm-filter-btn {
    padding: 6px 14px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    border-radius: 6px;
    font-size: 0.85rem;
    cursor: pointer;
    color: #64748b;
    font-weight: 500;
}

.snlm-comm-filter-btn.active {
    background: #0f3460;
    color: #fff;
    border-color: #0f3460;
}

/* Thread list */
.snlm-thread-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.snlm-thread-item {
    padding: 12px 16px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    cursor: pointer;
    background: #fff;
    transition: background 0.15s;
}

.snlm-thread-item:hover {
    background: #f1f5f9;
}

.snlm-thread-item.snlm-unread {
    border-left: 3px solid #0f3460;
    background: #f0f4ff;
}

.snlm-thread-item.snlm-thread-closed {
    opacity: 0.65;
}

.snlm-thread-item-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
    font-size: 0.8rem;
    color: #64748b;
}

.snlm-thread-client {
    font-weight: 600;
    color: #1e293b;
}

.snlm-thread-time {
    font-size: 0.78rem;
    color: #94a3b8;
}

.snlm-thread-item-subject {
    font-size: 0.9rem;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Unread dot indicator */
.snlm-unread-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    background: #0f3460;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Unread badge on tab */
.snlm-tab-count.snlm-unread-badge {
    background: #dc2626;
}

/* Topic badge */
.snlm-topic-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.72rem;
    font-weight: 600;
    background: #e2e8f0;
    color: #475569;
    margin-top: 6px;
}

.snlm-topic-loan     { background: #dbeafe; color: #1d4ed8; }
.snlm-topic-payment  { background: #dcfce7; color: #15803d; }
.snlm-topic-account  { background: #fef9c3; color: #a16207; }
.snlm-topic-complaint{ background: #fee2e2; color: #b91c1c; }
.snlm-topic-other    { background: #f1f5f9; color: #475569; }
.snlm-topic-general  { background: #e0f2fe; color: #0369a1; }

/* Thread view header */
.snlm-comm-thread-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 14px;
    border-bottom: 1px solid #e2e8f0;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.snlm-comm-thread-meta {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* Message list */
.snlm-message-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
    max-height: 480px;
    overflow-y: auto;
    padding: 4px 0;
}

/* Message bubble */
.snlm-message {
    max-width: 80%;
    padding: 12px 16px;
    border-radius: 12px;
    font-size: 0.9rem;
    line-height: 1.5;
}

.snlm-message.from-admin {
    align-self: flex-start;
    background: #0f3460;
    color: #fff;
    border-bottom-left-radius: 4px;
}

.snlm-message.from-client {
    align-self: flex-end;
    background: #f1f5f9;
    color: #1e293b;
    border-bottom-right-radius: 4px;
}

.snlm-message-sender {
    font-size: 0.75rem;
    font-weight: 600;
    opacity: 0.8;
    margin-bottom: 2px;
}

.snlm-message-time {
    font-size: 0.65rem;
    opacity: 0.5;
    text-align: right;
    margin-top: 4px;
}

.snlm-message-body {
    word-break: break-word;
}

/* Reply box */
.snlm-reply-box {
    border-top: 1px solid #e2e8f0;
    padding-top: 16px;
}

.snlm-textarea {
    width: 100%;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 0.9rem;
    font-family: inherit;
    resize: vertical;
    box-sizing: border-box;
    margin-bottom: 10px;
    background: #fff;
    color: #1e293b;
}

.snlm-textarea:focus {
    outline: none;
    border-color: #0f3460;
}

.snlm-reply-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Compose recipient tags */
.snlm-tag-input-wrap {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 6px 8px;
    min-height: 40px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    background: #fff;
    position: relative;
}

.snlm-recipient-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #dbeafe;
    color: #1d4ed8;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 0.82rem;
    font-weight: 500;
}

.snlm-tag-remove {
    background: none;
    border: none;
    cursor: pointer;
    color: #1d4ed8;
    font-size: 0.9rem;
    line-height: 1;
    padding: 0 2px;
}

.snlm-tag-search-input {
    border: none;
    outline: none;
    flex: 1;
    min-width: 120px;
    font-size: 0.88rem;
    font-family: inherit;
    background: transparent;
    color: #1e293b;
}

/* Suggestions dropdown */
.snlm-suggestions-list {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    z-index: 999;
    box-shadow: 0 4px 12px rgba(0,0,0,.1);
    max-height: 220px;
    overflow-y: auto;
}

.snlm-suggestion-item {
    padding: 9px 14px;
    cursor: pointer;
    font-size: 0.88rem;
    color: #1e293b;
    border-bottom: 1px solid #f1f5f9;
}

.snlm-suggestion-item:last-child { border-bottom: none; }
.snlm-suggestion-item:hover { background: #f0f4ff; }

.snlm-compose-group-row {
    display: flex;
    gap: 8px;
    align-items: center;
}

/* ═══════════════════════════════════════════════════════════════
   Floating Chat Widget
   ═══════════════════════════════════════════════════════════════ */
.snlm-chat-widget {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 320px;
    border-radius: 14px;
    box-shadow: 0 8px 32px rgba(0,0,0,.18);
    background: #fff;
    z-index: 99999;
    font-family: inherit;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: height 0.2s ease;
}

.snlm-chat-widget.snlm-chat-minimized {
    width: 52px !important;
    height: 52px !important;
    border-radius: 50% !important;
    overflow: visible !important;
    cursor: pointer;
}

/* Hide header+body when minimized; show bubble */
.snlm-chat-widget.snlm-chat-minimized .snlm-chat-widget-header,
.snlm-chat-widget.snlm-chat-minimized .snlm-chat-widget-body { display: none !important; }

.snlm-chat-widget.snlm-chat-minimized .snlm-chat-bubble { display: flex !important; }
.snlm-chat-widget:not(.snlm-chat-minimized) .snlm-chat-bubble { display: none !important; }

/* Bubble button */
.snlm-chat-bubble {
    display: none;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: #2563eb;
    color: #fff;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(37,99,235,.45);
}

.snlm-bubble-count {
    position: absolute;
    top: -4px;
    right: -4px;
    background: #dc2626;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 700;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}


.snlm-chat-widget-header {
    background: #0f3460;
    color: #fff;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    border-radius: 14px 14px 0 0;
    user-select: none;
}

.snlm-chat-minimized .snlm-chat-widget-header {
    border-radius: 50%;
}

.snlm-chat-widget-title {
    font-size: 0.9rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.snlm-chat-widget-badge {
    background: #dc2626;
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    border-radius: 10px;
    padding: 1px 6px;
    min-width: 18px;
    text-align: center;
}

.snlm-chat-widget-controls {
    display: flex;
    gap: 4px;
}

.snlm-chat-ctrl-btn {
    background: rgba(255,255,255,.2);
    border: none;
    color: #fff;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 0.85rem;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.snlm-chat-ctrl-btn:hover { background: rgba(255,255,255,.35); }

.snlm-chat-widget-body {
    display: flex;
    flex-direction: column;
    height: 420px;
}

/* Inbox */
.snlm-cw-inbox {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.snlm-cw-inbox-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    border-bottom: 1px solid #f1f5f9;
}

.snlm-cw-thread-list {
    flex: 1;
    overflow-y: auto;
}

.snlm-cw-thread-item {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 10px 14px;
    border-bottom: 1px solid #f1f5f9;
    cursor: pointer;
    transition: background 0.12s;
}

.snlm-cw-thread-item:hover { background: #f8fafc; }
.snlm-cw-thread-item.snlm-unread { background: #f0f4ff; }

/* Active thread */
.snlm-cw-thread {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.snlm-cw-thread-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-bottom: 1px solid #f1f5f9;
    min-height: 40px;
}

.snlm-cw-messages {
    flex: 1;
    overflow-y: auto;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.snlm-cw-msg {
    max-width: 85%;
    padding: 8px 12px;
    border-radius: 10px;
    font-size: 0.82rem;
    line-height: 1.4;
}

.snlm-cw-msg.from-admin {
    align-self: flex-start;
    background: #0f3460;
    color: #fff;
    border-bottom-left-radius: 3px;
}

.snlm-cw-msg.from-me {
    align-self: flex-end;
    background: #f1f5f9;
    color: #1e293b;
    border-bottom-right-radius: 3px;
}

.snlm-cw-msg-sender {
    font-size: 0.68rem;
    font-weight: 600;
    opacity: 0.75;
    margin-bottom: 1px;
}

.snlm-cw-msg-time {
    font-size: 0.6rem;
    opacity: 0.5;
    text-align: right;
    margin-top: 3px;
}

.snlm-cw-reply-area {
    padding: 8px 10px;
    border-top: 1px solid #f1f5f9;
    display: flex;
    gap: 6px;
    align-items: flex-end;
}

.snlm-cw-reply-input {
    flex: 1;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 0.82rem;
    font-family: inherit;
    resize: none;
    outline: none;
}

.snlm-cw-reply-input:focus { border-color: #0f3460; }

/* New request form */
.snlm-cw-new-form {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow-y: auto;
}

.snlm-cw-input {
    width: 100%;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 0.82rem;
    font-family: inherit;
    box-sizing: border-box;
    outline: none;
    background: #fff;
    color: #1e293b;
}

.snlm-cw-input:focus { border-color: #0f3460; }

.snlm-cw-body-input {
    resize: vertical;
    min-height: 80px;
}

/* ═══════════════════════════════════════════════════════════════
   Portal Pages list (Settings tab)
   ═══════════════════════════════════════════════════════════════ */
.snlm-portal-pages-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 8px;
}

.snlm-portal-page-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 10px 0;
    border-bottom: 1px solid #f1f5f9;
}

.snlm-portal-page-row:last-child { border-bottom: none; }

.snlm-portal-page-label {
    font-weight: 600;
    color: #1e293b;
    min-width: 130px;
    font-size: 0.88rem;
}

.snlm-portal-page-url {
    flex: 1;
    font-size: 0.78rem;
    word-break: break-all;
    color: #2563eb !important;
    text-decoration: underline;
}

/* ═══════════════════════════════════════════════════════════════
   OTP Verification Page
   ═══════════════════════════════════════════════════════════════ */

.snlm-otp-wrap {
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: #f1f5f9;
}

.snlm-otp-box {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 4px 24px rgba(0,0,0,.10);
    padding: 40px 36px 36px;
    width: 100%;
    max-width: 420px;
    text-align: center;
}

.snlm-otp-brand {
    font-size: 1rem;
    font-weight: 700;
    color: #0f3460;
    letter-spacing: .5px;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.snlm-otp-title {
    font-size: 1.35rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 8px;
}

.snlm-otp-sub {
    font-size: 0.88rem;
    color: #64748b;
    margin: 0 0 24px;
    line-height: 1.5;
}

.snlm-otp-digits {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-bottom: 20px;
}

.snlm-otp-digit {
    width: 46px;
    height: 54px;
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    color: #1e293b;
    background: #f8fafc;
    transition: border-color .15s, box-shadow .15s;
    outline: none;
}

.snlm-otp-digit:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
    background: #fff;
}

.snlm-otp-remember-label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 0.84rem;
    color: #475569;
    cursor: pointer;
    margin-bottom: 4px;
}

.snlm-otp-remember-label input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: #2563eb;
}

.snlm-otp-msg {
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 0.85rem;
    margin-bottom: 16px;
    text-align: left;
}

.snlm-otp-msg-error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #dc2626;
}

.snlm-otp-msg-ok {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #16a34a;
}

.snlm-otp-expired {
    color: #dc2626;
    font-size: 0.9rem;
}

.snlm-otp-resend-wrap {
    margin-top: 20px;
    font-size: 0.83rem;
    color: #94a3b8;
}

.snlm-otp-resend-wrap .snlm-link-btn {
    font-size: 0.83rem;
    color: #2563eb;
}

#snlm-otp-timer {
    color: #94a3b8;
    font-size: 0.8rem;
}

@media (max-width: 480px) {
    .snlm-otp-box { padding: 28px 20px 24px; }
    .snlm-otp-digit { width: 40px; height: 48px; font-size: 1.25rem; gap: 6px; }
}

/* ================================================================
   Bottom Navigation  (mobile only)
   ================================================================ */
.snlm-bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;height:50px;background:#fff;border-top:1px solid #e2e8f0;z-index:900;align-items:stretch;box-shadow:0 -2px 12px rgba(0,0,0,.07);}
.snlm-bn-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:none;background:none;color:#94a3b8;font-size:.62rem;font-weight:600;cursor:pointer;position:relative;padding:8px 2px 6px;transition:color .15s;text-transform:uppercase;letter-spacing:.3px;}
.snlm-bn-item i{font-size:1.15rem;}
.snlm-bn-item.active{color:#0f3460;}
.snlm-bn-apply{color:#2563eb !important;}
.snlm-bn-apply i{font-size:1.3rem;}
.snlm-bn-badge{position:absolute;top:6px;right:calc(50% - 18px);min-width:16px;height:16px;background:#dc2626;color:#fff;font-size:.62rem;font-weight:700;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 4px;line-height:1;}
@media(max-width:768px){.snlm-bottom-nav{display:flex;}.snlm-tabs-wrapper{display:none !important;}.snlm-portal-body{padding-bottom:72px !important;}.snlm-chat-widget{bottom:72px;}}
@media(min-width:769px){.snlm-bottom-nav{display:none !important;}.snlm-more-panel{display:none !important;}}

/* ================================================================
   More Slide-up Panel
   ================================================================ */
.snlm-more-panel{position:fixed;inset:0;z-index:1500;pointer-events:none;}
.snlm-more-panel.open{pointer-events:all;}
.snlm-more-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0);transition:background .25s;}
.snlm-more-panel.open .snlm-more-backdrop{background:rgba(0,0,0,.45);}
.snlm-more-sheet{position:absolute;bottom:0;left:0;right:0;background:#fff;border-radius:20px 20px 0 0;padding:8px 0 20px;transform:translateY(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);box-shadow:0 -4px 24px rgba(0,0,0,.12);}
.snlm-more-panel.open .snlm-more-sheet{transform:translateY(0);}
.snlm-more-handle{width:40px;height:4px;background:#e2e8f0;border-radius:2px;margin:4px auto 12px;}
.snlm-more-list{list-style:none;margin:0;padding:0;}
.snlm-more-item{display:flex;align-items:center;gap:14px;width:100%;padding:14px 24px;border:none;background:none;font-size:.95rem;font-weight:500;color:#1e293b;cursor:pointer;text-align:left;transition:background .12s;position:relative;}
.snlm-more-item:hover{background:#f8fafc;}
.snlm-more-item i{width:22px;text-align:center;color:#64748b;font-size:1.05rem;}
.snlm-more-divider{height:1px;background:#f1f5f9;margin:4px 0;}
.snlm-more-logout{color:#dc2626 !important;}
.snlm-more-logout i{color:#dc2626 !important;}
.snlm-theme-pill{margin-left:auto;width:40px;height:22px;background:#e2e8f0;border-radius:11px;position:relative;transition:background .2s;flex-shrink:0;}
.snlm-theme-pill::after{content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;background:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 1px 4px rgba(0,0,0,.2);}
.snlm-theme-pill.active{background:#2563eb;}
.snlm-theme-pill.active::after{transform:translateX(18px);}

/* ================================================================
   Dark Theme
   ================================================================ */
[data-kenta-theme="dark"] .snlm-portal{background:#0f172a;color:#e2e8f0;}
[data-kenta-theme="dark"] .snlm-portal-body{background:#0f172a;}
[data-kenta-theme="dark"] .snlm-sticky-header{background:#1e293b !important;border-bottom-color:#334155;}
[data-kenta-theme="dark"] .snlm-tabs{background:#1e293b;}
[data-kenta-theme="dark"] .snlm-tab-btn{color:#94a3b8;}
[data-kenta-theme="dark"] .snlm-tab-btn.active{background:#0f3460;color:#e2e8f0;border-color:#2563eb;}
[data-kenta-theme="dark"] .snlm-card{background:#1e293b;border-color:#334155;color:#e2e8f0;}
[data-kenta-theme="dark"] .snlm-card-title,[data-kenta-theme="dark"] .snlm-settings-section-title{color:#e2e8f0;}
[data-kenta-theme="dark"] .snlm-hint,[data-kenta-theme="dark"] .snlm-hint-text,[data-kenta-theme="dark"] .snlm-placeholder{color:#64748b;}
[data-kenta-theme="dark"] .snlm-table{color:#e2e8f0;}
[data-kenta-theme="dark"] .snlm-table thead th{background:#162032;color:#94a3b8;border-color:#334155;}
[data-kenta-theme="dark"] .snlm-table tbody td{border-color:#1e293b;color:#cbd5e1;}
[data-kenta-theme="dark"] .snlm-table tbody tr:nth-child(even) td{background:#162032;}
[data-kenta-theme="dark"] .snlm-table tbody tr:hover td{background:#243044;}
[data-kenta-theme="dark"] .snlm-form-row label{color:#cbd5e1;}
[data-kenta-theme="dark"] .snlm-portal input[type="text"],[data-kenta-theme="dark"] .snlm-portal input[type="number"],[data-kenta-theme="dark"] .snlm-portal input[type="tel"],[data-kenta-theme="dark"] .snlm-portal input[type="email"],[data-kenta-theme="dark"] .snlm-portal input[type="date"],[data-kenta-theme="dark"] .snlm-portal select,[data-kenta-theme="dark"] .snlm-portal textarea,[data-kenta-theme="dark"] .snlm-inline-input,[data-kenta-theme="dark"] .snlm-filter-input{background:#162032;border-color:#334155;color:#e2e8f0;}
[data-kenta-theme="dark"] .snlm-modal-box,[data-kenta-theme="dark"] .snlm-popup-box{background:#1e293b;color:#e2e8f0;}
[data-kenta-theme="dark"] .snlm-modal-head,[data-kenta-theme="dark"] .snlm-popup-head{border-bottom-color:#334155;}
[data-kenta-theme="dark"] .snlm-message.from-client{background:#1e3a5f;color:#e2e8f0;}
[data-kenta-theme="dark"] .snlm-message-list{background:#0f172a;}
[data-kenta-theme="dark"] .snlm-thread-item{background:#1e293b;border-color:#334155;color:#e2e8f0;}
[data-kenta-theme="dark"] .snlm-thread-item:hover{background:#243044;}
[data-kenta-theme="dark"] .snlm-chat-widget{background:#1e293b;border-color:#334155;}
[data-kenta-theme="dark"] .snlm-cw-inbox,[data-kenta-theme="dark"] .snlm-cw-thread{background:#1e293b;}
[data-kenta-theme="dark"] .snlm-bottom-nav{background:#1e293b;border-top-color:#334155;}
[data-kenta-theme="dark"] .snlm-bn-item{color:#64748b;}
[data-kenta-theme="dark"] .snlm-bn-item.active{color:#60a5fa;}
[data-kenta-theme="dark"] .snlm-more-sheet{background:#1e293b;}
[data-kenta-theme="dark"] .snlm-more-handle{background:#334155;}
[data-kenta-theme="dark"] .snlm-more-item{color:#e2e8f0;}
[data-kenta-theme="dark"] .snlm-more-item:hover{background:#243044;}
[data-kenta-theme="dark"] .snlm-more-item i{color:#94a3b8;}
[data-kenta-theme="dark"] .snlm-more-divider{background:#334155;}
[data-kenta-theme="dark"] .snlm-more-logout,[data-kenta-theme="dark"] .snlm-more-logout i{color:#f87171 !important;}
[data-kenta-theme="dark"] .snlm-theme-pill{background:#334155;}
[data-kenta-theme="dark"] .snlm-theme-pill.active{background:#2563eb;}
[data-kenta-theme="dark"] .snlm-otp-wrap{background:#0f172a;}
[data-kenta-theme="dark"] .snlm-otp-box{background:#1e293b;color:#e2e8f0;}
[data-kenta-theme="dark"] .snlm-otp-digit{background:#162032;border-color:#334155;color:#e2e8f0;}
[data-kenta-theme="dark"] .snlm-otp-sub{color:#94a3b8;}
[data-kenta-theme="dark"] .snlm-otp-brand{color:#60a5fa;}

/* ================================================================
   Bottom Nav OVERRIDES — glassy, li-based, correct contrast
   ================================================================ */

/* Glassy background — same look on both themes */
.snlm-bottom-nav {
    background: rgba(219,234,254,0.65) !important;
    backdrop-filter: blur(18px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(160%) !important;
    border-top: 1px solid rgba(59,130,246,0.18) !important;
    box-shadow: 0 -2px 16px rgba(59,130,246,0.08) !important;
}

.snlm-bn-list {
    list-style: none;
    margin: 0; padding: 7px;
    display: flex; width: 100%; height: 100%; 
}

/* li-based items — no button inheritance */
.snlm-bn-item {
    all: unset;
    flex: 1;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    cursor: pointer;
    color: rgba(15,23,42,0.5) !important;
    font-size: .62rem !important;
    font-weight: 600;
    padding: 8px 2px 6px;
    text-transform: uppercase;
    letter-spacing: .3px;
    position: relative;
    transition: color .15s;
    user-select: none;
    box-sizing: border-box;
}

.snlm-bn-item i { font-size: 1.15rem; }
.snlm-bn-item.active { color: #0f172a !important; }
.snlm-bn-apply { color: #2563eb !important; }
.snlm-bn-apply i { font-size: 1.3rem; }

/* More panel li items — no button inheritance */
.snlm-more-item {
    all: unset;
    display: flex !important;
    align-items: center;
    gap: 14px;
    width: 100%;
    padding: 14px 24px;
    cursor: pointer;
    font-size: .95rem;
    font-weight: 500;
    color: #1e293b !important;
    transition: background .12s;
    position: relative;
    box-sizing: border-box;
}
.snlm-more-item:hover { background: #f1f5f9; }
.snlm-more-item i { width: 22px; text-align: center; color: #64748b; font-size: 1.05rem; }
.snlm-more-logout { color: #dc2626 !important; }
.snlm-more-logout i { color: #dc2626 !important; }

/* Dark mode — glassy dark nav */
[data-kenta-theme="dark"] .snlm-bottom-nav {
    background: rgba(15,23,42,0.78) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    border-top-color: rgba(255,255,255,0.07) !important;
    box-shadow: 0 -2px 16px rgba(0,0,0,0.3) !important;
}

[data-kenta-theme="dark"] .snlm-bn-item { color: rgba(255,255,255,0.45) !important; }
[data-kenta-theme="dark"] .snlm-bn-item.active { color: #ffffff !important; }
[data-kenta-theme="dark"] .snlm-bn-apply { color: #60a5fa !important; }

[data-kenta-theme="dark"] .snlm-more-item { color: #f1f5f9 !important; }
[data-kenta-theme="dark"] .snlm-more-item:hover { background: #243044; }
[data-kenta-theme="dark"] .snlm-more-item i { color: #94a3b8; }
[data-kenta-theme="dark"] .snlm-more-logout { color: #f87171 !important; }
[data-kenta-theme="dark"] .snlm-more-logout i { color: #f87171 !important; }

/* ================================================================
   Dark Theme CONTRAST FIXES
   ================================================================ */

/* Base text — force high contrast throughout portal */
[data-kenta-theme="dark"] .snlm-portal,
[data-kenta-theme="dark"] .snlm-portal p,
[data-kenta-theme="dark"] .snlm-portal span:not(.snlm-bn-badge):not(.snlm-tab-count):not(.snlm-theme-pill),
[data-kenta-theme="dark"] .snlm-portal li,
[data-kenta-theme="dark"] .snlm-portal label,
[data-kenta-theme="dark"] .snlm-portal td,
[data-kenta-theme="dark"] .snlm-portal th,
[data-kenta-theme="dark"] .snlm-portal strong,
[data-kenta-theme="dark"] .snlm-portal h1,
[data-kenta-theme="dark"] .snlm-portal h2,
[data-kenta-theme="dark"] .snlm-portal h3,
[data-kenta-theme="dark"] .snlm-portal h4 {
    color: whitesmoke;
}

/* dark theme my edits */

[data-kenta-theme="dark"] .snlm-portal-header {
  background: #6274ff66;
  backdrop-filter: blur(10px);
  border-radius: 4px;
}

[data-kenta-theme="dark"] .snlm-stat-value {
    color: whitesmoke;
}

[data-kenta-theme="dark"] .snlm-id-badge {
    color: whitesmoke;
}

[data-kenta-theme="dark"] .snlm-table th {
  background: #181818;
}

[data-kenta-theme="dark"] .snlm-apply-account-section {
    background: #5c82ab;
}

[data-kenta-theme="dark"] .snlm-account-tag {
    background: #071da2;
}

[data-kenta-theme="dark"] .snlm-modal-row-label {
  background: #2c3569;
  padding: 2px;
  border-radius: 5px;
  margin-right: 5px;
}

[data-kenta-theme="dark"] .snlm-modal-breakdown * {
  color: white;
}

[data-kenta-theme="dark"] .snlm-apply-account-section {
  background: #636fab;
}

.snlm-account-tag {
  color: black !important;
}

/* Table — bright contrast */
[data-kenta-theme="dark"] .snlm-table thead th {
    background: #162032 !important;
    color: #cbd5e1 !important;
    border-color: #334155 !important;
}
[data-kenta-theme="dark"] .snlm-table tbody td {
    color: #e2e8f0 !important;
    border-color: #243044 !important;
}
[data-kenta-theme="dark"] .snlm-table tbody tr:nth-child(even) td { background: #162032; }
[data-kenta-theme="dark"] .snlm-table tbody tr:hover td { background: #243044; }

/* Muted / hint text — visible but lighter */
[data-kenta-theme="dark"] .snlm-hint,
[data-kenta-theme="dark"] .snlm-hint-text,
[data-kenta-theme="dark"] .snlm-placeholder {
    color: #94a3b8 !important;
}

/* Links inside portal */
[data-kenta-theme="dark"] .snlm-portal a:not(.snlm-btn) { color: #60a5fa; }

/* Status badges — keep their colors */
[data-kenta-theme="dark"] .snlm-status { color: inherit !important; }

/* More panel: completely invisible until .open is added */
.snlm-more-panel:not(.open) { visibility: hidden; }