/* Scope to admin/Filament containers to avoid leaking to public pages. */
.layout-wrapper .card,
.fi-main .card,
.fi-section,
.fi-ta-ctn,
.fi-wi {
    border-radius: var(--m26-radius-md);
}

/* Border & shadow for cards, sections, widgets, modals, dropdowns */
.layout-wrapper .card,
.fi-main .card,
.fi-section,
.fi-wi,
.layout-wrapper .modal-content,
.layout-wrapper .dropdown-menu,
.fi-main .fi-modal-window,
.fi-main .fi-dropdown-panel {
    border: 1px solid var(--m26-border);
    box-shadow: var(--m26-shadow-sm);
}

/* Table container - NO border/shadow to avoid double-border effect */
.fi-ta-ctn {
    border: none !important;
    box-shadow: none !important;
}

/* Also remove border from table wrapper if it exists */
.fi-ta {
    border: none !important;
}

.layout-wrapper .table,
.fi-ta-table {
    --bs-table-bg: transparent;
}

.layout-wrapper .table > :not(caption) > * > *,
.fi-ta-table td,
.fi-ta-table th {
    border-color: var(--m26-border);
}

.layout-wrapper .table thead th,
.fi-ta-header-cell {
    background: var(--m26-surface-soft);
}

.layout-wrapper .btn,
.fi-btn {
    border-radius: var(--m26-radius-sm);
    transition: transform 120ms ease, box-shadow 160ms ease;
}

.layout-wrapper .btn:hover,
.fi-btn:hover {
    transform: translateY(-1px);
}

.layout-wrapper .btn-primary,
.fi-btn-color-primary {
    box-shadow: 0 8px 16px rgba(15, 118, 110, 0.22);
}

.layout-wrapper .form-control,
.layout-wrapper .form-select,
.layout-wrapper .select2-selection,
.fi-input,
.fi-select-input {
    border-radius: var(--m26-radius-sm);
    border-color: #d7ddea;
}

.layout-wrapper .form-control:focus,
.layout-wrapper .form-select:focus,
.fi-input:focus,
.fi-select-input:focus,
.layout-wrapper .select2-container--focus .select2-selection {
    border-color: #0f766e;
    box-shadow: 0 0 0 0.18rem rgba(15, 118, 110, 0.14);
}

.layout-wrapper .badge,
.fi-badge {
    border-radius: 999px;
}

.fi-main .fi-ta-header-toolbar,
.fi-main .fi-ta-filters,
.fi-main .fi-tabs,
.fi-main .fi-pagination {
    border-radius: var(--m26-radius-md);
}

.fi-main .fi-ta-header-toolbar,
.fi-main .fi-ta-filters {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid var(--m26-border);
    box-shadow: var(--m26-shadow-sm);
}

/* Keep Filament table action buttons clickable over sticky header cells. */
.fi-main .fi-ta-header,
.fi-main .fi-ta-header-toolbar {
    position: relative;
    z-index: 12;
    pointer-events: auto;
}

.dark .layout-wrapper .card,
.dark .fi-main .card,
.dark .fi-section,
.dark .fi-ta-ctn,
.dark .fi-wi,
.dark .layout-wrapper .modal-content,
.dark .layout-wrapper .dropdown-menu,
.dark .fi-main .fi-modal-window,
.dark .fi-main .fi-dropdown-panel {
    background: var(--m26-surface);
    border-color: var(--m26-border);
}

.dark .layout-wrapper .table,
.dark .fi-main .fi-ta-table {
    background: #111b31;
    border-color: var(--m26-border);
}

.dark .layout-wrapper .table thead th,
.dark .fi-main .fi-ta-table thead th,
.dark .fi-main .fi-ta-header-cell,
.dark .fi-main .fi-ta-header-toolbar,
.dark .fi-main .fi-ta-filters {
    background: linear-gradient(180deg, #111b31 0%, #0f172a 100%);
    color: #cbd5e1;
    border-color: var(--m26-border);
}

.dark .layout-wrapper .table tbody tr:nth-child(even),
.dark .fi-main .fi-ta-table tbody tr:nth-child(even),
.dark .fi-main .fi-ta-record:nth-child(even) {
    background: #0f172a;
}

.dark .layout-wrapper .table tbody tr:hover,
.dark .fi-main .fi-ta-table tbody tr:hover,
.dark .fi-main .fi-ta-record:hover {
    background: #16233d;
}

.dark .fi-main .fi-tabs-item.fi-active,
.dark .fi-main .fi-tabs-item[aria-selected="true"] {
    color: #5eead4;
}

.fi-main .fi-tabs-item {
    border-radius: 10px;
}

.fi-main .fi-tabs-item.fi-active,
.fi-main .fi-tabs-item[aria-selected="true"] {
    background: var(--m26-primary-soft);
    color: #0f766e;
}

.fi-main .fi-ta-search-field,
.fi-main .fi-input-wrp,
.fi-main .fi-select-input,
.fi-main .fi-input {
    border-radius: var(--m26-radius-sm);
}

.fi-main .fi-pagination .fi-pagination-item,
.fi-main .fi-pagination .fi-pagination-item-button {
    border-radius: 10px;
}

/* Global table treatment for all admin pages (Sneat + Filament). */
.layout-wrapper .table,
.fi-main .fi-ta-table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    border: 1px solid var(--m26-border);
    border-radius: var(--m26-radius-md);
    overflow: hidden;
    background: #ffffff;
}

.layout-wrapper .table thead th,
.fi-main .fi-ta-table thead th,
.fi-main .fi-ta-header-cell {
    position: sticky;
    top: 0;
    z-index: 2;
    background: linear-gradient(180deg, #fbfcff 0%, #f3f6fc 100%);
    color: #4c5876;
    font-weight: 700;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 1px solid var(--m26-border);
}

.layout-wrapper .table > :not(caption) > * > *,
.fi-main .fi-ta-table td,
.fi-main .fi-ta-table th,
.fi-main .fi-ta-cell,
.fi-main .fi-ta-header-cell {
    padding: 0.72rem 0.85rem;
    vertical-align: middle;
}

.layout-wrapper .table tbody tr,
.fi-main .fi-ta-table tbody tr,
.fi-main .fi-ta-record {
    transition: background-color 140ms ease;
}

.layout-wrapper .table tbody tr:nth-child(even),
.fi-main .fi-ta-table tbody tr:nth-child(even),
.fi-main .fi-ta-record:nth-child(even) {
    background: #fafcff;
}

.layout-wrapper .table tbody tr:hover,
.fi-main .fi-ta-table tbody tr:hover,
.fi-main .fi-ta-record:hover {
    background: #eef8f6;
}

.layout-wrapper .table-responsive,
.fi-main .fi-ta-content {
    border-radius: var(--m26-radius-md);
}

.layout-wrapper .table .badge,
.fi-main .fi-ta-table .fi-badge {
    font-weight: 600;
}

@media (max-width: 768px) {
    .layout-wrapper .table > :not(caption) > * > *,
    .fi-main .fi-ta-table td,
    .fi-main .fi-ta-table th,
    .fi-main .fi-ta-cell,
    .fi-main .fi-ta-header-cell {
        padding: 0.6rem 0.65rem;
        font-size: 0.86rem;
    }

    .layout-wrapper .table thead th,
    .fi-main .fi-ta-table thead th,
    .fi-main .fi-ta-header-cell {
        font-size: 0.7rem;
    }
}

/* Variant: compact table for dense data pages. */
.layout-wrapper .table.table-compact > :not(caption) > * > *,
.fi-main .fi-ta-table.table-compact td,
.fi-main .fi-ta-table.table-compact th,
.fi-main .fi-ta-table.table-compact .fi-ta-cell,
.fi-main .fi-ta-table.table-compact .fi-ta-header-cell {
    padding: 0.42rem 0.56rem;
    font-size: 0.82rem;
}

.layout-wrapper .table.table-compact thead th,
.fi-main .fi-ta-table.table-compact thead th,
.fi-main .fi-ta-table.table-compact .fi-ta-header-cell {
    font-size: 0.68rem;
}

/* Variant: finance table with clearer numeric readability. */
.layout-wrapper .table.table-finance,
.fi-main .fi-ta-table.table-finance {
    font-variant-numeric: tabular-nums;
}

.layout-wrapper .table.table-finance .text-end,
.layout-wrapper .table.table-finance .col-amount,
.layout-wrapper .table.table-finance [data-col="amount"],
.fi-main .fi-ta-table.table-finance .text-end,
.fi-main .fi-ta-table.table-finance .col-amount,
.fi-main .fi-ta-table.table-finance [data-col="amount"] {
    text-align: right;
    font-weight: 700;
}

.layout-wrapper .table.table-finance tbody tr:hover,
.fi-main .fi-ta-table.table-finance tbody tr:hover,
.fi-main .fi-ta-table.table-finance .fi-ta-record:hover {
    background: #e9f8f4;
}

/* Variant: print mode for clean report exports. */
@media print {
    .layout-wrapper .table.table-print-clean,
    .fi-main .fi-ta-table.table-print-clean,
    .layout-wrapper .table.table-finance,
    .fi-main .fi-ta-table.table-finance {
        border: 1px solid #b7bfd0 !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        background: #fff !important;
    }

    .layout-wrapper .table.table-print-clean thead th,
    .fi-main .fi-ta-table.table-print-clean thead th,
    .fi-main .fi-ta-table.table-print-clean .fi-ta-header-cell,
    .layout-wrapper .table.table-finance thead th,
    .fi-main .fi-ta-table.table-finance thead th,
    .fi-main .fi-ta-table.table-finance .fi-ta-header-cell {
        background: #f2f4f8 !important;
        color: #111827 !important;
        position: static !important;
    }

    .layout-wrapper .table.table-print-clean tbody tr:nth-child(even),
    .fi-main .fi-ta-table.table-print-clean tbody tr:nth-child(even),
    .layout-wrapper .table.table-finance tbody tr:nth-child(even),
    .fi-main .fi-ta-table.table-finance tbody tr:nth-child(even) {
        background: #fff !important;
    }
}

/* Reusable stat-card system for non-table dashboard sections. */
.m26-stat-grid,
.fi-main .m26-stat-grid,
.layout-wrapper .m26-stat-grid {
    display: grid;
    gap: 1rem;
}

.m26-stat-grid-5,
.fi-main .m26-stat-grid-5,
.layout-wrapper .m26-stat-grid-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.m26-stat-card,
.fi-main .m26-stat-card,
.layout-wrapper .m26-stat-card {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 14px;
    border: 1px solid var(--m26-border);
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
    padding: 1rem;
}

.m26-stat-card::after,
.fi-main .m26-stat-card::after,
.layout-wrapper .m26-stat-card::after {
    content: "";
    position: absolute;
    width: 90px;
    height: 90px;
    right: -24px;
    bottom: -30px;
    border-radius: 999px;
    background: rgba(15, 118, 110, 0.06);
}

.m26-stat-value,
.fi-main .m26-stat-value,
.layout-wrapper .m26-stat-value {
    position: relative;
    z-index: 1;
    font-size: 1.8rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: -0.03em;
}

.m26-stat-label,
.fi-main .m26-stat-label,
.layout-wrapper .m26-stat-label {
    position: relative;
    z-index: 1;
    margin-top: 0.35rem;
    font-size: 0.78rem;
    color: var(--m26-text-muted);
}

.m26-stat-card--primary .m26-stat-value,
.fi-main .m26-stat-card--primary .m26-stat-value,
.layout-wrapper .m26-stat-card--primary .m26-stat-value { color: #0f766e; }
.m26-stat-card--success .m26-stat-value,
.fi-main .m26-stat-card--success .m26-stat-value,
.layout-wrapper .m26-stat-card--success .m26-stat-value { color: #16a34a; }
.m26-stat-card--info .m26-stat-value,
.fi-main .m26-stat-card--info .m26-stat-value,
.layout-wrapper .m26-stat-card--info .m26-stat-value { color: #0284c7; }
.m26-stat-card--warning .m26-stat-value,
.fi-main .m26-stat-card--warning .m26-stat-value,
.layout-wrapper .m26-stat-card--warning .m26-stat-value { color: #d97706; }
.m26-stat-card--danger .m26-stat-value,
.fi-main .m26-stat-card--danger .m26-stat-value,
.layout-wrapper .m26-stat-card--danger .m26-stat-value { color: #dc2626; }

@media (max-width: 1280px) {
    .m26-stat-grid-5,
    .fi-main .m26-stat-grid-5,
    .layout-wrapper .m26-stat-grid-5 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .m26-stat-grid-5,
    .fi-main .m26-stat-grid-5,
    .layout-wrapper .m26-stat-grid-5 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .m26-stat-value,
    .fi-main .m26-stat-value,
    .layout-wrapper .m26-stat-value {
        font-size: 1.45rem;
    }
}

@media (max-width: 520px) {
    .m26-stat-grid-5,
    .fi-main .m26-stat-grid-5,
    .layout-wrapper .m26-stat-grid-5 {
        grid-template-columns: 1fr;
    }
}

/* Reusable shell for guru custom pages. */
.guru-page-hero {
    position: relative;
    overflow: hidden;
}

.guru-page-hero::after {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    right: -48px;
    top: -64px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
}

.guru-page-hero-icon {
    background: rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(10px);
}

.guru-page-hero-badge {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
    backdrop-filter: blur(10px);
}

.guru-page-panel {
    overflow: hidden;
}

/* === PROFILE PAGES LAYOUT === */
/* Stat cards grid (4 cols on desktop, 2 cols tablet, 1 col mobile) */
.profile-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
@media (min-width: 768px) { .profile-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 480px) { .profile-stats { grid-template-columns: 1fr; } }

/* Header layout: photo card (1) + info (2) */
.profile-header { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 1024px) { .profile-header { grid-template-columns: minmax(220px, 1fr) 2fr; } }

.profile-card-col { padding-bottom: 1.5rem; text-align: center; display: flex; flex-direction: column; align-items: center; }
@media (min-width: 1024px) {
    .profile-card-col {
        padding-bottom: 0;
        padding-right: 1.5rem;
        border-right: 1px solid rgb(229 231 235);
    }
}
.dark .profile-card-col { border-color: rgb(55 65 81); }

/* Field grids 2/3/4 cols */
.profile-fields-2,
.profile-fields-3,
.profile-fields-4,
.profile-fields-5 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem 1.5rem;
}
@media (min-width: 640px) {
    .profile-fields-2,
    .profile-fields-3,
    .profile-fields-4,
    .profile-fields-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
    .profile-fields-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .profile-fields-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .profile-fields-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

/* Field colspans */
.profile-field-full { grid-column: 1 / -1; }
.profile-field-2 { grid-column: 1 / -1; }
.profile-field-3 { grid-column: 1 / -1; }
.profile-field-4 { grid-column: 1 / -1; }
@media (min-width: 640px) {
    .profile-field-2 { grid-column: span 2 / span 2; }
    .profile-field-3 { grid-column: span 2 / span 2; }
    .profile-field-4 { grid-column: span 2 / span 2; }
}
@media (min-width: 1024px) {
    .profile-field-3 { grid-column: span 3 / span 3; }
    .profile-field-4 { grid-column: span 4 / span 4; }
}

/* Item cards grid (anak, lembaga, per-tingkat) */
.profile-cards { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 640px) { .profile-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .profile-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Sarana stat grid (4 cols at md, smaller breakpoint) */
.profile-stats-sm {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}
@media (min-width: 768px) { .profile-stats-sm { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 480px) { .profile-stats-sm { grid-template-columns: 1fr; } }