/**
 * ORCA Collega Admin POC - Dark Navy Command Center Theme
 * Enterprise banking visual identity
 */

/* ========== ORCA DARK NAVY PALETTE ========== */
:root {
    /* Main surfaces */
    --orca-bg-main: #080D18;
    --orca-bg-sidebar: #0C1424;
    --orca-bg-card: #111B2E;
    --orca-bg-elevated: #162238;

    /* Borders */
    --orca-border: #24324A;

    /* Brand / primary */
    --orca-primary: #3B82F6;
    --orca-primary-hover: #2563EB;
    --orca-accent: #38BDF8;

    /* Typography */
    --orca-text-primary: #F8FAFC;
    --orca-text-secondary: #94A3B8;
    --orca-text-muted: #64748B;

    /* Semantic (independent from ORCA blue) */
    --orca-success: #22C55E;
    --orca-warning: #F59E0B;
    --orca-danger: #EF4444;

    /* OVERRIDE LEGACY GREEN THEME VARIABLES */
    --bg-color: #080D18 !important;
    --bg-color-primary: #3B82F6 !important;
    --text-color: #F8FAFC !important;
    --text-color-primary: #3B82F6 !important;
    --text-color-secondary: #94A3B8 !important;
}

/* ========== PAGE BACKGROUND ========== */
body.app {
    background-color: var(--orca-bg-main) !important;
}

/* ========== TRANSACTION TABLE ========== */
table.dataTable tbody tr {
    color: var(--orca-text-secondary) !important;
    background-color: var(--orca-bg-card);
}

table.dataTable tbody tr:hover {
    background-color: var(--orca-bg-elevated) !important;
}

/* Table borders - navy only, not blue */
.table tbody td,
.table thead th {
    border: 1px solid var(--orca-border) !important;
}

.table thead th {
    background-color: var(--orca-bg-elevated);
    color: var(--orca-text-primary) !important;
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    padding: 0.75rem 0.5rem;
}

.table tbody td {
    padding: 0.625rem 0.5rem;
    font-size: 0.875rem;
    vertical-align: middle;
    color: var(--orca-text-secondary) !important;
}

/* DataTables wrapper - ensure navy borders */
.dataTables_wrapper .dataTables_scroll,
.dataTables_wrapper table,
.dataTables_wrapper {
    border-color: var(--orca-border) !important;
}

/* ========== STATUS BADGES ========== */
.status-badge {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.status-success {
    background-color: rgba(34, 197, 94, 0.2);
    color: var(--orca-success);
    border: 1px solid var(--orca-success);
}

.status-pending {
    background-color: rgba(245, 158, 11, 0.2);
    color: var(--orca-warning);
    border: 1px solid var(--orca-warning);
}

.status-failed {
    background-color: rgba(239, 68, 68, 0.2);
    color: var(--orca-danger);
    border: 1px solid var(--orca-danger);
}

.status-neutral {
    background-color: rgba(100, 116, 139, 0.2);
    color: var(--orca-text-muted);
    border: 1px solid var(--orca-text-muted);
}

/* ========== CARD REFINEMENTS ========== */
.card {
    background-color: var(--orca-bg-card) !important;
    border: 1px solid var(--orca-border) !important;
}

.card-header {
    background-color: var(--orca-bg-elevated) !important;
    border-bottom: 1px solid var(--orca-border) !important;
}

.card-title {
    color: var(--orca-text-primary) !important;
    font-weight: 600;
}

/* ========== KPI CARDS ========== */
.kpi-card {
    background-color: var(--orca-bg-card);
    border: 1px solid var(--orca-border);
    border-radius: 0.5rem;
    padding: 1.25rem;
}

.kpi-number {
    font-size: 2rem;
    font-weight: 700;
    color: var(--orca-text-primary);
    line-height: 1.2;
    margin-bottom: 0.25rem;
}

.kpi-label {
    font-size: 0.875rem;
    color: var(--orca-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.kpi-accent {
    color: var(--orca-primary);
}

/* ========== SEARCH/FILTER TOOLBAR ========== */
#datatable_filter label {
    color: var(--orca-text-secondary);
    font-size: 0.875rem;
    margin-bottom: 0.25rem;
}

#datatable_filter input[type="date"],
#datatable_filter input[type="text"] {
    background-color: var(--orca-bg-elevated);
    border: 1px solid var(--orca-border) !important;
    color: var(--orca-text-primary);
    font-size: 0.875rem;
}

#datatable_filter input[type="date"]:focus,
#datatable_filter input[type="text"]:focus {
    background-color: var(--orca-bg-card);
    border-color: var(--orca-primary) !important;
    color: var(--orca-text-primary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
}

#datatable_filter input[type="date"]::placeholder,
#datatable_filter input[type="text"]::placeholder {
    color: var(--orca-text-muted);
}

#datatable_filter .btn-primary {
    background-color: var(--orca-primary);
    border-color: var(--orca-primary);
    color: #FFFFFF;
    font-weight: 600;
}

#datatable_filter .btn-primary:hover {
    background-color: var(--orca-primary-hover);
    border-color: var(--orca-primary-hover);
}

/* ========== CIF COLUMN EMPHASIS ========== */
.cif-column {
    font-weight: 500;
    color: var(--orca-text-primary);
}

.cif-empty {
    color: var(--orca-text-muted);
    font-style: italic;
}

/* ========== DATATABLES PAGINATION ========== */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: var(--orca-text-secondary) !important;
    background-color: transparent !important;
    border: 1px solid var(--orca-border) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: var(--orca-text-primary) !important;
    background-color: rgba(59, 130, 246, 0.1) !important;
    border-color: var(--orca-border) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background-color: var(--orca-primary) !important;
    color: #FFFFFF !important;
    border-color: var(--orca-primary) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    color: var(--orca-text-muted) !important;
    background-color: transparent !important;
    border-color: var(--orca-border) !important;
}

/* ========== SIDEBAR REFINEMENTS ========== */
.app-sidebar {
    background-color: var(--orca-bg-sidebar) !important;
}

.side-menu__item.active .side-menu__label {
    color: var(--orca-primary) !important;
}

.side-menu__item .side-menu__label {
    color: var(--orca-text-secondary);
}

.side-menu__item:hover .side-menu__label {
    color: var(--orca-text-primary) !important;
}

.side-menu__item:hover {
    background-color: rgba(59, 130, 246, 0.1) !important;
}

.side-menu__item.active {
    background-color: rgba(59, 130, 246, 0.15) !important;
}

/* ========== FORM CONTROLS ========== */
.form-control {
    background-color: var(--orca-bg-elevated) !important;
    border-color: var(--orca-border) !important;
    color: var(--orca-text-primary) !important;
}

.form-control:focus {
    background-color: var(--orca-bg-card) !important;
    border-color: var(--orca-primary) !important;
    color: var(--orca-text-primary) !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
}

.form-control::placeholder {
    color: var(--orca-text-muted) !important;
}

/* All input types - navy borders, blue focus only */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="search"],
select,
textarea {
    border: 1px solid var(--orca-border) !important;
    background-color: var(--orca-bg-elevated) !important;
    color: var(--orca-text-primary) !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
input[type="search"]:focus,
select:focus,
textarea:focus {
    border-color: var(--orca-primary) !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
}

/* ========== BUTTONS ========== */
.btn-primary {
    background-color: var(--orca-primary) !important;
    border-color: var(--orca-primary) !important;
    color: #FFFFFF !important;
}

.btn-primary:hover {
    background-color: var(--orca-primary-hover) !important;
    border-color: var(--orca-primary-hover) !important;
}

.btn-primary:focus {
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25) !important;
}

/* ========== HEADER ========== */
.app-header {
    background-color: var(--orca-bg-sidebar) !important;
    border-bottom: 1px solid var(--orca-border) !important;
}

/* ========== DATATABLES INFO ========== */
.dataTables_wrapper .dataTables_info {
    color: var(--orca-text-secondary) !important;
}

.dataTables_wrapper .dataTables_length label {
    color: var(--orca-text-secondary) !important;
}

.dataTables_wrapper .dataTables_length select {
    background-color: var(--orca-bg-elevated) !important;
    border: 1px solid var(--orca-border) !important;
    color: var(--orca-text-primary) !important;
}

.dataTables_wrapper .dataTables_length select:focus {
    border-color: var(--orca-primary) !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
}

/* ========== LABELS ========== */
label {
    color: var(--orca-text-secondary);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--orca-text-primary);
}

/* ========== PRODUCT STATUS (NON-SEMANTIC) ========== */
/* Product "Open" is not a success state - make it subtle */
.product-status-open,
.status-open {
    color: var(--orca-text-secondary) !important;
    background-color: rgba(148, 163, 184, 0.15) !important;
    border: 1px solid var(--orca-text-secondary) !important;
}

/* ========== ELIMINATE SIDEBAR GREEN GLOW ========== */
.app-sidebar {
    border-right: 1px solid var(--orca-border) !important;
    box-shadow: none !important;
}

.page-sidebar,
.app-sidebar::before,
.app-sidebar::after {
    box-shadow: none !important;
    border-right: 1px solid var(--orca-border) !important;
    border-left: none !important;
}

/* Remove all green borders from sidebar elements */
.side-menu,
.side-menu__item,
.slide-menu {
    border-color: var(--orca-border) !important;
    border-bottom-color: var(--orca-border) !important;
}

.side-menu__icon {
    background-color: transparent !important;
    color: var(--orca-text-muted) !important;
}

.side-menu__item.active .side-menu__icon {
    background-color: rgba(59, 130, 246, 0.2) !important;
    color: var(--orca-primary) !important;
}

.side-menu__item:hover .side-menu__icon {
    background-color: rgba(59, 130, 246, 0.1) !important;
    color: var(--orca-primary) !important;
}

/* ========== REMOVE GREEN FROM BACK-TO-TOP BUTTON ========== */
#back-to-top {
    background-color: var(--orca-primary) !important;
    color: white !important;
    border-color: var(--orca-primary) !important;
}

#back-to-top:hover {
    background-color: var(--orca-primary-hover) !important;
    color: white !important;
    border-color: var(--orca-primary-hover) !important;
}

/* ========== OVERRIDE UTILITY CLASSES ========== */
/* Only override when NOT semantic success */
.text-success:not(.status-success):not(.badge-success) {
    color: var(--orca-primary) !important;
}

.border-success:not(.status-success) {
    border-color: var(--orca-border) !important;
}

.btn-success:not(.semantic-success) {
    background-color: var(--orca-primary) !important;
    border-color: var(--orca-primary) !important;
}

.btn-success:not(.semantic-success):hover {
    background-color: var(--orca-primary-hover) !important;
    border-color: var(--orca-primary-hover) !important;
}

/* ========== BREADCRUMB ========== */
.breadcrumb-item.active {
    color: var(--orca-text-secondary) !important;
}

.breadcrumb-item.active a {
    color: var(--orca-primary) !important;
}

.breadcrumb-item a {
    color: var(--orca-primary) !important;
}

/* ========== PAGE HEADER ========== */
.page-title {
    color: var(--orca-text-primary) !important;
}

/* ========== NAV TABS ========== */
.nav-tabs .nav-link.active {
    background-color: var(--orca-primary) !important;
    border-color: var(--orca-primary) !important;
    color: white !important;
}

.nav-tabs .nav-link {
    background-color: var(--orca-bg-card);
    border-color: var(--orca-border);
    color: var(--orca-text-secondary);
}

.nav-tabs .nav-link:hover {
    background-color: var(--orca-bg-elevated);
    border-color: var(--orca-border);
    color: var(--orca-text-primary);
}

/* ========== REMOVE ALL GREEN SHADOWS AND GLOWS ========== */
* {
    box-shadow: none !important;
}

/* Re-enable only necessary shadows with neutral colors */
.card {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.3) !important;
}

.dropdown-menu {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3) !important;
}

.btn:focus,
.form-control:focus,
input:focus,
select:focus,
textarea:focus {
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
}

/* ========== RESPONSIVE ADJUSTMENTS ========== */
@media (max-width: 768px) {
    .table thead th,
    .table tbody td {
        font-size: 0.8125rem;
        padding: 0.5rem 0.375rem;
    }

    .kpi-number {
        font-size: 1.5rem;
    }
}