/*
 * ERP look-and-feel override (gaya NetSuite: padat informasi, warna
 * netral navy/abu-abu) - lihat memory feedback_filament_erp_netsuite_standard.
 * File statis (bukan hasil build Vite/Tailwind), didaftarkan lewat
 * render hook HEAD_END di AdminPanelProvider supaya tetap "Filament
 * native" tanpa perlu pipeline compile tambahan.
 */

/* Table lebih compact/dense - baris py-4 default Filament terlalu lega
   untuk tabel yang berisi banyak baris (gaya NetSuite). */
.fi-ta-text:not(.fi-inline),
.fi-ta-icon-item-container {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

.fi-ta-header-cell {
    padding-top: 0.625rem !important;
    padding-bottom: 0.625rem !important;
}

.fi-ta-cell:has(.fi-ta-actions) {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

/* Warna primary (navy) diatur lewat Panel::colors() di
   AdminPanelProvider (mekanisme native Filament, generate oklch() yang
   benar) - bukan lewat override CSS var disini. */

/* Overlay loading global (mirip SweetAlert) untuk request Livewire yang
   memproses sesuatu (submit form, table action, sort/filter) - lihat
   resources/views/filament/loading-overlay.blade.php untuk JS-nya.
   Disembunyikan lewat display:none (bukan cuma opacity) supaya tidak
   menghalangi klik saat idle. Khusus perpindahan halaman (wire:navigate)
   pakai .erp-page-progress di bawah, bukan overlay ini - biar lebih soft. */
.erp-loading-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    align-items: center;
    justify-content: center;
    background-color: rgb(15 23 42 / 0.4);
}

.erp-loading-overlay.is-visible {
    display: flex;
}

.erp-loading-overlay__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
}

.erp-loading-overlay__spinner {
    width: 3rem;
    height: 3rem;
    border-radius: 9999px;
    border: 0.25rem solid rgb(255 255 255 / 0.3);
    border-top-color: #1e3a8a;
    animation: erp-loading-overlay-spin 0.7s linear infinite;
}

.erp-loading-overlay__text {
    color: #ffffff;
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0.025em;
    margin: 0;
}

@keyframes erp-loading-overlay-spin {
    to {
        transform: rotate(360deg);
    }
}

/* Progress bar tipis di top layar - indikator soft khusus perpindahan
   halaman (wire:navigate). Lebar dianimasikan lewat class is-active/is-done
   dari JS di loading-overlay.blade.php, bukan lewat animasi CSS mandiri. */
.erp-page-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 0%;
    z-index: 10000;
    opacity: 0;
    background: linear-gradient(90deg, #1e3a8a, #3b82f6);
    box-shadow: 0 0 8px rgb(59 130 246 / 0.6);
    pointer-events: none;
    transition: width 0.3s ease, opacity 0.2s ease;
}

.erp-page-progress.is-active {
    opacity: 1;
    width: 80%;
    transition: width 4s cubic-bezier(0.1, 0.6, 0.2, 1), opacity 0.2s ease;
}

.erp-page-progress.is-done {
    opacity: 1;
    width: 100%;
    transition: width 0.2s ease;
}

/* §notif Posisi notifikasi Filament ke tengah atas layar agar lebih mudah dilihat user.
   Override semua varian fi-align-* agar selalu center tanpa peduli konfigurasi server. */
.fi-no {
    position: fixed !important;
    top: 1.5rem !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translateX(-50%) !important;
    width: max-content !important;
    max-width: min(36rem, 90vw) !important;
    z-index: 9998;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

/* Font notifikasi lebih besar agar mudah dibaca */
.fi-notification {
    font-size: 1rem !important;
    min-width: 22rem;
    box-shadow: 0 8px 32px rgb(0 0 0 / 0.18) !important;
}

.fi-notification .fi-notification-title {
    font-size: 1rem !important;
    font-weight: 600 !important;
}

.fi-notification .fi-notification-body {
    font-size: 0.9375rem !important;
}

/* §14 Font size compact/dense (gaya NetSuite) - target 13px baseline,
   TIDAK diturunkan lebih ekstrem dari itu demi keterbacaan (per catatan
   dokumen sumber sendiri). Nama class disesuaikan ke Filament v5 nyata
   (bukan disalin mentah dari dokumen, yang beberapa classnya untuk versi
   lama - ex. .fi-fo-field-wrp-label tidak ada di v5, yang benar
   .fi-fo-field-label - dicek langsung ke vendor/filament sebelum dipakai). */
.fi-input,
.fi-ta-cell,
.fi-ta-text,
.fi-btn {
    font-size: 0.75rem !important;
    line-height: 1.125rem !important;
}

.fi-fo-field-label {
    font-size: 0.6875rem !important;
    font-weight: 500 !important;
}

.fi-section-header-heading {
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
}

/* KPI card Dashboard (gaya referensi mockup 2026-07-03) - icon+label di
   baris atas, angka besar di tengah, badge %-perubahan di baris sendiri
   paling bawah. Lihat memory feedback_dashboard_vs_report_ui "Reference
   visual". Tidak pakai utility Tailwind arbitrary (tidak ada JIT build
   untuk custom Blade page ini), jadi class named disini. */
.erp-kpi-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.erp-kpi-card__label {
    font-size: 0.75rem;
    font-weight: 500;
    color: rgb(107 114 128);
}

.dark .erp-kpi-card__label {
    color: rgb(156 163 175);
}

.erp-kpi-card__icon {
    height: 1.25rem;
    width: 1.25rem;
    color: rgb(156 163 175);
}

.erp-kpi-card__value {
    margin-top: 0.375rem;
    font-size: 1.5rem;
    font-weight: 700;
}

.erp-kpi-card__delta {
    margin-top: 0.5rem;
}

/* Leaderboard - lingkaran inisial 2-huruf, bukan nomor rank. */
.erp-avatar-circle {
    display: flex;
    height: 1.75rem;
    width: 1.75rem;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background-color: rgb(30 58 138 / 0.12);
    font-size: 0.6875rem;
    font-weight: 600;
    color: rgb(30 58 138);
}

.dark .erp-avatar-circle {
    background-color: rgb(96 165 250 / 0.16);
    color: rgb(147 197 253);
}

/* §15 Login/simple-page (login, register, forgot password, edit profile)
   dipercantik - gradient navy penuh layar di belakang, konten (logo+judul+
   form) dijadikan satu card putih melayang, bukan form polos tanpa
   pembatas. Menyasar class layout Filament v5 sungguhan (dicek langsung
   ke vendor/filament sebelum dipakai), bukan class versi lama. */
.fi-simple-layout {
    min-height: 100vh;
    background: radial-gradient(circle at top left, rgb(30 58 138 / 0.55), transparent 55%),
        linear-gradient(160deg, #0f1c4d 0%, #1e3a8a 45%, #13245e 100%);
}

.dark .fi-simple-layout {
    background: radial-gradient(circle at top left, rgb(30 58 138 / 0.65), transparent 55%),
        linear-gradient(160deg, #05070f 0%, #0f1c4d 55%, #05070f 100%);
}

.fi-simple-main-ctn {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.fi-simple-page-content {
    background-color: #fff;
    border-radius: 1rem;
    box-shadow: 0 20px 45px -12px rgb(15 23 42 / 0.35);
    padding: 2.5rem 2.25rem;
}

.dark .fi-simple-page-content {
    background-color: rgb(17 24 39);
    box-shadow: 0 20px 45px -12px rgb(0 0 0 / 0.6);
}

.fi-simple-header {
    text-align: center;
    align-items: center;
}

.fi-simple-header .fi-logo {
    margin-left: auto;
    margin-right: auto;
}

.fi-simple-header-subheading {
    color: rgb(100 116 139);
    font-size: 0.8125rem;
}

.dark .fi-simple-header-subheading {
    color: rgb(148 163 184);
}

/* §16 Table Repeater (Filament v5 native Repeater::table(), lihat
   PurchaseOrderForm/TransferForm's "Detail SKU") - header sticky ke
   scroll halaman (BUKAN overflow-y:auto+max-height di container ini
   sendiri) supaya label kolom tetap terlihat kalau baris SKU sampai
   puluhan. overflow-y:auto disini SENGAJA dihapus - itu memotong
   (clip) dropdown Select SKU yang seharusnya melayang diatas tabel,
   membuatnya seolah "terjebak" ikut ter-scroll didalam tabel - dilaporkan
   user langsung. position:sticky tanpa scroll-container disini tetap
   sticky relatif ke scroll halaman penuh, jadi behavior "header ikut
   keliatan pas scroll" tetap dapat tanpa efek samping itu. */
.fi-fo-table-repeater table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background-color: rgb(249 250 251);
}

.dark .fi-fo-table-repeater table thead th {
    background-color: rgb(31 41 55);
}

/* Kolom Unit Price (ke-3) kurang krusial dibanding SKU/Qty - disembunyikan
   di layar kecil supaya SKU+Qty (+Subtotal) tetap muat tanpa horizontal
   scroll. */
@media (max-width: 640px) {
    .fi-fo-table-repeater table th:nth-child(3),
    .fi-fo-table-repeater table td:nth-child(3) {
        display: none;
    }
}