/* Global ERP polish layer.
   Keeps the existing component system, but makes the product feel calmer,
   denser, and more consistent across admin, AI, reporting, and POS screens. */

:root {
    --erp-radius-sm: 6px;
    --erp-radius: 8px;
    --erp-radius-lg: 8px;
    --erp-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
    --erp-shadow-panel: 0 10px 24px rgba(15, 23, 42, 0.06);
    --erp-control-height: 40px;
    --erp-shell-gutter: 1rem;
}

html[data-bs-theme="light"] {
    --app-bg: #f5f7fa;
    --app-surface: #ffffff;
    --app-surface-elevated: #ffffff;
    --app-surface-muted: #f8fafc;
    --app-surface-soft: #eef2f7;
    --app-border: #d9e2ec;
    --app-border-strong: #c7d2df;
    --app-heading: #172033;
    --app-text: #334155;
    --app-muted: #667085;
    --app-faint: #8a96a8;
    --app-table-head: #f8fafc;
    --app-table-row: #ffffff;
    --app-table-hover: #f8fafc;
    --app-soft-card-radius: var(--erp-radius);
    --app-soft-card-border: var(--app-border);
    --app-soft-card-divider: var(--app-border);
    --app-soft-card-bg: var(--app-surface);
    --app-soft-card-head-bg: var(--app-surface-muted);
    --app-soft-card-shadow: var(--erp-shadow);
    --app-soft-card-shadow-hover: var(--erp-shadow);
}

html[data-bs-theme="dark"] {
    --app-bg: #0b111a;
    --app-surface: #111925;
    --app-surface-elevated: #141d2a;
    --app-surface-muted: #0f1722;
    --app-surface-soft: #182232;
    --app-border: rgba(148, 163, 184, 0.2);
    --app-border-strong: rgba(148, 163, 184, 0.32);
    --app-heading: #f6f8fb;
    --app-text: #d6deea;
    --app-muted: #a3afc0;
    --app-faint: #8290a4;
    --app-icon-surface: rgba(255, 255, 255, 0.055);
    --app-table-head: #101823;
    --app-table-row: #141d2a;
    --app-table-hover: #182334;
    --app-soft-card-radius: var(--erp-radius);
    --app-soft-card-border: var(--app-border);
    --app-soft-card-divider: var(--app-border);
    --app-soft-card-bg: var(--app-surface-elevated);
    --app-soft-card-head-bg: var(--app-surface-muted);
    --app-soft-card-shadow: none;
    --app-soft-card-shadow-hover: none;
}

html,
body.admin-layout,
body.pos-layout,
.admin-layout .main-content,
.pos-layout .pos-layout-main {
    background: var(--app-bg) !important;
}

.admin-layout .main-content > .container-fluid {
    padding: var(--erp-shell-gutter) !important;
}

.admin-layout .row {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 1rem;
}

/* Shell */
.app-navbar {
    min-height: 64px;
    margin-top: 0.75rem;
    border-radius: var(--erp-radius) !important;
    border-color: var(--app-border) !important;
    background: color-mix(in srgb, var(--app-surface-elevated) 92%, transparent) !important;
    box-shadow: var(--erp-shadow) !important;
}

.app-navbar .container-fluid {
    gap: 0.85rem;
}

.app-navbar .input-group,
.app-navbar .input-group.input-group-outline {
    min-width: 260px;
}

.app-navbar .input-group.input-group-outline .form-control {
    min-height: var(--erp-control-height);
    border-radius: var(--erp-radius) !important;
}

.app-navbar .org-switcher__button,
.app-user-menu__dropdown,
.app-notification-menu {
    border-radius: var(--erp-radius) !important;
    box-shadow: var(--erp-shadow) !important;
}

.app-sidenav {
    border-radius: 0 !important;
    border-right: 1px solid var(--app-border) !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    border-left: 0 !important;
    box-shadow: none !important;
}

.app-sidenav .sidebar-logo {
    width: 2.45rem;
    height: 2.45rem;
    border-radius: var(--erp-radius) !important;
}

.app-sidenav .sidebar-brand-name {
    font-size: 0.98rem;
    letter-spacing: 0;
}

.app-sidenav .sidebar-brand-tagline {
    font-size: 0.74rem;
}

.app-sidenav .navbar-nav .nav-link {
    min-height: 2.45rem;
    margin: 0.06rem 0.65rem;
    border-radius: var(--erp-radius) !important;
}

.app-sidenav .navbar-nav .nav-link > i:first-child,
.app-sidenav__main > i:first-child {
    width: 1.75rem;
    height: 1.75rem;
    border-radius: var(--erp-radius-sm) !important;
}

.app-sidenav__submenu .nav-link {
    min-height: 2.25rem;
    border-radius: var(--erp-radius-sm) !important;
}

.app-sidenav__section {
    padding-top: 0.75rem;
    letter-spacing: 0.12em;
}

.app-sidenav .sidenav-footer .mx-3 {
    margin-right: 0.75rem !important;
    margin-left: 0.75rem !important;
}

/* Panels and cards */
.admin-layout .card,
.admin-layout .tbl-panel,
.admin-layout .mkpi,
.admin-layout .workspace-card,
.admin-layout .workflow-card,
.admin-layout .workflow-lane,
.admin-layout .chart-card,
.admin-layout .activity-card,
.admin-layout .stat-list-card,
.admin-layout .table-summary-card,
.admin-layout .modal-content,
.admin-layout .dropdown-menu,
.admin-layout .accordion-item {
    border-radius: var(--erp-radius) !important;
    border-color: var(--app-border) !important;
    background: var(--app-surface-elevated) !important;
    box-shadow: var(--erp-shadow) !important;
}

.admin-layout .card:hover,
.admin-layout .tbl-panel:hover,
.admin-layout .mkpi:hover,
.admin-layout .workspace-card:hover,
.admin-layout .workflow-card:hover,
.admin-layout .dashboard-shortcut-grid a:hover,
.admin-layout .pos-status-card:hover,
.admin-layout .pos-product-tile:hover {
    transform: none !important;
    box-shadow: var(--erp-shadow) !important;
}

.admin-layout .card > .card-header,
.admin-layout .card .card-header:first-child,
.admin-layout .tbl-panel__head,
.admin-layout .modal-header,
.admin-layout .modal-footer {
    border-color: var(--app-border) !important;
    background: var(--app-surface-muted) !important;
}

.admin-layout .card .card-body,
.admin-layout .tbl-panel__body {
    background: transparent !important;
}

.admin-layout .card .card-header,
.admin-layout .card .card-body,
.admin-layout .card .card-footer {
    padding: 1rem !important;
}

/* Page headers */
.mphb {
    border-radius: var(--erp-radius) !important;
    border-color: var(--app-border) !important;
    background: var(--app-surface-elevated) !important;
    box-shadow: var(--erp-shadow) !important;
}

.mphb__graphics,
.mphb__orb,
.mphb__ring,
.mphb__grid,
.mphb__ribbon,
.mphb__panel,
.mphb__dots,
.mkpi::after {
    display: none !important;
}

.mphb::before,
.mkpi::before {
    content: none !important;
}

.mphb__title {
    font-size: 1.28rem;
    line-height: 1.25;
    letter-spacing: 0;
}

.mphb--card .mphb__title {
    font-size: 1rem;
}

.mphb__subtitle {
    max-width: 880px;
    color: var(--app-muted) !important;
    font-size: 0.9rem;
}

.mphb__badge,
.tbl-pagination__eyebrow,
.pos-eyebrow {
    min-height: 24px;
    border-radius: 999px;
    font-size: 0.66rem;
    letter-spacing: 0.08em;
}

.mphb__meta-item {
    border-radius: var(--erp-radius) !important;
    border-color: var(--app-border) !important;
    background: var(--app-surface-muted) !important;
    box-shadow: none !important;
}

/* KPI and dashboard blocks */
.mkpi {
    padding: 0.9rem !important;
    background: var(--app-surface-elevated) !important;
}

.mkpi--stat-only {
    min-height: 96px;
}

.mkpi__value {
    font-size: 1.55rem;
    font-weight: 800;
}

.mkpi__icon {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
    border-radius: var(--erp-radius) !important;
    background: var(--app-icon-surface) !important;
    border-color: var(--app-border) !important;
    box-shadow: none !important;
}

.mkpi__chart {
    min-height: 78px;
    border-radius: var(--erp-radius) !important;
    background: var(--app-surface-muted) !important;
    border-color: var(--app-border) !important;
}

.dashboard-hero-meta span,
.dashboard-shortcut-grid a,
.dashboard-settings-strip > div,
.dashboard-readiness-row,
.dashboard-warning,
.dashboard-empty {
    border-radius: var(--erp-radius) !important;
    border-color: var(--app-border) !important;
    background: var(--app-surface-elevated) !important;
    box-shadow: none !important;
}

/* Controls */
.mui-btn,
.btn,
.auth-button,
.pos-category-chip,
.pos-mode-btn,
.pos-icon-btn,
.pos-alert-chip,
.pos-floating-checkout,
.tbl-action-btn,
.tbl-page-btn,
.theme-toggle,
.fixed-plugin .fixed-plugin-button {
    border-radius: var(--erp-radius) !important;
    box-shadow: none !important;
}

.mui-btn,
.btn {
    min-height: var(--erp-control-height);
    font-weight: 700;
}

.mui-btn__layer::before,
.mui-btn__layer::after {
    display: none !important;
}

.form-control,
.form-select,
.input-group.input-group-outline .form-control,
.input-group.input-group-dynamic .form-control,
.input-group.input-group-static .form-control,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple,
.pos-mini-field input,
.pos-mini-field select,
.pos-scanbar__input,
.pos-field-compact .form-control {
    border-radius: var(--erp-radius) !important;
    border-color: var(--app-border) !important;
    background: var(--app-input-bg, var(--app-surface)) !important;
    box-shadow: none !important;
}

.form-control:focus,
.form-select:focus,
.input-group.input-group-outline .form-control:focus,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: color-mix(in srgb, var(--bs-primary) 45%, var(--app-border)) !important;
    box-shadow: 0 0 0 0.18rem var(--app-focus-ring) !important;
}

.dropdown-menu {
    padding: 0.45rem !important;
}

.dropdown-item {
    border-radius: var(--erp-radius-sm) !important;
}

/* Tables */
.tbl-panel {
    overflow: hidden;
}

.tbl-insights {
    gap: 0.5rem;
    margin-bottom: 0.8rem;
}

.tbl-pill,
.tbl-status,
.tbl-bulkbar__count {
    min-height: 30px;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    font-size: 0.76rem;
}

.tbl-toolbar {
    gap: 0.65rem;
}

.tbl-toolbar__group {
    gap: 0.65rem;
}

.tbl-table thead th {
    padding: 0.72rem 0.85rem;
    letter-spacing: 0.06em;
}

.tbl-table tbody td {
    padding: 0.78rem 0.85rem;
    font-size: 0.86rem;
    font-weight: 600;
}

.tbl-identity__avatar {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
    border-radius: var(--erp-radius) !important;
    background: var(--app-icon-surface) !important;
    box-shadow: none !important;
}

.tbl-action-btn {
    width: 34px;
    min-width: 34px;
    height: 34px;
}

.tbl-pagination {
    padding: 0.85rem 1rem;
    background: var(--app-surface-muted) !important;
}

.tbl-page-list {
    border-radius: var(--erp-radius) !important;
    box-shadow: none !important;
}

.tbl-page-btn {
    min-width: 38px;
    height: 38px;
}

/* POS */
.pos-workspace {
    --pos-line: var(--app-border);
    --pos-soft: var(--app-surface-muted);
    --pos-ink: var(--app-heading);
    --pos-muted: var(--app-muted);
    --pos-checkout-width: 430px;
}

.pos-topbar,
.pos-branch-lock,
.pos-category-strip,
.pos-product-stage,
.pos-cart-panel,
.pos-product-group,
.pos-vertical-panel,
.pos-scanbar,
.pos-status-card,
.pos-shift-mini {
    border-radius: var(--erp-radius) !important;
    border-color: var(--app-border) !important;
    background: var(--app-surface-elevated) !important;
    box-shadow: var(--erp-shadow) !important;
}

.pos-topbar::before {
    width: 3px;
    background: var(--bs-primary) !important;
}

.pos-status-card,
.pos-category-chip,
.pos-mode-btn,
.pos-icon-btn {
    min-height: 40px;
}

.pos-product-tile {
    border-radius: var(--erp-radius) !important;
    border-color: var(--app-border) !important;
    background: var(--app-surface) !important;
    box-shadow: none !important;
}

.pos-cart-panel {
    top: 0.75rem;
}

.pos-alert-row,
.pos-topbar__actions,
.pos-checkout-tools {
    gap: 0.55rem;
}

/* Fixed plugin */
.fixed-plugin:not(.show) .card {
    display: none !important;
}

.fixed-plugin.show .card {
    display: block !important;
}

.fixed-plugin .card.tbl-panel {
    border-radius: var(--erp-radius) !important;
    box-shadow: var(--erp-shadow-panel) !important;
}

.fixed-plugin-section {
    border-radius: var(--erp-radius) !important;
    background: var(--app-surface-muted) !important;
    border-color: var(--app-border) !important;
    box-shadow: none !important;
}

/* Auth shell still needs a branded look, but should not dominate the admin product. */
.auth-layout .auth-card,
.auth-layout .auth-visual-panel,
.auth-layout .auth-surface {
    border-radius: var(--erp-radius) !important;
}

/* Responsive cleanup */
@media (max-width: 1199.98px) {
    .app-navbar .input-group,
    .app-navbar .input-group.input-group-outline {
        min-width: 200px;
    }

    .pos-body {
        grid-template-columns: minmax(0, 1fr) minmax(330px, 390px);
    }
}

@media (max-width: 991.98px) {
    .admin-layout .main-content > .container-fluid {
        padding: 0.75rem !important;
    }

    .app-navbar {
        margin: 0.5rem 0.5rem 0;
    }

    .app-navbar .container-fluid {
        min-width: 0;
        flex-wrap: wrap;
    }

    .app-navbar .navbar-collapse {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        align-items: stretch;
        gap: 0.75rem;
        overflow-x: clip;
    }

    .app-navbar .navbar-nav {
        width: 100%;
        min-width: 0;
        flex-wrap: wrap;
        justify-content: flex-start !important;
        gap: 0.35rem;
    }

    .app-navbar .navbar-nav .nav-item {
        min-width: 0;
        padding-right: 0.45rem !important;
        padding-left: 0.45rem !important;
    }

    .app-navbar .input-group,
    .app-navbar .input-group.input-group-outline {
        width: 100%;
        min-width: 0;
    }

    .app-navbar .org-switcher,
    .app-navbar .org-switcher__button {
        max-width: 100%;
        min-width: 0;
    }

    .app-navbar .org-switcher__copy,
    .app-navbar .org-switcher__company,
    .app-navbar .org-switcher__branch {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .mphb__content,
    .pos-topbar {
        gap: 0.75rem;
    }

    .pos-body {
        display: block;
    }

    .pos-cart-panel {
        position: relative;
        top: auto;
        margin-top: 0.85rem;
    }
}

@media (max-width: 767.98px) {
    :root {
        --erp-shell-gutter: 0.75rem;
    }

    .mphb {
        padding: 0.9rem !important;
    }

    .mphb__right,
    .pos-topbar__actions {
        width: 100%;
        justify-content: flex-start;
    }

    .mui-btn,
    .btn {
        max-width: 100%;
        white-space: normal;
    }

    .tbl-table thead th,
    .tbl-table tbody td {
        padding: 0.65rem 0.75rem;
    }
}
