﻿/* =========================================================
   Facilities Inventory
========================================================= */

.inventory-filter-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 220px auto;
    gap: .85rem;
    align-items: end;
}

.inventory-count-badge,
.inventory-mini-badge {
    border-radius: 999px;
    padding: .35rem .75rem;
    background: #f1f5f9;
    color: #475569;
    font-weight: 950;
    font-size: .78rem;
    white-space: nowrap;
}

.inventory-mini-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
}

.inventory-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1060;
    background: rgba(15, 23, 42, .55);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.inventory-modal {
    width: min(760px, 100%);
    max-height: calc(100vh - 2rem);
    background: #ffffff;
    border-radius: 26px;
    box-shadow: 0 28px 70px rgba(15, 23, 42, .30);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.inventory-modal-lg {
    width: min(1120px, 100%);
}

.inventory-modal-header {
    padding: 1rem;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

    .inventory-modal-header > div:first-child {
        display: flex;
        align-items: flex-start;
        gap: .8rem;
    }

        .inventory-modal-header > div:first-child > i {
            width: 48px;
            height: 48px;
            border-radius: 18px;
            background: #edf9db;
            color: #527900;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 1.25rem;
            flex: 0 0 auto;
        }

    .inventory-modal-header h5 {
        color: #0f172a;
        font-weight: 950;
        margin: 0;
    }

    .inventory-modal-header p {
        color: #64748b;
        margin: .25rem 0 0;
        line-height: 1.55;
    }

.inventory-modal-body {
    padding: 1rem;
    overflow: auto;
}

.inventory-modal-footer {
    padding: 1rem;
    border-top: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .65rem;
}

.inventory-form-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .85rem;
}

    .inventory-form-grid .form-label,
    .inventory-filter-grid .form-label {
        font-weight: 850;
        color: #475569;
        font-size: .82rem;
    }

    .inventory-form-grid .span-2 {
        grid-column: span 2;
    }

    .inventory-form-grid .span-3 {
        grid-column: span 3;
    }

@media (max-width: 992px) {
    .inventory-filter-grid,
    .inventory-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

        .inventory-form-grid .span-2,
        .inventory-form-grid .span-3 {
            grid-column: span 2;
        }
}

@media (max-width: 576px) {
    .inventory-filter-grid,
    .inventory-form-grid {
        grid-template-columns: 1fr;
    }

        .inventory-form-grid .span-2,
        .inventory-form-grid .span-3 {
            grid-column: span 1;
        }
}
.inventory-filter-grid-4 {
    grid-template-columns: minmax(0, 1fr) 260px 180px auto;
}

.inventory-balance-badge {
    border-radius: 999px;
    padding: .35rem .75rem;
    font-weight: 950;
    font-size: .78rem;
    display: inline-flex;
    min-width: 54px;
    justify-content: center;
}

    .inventory-balance-badge.normal {
        background: #dcfce7;
        color: #15803d;
    }

    .inventory-balance-badge.low {
        background: #fee2e2;
        color: #b91c1c;
    }

@media (max-width: 1200px) {
    .inventory-filter-grid-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .inventory-filter-grid-4 {
        grid-template-columns: 1fr;
    }
}

.inventory-store-type {
    border-radius: 999px;
    padding: .35rem .75rem;
    font-weight: 950;
    font-size: .76rem;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    white-space: nowrap;
}

    .inventory-store-type.main {
        background: #fef3c7;
        color: #92400e;
    }

    .inventory-store-type.normal {
        background: #edf9db;
        color: #527900;
    }

/* =========================================================
   Inventory Transactions
========================================================= */

.inventory-transactions-filter {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) 220px 260px 210px 160px 160px auto;
    gap: .85rem;
    align-items: end;
}

.inventory-movement-actions {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .85rem;
}

.inventory-action-card {
    border: 1px solid #e5e7eb;
    background: #ffffff;
    border-radius: 22px;
    padding: 1rem;
    text-align: start;
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .06);
    transition: .2s ease;
}

    .inventory-action-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 36px rgba(15, 23, 42, .10);
    }

    .inventory-action-card i {
        width: 44px;
        height: 44px;
        border-radius: 16px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        font-size: 1.15rem;
    }

    .inventory-action-card strong {
        display: block;
        color: #0f172a;
        font-weight: 950;
        line-height: 1.25;
    }

    .inventory-action-card span {
        display: block;
        color: #64748b;
        font-size: .76rem;
        font-weight: 750;
        margin-top: .2rem;
        line-height: 1.45;
    }

    .inventory-action-card.opening i {
        background: #edf9db;
        color: #527900;
    }

    .inventory-action-card.in i,
    .inventory-action-card.adjust-in i {
        background: #dcfce7;
        color: #15803d;
    }

    .inventory-action-card.out i,
    .inventory-action-card.adjust-out i {
        background: #fee2e2;
        color: #b91c1c;
    }

    .inventory-action-card.purchase i {
        background: #fef3c7;
        color: #92400e;
    }

.inventory-transaction-badge {
    border-radius: 999px;
    padding: .35rem .75rem;
    background: #f1f5f9;
    color: #475569;
    font-weight: 950;
    font-size: .74rem;
    display: inline-flex;
    white-space: nowrap;
}

    .inventory-transaction-badge.opening {
        background: #edf9db;
        color: #527900;
    }

    .inventory-transaction-badge.in,
    .inventory-transaction-badge.adjust-in,
    .inventory-transaction-badge.wo-return {
        background: #dcfce7;
        color: #15803d;
    }

    .inventory-transaction-badge.out,
    .inventory-transaction-badge.adjust-out,
    .inventory-transaction-badge.wo-out {
        background: #fee2e2;
        color: #b91c1c;
    }

    .inventory-transaction-badge.purchase {
        background: #fef3c7;
        color: #92400e;
    }

.inventory-qty {
    border-radius: 999px;
    padding: .3rem .65rem;
    font-weight: 950;
    font-size: .76rem;
    display: inline-flex;
    min-width: 50px;
    justify-content: center;
}

    .inventory-qty.in {
        background: #dcfce7;
        color: #15803d;
    }

    .inventory-qty.out {
        background: #fee2e2;
        color: #b91c1c;
    }

.inventory-reference {
    display: inline-flex;
    flex-direction: column;
    gap: .2rem;
    border-radius: 14px;
    padding: .4rem .6rem;
    background: #f8fafc;
    color: #475569;
    font-size: .76rem;
    font-weight: 900;
}

    .inventory-reference small {
        color: #64748b;
        font-weight: 800;
    }

.inventory-movement-help {
    border: 1px solid #bae6fd;
    background: #f0f9ff;
    color: #075985;
    border-radius: 18px;
    padding: .85rem;
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    font-weight: 850;
    line-height: 1.6;
}

@media (max-width: 1400px) {
    .inventory-transactions-filter {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .inventory-movement-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .inventory-transactions-filter,
    .inventory-movement-actions {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Low Stock Report
========================================================= */

.inventory-low-stock-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.inventory-low-card {
    border: 1px solid #e5e7eb;
    background: #ffffff;
    border-radius: 22px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: .85rem;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .06);
}

    .inventory-low-card i {
        width: 52px;
        height: 52px;
        border-radius: 18px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 1.35rem;
    }

    .inventory-low-card strong {
        display: block;
        color: #0f172a;
        font-size: 1.7rem;
        font-weight: 950;
        line-height: 1;
    }

    .inventory-low-card span {
        display: block;
        color: #64748b;
        font-size: .82rem;
        font-weight: 850;
        margin-top: .25rem;
    }

    .inventory-low-card.danger i {
        background: #fee2e2;
        color: #b91c1c;
    }

    .inventory-low-card.warning i {
        background: #fef3c7;
        color: #92400e;
    }

    .inventory-low-card.info i {
        background: #edf9db;
        color: #527900;
    }

    .inventory-low-card.success i {
        background: #dcfce7;
        color: #15803d;
    }

.inventory-low-filter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px 260px auto;
    gap: .85rem;
    align-items: end;
}

    .inventory-low-filter .form-label {
        font-weight: 850;
        color: #475569;
        font-size: .82rem;
    }

.inventory-shortage-badge {
    border-radius: 999px;
    padding: .35rem .75rem;
    background: #fee2e2;
    color: #b91c1c;
    font-weight: 950;
    font-size: .78rem;
    display: inline-flex;
    min-width: 54px;
    justify-content: center;
}

.inventory-severity-badge {
    border-radius: 999px;
    padding: .35rem .75rem;
    font-weight: 950;
    font-size: .76rem;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    white-space: nowrap;
}

    .inventory-severity-badge.critical {
        background: #7f1d1d;
        color: #ffffff;
    }

    .inventory-severity-badge.high {
        background: #fee2e2;
        color: #b91c1c;
    }

    .inventory-severity-badge.medium {
        background: #fef3c7;
        color: #92400e;
    }

    .inventory-severity-badge.low {
        background: #edf9db;
        color: #527900;
    }

@media (max-width: 1200px) {
    .inventory-low-stock-summary,
    .inventory-low-filter {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .inventory-low-stock-summary,
    .inventory-low-filter {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Work Order Materials
========================================================= */

.workorder-material-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .85rem;
}

    .workorder-material-summary div {
        border: 1px solid #e5e7eb;
        background: #f8fafc;
        border-radius: 18px;
        padding: .85rem;
    }

    .workorder-material-summary label {
        display: block;
        color: #64748b;
        font-size: .75rem;
        font-weight: 900;
        margin-bottom: .3rem;
    }

    .workorder-material-summary strong {
        display: block;
        color: #0f172a;
        font-size: 1.25rem;
        font-weight: 950;
    }

.wo-material-status {
    border-radius: 999px;
    padding: .35rem .75rem;
    font-weight: 950;
    font-size: .76rem;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    white-space: nowrap;
}

    .wo-material-status.issued {
        background: #fee2e2;
        color: #b91c1c;
    }

    .wo-material-status.returned {
        background: #dcfce7;
        color: #15803d;
    }

.wo-return-box {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .85rem;
}

    .wo-return-box div {
        border: 1px solid #e5e7eb;
        background: #f8fafc;
        border-radius: 18px;
        padding: .85rem;
    }

    .wo-return-box label {
        display: block;
        color: #64748b;
        font-size: .75rem;
        font-weight: 900;
        margin-bottom: .3rem;
    }

    .wo-return-box strong {
        display: block;
        color: #0f172a;
        font-weight: 950;
    }

@media (max-width: 768px) {
    .workorder-material-summary,
    .wo-return-box {
        grid-template-columns: 1fr;
    }
}
/* =========================================================
   Inventory Dashboard
========================================================= */

.inventory-dashboard-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.inventory-dashboard-kpis-secondary {
    margin-top: .25rem;
}

.inventory-dashboard-kpi {
    border: 1px solid #e5e7eb;
    background: #ffffff;
    border-radius: 24px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: .85rem;
    box-shadow: 0 16px 36px rgba(15, 23, 42, .07);
    cursor: pointer;
    transition: .2s ease;
    min-height: 120px;
}

    .inventory-dashboard-kpi:hover {
        transform: translateY(-2px);
        box-shadow: 0 22px 44px rgba(15, 23, 42, .11);
    }

    .inventory-dashboard-kpi .kpi-icon {
        width: 58px;
        height: 58px;
        border-radius: 20px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        font-size: 1.45rem;
    }

    .inventory-dashboard-kpi span {
        display: block;
        color: #64748b;
        font-size: .8rem;
        font-weight: 900;
    }

    .inventory-dashboard-kpi strong {
        display: block;
        color: #0f172a;
        font-size: 2rem;
        font-weight: 950;
        line-height: 1.1;
        margin-top: .2rem;
    }

    .inventory-dashboard-kpi small {
        display: block;
        color: #94a3b8;
        font-size: .74rem;
        font-weight: 800;
        margin-top: .2rem;
    }

    .inventory-dashboard-kpi.primary .kpi-icon {
        background: #edf9db;
        color: #527900;
    }

    .inventory-dashboard-kpi.info .kpi-icon {
        background: #eefbd8;
        color: #527900;
    }

    .inventory-dashboard-kpi.danger .kpi-icon {
        background: #fee2e2;
        color: #b91c1c;
    }

    .inventory-dashboard-kpi.success .kpi-icon {
        background: #dcfce7;
        color: #15803d;
    }

    .inventory-dashboard-kpi.warning .kpi-icon {
        background: #fef3c7;
        color: #92400e;
    }

    .inventory-dashboard-kpi.purple .kpi-icon {
        background: #ede9fe;
        color: #6d28d9;
    }

    .inventory-dashboard-kpi.dark .kpi-icon {
        background: #e2e8f0;
        color: #334155;
    }

    .inventory-dashboard-kpi.neutral .kpi-icon {
        background: #f1f5f9;
        color: #475569;
    }

.inventory-dashboard-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

@media (max-width: 1200px) {
    .inventory-dashboard-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .inventory-dashboard-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 576px) {
    .inventory-dashboard-kpis {
        grid-template-columns: 1fr;
    }

    .inventory-dashboard-kpi {
        min-height: auto;
    }
}

/* =========================================================
   Stock Transfer
========================================================= */

.inventory-transfer-filter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px 160px 160px auto;
    gap: .85rem;
    align-items: end;
}

    .inventory-transfer-filter .form-label {
        font-weight: 850;
        color: #475569;
        font-size: .82rem;
    }

@media (max-width: 1200px) {
    .inventory-transfer-filter {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .inventory-transfer-filter {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Inventory Stock Report
========================================================= */

.inventory-stock-report-filter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 240px 240px 220px auto;
    gap: .85rem;
    align-items: end;
}

    .inventory-stock-report-filter .form-label {
        font-weight: 850;
        color: #475569;
        font-size: .82rem;
    }

.inventory-report-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.inventory-report-card {
    border: 1px solid #e5e7eb;
    background: #ffffff;
    border-radius: 22px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: .85rem;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .06);
}

    .inventory-report-card i {
        width: 52px;
        height: 52px;
        border-radius: 18px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 1.35rem;
    }

    .inventory-report-card span {
        display: block;
        color: #64748b;
        font-size: .8rem;
        font-weight: 900;
    }

    .inventory-report-card strong {
        display: block;
        color: #0f172a;
        font-size: 1.65rem;
        font-weight: 950;
        line-height: 1.1;
        margin-top: .25rem;
    }

    .inventory-report-card.primary i {
        background: #edf9db;
        color: #527900;
    }

    .inventory-report-card.info i {
        background: #eefbd8;
        color: #527900;
    }

    .inventory-report-card.danger i {
        background: #fee2e2;
        color: #b91c1c;
    }

    .inventory-report-card.success i {
        background: #dcfce7;
        color: #15803d;
    }

.inventory-report-table tfoot th {
    background: #f8fafc;
    color: #0f172a;
    font-weight: 950;
}

.inventory-report-low-row {
    background: #fff7f7;
}

.inventory-print-header {
    display: none;
}

@media (max-width: 1200px) {
    .inventory-stock-report-filter,
    .inventory-report-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .inventory-stock-report-filter,
    .inventory-report-summary {
        grid-template-columns: 1fr;
    }
}

@media print {
    body {
        background: #ffffff !important;
    }

    .inventory-report-no-print,
    .fm-page-header,
    .sidebar,
    .navbar,
    .topbar,
    .layout-sidebar,
    .layout-topbar {
        display: none !important;
    }

    .inventory-print-header {
        display: block;
        text-align: center;
        margin-bottom: 1rem;
        border-bottom: 2px solid #0f172a;
        padding-bottom: .75rem;
    }

        .inventory-print-header h3 {
            margin: 0;
            font-weight: 950;
            color: #0f172a;
        }

        .inventory-print-header p {
            margin: .35rem 0 0;
            color: #475569;
            font-weight: 700;
        }

    .fm-page,
    .inventory-report-page {
        padding: 0 !important;
        margin: 0 !important;
    }

    .fm-card {
        box-shadow: none !important;
        border: 1px solid #d1d5db !important;
        border-radius: 0 !important;
        page-break-inside: avoid;
    }

    .inventory-report-summary {
        grid-template-columns: repeat(4, 1fr) !important;
    }

    .inventory-report-card {
        box-shadow: none !important;
        border-radius: 0 !important;
    }

    .table {
        font-size: 11px !important;
    }

    .fm-table th,
    .fm-table td {
        padding: .35rem !important;
    }
}

/* =========================================================
   Work Order Material Consumption Report
========================================================= */

.wo-material-report-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.wo-material-report-card {
    border: 1px solid #e5e7eb;
    background: #ffffff;
    border-radius: 22px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: .85rem;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .06);
}

    .wo-material-report-card i {
        width: 52px;
        height: 52px;
        border-radius: 18px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 1.35rem;
    }

    .wo-material-report-card span {
        display: block;
        color: #64748b;
        font-size: .8rem;
        font-weight: 900;
    }

    .wo-material-report-card strong {
        display: block;
        color: #0f172a;
        font-size: 1.65rem;
        font-weight: 950;
        line-height: 1.1;
        margin-top: .25rem;
    }

    .wo-material-report-card.primary i {
        background: #edf9db;
        color: #527900;
    }

    .wo-material-report-card.danger i {
        background: #fee2e2;
        color: #b91c1c;
    }

    .wo-material-report-card.success i {
        background: #dcfce7;
        color: #15803d;
    }

    .wo-material-report-card.warning i {
        background: #fef3c7;
        color: #92400e;
    }

.wo-material-report-filter {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) 220px 260px 240px 240px 180px 160px 160px auto;
    gap: .85rem;
    align-items: end;
}

    .wo-material-report-filter .form-label {
        font-weight: 850;
        color: #475569;
        font-size: .82rem;
    }

.wo-material-report-table tfoot th {
    background: #f8fafc;
    color: #0f172a;
    font-weight: 950;
}

.wo-material-returned-row {
    background: #f0fdf4;
}

.wo-material-print-header {
    display: none;
}

@media (max-width: 1500px) {
    .wo-material-report-filter {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1200px) {
    .wo-material-report-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .wo-material-report-filter,
    .wo-material-report-summary {
        grid-template-columns: 1fr;
    }
}

@media print {
    body {
        background: #ffffff !important;
    }

    .wo-material-report-no-print,
    .fm-page-header,
    .sidebar,
    .navbar,
    .topbar,
    .layout-sidebar,
    .layout-topbar {
        display: none !important;
    }

    .wo-material-print-header {
        display: block;
        text-align: center;
        margin-bottom: 1rem;
        border-bottom: 2px solid #0f172a;
        padding-bottom: .75rem;
    }

        .wo-material-print-header h3 {
            margin: 0;
            font-weight: 950;
            color: #0f172a;
        }

        .wo-material-print-header p {
            margin: .35rem 0 0;
            color: #475569;
            font-weight: 700;
        }

    .fm-page,
    .wo-material-report-page {
        padding: 0 !important;
        margin: 0 !important;
    }

    .fm-card {
        box-shadow: none !important;
        border: 1px solid #d1d5db !important;
        border-radius: 0 !important;
        page-break-inside: avoid;
    }

    .wo-material-report-summary {
        grid-template-columns: repeat(4, 1fr) !important;
    }

    .wo-material-report-card {
        box-shadow: none !important;
        border-radius: 0 !important;
    }

    .table {
        font-size: 10.5px !important;
    }

    .fm-table th,
    .fm-table td {
        padding: .32rem !important;
    }
}


/* =========================================================
   Facilities Login
========================================================= */

.fm-login-page {
    min-height: 100vh;
    background: radial-gradient(circle at top left, rgba(132, 199, 8, .20), transparent 35%), radial-gradient(circle at bottom right, rgba(132, 199, 8, .18), transparent 35%), linear-gradient(135deg, #f8fafc, #eef2ff);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
}

.fm-login-card {
    width: 100%;
    max-width: 470px;
    background: rgba(255, 255, 255, .86);
    backdrop-filter: blur(18px);
    border: 1px solid rgba(226, 232, 240, .95);
    border-radius: 30px;
    padding: 1.5rem;
    box-shadow: 0 30px 80px rgba(15, 23, 42, .16);
}

.fm-login-brand {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.4rem;
}

.fm-login-logo {
    width: 68px;
    height: 68px;
    border-radius: 24px;
    background: linear-gradient(135deg, #6b9f08, #84c708);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    box-shadow: 0 18px 38px rgba(132, 199, 8, .35);
}

.fm-login-brand h3 {
    margin: 0;
    color: #0f172a;
    font-weight: 950;
    font-size: 1.35rem;
}

.fm-login-brand p {
    margin: .25rem 0 0;
    color: #64748b;
    font-weight: 700;
}

.fm-login-form {
    display: grid;
    gap: 1rem;
}

    .fm-login-form .form-label {
        font-weight: 850;
        color: #475569;
    }

.fm-login-input {
    min-height: 50px;
    border-radius: 16px;
    border-color: #dbe3ef;
    font-weight: 700;
}

    .fm-login-input:focus {
        box-shadow: 0 0 0 .2rem rgba(132, 199, 8, .13);
    }

.fm-login-btn {
    min-height: 52px;
    border-radius: 16px;
    font-weight: 900;
    margin-top: .35rem;
}

.fm-login-footer {
    margin-top: 1.25rem;
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    border-radius: 18px;
    padding: .85rem;
    color: #64748b;
    font-weight: 800;
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
}

    .fm-login-footer strong {
        color: #0f172a;
    }

/* =========================================================
   Layout User Menu
========================================================= */

.layout-user-menu {
    position: relative;
}

.layout-user-button {
    border: 1px solid rgba(226, 232, 240, .95);
    background: rgba(255, 255, 255, .88);
    border-radius: 18px;
    padding: .45rem .55rem;
    display: flex;
    align-items: center;
    gap: .65rem;
    min-width: 210px;
    max-width: 280px;
    cursor: pointer;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .08);
    transition: .2s ease;
}

    .layout-user-button:hover {
        background: #ffffff;
        transform: translateY(-1px);
        box-shadow: 0 16px 34px rgba(15, 23, 42, .12);
    }

.layout-user-avatar {
    width: 42px;
    height: 42px;
    border-radius: 15px;
    background: linear-gradient(135deg, #6b9f08, #84c708);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 950;
    font-size: 1rem;
    flex: 0 0 auto;
    box-shadow: 0 10px 22px rgba(132, 199, 8, .28);
}

    .layout-user-avatar.large {
        width: 54px;
        height: 54px;
        border-radius: 18px;
        font-size: 1.25rem;
    }

.layout-user-info {
    flex: 1;
    min-width: 0;
    text-align: start;
}

    .layout-user-info strong {
        display: block;
        color: #0f172a;
        font-size: .9rem;
        font-weight: 950;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .layout-user-info span {
        display: block;
        color: #64748b;
        font-size: .73rem;
        font-weight: 800;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.layout-user-arrow {
    width: 26px;
    height: 26px;
    border-radius: 10px;
    background: #f1f5f9;
    color: #475569;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: .2s ease;
    flex: 0 0 auto;
}

    .layout-user-arrow.open {
        transform: rotate(180deg);
        background: #eefbd8;
        color: #527900;
    }

.layout-user-dropdown {
    position: absolute;
    top: calc(100% + .65rem);
    inset-inline-end: 0;
    width: 300px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 24px;
    padding: .75rem;
    box-shadow: 0 30px 70px rgba(15, 23, 42, .18);
    z-index: 2000;
    animation: userMenuFade .18s ease;
}

@keyframes userMenuFade {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.layout-user-dropdown-header {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .65rem;
    background: linear-gradient(135deg, #f8fafc, #eef2ff);
    border-radius: 18px;
}

    .layout-user-dropdown-header strong {
        display: block;
        color: #0f172a;
        font-weight: 950;
        font-size: .95rem;
    }

    .layout-user-dropdown-header span {
        display: block;
        color: #64748b;
        font-weight: 800;
        font-size: .75rem;
        margin-top: .15rem;
    }

.layout-user-dropdown-divider {
    height: 1px;
    background: #e5e7eb;
    margin: .65rem .25rem;
}

.layout-user-dropdown-item {
    width: 100%;
    border: 0;
    background: transparent;
    color: #334155;
    border-radius: 16px;
    padding: .72rem .8rem;
    display: flex;
    align-items: center;
    gap: .7rem;
    font-weight: 850;
    text-align: start;
    transition: .18s ease;
}

    .layout-user-dropdown-item i {
        width: 34px;
        height: 34px;
        border-radius: 12px;
        background: #f1f5f9;
        color: #6b9f08;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 1rem;
        flex: 0 0 auto;
    }

    .layout-user-dropdown-item:hover {
        background: #f8fafc;
        color: #0f172a;
    }

        .layout-user-dropdown-item:hover i {
            background: #eefbd8;
        }

    .layout-user-dropdown-item.danger {
        color: #b91c1c;
    }

        .layout-user-dropdown-item.danger i {
            background: #fee2e2;
            color: #b91c1c;
        }

        .layout-user-dropdown-item.danger:hover {
            background: #fef2f2;
        }

@media (max-width: 768px) {
    .layout-user-button {
        min-width: auto;
        padding: .45rem;
    }

    .layout-user-info,
    .layout-user-arrow {
        display: none;
    }

    .layout-user-dropdown {
        width: 280px;
        inset-inline-end: 0;
    }
}
/* =========================================================
   Security Users
========================================================= */

.security-users-filter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px 180px auto;
    gap: .85rem;
    align-items: end;
}

    .security-users-filter .form-label {
        font-weight: 850;
        color: #475569;
        font-size: .82rem;
    }

.security-user-cell {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.security-user-avatar {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    background: linear-gradient(135deg, #6b9f08, #84c708);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 950;
    box-shadow: 0 12px 24px rgba(132, 199, 8, .24);
    flex: 0 0 auto;
}

.security-user-cell strong {
    display: block;
    color: #0f172a;
    font-weight: 950;
}

.security-user-cell span {
    display: block;
    color: #64748b;
    font-size: .78rem;
    font-weight: 800;
}

.security-user-cell small {
    display: block;
    color: #94a3b8;
    font-size: .72rem;
    font-weight: 800;
}

.security-role-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

    .security-role-tags span {
        background: #eef2ff;
        color: #3730a3;
        border: 1px solid #c7d2fe;
        border-radius: 999px;
        padding: .25rem .55rem;
        font-size: .72rem;
        font-weight: 900;
    }

.security-status-badge {
    border-radius: 999px;
    padding: .28rem .55rem;
    font-size: .72rem;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    gap: .25rem;
}

    .security-status-badge.active {
        background: #dcfce7;
        color: #15803d;
    }

    .security-status-badge.inactive {
        background: #f1f5f9;
        color: #64748b;
    }

    .security-status-badge.locked {
        background: #fee2e2;
        color: #b91c1c;
    }

    .security-status-badge.warning {
        background: #fef3c7;
        color: #92400e;
    }

.security-checks-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    padding-top: 2rem;
}

    .security-checks-row .form-check {
        font-weight: 850;
        color: #475569;
    }

.security-roles-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.security-role-option {
    border: 1px solid #e5e7eb;
    background: #ffffff;
    border-radius: 18px;
    padding: .75rem;
    display: flex;
    align-items: center;
    gap: .65rem;
    cursor: pointer;
    transition: .18s ease;
}

    .security-role-option:hover {
        background: #f8fafc;
        border-color: #cbd5e1;
    }

    .security-role-option input {
        width: 18px;
        height: 18px;
    }

    .security-role-option strong {
        display: block;
        color: #0f172a;
        font-weight: 900;
        font-size: .86rem;
    }

    .security-role-option small {
        display: block;
        color: #64748b;
        font-weight: 800;
        font-size: .72rem;
    }

@media (max-width: 1200px) {
    .security-users-filter,
    .security-roles-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .security-users-filter,
    .security-roles-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Security Roles
========================================================= */

.security-roles-filter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 200px 220px auto;
    gap: .85rem;
    align-items: end;
}

    .security-roles-filter .form-label {
        font-weight: 850;
        color: #475569;
        font-size: .82rem;
    }

.security-role-cell {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.security-role-icon {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    background: linear-gradient(135deg, #4338ca, #6b9f08);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 950;
    box-shadow: 0 12px 24px rgba(67, 56, 202, .24);
    flex: 0 0 auto;
}

.security-role-cell strong {
    display: block;
    color: #0f172a;
    font-weight: 950;
}

.security-role-cell span {
    display: block;
    color: #64748b;
    font-size: .78rem;
    font-weight: 800;
}

.security-count-badge {
    border-radius: 999px;
    padding: .32rem .65rem;
    font-size: .75rem;
    font-weight: 950;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}

    .security-count-badge.users {
        background: #edf9db;
        color: #527900;
    }

    .security-count-badge.permissions {
        background: #ede9fe;
        color: #6d28d9;
    }

.security-status-badge.system {
    background: #eef2ff;
    color: #3730a3;
}

.security-status-badge.custom {
    background: #f1f5f9;
    color: #475569;
}

@media (max-width: 1200px) {
    .security-roles-filter {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .security-roles-filter {
        grid-template-columns: 1fr;
    }
}
/* =========================================================
   Security Role Permissions
========================================================= */

.security-role-permission-select {
    display: grid;
    grid-template-columns: minmax(0, 420px) auto;
    gap: .85rem;
    align-items: end;
}

    .security-role-permission-select .form-label,
    .security-permission-filter .form-label {
        font-weight: 850;
        color: #475569;
        font-size: .82rem;
    }

.security-role-permission-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.security-role-permission-card {
    border: 1px solid #e5e7eb;
    background: #ffffff;
    border-radius: 22px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: .85rem;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .06);
}

    .security-role-permission-card > i {
        width: 52px;
        height: 52px;
        border-radius: 18px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 1.35rem;
        flex: 0 0 auto;
    }

    .security-role-permission-card span {
        display: block;
        color: #64748b;
        font-size: .8rem;
        font-weight: 900;
    }

    .security-role-permission-card strong {
        display: block;
        color: #0f172a;
        font-size: 1.35rem;
        font-weight: 950;
        line-height: 1.1;
        margin-top: .25rem;
    }

    .security-role-permission-card small {
        display: block;
        color: #94a3b8;
        font-size: .74rem;
        font-weight: 800;
        margin-top: .25rem;
    }

    .security-role-permission-card.primary > i {
        background: #eef2ff;
        color: #3730a3;
    }

    .security-role-permission-card.info > i {
        background: #eefbd8;
        color: #527900;
    }

    .security-role-permission-card.success > i {
        background: #dcfce7;
        color: #15803d;
    }

    .security-role-permission-card.warning > i {
        background: #fef3c7;
        color: #92400e;
    }

.security-permission-filter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px 220px;
    gap: .85rem;
    align-items: end;
}

.security-permissions-groups {
    display: grid;
    gap: 1rem;
}

.security-permission-module {
    border: 1px solid #e5e7eb;
    border-radius: 22px;
    background: #ffffff;
    overflow: hidden;
}

.security-permission-module-header {
    padding: .9rem 1rem;
    background: linear-gradient(135deg, #f8fafc, #eef2ff);
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
}

    .security-permission-module-header > div:first-child {
        display: flex;
        align-items: center;
        gap: .55rem;
    }

    .security-permission-module-header i {
        color: #6b9f08;
    }

    .security-permission-module-header strong {
        color: #0f172a;
        font-weight: 950;
    }

    .security-permission-module-header span {
        color: #64748b;
        font-size: .78rem;
        font-weight: 850;
    }

.security-permission-page-group {
    padding: 1rem;
    border-top: 1px solid #f1f5f9;
}

.security-permission-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
    margin-bottom: .75rem;
}

    .security-permission-page-header > div:first-child {
        display: flex;
        align-items: center;
        gap: .5rem;
    }

    .security-permission-page-header i {
        color: #64748b;
    }

    .security-permission-page-header strong {
        color: #334155;
        font-weight: 950;
    }

    .security-permission-page-header span {
        background: #f1f5f9;
        color: #475569;
        border-radius: 999px;
        padding: .15rem .5rem;
        font-size: .72rem;
        font-weight: 900;
    }

.security-permission-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.security-permission-option {
    border: 1px solid #e5e7eb;
    border-radius: 18px;
    padding: .8rem;
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    cursor: pointer;
    transition: .18s ease;
    background: #ffffff;
}

    .security-permission-option:hover {
        background: #f8fafc;
        border-color: #cbd5e1;
    }

    .security-permission-option.selected {
        background: #f5fbe9;
        border-color: #93c5fd;
    }

    .security-permission-option input {
        width: 18px;
        height: 18px;
        margin-top: .15rem;
        flex: 0 0 auto;
    }

.security-permission-option-body {
    min-width: 0;
    flex: 1;
}

    .security-permission-option-body strong {
        display: block;
        color: #0f172a;
        font-size: .86rem;
        font-weight: 950;
    }

    .security-permission-option-body small {
        display: block;
        color: #64748b;
        font-size: .7rem;
        font-weight: 800;
        margin-top: .25rem;
        word-break: break-word;
    }

.security-permission-meta {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: wrap;
    margin-top: .5rem;
}

    .security-permission-meta span {
        background: #f1f5f9;
        color: #475569;
        border-radius: 999px;
        padding: .18rem .5rem;
        font-size: .68rem;
        font-weight: 900;
    }

    .security-permission-meta .menu {
        background: #fef3c7;
        color: #92400e;
    }

.fm-section-action-btn.danger {
    color: #b91c1c;
}

@media (max-width: 1400px) {
    .security-permission-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1200px) {
    .security-role-permission-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .security-permission-filter {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .security-role-permission-select,
    .security-role-permission-summary,
    .security-permission-filter,
    .security-permission-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Security User Permission Overrides
========================================================= */

.security-user-permission-select {
    display: grid;
    grid-template-columns: minmax(0, 460px) auto;
    gap: .85rem;
    align-items: end;
}

    .security-user-permission-select .form-label,
    .security-user-permission-filter .form-label {
        font-weight: 850;
        color: #475569;
        font-size: .82rem;
    }

.security-user-permission-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.security-user-permission-card {
    border: 1px solid #e5e7eb;
    background: #ffffff;
    border-radius: 22px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: .85rem;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .06);
}

    .security-user-permission-card > i {
        width: 52px;
        height: 52px;
        border-radius: 18px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 1.35rem;
        flex: 0 0 auto;
    }

    .security-user-permission-card span {
        display: block;
        color: #64748b;
        font-size: .8rem;
        font-weight: 900;
    }

    .security-user-permission-card strong {
        display: block;
        color: #0f172a;
        font-size: 1.25rem;
        font-weight: 950;
        line-height: 1.1;
        margin-top: .25rem;
    }

    .security-user-permission-card small {
        display: block;
        color: #94a3b8;
        font-size: .74rem;
        font-weight: 800;
        margin-top: .25rem;
    }

    .security-user-permission-card.primary > i {
        background: #eef2ff;
        color: #3730a3;
    }

    .security-user-permission-card.info > i {
        background: #eefbd8;
        color: #527900;
    }

    .security-user-permission-card.success > i {
        background: #dcfce7;
        color: #15803d;
    }

    .security-user-permission-card.warning > i {
        background: #fef3c7;
        color: #92400e;
    }

.security-user-permission-filter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px 240px;
    gap: .85rem;
    align-items: end;
}

.security-user-permissions-groups {
    display: grid;
    gap: 1rem;
}

.security-user-permission-module {
    border: 1px solid #e5e7eb;
    border-radius: 22px;
    background: #ffffff;
    overflow: hidden;
}

.security-user-permission-module-header {
    padding: .9rem 1rem;
    background: linear-gradient(135deg, #f8fafc, #eef2ff);
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
}

    .security-user-permission-module-header > div:first-child {
        display: flex;
        align-items: center;
        gap: .55rem;
    }

    .security-user-permission-module-header i {
        color: #6b9f08;
    }

    .security-user-permission-module-header strong {
        color: #0f172a;
        font-weight: 950;
    }

    .security-user-permission-module-header span {
        color: #64748b;
        font-size: .78rem;
        font-weight: 850;
    }

.security-user-permission-page-group {
    padding: 1rem;
    border-top: 1px solid #f1f5f9;
}

.security-user-permission-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
    margin-bottom: .75rem;
}

    .security-user-permission-page-header > div:first-child {
        display: flex;
        align-items: center;
        gap: .5rem;
    }

    .security-user-permission-page-header i {
        color: #64748b;
    }

    .security-user-permission-page-header strong {
        color: #334155;
        font-weight: 950;
    }

    .security-user-permission-page-header span {
        background: #f1f5f9;
        color: #475569;
        border-radius: 999px;
        padding: .15rem .5rem;
        font-size: .72rem;
        font-weight: 900;
    }

.security-user-permission-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.security-user-permission-option {
    border: 1px solid #e5e7eb;
    border-radius: 20px;
    padding: .85rem;
    background: #ffffff;
    transition: .18s ease;
}

    .security-user-permission-option:hover {
        box-shadow: 0 12px 28px rgba(15, 23, 42, .07);
    }

    .security-user-permission-option.effective-allow {
        border-color: #bbf7d0;
        background: #f7fff9;
    }

    .security-user-permission-option.effective-deny {
        border-color: #e5e7eb;
        background: #ffffff;
    }

    .security-user-permission-option.override-allow {
        border-color: #22c55e;
        background: #ecfdf5;
    }

    .security-user-permission-option.override-deny {
        border-color: #ef4444;
        background: #fef2f2;
    }

.security-user-permission-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

    .security-user-permission-top strong {
        display: block;
        color: #0f172a;
        font-size: .88rem;
        font-weight: 950;
    }

    .security-user-permission-top small {
        display: block;
        color: #64748b;
        font-size: .7rem;
        font-weight: 800;
        margin-top: .25rem;
        word-break: break-word;
    }

.security-effective-badge {
    border-radius: 999px;
    padding: .25rem .55rem;
    font-size: .68rem;
    font-weight: 950;
    flex: 0 0 auto;
}

    .security-effective-badge.allowed {
        background: #dcfce7;
        color: #15803d;
    }

    .security-effective-badge.denied {
        background: #fee2e2;
        color: #b91c1c;
    }

.security-permission-meta .role-allowed {
    background: #dcfce7;
    color: #15803d;
}

.security-permission-meta .role-denied {
    background: #f1f5f9;
    color: #64748b;
}

.security-override-buttons {
    margin-top: .75rem;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .45rem;
}

.security-override-btn {
    border: 1px solid #e5e7eb;
    background: #ffffff;
    color: #475569;
    border-radius: 14px;
    padding: .45rem .5rem;
    font-size: .75rem;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .3rem;
    transition: .18s ease;
}

    .security-override-btn:hover {
        background: #f8fafc;
    }

    .security-override-btn.inherit.active {
        background: #eef2ff;
        color: #3730a3;
        border-color: #c7d2fe;
    }

    .security-override-btn.allow.active {
        background: #dcfce7;
        color: #15803d;
        border-color: #86efac;
    }

    .security-override-btn.deny.active {
        background: #fee2e2;
        color: #b91c1c;
        border-color: #fecaca;
    }

@media (max-width: 1200px) {
    .security-user-permission-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .security-user-permission-filter,
    .security-user-permission-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .security-user-permission-select,
    .security-user-permission-summary,
    .security-user-permission-filter,
    .security-override-buttons {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Location Structure
========================================================= */

.location-structure-tabs {
    display: flex;
    gap: .6rem;
    flex-wrap: wrap;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: .75rem;
}

.location-structure-tab {
    border: 1px solid #e5e7eb;
    background: #ffffff;
    color: #475569;
    border-radius: 16px;
    padding: .65rem .95rem;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    font-weight: 900;
    transition: .18s ease;
}

    .location-structure-tab:hover {
        background: #f8fafc;
        border-color: #cbd5e1;
    }

    .location-structure-tab.active {
        background: #f5fbe9;
        color: #527900;
        border-color: #93c5fd;
        box-shadow: 0 10px 22px rgba(132, 199, 8, .12);
    }

.location-filter {
    max-width: 280px;
    font-weight: 800;
}

@media (max-width: 768px) {
    .location-filter {
        max-width: 100%;
    }

    .location-structure-tab {
        flex: 1 1 100%;
        justify-content: center;
    }
}
/* =========================================================
   Asset Import Page
========================================================= */

.asset-import-hero {
    position: relative;
    overflow: hidden;
    border-radius: 28px;
    padding: 1.35rem;
    background: linear-gradient(135deg, #0f172a, #527900, #06b6d4);
    color: #ffffff;
    display: flex;
    align-items: center;
    gap: 1rem;
    box-shadow: 0 24px 60px rgba(132, 199, 8, .25);
    animation: assetImportFade .45s ease;
}

    .asset-import-hero::after {
        content: "";
        position: absolute;
        width: 260px;
        height: 260px;
        border-radius: 999px;
        background: rgba(255,255,255,.12);
        inset-inline-end: -80px;
        top: -100px;
        animation: assetImportFloat 5s ease-in-out infinite;
    }

.asset-import-icon {
    width: 72px;
    height: 72px;
    border-radius: 24px;
    background: rgba(255,255,255,.18);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 2.3rem;
    flex: 0 0 auto;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.2);
}

.asset-import-hero h4 {
    margin: 0;
    font-weight: 950;
}

.asset-import-hero p {
    margin: .25rem 0 0;
    color: rgba(255,255,255,.82);
    font-weight: 700;
}

.asset-import-upload-box {
    border: 2px dashed #cbd5e1;
    border-radius: 26px;
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    padding: 2rem;
    text-align: center;
    transition: .25s ease;
    animation: assetImportSlideUp .45s ease;
}

    .asset-import-upload-box:hover {
        border-color: #b5ed45;
        background: #f5fbe9;
        transform: translateY(-2px);
    }

    .asset-import-upload-box.loading {
        border-color: #6b9f08;
        background: #f5fbe9;
    }

    .asset-import-upload-box > i {
        font-size: 3rem;
        color: #6b9f08;
        display: block;
        margin-bottom: .75rem;
        animation: assetImportPulse 1.6s ease-in-out infinite;
    }

    .asset-import-upload-box h5 {
        font-weight: 950;
        color: #0f172a;
        margin-bottom: .35rem;
    }

    .asset-import-upload-box p {
        color: #64748b;
        font-weight: 750;
    }

.asset-import-loader {
    display: inline-flex;
    align-items: center;
    gap: .65rem;
    color: #527900;
    font-weight: 900;
}

.asset-import-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.asset-import-summary-card {
    border: 1px solid #e5e7eb;
    border-radius: 24px;
    background: #ffffff;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: .85rem;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .06);
    animation: assetImportSlideUp .45s ease;
}

    .asset-import-summary-card i {
        width: 52px;
        height: 52px;
        border-radius: 18px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 1.35rem;
        flex: 0 0 auto;
    }

    .asset-import-summary-card span {
        display: block;
        color: #64748b;
        font-size: .8rem;
        font-weight: 900;
    }

    .asset-import-summary-card strong {
        display: block;
        color: #0f172a;
        font-size: 1.6rem;
        font-weight: 950;
        line-height: 1.1;
    }

    .asset-import-summary-card.total i {
        background: #eefbd8;
        color: #527900;
    }

    .asset-import-summary-card.success i {
        background: #dcfce7;
        color: #15803d;
    }

    .asset-import-summary-card.danger i {
        background: #fee2e2;
        color: #b91c1c;
    }

    .asset-import-summary-card.warning i {
        background: #fef3c7;
        color: #92400e;
    }

.asset-import-filter {
    width: 190px;
    font-weight: 850;
}

.asset-import-search {
    width: 260px;
    font-weight: 850;
}

.asset-import-table-wrap {
    max-height: 620px;
    overflow: auto;
    border: 1px solid #e5e7eb;
    border-radius: 20px;
}

.asset-import-table thead {
    position: sticky;
    top: 0;
    background: #f8fafc;
    z-index: 2;
}

.asset-import-desc {
    max-width: 320px;
    white-space: normal;
    font-weight: 750;
    color: #334155;
}

.asset-import-status {
    border-radius: 999px;
    padding: .32rem .6rem;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .72rem;
    font-weight: 950;
}

    .asset-import-status.valid {
        background: #dcfce7;
        color: #15803d;
    }

    .asset-import-status.error {
        background: #fee2e2;
        color: #b91c1c;
    }

.import-row-valid {
    background: #ffffff;
}

.import-row-error {
    background: #fff7f7;
}

.asset-import-message {
    border-radius: 12px;
    padding: .4rem .55rem;
    font-size: .72rem;
    font-weight: 850;
    margin-bottom: .25rem;
    max-width: 340px;
}

    .asset-import-message.error {
        background: #fee2e2;
        color: #991b1b;
    }

    .asset-import-message.warning {
        background: #fef3c7;
        color: #92400e;
    }

@keyframes assetImportFade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes assetImportSlideUp {
    from {
        opacity: 0;
        transform: translateY(14px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes assetImportFloat {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(18px);
    }
}

@keyframes assetImportPulse {
    0%, 100% {
        transform: scale(1);
        opacity: .85;
    }

    50% {
        transform: scale(1.08);
        opacity: 1;
    }
}

@media (max-width: 1200px) {
    .asset-import-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .asset-import-hero,
    .asset-import-summary {
        grid-template-columns: 1fr;
    }

    .asset-import-hero {
        flex-direction: column;
        text-align: center;
    }

    .asset-import-filter,
    .asset-import-search {
        width: 100%;
    }
}

/* =========================================================
   Asset Import Progress
========================================================= */

.asset-import-progress-card {
    overflow: hidden;
    border: 1px solid #eefbd8;
    background: radial-gradient(circle at top right, rgba(132, 199, 8, .10), transparent 30%), linear-gradient(135deg, #ffffff, #f8fafc);
    animation: assetImportSlideUp .35s ease;
}

.asset-import-progress-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

    .asset-import-progress-header h5 {
        margin: 0;
        font-weight: 950;
        color: #0f172a;
        display: flex;
        align-items: center;
        gap: .5rem;
    }

        .asset-import-progress-header h5 i {
            color: #6b9f08;
        }

    .asset-import-progress-header p {
        margin: .3rem 0 0;
        color: #64748b;
        font-weight: 750;
    }

.asset-import-progress-percent {
    width: 86px;
    height: 86px;
    border-radius: 24px;
    background: linear-gradient(135deg, #6b9f08, #06b6d4);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.55rem;
    font-weight: 950;
    box-shadow: 0 18px 35px rgba(132, 199, 8, .25);
    flex: 0 0 auto;
}

.asset-import-progress-bar {
    margin-top: 1rem;
    height: 18px;
    background: #e2e8f0;
    border-radius: 999px;
    overflow: hidden;
    position: relative;
    box-shadow: inset 0 1px 3px rgba(15, 23, 42, .15);
}

.asset-import-progress-fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #6b9f08, #06b6d4, #22c55e);
    position: relative;
    transition: width .25s ease;
    overflow: hidden;
}

    .asset-import-progress-fill::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient( 120deg, transparent, rgba(255, 255, 255, .45), transparent );
        transform: translateX(-100%);
        animation: assetImportProgressShine 1.2s infinite;
    }

.asset-import-progress-meta {
    margin-top: 1rem;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .75rem;
}

    .asset-import-progress-meta > div,
    .asset-import-current-row > div {
        border: 1px solid #e5e7eb;
        background: #ffffff;
        border-radius: 18px;
        padding: .8rem;
    }

    .asset-import-progress-meta span,
    .asset-import-current-row span {
        display: block;
        color: #64748b;
        font-size: .76rem;
        font-weight: 900;
    }

    .asset-import-progress-meta strong,
    .asset-import-current-row strong {
        display: block;
        color: #0f172a;
        font-size: .9rem;
        font-weight: 950;
        margin-top: .25rem;
        word-break: break-word;
    }

.asset-import-current-row {
    margin-top: .75rem;
    display: grid;
    grid-template-columns: 1fr 1.3fr 1.7fr;
    gap: .75rem;
}

.asset-import-progress-log {
    margin-top: 1rem;
    display: grid;
    gap: .45rem;
    max-height: 240px;
    overflow: auto;
    padding-inline-end: .25rem;
}

.asset-import-progress-log-item {
    border: 1px solid #e5e7eb;
    background: #ffffff;
    border-radius: 14px;
    padding: .55rem .7rem;
    display: grid;
    grid-template-columns: 58px minmax(120px, .6fr) 1fr;
    gap: .6rem;
    align-items: center;
    animation: assetImportSlideUp .25s ease;
}

    .asset-import-progress-log-item span {
        background: #f5fbe9;
        color: #527900;
        border-radius: 999px;
        padding: .22rem .45rem;
        font-size: .72rem;
        font-weight: 950;
        text-align: center;
    }

    .asset-import-progress-log-item strong {
        color: #0f172a;
        font-weight: 950;
        font-size: .8rem;
    }

    .asset-import-progress-log-item small {
        color: #64748b;
        font-weight: 800;
    }

    .asset-import-progress-log-item.error {
        border-color: #fecaca;
        background: #fff7f7;
    }

        .asset-import-progress-log-item.error span {
            background: #fee2e2;
            color: #b91c1c;
        }

    .asset-import-progress-log-item.completed {
        border-color: #bbf7d0;
        background: #f0fdf4;
    }

        .asset-import-progress-log-item.completed span {
            background: #dcfce7;
            color: #15803d;
        }

@keyframes assetImportProgressShine {
    100% {
        transform: translateX(100%);
    }
}

@media (max-width: 992px) {
    .asset-import-progress-meta,
    .asset-import-current-row {
        grid-template-columns: 1fr;
    }

    .asset-import-progress-log-item {
        grid-template-columns: 1fr;
    }

    .asset-import-progress-header {
        flex-direction: column;
    }

    .asset-import-progress-percent {
        width: 100%;
        height: 62px;
    }
}

.license-activation-page {
    min-height: 100vh;
    padding: 1.5rem;
    background: radial-gradient(circle at top right, rgba(132, 199, 8, .12), transparent 30%), linear-gradient(135deg, #f8fafc, #eef2ff);
}

.license-activation-hero {
    position: relative;
    overflow: hidden;
    border-radius: 30px;
    padding: 1.8rem;
    color: #fff;
    background: linear-gradient(135deg, #0f172a, #527900, #06b6d4);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    box-shadow: 0 28px 70px rgba(132, 199, 8, .25);
}

    .license-activation-hero h1 {
        margin: .5rem 0 .35rem;
        font-weight: 950;
        letter-spacing: -.04em;
    }

    .license-activation-hero p {
        margin: 0;
        color: rgba(255,255,255,.84);
        font-weight: 700;
    }

.license-pill {
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.25);
    padding: .35rem .7rem;
    border-radius: 999px;
    font-weight: 900;
    font-size: .78rem;
}

.license-activation-icon {
    width: 96px;
    height: 96px;
    border-radius: 30px;
    background: rgba(255,255,255,.16);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
}

.license-card {
    border: 1px solid #e5e7eb;
    border-radius: 26px;
    background: rgba(255,255,255,.94);
    padding: 1.25rem;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .07);
    backdrop-filter: blur(12px);
}

.license-section-title {
    display: flex;
    align-items: center;
    gap: .55rem;
    font-size: 1rem;
    font-weight: 950;
    color: #0f172a;
}

    .license-section-title i {
        color: #6b9f08;
        font-size: 1.2rem;
    }

.license-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

    .license-info-grid > div {
        border: 1px solid #e5e7eb;
        border-radius: 18px;
        padding: .85rem;
        background: #f8fafc;
    }

    .license-info-grid span {
        display: block;
        color: #64748b;
        font-size: .76rem;
        font-weight: 900;
    }

    .license-info-grid strong {
        display: block;
        color: #0f172a;
        font-size: .88rem;
        font-weight: 950;
        margin-top: .25rem;
        word-break: break-word;
    }

.hash-text {
    font-family: Consolas, monospace;
    font-size: .74rem !important;
    direction: ltr;
}

.license-textarea {
    font-family: Consolas, monospace;
    font-size: .82rem;
    direction: ltr;
    border-radius: 16px;
}

.license-upload-box {
    border: 2px dashed #cbd5e1;
    border-radius: 24px;
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    padding: 1.5rem;
    text-align: center;
    transition: .2s ease;
}

    .license-upload-box:hover {
        border-color: #b5ed45;
        background: #f5fbe9;
        transform: translateY(-2px);
    }

    .license-upload-box.loading {
        border-color: #6b9f08;
        background: #f5fbe9;
    }

    .license-upload-box > i {
        font-size: 2.8rem;
        color: #6b9f08;
        display: block;
        margin-bottom: .7rem;
    }

    .license-upload-box h5 {
        font-weight: 950;
        color: #0f172a;
        margin-bottom: .3rem;
    }

    .license-upload-box p {
        color: #64748b;
        font-weight: 750;
    }

.license-install-loader {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    color: #527900;
    font-weight: 900;
}

.license-status {
    border-radius: 22px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: .8rem;
}

    .license-status i {
        font-size: 2rem;
    }

    .license-status strong {
        display: block;
        font-weight: 950;
    }

    .license-status span {
        display: block;
        font-weight: 750;
    }

    .license-status.valid {
        background: #f0fdf4;
        border: 1px solid #bbf7d0;
        color: #166534;
    }

    .license-status.invalid {
        background: #fff7f7;
        border: 1px solid #fecaca;
        color: #991b1b;
    }

    .license-status.unknown {
        background: #f8fafc;
        border: 1px solid #e5e7eb;
        color: #475569;
    }

@media (max-width: 992px) {
    .license-activation-hero {
        flex-direction: column;
        align-items: flex-start;
    }

    .license-activation-icon {
        width: 100%;
        height: 72px;
    }

    .license-info-grid {
        grid-template-columns: 1fr;
    }
}

.license-error-page {
    min-height: 100vh;
    padding: 1.5rem;
    background: radial-gradient(circle at top right, rgba(220, 38, 38, .12), transparent 30%), linear-gradient(135deg, #f8fafc, #fff1f2);
    display: flex;
    align-items: center;
    justify-content: center;
}

.license-error-card {
    width: min(760px, 96vw);
    background: #ffffff;
    border: 1px solid #fecaca;
    border-radius: 34px;
    padding: 2rem;
    text-align: center;
    box-shadow: 0 30px 80px rgba(15, 23, 42, .12);
}

.license-error-icon {
    width: 96px;
    height: 96px;
    margin: 0 auto 1rem;
    border-radius: 30px;
    background: #fee2e2;
    color: #b91c1c;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
}

.license-error-card h1 {
    font-weight: 950;
    color: #0f172a;
    margin-bottom: .5rem;
}

.license-error-card p {
    color: #64748b;
    font-weight: 750;
    margin-bottom: 1.2rem;
}

.license-error-message {
    text-align: left;
    direction: ltr;
    border: 1px solid #fecaca;
    border-radius: 22px;
    background: #fff7f7;
    padding: 1rem;
    margin: 1rem 0;
}

    .license-error-message strong {
        display: block;
        color: #991b1b;
        font-weight: 950;
        margin-bottom: .35rem;
    }

    .license-error-message span {
        display: block;
        color: #7f1d1d;
        font-family: Consolas, monospace;
        font-size: .85rem;
        word-break: break-word;
    }

.license-error-actions {
    display: flex;
    justify-content: center;
    gap: .75rem;
    flex-wrap: wrap;
}

.license-usage-badge {
    min-width: 170px;
    border: 1px solid #eefbd8;
    background: #f5fbe9;
    color: #1e3a8a;
    border-radius: 16px;
    padding: .55rem .75rem;
    display: inline-flex;
    flex-direction: column;
    gap: .25rem;
    font-weight: 900;
}

    .license-usage-badge span {
        font-size: .72rem;
        color: #64748b;
    }

    .license-usage-badge strong {
        font-size: .88rem;
    }

    .license-usage-badge.exceeded {
        background: #fff7f7;
        border-color: #fecaca;
        color: #991b1b;
    }

.license-mini-bar {
    height: 6px;
    background: #eefbd8;
    border-radius: 999px;
    overflow: hidden;
}

    .license-mini-bar div {
        height: 100%;
        background: linear-gradient(90deg, #6b9f08, #06b6d4);
        border-radius: 999px;
    }

/* =========================================================
   License Status Page
========================================================= */

.license-status-page {
    min-height: 100vh;
    padding: 1.5rem;
    background: radial-gradient(circle at top right, rgba(132, 199, 8, .12), transparent 30%), linear-gradient(135deg, #f8fafc, #eef2ff);
}

.license-status-hero {
    position: relative;
    overflow: hidden;
    border-radius: 30px;
    padding: 1.8rem;
    color: #fff;
    background: linear-gradient(135deg, #0f172a, #527900, #06b6d4);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    box-shadow: 0 28px 70px rgba(132, 199, 8, .25);
}

    .license-status-hero h1 {
        margin: .5rem 0 .35rem;
        font-weight: 950;
        letter-spacing: -.04em;
    }

    .license-status-hero p {
        margin: 0;
        color: rgba(255, 255, 255, .84);
        font-weight: 700;
    }

.license-pill {
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .25);
    padding: .35rem .7rem;
    border-radius: 999px;
    font-weight: 900;
    font-size: .78rem;
}

.license-hero-badge {
    width: 116px;
    height: 96px;
    border-radius: 30px;
    background: rgba(255, 255, 255, .16);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .25rem;
    font-weight: 950;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
}

    .license-hero-badge i {
        font-size: 2.4rem;
    }

    .license-hero-badge.valid {
        color: #dcfce7;
    }

    .license-hero-badge.invalid {
        color: #fee2e2;
    }

.license-status-loading {
    margin-top: 1rem;
    border-radius: 24px;
    background: #fff;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
    display: flex;
    align-items: center;
    gap: .8rem;
    color: #527900;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .07);
}

.license-status-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .9rem;
}

.license-status-card,
.license-panel {
    border: 1px solid #e5e7eb;
    border-radius: 26px;
    background: rgba(255, 255, 255, .94);
    padding: 1.15rem;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .07);
    backdrop-filter: blur(12px);
}

    .license-status-card span {
        display: block;
        color: #64748b;
        font-size: .78rem;
        font-weight: 900;
    }

    .license-status-card strong {
        display: block;
        color: #0f172a;
        font-size: 1rem;
        font-weight: 950;
        margin-top: .25rem;
        word-break: break-word;
    }

    .license-status-card.warning {
        border-color: #fde68a;
        background: #fffbeb;
    }

    .license-status-card.danger {
        border-color: #fecaca;
        background: #fff7f7;
    }

.license-panel-title {
    display: flex;
    align-items: center;
    gap: .55rem;
    font-size: 1rem;
    font-weight: 950;
    color: #0f172a;
}

    .license-panel-title i {
        color: #6b9f08;
    }

.license-limit-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .9rem;
}

.license-limit-card {
    border: 1px solid #eefbd8;
    background: #f5fbe9;
    border-radius: 22px;
    padding: 1rem;
}

    .license-limit-card.exceeded {
        border-color: #fecaca;
        background: #fff7f7;
    }

.license-limit-head {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.license-limit-icon {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    background: #eefbd8;
    color: #527900;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex: 0 0 auto;
}

.license-limit-card.exceeded .license-limit-icon {
    background: #fee2e2;
    color: #b91c1c;
}

.license-limit-head span {
    display: block;
    color: #64748b;
    font-size: .78rem;
    font-weight: 900;
}

.license-limit-head strong {
    display: block;
    color: #0f172a;
    font-size: 1rem;
    font-weight: 950;
}

.license-progress {
    height: 10px;
    background: #eefbd8;
    border-radius: 999px;
    overflow: hidden;
    margin-top: .9rem;
}

    .license-progress div {
        height: 100%;
        background: linear-gradient(90deg, #6b9f08, #06b6d4);
        border-radius: 999px;
    }

.license-limit-card.exceeded .license-progress div {
    background: linear-gradient(90deg, #dc2626, #f97316);
}

.license-limit-footer {
    margin-top: .45rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #475569;
    font-size: .78rem;
    font-weight: 850;
}

.license-unlimited {
    margin-top: .9rem;
    border-radius: 14px;
    background: #dcfce7;
    color: #166534;
    padding: .45rem .65rem;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-weight: 950;
}

.license-module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .7rem;
}

.license-module-item {
    border: 1px solid #bbf7d0;
    background: #f0fdf4;
    color: #166534;
    border-radius: 16px;
    padding: .7rem;
    display: flex;
    align-items: center;
    gap: .45rem;
    font-weight: 950;
}

.license-machine-info {
    display: grid;
    gap: .75rem;
}

    .license-machine-info > div {
        border: 1px solid #e5e7eb;
        background: #f8fafc;
        border-radius: 18px;
        padding: .85rem;
    }

    .license-machine-info span {
        display: block;
        color: #64748b;
        font-size: .76rem;
        font-weight: 900;
    }

    .license-machine-info strong {
        display: block;
        color: #0f172a;
        font-size: .88rem;
        font-weight: 950;
        margin-top: .25rem;
        word-break: break-word;
    }

.license-hash {
    font-family: Consolas, monospace;
    font-size: .74rem !important;
    direction: ltr;
}

.license-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 20px;
    padding: 1rem;
    color: #64748b;
    display: flex;
    align-items: center;
    gap: .5rem;
    font-weight: 850;
}

.license-invalid-box {
    border: 1px solid #fecaca;
    background: #fff7f7;
    border-radius: 26px;
    padding: 1.2rem;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

    .license-invalid-box i {
        font-size: 2.4rem;
        color: #b91c1c;
    }

    .license-invalid-box h4 {
        margin: 0;
        color: #991b1b;
        font-weight: 950;
    }

    .license-invalid-box p {
        color: #7f1d1d;
        font-weight: 750;
    }

@media (max-width: 1200px) {
    .license-status-grid,
    .license-limit-grid,
    .license-module-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .license-status-hero {
        flex-direction: column;
        align-items: flex-start;
    }

    .license-hero-badge {
        width: 100%;
        height: 74px;
    }

    .license-status-grid,
    .license-limit-grid,
    .license-module-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Change Password Page
========================================================= */

.change-password-page {
    padding: 1.25rem;
}

.change-password-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, .6fr);
    gap: 1rem;
    align-items: start;
}

.change-password-card {
    padding: 1.25rem;
}

.change-password-profile {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid #e5e7eb;
    background: linear-gradient(135deg, #f8fafc, #eef2ff);
    border-radius: 24px;
    margin-bottom: 1rem;
}

.change-password-avatar {
    width: 72px;
    height: 72px;
    border-radius: 24px;
    background: linear-gradient(135deg, #6b9f08, #06b6d4);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.65rem;
    font-weight: 950;
    box-shadow: 0 16px 34px rgba(132, 199, 8, .22);
    flex: 0 0 auto;
}

.change-password-profile h4 {
    margin: 0;
    color: #0f172a;
    font-weight: 950;
}

.change-password-profile span {
    display: block;
    margin-top: .2rem;
    color: #64748b;
    font-weight: 800;
}

.change-password-force-alert {
    display: flex;
    gap: .85rem;
    align-items: flex-start;
    border: 1px solid #fde68a;
    background: #fffbeb;
    color: #92400e;
    border-radius: 20px;
    padding: .95rem;
    margin-bottom: 1rem;
}

    .change-password-force-alert i {
        font-size: 1.4rem;
        margin-top: .1rem;
    }

    .change-password-force-alert strong {
        display: block;
        font-weight: 950;
    }

    .change-password-force-alert span {
        display: block;
        font-weight: 750;
        margin-top: .15rem;
    }

.change-password-form {
    display: grid;
    gap: 1rem;
}

.fm-form-group label {
    display: block;
    margin-bottom: .4rem;
    color: #334155;
    font-weight: 900;
}

.required {
    color: #dc2626;
}

.fm-help-text {
    display: block;
    margin-top: .35rem;
    color: #64748b;
    font-weight: 750;
}

.fm-password-input {
    display: flex;
    align-items: stretch;
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 16px;
    overflow: hidden;
}

    .fm-password-input .form-control {
        border: 0;
        box-shadow: none;
        min-height: 46px;
        font-weight: 800;
    }

        .fm-password-input .form-control:focus {
            box-shadow: none;
        }

.fm-password-toggle {
    width: 50px;
    border: 0;
    border-inline-start: 1px solid #e5e7eb;
    background: #f8fafc;
    color: #475569;
    transition: .2s ease;
}

    .fm-password-toggle:hover {
        background: #eef2ff;
        color: #527900;
    }

.password-rules {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
    margin-top: 1rem;
}

.password-rule {
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    color: #64748b;
    border-radius: 16px;
    padding: .7rem .8rem;
    display: flex;
    align-items: center;
    gap: .5rem;
    font-weight: 850;
    font-size: .86rem;
}

    .password-rule i {
        color: #94a3b8;
    }

    .password-rule.valid {
        border-color: #bbf7d0;
        background: #f0fdf4;
        color: #166534;
    }

        .password-rule.valid i {
            color: #16a34a;
        }

.change-password-actions {
    display: flex;
    justify-content: flex-end;
    gap: .75rem;
    flex-wrap: wrap;
    margin-top: 1.25rem;
}

.change-password-info-card {
    padding: 1.25rem;
    position: sticky;
    top: 1rem;
}

.change-password-info-icon {
    width: 76px;
    height: 76px;
    border-radius: 26px;
    background: linear-gradient(135deg, #0f172a, #6b9f08);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    margin-bottom: 1rem;
    box-shadow: 0 18px 38px rgba(15, 23, 42, .18);
}

.change-password-info-card h4 {
    margin: 0;
    color: #0f172a;
    font-weight: 950;
}

.change-password-info-card p {
    color: #64748b;
    font-weight: 750;
    margin-top: .6rem;
    line-height: 1.8;
}

.change-password-info-list {
    display: grid;
    gap: .6rem;
    margin-top: 1rem;
}

    .change-password-info-list div {
        display: flex;
        align-items: center;
        gap: .5rem;
        border: 1px solid #e5e7eb;
        background: #f8fafc;
        border-radius: 15px;
        padding: .7rem;
        color: #334155;
        font-weight: 850;
    }

    .change-password-info-list i {
        color: #16a34a;
    }

[dir="rtl"] .fm-password-toggle {
    border-inline-start: 0;
    border-inline-end: 1px solid #e5e7eb;
}

@media (max-width: 1100px) {
    .change-password-layout {
        grid-template-columns: 1fr;
    }

    .change-password-info-card {
        position: static;
    }
}

@media (max-width: 768px) {
    .change-password-page {
        padding: .75rem;
    }

    .change-password-profile {
        align-items: flex-start;
    }

    .change-password-avatar {
        width: 58px;
        height: 58px;
        border-radius: 20px;
        font-size: 1.35rem;
    }

    .password-rules {
        grid-template-columns: 1fr;
    }

    .change-password-actions {
        flex-direction: column-reverse;
    }

        .change-password-actions .fm-action-btn {
            width: 100%;
            justify-content: center;
        }
}

/* =========================================================
   User Profile Page
========================================================= */

.profile-page {
    padding: 1.25rem;
}

.profile-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, .55fr);
    gap: 1rem;
    align-items: start;
}

.profile-main-card {
    padding: 1.25rem;
}

.profile-hero {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    gap: 1rem;
    border-radius: 28px;
    padding: 1.25rem;
    background: radial-gradient(circle at top right, rgba(255, 255, 255, .28), transparent 35%), linear-gradient(135deg, #0f172a, #527900, #06b6d4);
    color: #ffffff;
    margin-bottom: 1.25rem;
    box-shadow: 0 24px 54px rgba(132, 199, 8, .22);
}

.profile-avatar {
    width: 86px;
    height: 86px;
    border-radius: 28px;
    background: rgba(255, 255, 255, .18);
    border: 1px solid rgba(255, 255, 255, .26);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.1rem;
    font-weight: 950;
    flex: 0 0 auto;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}

.profile-hero-info h3 {
    margin: 0;
    font-weight: 950;
    letter-spacing: -.02em;
}

.profile-hero-info > span {
    display: block;
    margin-top: .25rem;
    color: rgba(255, 255, 255, .82);
    font-weight: 800;
}

.profile-badges {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    margin-top: .8rem;
}

.profile-badge {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    border-radius: 999px;
    padding: .35rem .7rem;
    font-size: .76rem;
    font-weight: 950;
}

    .profile-badge.active {
        color: #dcfce7;
        background: rgba(22, 163, 74, .22);
        border: 1px solid rgba(187, 247, 208, .45);
    }

    .profile-badge.inactive {
        color: #fee2e2;
        background: rgba(220, 38, 38, .22);
        border: 1px solid rgba(254, 202, 202, .45);
    }

    .profile-badge.warning {
        color: #fef3c7;
        background: rgba(245, 158, 11, .22);
        border: 1px solid rgba(253, 230, 138, .45);
    }

.profile-section-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: #0f172a;
    font-weight: 950;
    margin-bottom: 1rem;
}

    .profile-section-title i {
        color: #6b9f08;
    }

.profile-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.profile-full {
    grid-column: 1 / -1;
}

.fm-form-group label {
    display: block;
    margin-bottom: .4rem;
    color: #334155;
    font-weight: 900;
}

.fm-form-group .form-control {
    min-height: 46px;
    border-radius: 15px;
    border: 1px solid #dbe3ef;
    font-weight: 800;
}

    .fm-form-group .form-control:focus {
        border-color: #6b9f08;
        box-shadow: 0 0 0 .2rem rgba(132, 199, 8, .10);
    }

.required {
    color: #dc2626;
}

.profile-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: .75rem;
    flex-wrap: wrap;
    margin-top: 1.25rem;
}

.profile-side {
    display: grid;
    gap: 1rem;
}

.profile-info-card,
.profile-security-card {
    padding: 1.25rem;
}

.profile-info-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: #0f172a;
    font-weight: 950;
    margin-bottom: 1rem;
}

    .profile-info-title i {
        color: #6b9f08;
    }

.profile-info-list {
    display: grid;
    gap: .7rem;
}

    .profile-info-list > div {
        border: 1px solid #e5e7eb;
        background: #f8fafc;
        border-radius: 18px;
        padding: .85rem;
    }

    .profile-info-list span {
        display: block;
        color: #64748b;
        font-size: .78rem;
        font-weight: 900;
    }

    .profile-info-list strong {
        display: block;
        color: #0f172a;
        font-size: .9rem;
        font-weight: 950;
        margin-top: .25rem;
        word-break: break-word;
    }

.profile-security-card {
    background: radial-gradient(circle at top right, rgba(132, 199, 8, .12), transparent 35%), #ffffff;
}

.profile-security-icon {
    width: 76px;
    height: 76px;
    border-radius: 26px;
    background: linear-gradient(135deg, #0f172a, #6b9f08);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    margin-bottom: 1rem;
    box-shadow: 0 18px 38px rgba(15, 23, 42, .18);
}

.profile-security-card h4 {
    margin: 0;
    color: #0f172a;
    font-weight: 950;
}

.profile-security-card p {
    color: #64748b;
    font-weight: 750;
    line-height: 1.8;
    margin: .65rem 0 1rem;
}

@media (max-width: 1100px) {
    .profile-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .profile-page {
        padding: .75rem;
    }

    .profile-hero {
        align-items: flex-start;
        padding: 1rem;
    }

    .profile-avatar {
        width: 64px;
        height: 64px;
        border-radius: 22px;
        font-size: 1.55rem;
    }

    .profile-form-grid {
        grid-template-columns: 1fr;
    }

    .profile-form-actions {
        flex-direction: column-reverse;
    }

        .profile-form-actions .fm-action-btn,
        .fm-toolbar .fm-action-btn {
            width: 100%;
            justify-content: center;
        }
}

.audit-details-box {
    min-height: 74px;
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    border-radius: 14px;
    padding: .85rem;
    color: #334155;
    font-weight: 750;
    white-space: pre-wrap;
}

.audit-json-box {
    min-height: 180px;
    max-height: 320px;
    overflow: auto;
    border: 1px solid #e5e7eb;
    background: #0f172a;
    color: #e2e8f0;
    border-radius: 14px;
    padding: .85rem;
    font-size: .78rem;
    direction: ltr;
    text-align: left;
}

/* =========================================================
   Work Order SLA Card
========================================================= */

.sla-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .85rem;
}

.sla-mini-card {
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    border-radius: 16px;
    padding: .9rem;
}

    .sla-mini-card span {
        display: block;
        color: #64748b;
        font-size: .78rem;
        font-weight: 900;
        margin-bottom: .35rem;
    }

    .sla-mini-card strong {
        display: block;
        color: #0f172a;
        font-size: 1rem;
        font-weight: 950;
    }

    .sla-mini-card small {
        display: block;
        margin-top: .25rem;
        color: #64748b;
        font-weight: 800;
    }

@media (max-width: 1200px) {
    .sla-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .sla-card-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   PM Schedules Actions & Filters
========================================================= */

.pm-action-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .65rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e5e7eb;
}

.pm-action-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
}

.pm-action-divider {
    width: 1px;
    height: 34px;
    background: #e5e7eb;
}

.pm-action-spacer {
    flex: 1 1 auto;
}

.pm-action-btn {
    min-height: 38px;
    border-radius: 12px;
    font-weight: 850;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    box-shadow: 0 6px 16px rgba(15, 23, 42, .05);
}

    .pm-action-btn i {
        font-size: .95rem;
    }

.pm-filter-panel {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid #e5e7eb;
    border-radius: 18px;
    padding: 1rem;
    box-shadow: 0 14px 35px rgba(15, 23, 42, .05);
}

.pm-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: .85rem;
    margin-bottom: .85rem;
    border-bottom: 1px solid #e5e7eb;
}

    .pm-filter-header strong {
        display: block;
        color: #0f172a;
        font-size: .98rem;
        font-weight: 950;
    }

    .pm-filter-header span {
        display: block;
        color: #64748b;
        font-size: .82rem;
        font-weight: 700;
        margin-top: .1rem;
    }

.pm-clear-btn {
    min-height: 38px;
    border-radius: 12px;
    font-weight: 850;
    white-space: nowrap;
}

.pm-filter-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1.25fr .8fr .8fr;
    gap: .85rem;
    align-items: end;
}

.pm-filter-item label {
    display: block;
    color: #475569;
    font-size: .78rem;
    font-weight: 900;
    margin-bottom: .35rem;
}

.pm-filter-item .form-select,
.pm-filter-item .form-control {
    min-height: 42px;
    border-radius: 13px;
    border-color: #dbe3ef;
    font-weight: 750;
    color: #0f172a;
    box-shadow: none;
}

    .pm-filter-item .form-select:focus,
    .pm-filter-item .form-control:focus,
    .pm-search-input input:focus {
        border-color: #6b9f08;
        box-shadow: 0 0 0 .18rem rgba(132, 199, 8, .12);
    }

.pm-search-input {
    position: relative;
}

    .pm-search-input i {
        position: absolute;
        inset-inline-start: .9rem;
        top: 50%;
        transform: translateY(-50%);
        color: #64748b;
        font-size: .95rem;
    }

    .pm-search-input input {
        width: 100%;
        min-height: 42px;
        border: 1px solid #dbe3ef;
        border-radius: 13px;
        padding-inline-start: 2.45rem;
        padding-inline-end: .9rem;
        color: #0f172a;
        font-weight: 750;
        outline: none;
        background: #ffffff;
    }

        .pm-search-input input::placeholder {
            color: #94a3b8;
            font-weight: 650;
        }

@media (max-width: 1400px) {
    .pm-filter-grid {
        grid-template-columns: 1.4fr 1fr 1.2fr 1fr 1fr;
    }
}

@media (max-width: 1200px) {
    .pm-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pm-filter-search {
        grid-column: 1 / -1;
    }

    .pm-action-spacer {
        display: none;
    }
}

@media (max-width: 768px) {
    .pm-action-bar {
        align-items: stretch;
    }

    .pm-action-group {
        width: 100%;
    }

    .pm-action-btn {
        flex: 1 1 auto;
        justify-content: center;
    }

    .pm-action-divider {
        display: none;
    }

    .pm-filter-header {
        align-items: stretch;
        flex-direction: column;
    }

    .pm-clear-btn {
        width: 100%;
        justify-content: center;
    }

    .pm-filter-grid {
        grid-template-columns: 1fr;
    }

    .pm-filter-search {
        grid-column: auto;
    }
}
/* =========================================================
   Asset Search Select
========================================================= */

.asset-search-select {
    position: relative;
    width: 100%;
}

.asset-search-input {
    position: relative;
}

    .asset-search-input i {
        position: absolute;
        inset-inline-start: .85rem;
        top: 50%;
        transform: translateY(-50%);
        color: #64748b;
        z-index: 1;
    }

    .asset-search-input input {
        width: 100%;
        min-height: 42px;
        border: 1px solid #dbe3ef;
        border-radius: 13px;
        padding-inline-start: 2.4rem;
        padding-inline-end: 2.4rem;
        color: #0f172a;
        font-weight: 750;
        outline: none;
        background: #ffffff;
    }

        .asset-search-input input:focus {
            border-color: #6b9f08;
            box-shadow: 0 0 0 .18rem rgba(132, 199, 8, .12);
        }

.asset-clear-btn {
    position: absolute;
    inset-inline-end: .45rem;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 9px;
    background: #f1f5f9;
    color: #334155;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .asset-clear-btn:hover {
        background: #e2e8f0;
    }

.asset-search-dropdown {
    position: absolute;
    z-index: 1055;
    top: calc(100% + .35rem);
    inset-inline-start: 0;
    inset-inline-end: 0;
    max-height: 280px;
    overflow-y: auto;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    box-shadow: 0 20px 45px rgba(15, 23, 42, .16);
    padding: .35rem;
}

.asset-search-option {
    width: 100%;
    border: 0;
    background: transparent;
    text-align: start;
    padding: .65rem .75rem;
    border-radius: 11px;
    display: flex;
    flex-direction: column;
    gap: .15rem;
}

    .asset-search-option:hover,
    .asset-search-option.selected {
        background: #f5fbe9;
    }

.asset-code {
    color: #527900;
    font-weight: 950;
    font-size: .82rem;
}

.asset-name {
    color: #0f172a;
    font-weight: 800;
    font-size: .88rem;
}

.asset-search-state {
    min-height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    font-weight: 800;
    color: #64748b;
}

.fm-asset-type {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 72px;
    padding: .3rem .65rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 900;
    border: 1px solid transparent;
}

    .fm-asset-type.hard {
        background: #f5fbe9;
        color: #527900;
        border-color: #d9f6a1;
    }

    .fm-asset-type.soft {
        background: #f0fdf4;
        color: #15803d;
        border-color: #bbf7d0;
    }

    .fm-asset-type.none {
        background: #f8fafc;
        color: #64748b;
        border-color: #e2e8f0;
    }

/* =========================================================
   Audit Logs Details
========================================================= */

.audit-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .85rem;
    margin-bottom: 1rem;
}

.audit-summary-item {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: .85rem;
}

    .audit-summary-item span {
        display: block;
        color: #64748b;
        font-size: .78rem;
        font-weight: 900;
        margin-bottom: .25rem;
    }

    .audit-summary-item strong {
        display: block;
        color: #0f172a;
        font-weight: 950;
        word-break: break-word;
    }

.audit-details-box {
    min-height: 76px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: .85rem;
    color: #0f172a;
    font-weight: 700;
    white-space: pre-wrap;
}

.audit-json-box {
    min-height: 260px;
    max-height: 420px;
    overflow: auto;
    background: #0f172a;
    color: #e2e8f0;
    border-radius: 14px;
    padding: 1rem;
    font-size: .82rem;
    direction: ltr;
    text-align: left;
}

.audit-diff-table td {
    vertical-align: top;
}

.audit-old-value {
    display: inline-block;
    background: #fff1f2;
    color: #be123c;
    border: 1px solid #fecdd3;
    border-radius: 10px;
    padding: .35rem .55rem;
    font-weight: 800;
    max-width: 100%;
    word-break: break-word;
}

.audit-new-value {
    display: inline-block;
    background: #f0fdf4;
    color: #15803d;
    border: 1px solid #bbf7d0;
    border-radius: 10px;
    padding: .35rem .55rem;
    font-weight: 800;
    max-width: 100%;
    word-break: break-word;
}

@media (max-width: 1200px) {
    .audit-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .audit-summary-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Workflow Approvals
========================================================= */

.approval-details-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

.approval-detail-item {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: .85rem;
}

    .approval-detail-item span {
        display: block;
        color: #64748b;
        font-size: .78rem;
        font-weight: 900;
        margin-bottom: .25rem;
    }

    .approval-detail-item strong {
        display: block;
        color: #0f172a;
        font-weight: 950;
        word-break: break-word;
    }

.fm-filter-select {
    max-width: 260px;
}

@media (max-width: 768px) {
    .approval-details-grid {
        grid-template-columns: 1fr;
    }

    .fm-filter-select {
        max-width: 100%;
    }
}

/* =========================================================
   Workflow Definition Form
========================================================= */

.workflow-option-box {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: .9rem;
    min-height: 104px;
}

    .workflow-option-box .form-check-input {
        margin-top: .25rem;
        flex: 0 0 auto;
    }

    .workflow-option-box strong {
        display: block;
        color: #0f172a;
        font-weight: 950;
        margin-bottom: .2rem;
    }

    .workflow-option-box span {
        display: block;
        color: #64748b;
        font-size: .82rem;
        font-weight: 700;
        line-height: 1.5;
    }


/* =========================================================
   Workflow Pending Approval Badge
========================================================= */

.fm-workflow-badge {
    min-width: 22px;
    height: 22px;
    padding: 0 .45rem;
    border-radius: 999px;
    background: #dc2626;
    color: #ffffff;
    font-size: .72rem;
    font-weight: 950;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    box-shadow: 0 8px 18px rgba(220, 38, 38, .25);
}

.fm-header-approval-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    text-decoration: none;
    color: #0f172a;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: .55rem .75rem;
    font-weight: 850;
}

    .fm-header-approval-link:hover {
        color: #0f172a;
        background: #f8fafc;
    }

    .fm-header-approval-link .fm-workflow-badge {
        margin-inline-start: .2rem;
    }

.fm-menu-workflow-badge {
    margin-inline-start: auto;
    min-width: 20px;
    height: 20px;
    padding: 0 .4rem;
    border-radius: 999px;
    background: #dc2626;
    color: #ffffff;
    font-size: .68rem;
    font-weight: 950;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* =========================================================
   Workflow Pending Approvals Widget
========================================================= */

.workflow-widget-card {
    height: 100%;
}

.workflow-widget-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

    .workflow-widget-header h5 {
        margin: 0;
        color: #0f172a;
        font-weight: 950;
        display: flex;
        align-items: center;
        gap: .5rem;
    }

        .workflow-widget-header h5 i {
            color: #6b9f08;
        }

    .workflow-widget-header p {
        margin: .25rem 0 0;
        color: #64748b;
        font-size: .85rem;
        font-weight: 700;
    }

.workflow-widget-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin-bottom: 1rem;
}

.workflow-widget-stat {
    border-radius: 16px;
    padding: .85rem;
    border: 1px solid #e5e7eb;
    background: #f8fafc;
}

    .workflow-widget-stat span {
        display: block;
        color: #64748b;
        font-size: .78rem;
        font-weight: 900;
        margin-bottom: .25rem;
    }

    .workflow-widget-stat strong {
        display: block;
        color: #0f172a;
        font-size: 1.5rem;
        font-weight: 950;
        line-height: 1;
    }

    .workflow-widget-stat.primary {
        background: #f5fbe9;
        border-color: #d9f6a1;
    }

        .workflow-widget-stat.primary strong {
            color: #527900;
        }

    .workflow-widget-stat.warning {
        background: #fffbeb;
        border-color: #fde68a;
    }

        .workflow-widget-stat.warning strong {
            color: #b45309;
        }

.workflow-widget-loading,
.workflow-widget-empty {
    min-height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    color: #64748b;
    font-weight: 800;
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    border-radius: 16px;
}

    .workflow-widget-empty i {
        font-size: 1.4rem;
        color: #16a34a;
    }

.workflow-widget-list {
    display: flex;
    flex-direction: column;
    gap: .65rem;
}

.workflow-widget-item {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .75rem;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    background: #ffffff;
    transition: .15s ease;
}

    .workflow-widget-item:hover {
        background: #f8fafc;
        transform: translateY(-1px);
        box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
    }

.workflow-widget-item-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    font-size: 1.1rem;
}

    .workflow-widget-item-icon.info {
        background: #f5fbe9;
        color: #6b9f08;
        border: 1px solid #d9f6a1;
    }

    .workflow-widget-item-icon.danger {
        background: #fef2f2;
        color: #dc2626;
        border: 1px solid #fecaca;
    }

.workflow-widget-item-content {
    flex: 1;
    min-width: 0;
}

.workflow-widget-item-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .45rem;
    margin-bottom: .25rem;
}

    .workflow-widget-item-title strong {
        color: #0f172a;
        font-weight: 950;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.workflow-widget-item-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem;
    color: #64748b;
    font-size: .78rem;
    font-weight: 750;
}

.workflow-widget-footer {
    margin-top: 1rem;
}

@media (max-width: 576px) {
    .workflow-widget-header {
        flex-direction: column;
    }

    .workflow-widget-stats {
        grid-template-columns: 1fr;
    }

    .workflow-widget-item {
        align-items: flex-start;
    }
}