/*
 * Enterprise SaaS design system
 * Source of truth: products_18-08-2026_file_1786990201211_9899944.md
 */
:root {
    /* Brand mengalir dari --theme-color-1/-2 yang di-set General Setting
       (lihat layouts/styles.blade.php); enterprise hanya menyediakan fallback. */
    --enterprise-primary: var(--theme-color-1, #064A9D);
    --enterprise-primary-rgb: var(--theme-color-1-rgb, 6, 74, 157);
    --enterprise-app-bg: #EEF5FC;
    --enterprise-sidebar-bg: #F4F8FD;
    --enterprise-surface: #FFFFFF;
    --enterprise-border: #CAD9E8;
    --enterprise-text: #0A1628;
    --enterprise-muted: #53657A;
    --enterprise-success: #247A52;
    --enterprise-warning: #A56A00;
    --enterprise-danger: #B54747;
    --enterprise-radius: 5px;
    --enterprise-control-height: 38px;
    /* --theme-color-1/-2 TIDAK dioverride di sini — sumbernya General Setting
       via layouts/styles.blade.php, agar brand admin mengalir ke seluruh sistem. */
    --bs-primary: var(--enterprise-primary);
    --bs-primary-rgb: var(--enterprise-primary-rgb);
    --bs-body-bg: var(--enterprise-app-bg);
    --bs-body-color: var(--enterprise-text);
    --bs-border-color: var(--enterprise-border);
}

html, body {
    min-height: 100%;
    background: var(--enterprise-app-bg);
    color: var(--enterprise-text);
    font-family: "Public Sans", "Segoe UI", sans-serif;
    font-size: 0.875rem;
}

body { line-height: 1.5; }
a { color: var(--enterprise-primary); }
a:hover { color: #043D82; }

.layout-wrapper,
.layout-container,
.layout-page,
.content-wrapper { background: var(--enterprise-app-bg); }

.layout-page { min-width: 0; }

.content-wrapper > .container-fluid {
    padding-top: 1.25rem;
    padding-bottom: 1.5rem;
}

.content-wrapper > .container-fluid > h4,
.content-wrapper > .container-fluid > h1,
.content-wrapper > .container-fluid > h2,
.content-wrapper > .container-fluid > h3 {
    margin: 0 0 1rem;
    color: var(--enterprise-text);
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--enterprise-text);
    font-weight: 600;
}

.text-muted,
.text-secondary { color: var(--enterprise-muted) !important; }

.text-primary { color: var(--enterprise-primary) !important; }

.bg-body,
.bg-light,
.bg-body-tertiary { background-color: var(--enterprise-app-bg) !important; }

.bg-white { background-color: var(--enterprise-surface) !important; }

.layout-navbar.navbar-detached {
    min-height: 3.5rem;
    border: 1px solid var(--enterprise-border);
    border-radius: var(--enterprise-radius);
    background: var(--enterprise-surface) !important;
    box-shadow: none !important;
}

.layout-navbar .nav-link { color: var(--enterprise-muted); }

.layout-navbar .nav-link:hover,
.layout-navbar .nav-link:focus-visible {
    color: var(--enterprise-primary);
    background: #F4F8FD;
}

.navbar-search-wrapper .search-toggler {
    color: var(--enterprise-muted) !important;
    font-size: 0.8125rem;
}

.navbar-search-wrapper .search-toggler:hover {
    color: var(--enterprise-primary) !important;
}

.dropdown-notifications .badge-notifications {
    min-width: 1.25rem;
    background: var(--enterprise-danger) !important;
    font-size: 0.625rem;
}

.card,
.offcanvas,
.modal-content,
.popover,
.dropdown-menu,
.toast,
.alert {
    border: 1px solid var(--enterprise-border);
    border-radius: var(--enterprise-radius);
    background: var(--enterprise-surface);
    color: var(--enterprise-text);
    box-shadow: none;
}

.card { overflow: hidden; }

.card-header {
    border-bottom: 1px solid var(--enterprise-border);
    background: var(--enterprise-surface);
    color: var(--enterprise-text);
    font-size: 0.8125rem;
    font-weight: 600;
    padding: 0.875rem 1rem;
}

.card-body { padding: 1rem; }

.card-footer {
    border-top: 1px solid var(--enterprise-border);
    background: #FBFDFF;
}

.card.shadow,
.card.shadow-sm,
.card.shadow-lg { box-shadow: none !important; }

.border,
.border-top,
.border-end,
.border-bottom,
.border-start { border-color: var(--enterprise-border) !important; }

.btn {
    min-height: var(--enterprise-control-height);
    border-radius: 4px;
    box-shadow: none !important;
    font-size: 0.8125rem;
    font-weight: 600;
}

.btn-primary,
.btn-info,
.btn-primary:disabled,
.btn-primary.disabled {
    border-color: var(--enterprise-primary) !important;
    background: var(--enterprise-primary) !important;
    color: #FFFFFF !important;
}

.btn-primary:hover,
.btn-primary:focus-visible,
.btn-primary:active,
.btn-info:hover,
.btn-info:focus-visible {
    border-color: #043D82 !important;
    background: #043D82 !important;
    color: #FFFFFF !important;
}

.btn-outline-primary {
    border-color: var(--enterprise-primary) !important;
    color: var(--enterprise-primary) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus-visible {
    border-color: var(--enterprise-primary) !important;
    background: #E8F1FB !important;
    color: var(--enterprise-primary) !important;
}

.btn-light,
.btn-secondary,
.btn-outline-secondary {
    border-color: var(--enterprise-border) !important;
    background: #F4F8FD !important;
    color: var(--enterprise-text) !important;
}

.btn-light:hover,
.btn-secondary:hover,
.btn-outline-secondary:hover {
    border-color: #AFC5DD !important;
    background: #E9F2FB !important;
}

.btn-danger {
    border-color: var(--enterprise-danger) !important;
    background: var(--enterprise-danger) !important;
}

.btn-success {
    border-color: var(--enterprise-success) !important;
    background: var(--enterprise-success) !important;
}

.form-label,
.col-form-label {
    margin-bottom: 0.35rem;
    color: var(--enterprise-text);
    font-size: 0.75rem;
    font-weight: 600;
}

.form-control,
.form-select,
.input-group-text,
.bootstrap-select > .dropdown-toggle,
select,
textarea {
    min-height: var(--enterprise-control-height);
    border: 1px solid var(--enterprise-border);
    border-radius: 4px;
    background: var(--enterprise-surface);
    color: var(--enterprise-text);
    font-size: 0.8125rem;
    box-shadow: none !important;
}

.form-control::placeholder { color: #8291A2; }

.form-control:focus,
.form-select:focus,
.form-control:focus-visible,
.form-select:focus-visible,
select:focus,
textarea:focus {
    border-color: var(--enterprise-primary);
    background: var(--enterprise-surface);
    color: var(--enterprise-text);
    box-shadow: 0 0 0 3px rgba(var(--enterprise-primary-rgb), 0.12) !important;
}

.input-group-text { display: flex; align-items: center; color: var(--enterprise-muted); }

.form-check-input { border-color: #AFC5DD; }

.form-check-input:checked {
    border-color: var(--enterprise-primary);
    background-color: var(--enterprise-primary);
}

.table-responsive {
    border: 1px solid var(--enterprise-border);
    border-radius: var(--enterprise-radius);
    background: var(--enterprise-surface);
}

.table {
    margin-bottom: 0;
    --bs-table-color: var(--enterprise-text);
    --bs-table-border-color: var(--enterprise-border);
    --bs-table-bg: transparent;
    font-size: 0.8125rem;
}

.table > :not(caption) > * > * {
    padding: 0.7rem 0.75rem;
    border-bottom-color: var(--enterprise-border);
}

.table thead th,
.table thead.thead-dark th,
.table-dark thead th,
thead.table-dark th,
.table-light th {
    border-bottom: 1px solid var(--enterprise-border) !important;
    background: var(--enterprise-sidebar-bg) !important;
    color: var(--enterprise-muted) !important;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.table tbody tr:hover > * { background: #F7FAFE !important; }

.table-striped > tbody > tr:nth-of-type(odd) > * { background: #FBFDFF; }

.table-dark,
.table-dark > :not(caption) > * > * {
    background: var(--enterprise-primary) !important;
    color: #FFFFFF !important;
    border-color: rgba(255, 255, 255, .18) !important;
}

.table-dark thead th,
thead.table-dark th {
    background: #053E85 !important;
    color: #FFFFFF !important;
}

.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input { min-height: 34px; }

.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    color: var(--enterprise-muted) !important;
    font-size: 0.75rem;
}

.nav-tabs { gap: 0.25rem; border-bottom: 1px solid var(--enterprise-border); }

.nav-tabs .nav-link {
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    color: var(--enterprise-muted);
    font-size: 0.8125rem;
    font-weight: 600;
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus-visible {
    color: var(--enterprise-primary);
    background: #F4F8FD;
}

.nav-tabs .nav-link.active {
    border-bottom-color: var(--enterprise-primary);
    background: transparent;
    color: var(--enterprise-primary);
}

.pagination { gap: 0.25rem; }

.page-link {
    min-width: 2rem;
    min-height: 2rem;
    border: 1px solid var(--enterprise-border);
    border-radius: 4px !important;
    background: var(--enterprise-surface);
    color: var(--enterprise-muted);
    text-align: center;
}

.page-link:hover,
.page-link:focus-visible {
    border-color: var(--enterprise-primary);
    background: #E8F1FB;
    color: var(--enterprise-primary);
}

.page-item.active .page-link {
    border-color: var(--enterprise-primary);
    background: var(--enterprise-primary);
    color: #FFFFFF;
}

.badge {
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 700;
}

.bg-primary,
.badge-primary { background: var(--enterprise-primary) !important; }

.bg-success,
.badge-success {
    background: #E8F5EE !important;
    color: var(--enterprise-success) !important;
}

.bg-warning,
.badge-warning {
    background: #FFF6DF !important;
    color: var(--enterprise-warning) !important;
}

.bg-danger,
.badge-danger {
    background: #FDECEC !important;
    color: var(--enterprise-danger) !important;
}

.bg-info,
.badge-info {
    background: #E8F1FB !important;
    color: var(--enterprise-primary) !important;
}

.alert {
    padding: 0.75rem 1rem;
    font-size: 0.8125rem;
}

.alert-primary {
    border-color: #A8C5E6;
    background: #E8F1FB !important;
    color: #064A9D !important;
}

.alert-success {
    border-color: #B4D9C2;
    background: #EAF6EF !important;
    color: #247A52 !important;
}

.alert-warning {
    border-color: #E7CF98;
    background: #FFF7E4 !important;
    color: #805800 !important;
}

.alert-danger {
    border-color: #E5B7B7;
    background: #FDECEC !important;
    color: #9E3D3D !important;
}

.modal-header,
.modal-footer,
.dropdown-menu-header,
.dropdown-menu-footer {
    border-color: var(--enterprise-border) !important;
    background: #FBFDFF;
}

.modal-title,
.dropdown-menu-header h5 {
    color: var(--enterprise-text);
    font-size: 0.875rem;
    font-weight: 700;
}

.dropdown-item {
    color: var(--enterprise-text);
    font-size: 0.8125rem;
}

.dropdown-item:hover,
.dropdown-item:focus-visible {
    background: #F4F8FD;
    color: var(--enterprise-primary);
}

.modal-backdrop.show { opacity: 0.35; }

.toast-header {
    border-bottom-color: var(--enterprise-border);
    background: #FBFDFF;
    color: var(--enterprise-text);
}

.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    min-height: var(--enterprise-control-height);
    border: 1px solid var(--enterprise-border);
    border-radius: 4px;
    background: #FFFFFF;
}

.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--enterprise-primary);
    box-shadow: 0 0 0 3px rgba(var(--enterprise-primary-rgb), .12);
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: var(--enterprise-primary);
}

.bootstrap-select .dropdown-menu { border-color: var(--enterprise-border); }

.page-header,
.page-toolbar,
.toolbar,
.filter-toolbar {
    border: 1px solid var(--enterprise-border);
    border-radius: var(--enterprise-radius);
    background: var(--enterprise-surface);
    padding: 0.75rem 1rem;
}

hr {
    border-color: var(--enterprise-border);
    opacity: 1;
}

pre,
code { color: var(--enterprise-text); }

pre {
    border: 1px solid var(--enterprise-border);
    border-radius: 4px;
    background: var(--enterprise-sidebar-bg);
}

@media (max-width: 767.98px) {
    .content-wrapper > .container-fluid {
        padding: 0.75rem;
    }

    .card-body { padding: 0.875rem; }
    .card-header { padding: 0.75rem 0.875rem; }

    .table-responsive { border-radius: 4px; }

    .page-header,
    .page-toolbar,
    .toolbar,
    .filter-toolbar { padding: 0.625rem 0.75rem; }
}


/* Legacy dashboard components brought into the same enterprise system. */
.layout-wrapper .digital-clock {
    border: 1px solid var(--enterprise-border) !important;
    border-radius: var(--enterprise-radius) !important;
    background: var(--enterprise-surface) !important;
    color: var(--enterprise-primary) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

.layout-wrapper .digital-clock:hover {
    background: #F4F8FD !important;
    box-shadow: none !important;
    transform: translateY(-50%) !important;
}

.layout-wrapper .clock-icon {
    border-radius: 4px !important;
    background: #E8F1FB !important;
    color: var(--enterprise-primary) !important;
    box-shadow: none !important;
}

.layout-wrapper .stat-card {
    border: 1px solid var(--enterprise-border) !important;
    border-radius: var(--enterprise-radius) !important;
    background: var(--enterprise-surface) !important;
    color: var(--enterprise-text) !important;
    box-shadow: none !important;
}

.layout-wrapper .stat-card:hover {
    box-shadow: none !important;
    transform: none !important;
}

.layout-wrapper .stat-card--highlight {
    border-color: var(--enterprise-primary) !important;
    background: var(--enterprise-primary) !important;
    color: #FFFFFF !important;
    box-shadow: none !important;
}

.layout-wrapper .stat-card__icon {
    border-radius: 4px !important;
    background: #E8F1FB !important;
    color: var(--enterprise-primary) !important;
    box-shadow: none !important;
}

.layout-wrapper .stat-card--highlight .stat-card__icon {
    background: rgba(255, 255, 255, .18) !important;
    color: #FFFFFF !important;
}

.layout-wrapper .stat-card__title,
.layout-wrapper .stat-card__meta {
    color: var(--enterprise-muted) !important;
}

.layout-wrapper .stat-card--highlight .stat-card__title,
.layout-wrapper .stat-card--highlight .stat-card__meta {
    color: rgba(255, 255, 255, .84) !important;
}

.layout-wrapper .contract-card,
.layout-wrapper .contract-table-wrapper,
.layout-wrapper .welcome-card {
    border: 1px solid var(--enterprise-border) !important;
    border-radius: var(--enterprise-radius) !important;
    box-shadow: none !important;
}

.layout-wrapper .contract-summary__item {
    border: 1px solid var(--enterprise-border) !important;
    border-radius: var(--enterprise-radius) !important;
    background: var(--enterprise-sidebar-bg) !important;
    color: var(--enterprise-text) !important;
    box-shadow: none !important;
}

.layout-wrapper .contract-summary__icon {
    border-radius: 4px !important;
    background: #E8F1FB !important;
    color: var(--enterprise-primary) !important;
}

.layout-wrapper .contract-tabs .nav-link {
    color: var(--enterprise-muted) !important;
}

.layout-wrapper .contract-tabs .nav-link.active {
    border-color: var(--enterprise-primary) !important;
    color: var(--enterprise-primary) !important;
}

.layout-wrapper .contract-pill {
    border: 1px solid var(--enterprise-border) !important;
    border-radius: 999px !important;
    background: #F4F8FD !important;
    color: var(--enterprise-muted) !important;
}

.layout-wrapper .contract-pill--danger {
    border-color: #E5B7B7 !important;
    background: #FDECEC !important;
    color: var(--enterprise-danger) !important;
}

.layout-wrapper .contract-pill--safe {
    border-color: #B4D9C2 !important;
    background: #EAF6EF !important;
    color: var(--enterprise-success) !important;
}

.layout-wrapper [style*="linear-gradient"].card,
.layout-wrapper .card[style*="linear-gradient"] {
    background: var(--enterprise-surface) !important;
    background-image: none !important;
    color: var(--enterprise-text) !important;
}

.layout-wrapper .card[style*="border-radius: 12px"],
.layout-wrapper .card[style*="border-radius: 15px"],
.layout-wrapper .card[style*="border-radius: 20px"],
.layout-wrapper .card[style*="border-radius: 24px"] {
    border-radius: var(--enterprise-radius) !important;
}

.layout-wrapper .card[style*="box-shadow"] {
    box-shadow: none !important;
}

.layout-wrapper .btn.rounded-pill {
    border-radius: 4px !important;
}

/* Standalone auth/mobile screens */
.sign-btn,
input.sign-btn {
    border: 1px solid var(--enterprise-primary) !important;
    border-radius: 4px !important;
    background: var(--enterprise-primary) !important;
    color: #FFFFFF !important;
    box-shadow: none !important;
}

.sign-btn:hover,
.sign-btn:focus-visible {
    border-color: #043D82 !important;
    background: #043D82 !important;
}

.top-section {
    border-radius: 0 0 var(--enterprise-radius) var(--enterprise-radius) !important;
    background: var(--enterprise-primary) !important;
    box-shadow: none !important;
}

.top-section .blob-1 {
    background: rgba(255, 255, 255, .12) !important;
}

body:has(.hero-bg) {
    background: var(--enterprise-app-bg) !important;
    color: var(--enterprise-text) !important;
}

.hero-bg {
    border-bottom-left-radius: var(--enterprise-radius) !important;
    border-bottom-right-radius: var(--enterprise-radius) !important;
    background: var(--enterprise-primary) !important;
    box-shadow: none !important;
}

.glass-icon {
    border: 1px solid rgba(255, 255, 255, .3) !important;
    border-radius: 4px !important;
    background: rgba(255, 255, 255, .12) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

.carousel-wrapper {
    border: 1px solid var(--enterprise-border) !important;
    border-radius: var(--enterprise-radius) !important;
    box-shadow: none !important;
}

.alert-slide {
    border-radius: var(--enterprise-radius) !important;
}

@media (max-width: 767.98px) {
    body:has(.hero-bg) .hero-bg {
        padding-bottom: 3.5rem;
    }
}

/* Global page hygiene: normalize legacy page-level decoration without touching
   avatars, status badges, charts, or functional content. */
.layout-wrapper .card,
.layout-wrapper .modal-content,
.layout-wrapper .alert {
    border-radius: var(--enterprise-radius) !important;
}

.layout-wrapper .card.border-0,
.layout-wrapper .modal-content.border-0 {
    border: 1px solid var(--enterprise-border) !important;
}

.layout-wrapper .shadow,
.layout-wrapper .shadow-sm,
.layout-wrapper .shadow-lg,
.layout-wrapper [style*="box-shadow"] {
    box-shadow: none !important;
}

.layout-wrapper [style*="linear-gradient"],
.layout-wrapper [style*="radial-gradient"] {
    background-image: none !important;
    background-color: var(--enterprise-surface) !important;
    color: var(--enterprise-text) !important;
}

.layout-wrapper .btn.rounded-pill,
.layout-wrapper a.btn.rounded-pill,
.layout-wrapper button.rounded-pill,
.layout-wrapper .nav-link.rounded-pill {
    border-radius: 4px !important;
}

.layout-wrapper .badge.rounded-pill,
.layout-wrapper .avatar .rounded-pill,
.layout-wrapper .avatar-initial.rounded-pill {
    border-radius: 999px !important;
}

.layout-wrapper .border-0 {
    border-color: var(--enterprise-border) !important;
}

.layout-wrapper .bg-label-primary,
.layout-wrapper .bg-label-info {
    background: #E8F1FB !important;
    color: var(--enterprise-primary) !important;
}

.layout-wrapper .bg-label-success {
    background: #E8F5EE !important;
    color: var(--enterprise-success) !important;
}

.layout-wrapper .bg-label-warning {
    background: #FFF6DF !important;
    color: var(--enterprise-warning) !important;
}

.layout-wrapper .bg-label-danger {
    background: #FDECEC !important;
    color: var(--enterprise-danger) !important;
}

.layout-wrapper .bg-label-secondary {
    background: #F4F8FD !important;
    color: var(--enterprise-muted) !important;
}

.layout-wrapper .text-success { color: var(--enterprise-success) !important; }
.layout-wrapper .text-warning { color: var(--enterprise-warning) !important; }
.layout-wrapper .text-danger { color: var(--enterprise-danger) !important; }
.layout-wrapper .text-info { color: var(--enterprise-primary) !important; }

/* Mobile-modern layouts use legacy inline important rules; these selectors keep
   their shell on the same document palette. */
:root {
    --color-nav: var(--enterprise-primary);
    --color-nav-active: #E8F1FB;
    --bg-indicator: var(--enterprise-primary);
    --color-nav-hover: #E8F1FB;
    --bg-nav: var(--enterprise-surface);
}

html:has(body header),
html:has(body header) body {
    background: var(--enterprise-app-bg) !important;
}

html:has(body header) body {
    color: var(--enterprise-text) !important;
}

html:has(body header) body > header {
    background: var(--enterprise-primary) !important;
}

html:has(body header) .air-datepicker {
    border: 1px solid var(--enterprise-border) !important;
    border-radius: var(--enterprise-radius) !important;
    box-shadow: none !important;
}

html:has(body header) .air-datepicker-cell.-selected- {
    background: var(--enterprise-primary) !important;
}