/* =========================================
   TABLES  
   ========================================= */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap');

:root {
    --aw-table-header-bg: #A1C9D3; /* Base background for headers */
    --aw-table-header-hover: #D4E9EE; /* Hover color for headers */
    --aw-table-header-text: #1A4E63; /* Teal text for contrast */
    --aw-table-header-border: #1A4E63; /* Border color */
    --aw-table-divider: #E6ECEF;
    --aw-table-hover-bg: #F3F8F9;
    --aw-table-body-text: #3A3A3A;
}

/* Base Table */
.table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #FFFFFF;
    border-radius: 0;
    overflow: visible; 
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.04);
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.25;
    color: var(--aw-table-body-text);
}

/* Header Row (Thick variant) */
:root {
    --aw-table-header-bg: #A1C9D3; /* Base background */
    --aw-table-header-hover: #D4E9EE; /* Hover color */
    --aw-table-header-text: #1A4E63; /* Teal text for contrast */
}



.table thead th {
    background-color: var(--aw-table-header-bg);
    color: var(--aw-table-header-text);
    transition: background-color 0.2s ease-in-out;
    font-weight: 600;
    font-size: 14px;
    text-align: left;
    vertical-align: middle;
    padding: 0.6rem 0.85rem; /* was 1.25rem 1.5rem */
    height: auto;
    letter-spacing: 0.02em;
    border-bottom: 2px solid var(--aw-table-header-border);
    white-space: nowrap;
}

    .table thead th:hover {
        background-color: var(--aw-table-header-hover);
    }

.table thead {
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
}

    .table thead tr:first-child th:first-child {
        border-top-left-radius: 0;
    }

    .table thead tr:first-child th:last-child {
        border-top-right-radius: 0;
    }

/* =========================================
   ROW STYLES 
   ========================================= */
:root {
    --aw-row-text: #2f3a3f;
    --aw-row-bg: #ffffff;
    --aw-row-alt: #FAFBFC;
    --aw-row-hover: #F3F8F9;
    --aw-row-divider: #E6ECEF;
    --aw-row-vpad: 1.05rem;
}

/* Base Rows */
.table tbody tr {
    color: var(--aw-row-text);
    background-color: var(--aw-row-bg);
    transition: background-color .18s ease, box-shadow .18s ease;
}

.table tbody td {
    padding: var(--aw-row-vpad) 0.80rem; /* ~52px row height */
    border-bottom: 1px solid var(--aw-row-divider);
    background-color: inherit;
    vertical-align: middle;
    text-align: left;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.25;
    white-space: nowrap;
}

/* Striping */
.table.table-striped tbody tr:nth-of-type(even) {
    background-color: var(--aw-row-alt);
}

/* Hover */
.table.table-hover tbody tr:hover {
    background-color: var(--aw-row-hover);
}

/* Selected / Active */
.table tbody tr.selected,
.table tbody tr.active-row {
    background-color: #E2F1F4 !important;
    box-shadow: inset 0 -1px 0 var(--aw-row-divider), inset 0 1px 0 var(--aw-row-divider);
    font-weight: 600;
}

/* Rounded Bottom Corners */
.table tbody tr:last-child td:first-child {
    border-bottom-left-radius: 0;
}

.table tbody tr:last-child td:last-child {
    border-bottom-right-radius: 0;
}

/* =========================================
   ACTIONS COLUMN — Compact Global Standard
   ========================================= */
.actions-column {
    width: 70px;
    min-width: 70px;
    max-width: 70px;
    text-align: center !important;
    white-space: nowrap;
    padding: 0.25rem !important;
    position: relative; /* fix for dropdown overflow */
    overflow: visible !important; /* Allow dropdown to extend outside */
}

    /* Center the dropdown wrapper */
    .actions-column .dropdown {
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

.actions-column--button {
    width: 130px;
    min-width: 130px;
    max-width: 150px;
    padding: 0.45rem 0.5rem !important;
}

    .actions-column--button .btn-aw {
        width: 100%;
        justify-content: center;
    }

    /* ensure kebab / button inside fits comfortably */
    .actions-column .aw-kebab,
    .actions-column .btn {
        padding: 4px 6px;
        font-size: 15px;
        border-radius: 8px;
    }

/* optional: allow a touch more width on very small screens */
@media (max-width: 576px) {
    .actions-column {
        width: 80px;
        min-width: 80px;
        max-width: 80px;
    }
}

/* Compact Variant */
.table.table-compact tbody td {
    padding: .55rem 1rem;
    font-size: 13px;
}

/* =========================================
   DATATABLES CONTROLS
   ========================================= */
/* Ensure DataTables wrapper doesn't clip dropdowns */
div.dataTables_wrapper {
    overflow: visible !important;
}

.aw-container-body.table .aw-container-card,
.aw-container-body.table .aw-container-card .aw-container-card-body,
.aw-container-body.table .aw-container-card .aw-container-card-body.aw-container-card-body--table,
.aw-container-body.table .aw-container-card .aw-container-card-body.aw-container-card-body--table .table-responsive,
.aw-container-body.table .aw-container-card .aw-container-card-body.aw-container-card-body--table .table-responsive .dataTables_wrapper {
    overflow: visible !important;
}

/* Dedicated helper class for any card that hosts a table */
.aw-container-card--table,
.aw-container-card--table .aw-container-card-body,
.aw-container-card--table .aw-container-card-body.aw-container-card-body--table,
.aw-container-card--table .aw-container-card-body.aw-container-card-body--table .table-responsive,
.aw-container-card--table .aw-container-card-body.aw-container-card-body--table .table-responsive .dataTables_wrapper {
    overflow: visible !important;
}

/* Optional helper for Bootstrap cards that need the same behavior */
.card.card--table,
.card.card--table .card-body,
.card.card--table .card-body .table-responsive,
.card.card--table .card-body .table-responsive .dataTables_wrapper {
    overflow: visible !important;
}

/* Generic Bootstrap cards that host tables (e.g., Production Revenue Details deductions)
   Must override theme-v2.css .card { overflow: hidden; } */
.card:has(.table-responsive) {
    overflow: visible !important;
}
.card-body:has(.table-responsive),
.card-body .table-responsive,
.card-body .table-responsive .dataTables_wrapper {
    overflow: visible !important;
}

.aw-container-card:has(.aw-container-card-body--table),
.aw-container-card:has(.aw-container-card-body--table) .aw-container-card-body,
.aw-container-card:has(.aw-container-card-body--table) .aw-container-card-body.aw-container-card-body--table,
.aw-container-card:has(.aw-container-card-body--table) .aw-container-card-body.aw-container-card-body--table .table-responsive,
.aw-container-card:has(.aw-container-card-body--table) .aw-container-card-body.aw-container-card-body--table .table-responsive .dataTables_wrapper {
    overflow: visible !important;
}

/* Preserve horizontal scrolling for enhanced tables */
.aw-container-body.table .aw-container-card .aw-container-card-body.aw-container-card-body--table .aw-scroll-scroller,
.aw-container-card--table .aw-container-card-body.aw-container-card-body--table .aw-scroll-scroller,
.aw-container-card--table:has(.aw-container-card-body--table) .aw-container-card-body.aw-container-card-body--table .aw-scroll-scroller,
.aw-container-card--table:has(.aw-container-card-body--table) .aw-container-card-body.aw-container-card-body--table .table-responsive.aw-scroll-scroller,
.card.card--table .card-body .aw-scroll-scroller {
    overflow-x: auto !important;
    overflow-y: hidden;
}

div.dataTables_length,
div.dataTables_filter,
div.dataTables_info,
div.dataTables_paginate {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    font-size: 14px;
    color: #4A4A4A;
    padding: 10px 15px;
}

/*    div.dataTables_filter input {
        border: 1px solid var(--aw-table-divider);
        border-radius: 8px;
        padding: 6px 10px;
        background: #fff;
        font-size: 14px;
        font-family: inherit;
    }*/

/* Responsive Wrapper */
.table-responsive {
    border-radius: 8px;
    overflow-x: auto; /* Enable horizontal scrolling on mobile */
    overflow-y: visible; /* Allow dropdowns to extend vertically */
    background: #FFFFFF;
    box-shadow: 0px 1px 2px rgba(0,0,0,0.04);
    padding: 4px 0;
}


/* === Kebab trigger === */
.aw-kebab {
    border: 1px solid #DFE7EA;
    background: #FFFFFF;
    border-radius: 10px;
    padding: 6px 8px;
    line-height: 1;
    color: #6b7a86;
}

    .aw-kebab:hover {
        background: #F3F8F9;
        color: #1A4E63;
    }

/* === Dropdown menu styling === */
.aw-actions {
    --aw-menu-shadow: 0 8px 24px rgba(16,24,40,.08), 0 2px 8px rgba(16,24,40,.06);
    padding: 8px;
    border: 1px solid #E6ECEF;
    border-radius: 12px;
    box-shadow: var(--aw-menu-shadow);
    min-width: 200px;
    z-index: 9999 !important; /* Appear above all content */
}

.aw-action-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    font-weight: 500;
    font-size: 14px;
    color: #2f3a3f;
}

    .aw-action-item:hover {
        background: #F3F8F9;
        color: #1A4E63;
        text-decoration: none;
    }

    /* icon pill */
    .aw-action-item .icon {
        width: 28px;
        height: 28px;
        border-radius: 8px;
        display: grid;
        place-items: center;
        background: #EEF3F5;
        color: #51626d;
    }

    /* variants */
    .aw-action-item.details .icon {
        background: #EEF3F5;
        color: #51626d;
    }

    .aw-action-item.edit .icon {
        background: rgba(251,176,59,.18); /* gold */
        color: #AD7A15;
    }

    .aw-action-item.delete .icon {
        background: rgba(228,96,77,.14); /* red */
        color: #B74434;
    }

/* =========================================
   Kebab Button (⋯) 
   ========================================= */

.aw-kebab {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: none;
    background: #FFF6E9; /* soft beige background */
    border-radius: 10px;
    padding: 6px 9px;
    line-height: 1;
    color: #1A4E63; /* teal icon color for contrast */
    font-size: 16px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .aw-kebab:hover {
        background: #FCEFD9; /* slightly darker warm hover */
        color: #1A4E63;
        transform: translateY(-1px);
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
    }

    .aw-kebab:active {
        background: #FBE3B9; /* press state */
        box-shadow: inset 0 2px 3px rgba(0,0,0,0.1);
    }

/* =========================================
   LAYOUT SYSTEM TABLE OVERRIDES
   For pages using aw-container layout
   ========================================= */

/* Remove table side borders - card provides the frame */
.aw-container-card .table {
    margin-bottom: 0;
    border-left: none;
    border-right: none;
}

/* Table wrapper inside card */
.aw-container-card .table-responsive {
    margin: 0;
    border-radius: 0px;
}

/* Remove all corner rounding - card handles it */
.aw-container-card .table thead tr:first-child th:first-child,
.aw-container-card .table thead tr:first-child th:last-child,
.aw-container-card .table tbody tr:last-child td:first-child,
.aw-container-card .table tbody tr:last-child td:last-child {
    border-radius: 0 !important;
}

/* Lighter border color for cleaner look */
.aw-container-card .table-bordered th,
.aw-container-card .table-bordered td {
    border-color: #E8EBED !important;
    border-radius: 0;
}

/* Clickable row behavior */
.clickable-row {
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.clickable-row:hover {
    background-color: #F8F9FA;
}

/* =========================================
   FIX: Override jQuery DataTables Default Styling
   Remove the dark bottom border that conflicts with rounded corners-important
   ========================================= */

/* Remove DataTables default bottom border - it breaks rounded corners */
.aw-container-card table.dataTable.no-footer {
    border-bottom: none !important;
}

/* Remove DataTables table borders that conflict with our card borders */
.aw-container-card table.dataTable {
    border-collapse: separate;
    border-spacing: 0;
}

/* =========================================
   HORIZONTAL SCROLL ENHANCEMENTS
   ========================================= */
.aw-scroll-shell {
    position: relative;
    width: 100%;
}

.aw-container-card-body--table .aw-scroll-shell,
.aw-container-card-body--table .aw-scroll-scroller,
.aw-container-card-body--table .aw-scroll-scroller.table-responsive {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
}

.aw-scroll-scroller {
    position: relative;
    overflow-x: auto;
    scroll-behavior: smooth;
}

.aw-scroll-scroller::before,
.aw-scroll-scroller::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 36px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s ease;
    z-index: 1;
}

.aw-scroll-scroller::before {
    left: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0));
}

.aw-scroll-scroller::after {
    right: 0;
    background: linear-gradient(-90deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0));
}

.aw-scroll-scroller.aw-scroll-scroller--has-left::before {
    opacity: 1;
}

.aw-scroll-scroller.aw-scroll-scroller--has-right::after {
    opacity: 1;
}

.aw-scroll-arrow,
.aw-scroll-progress {
    display: none;
}

/* Only show arrows/progress when the wrapper is both enhanced AND has actual horizontal overflow.
   This ensures tables that fully fit on load (no overflow) don't show the controls until needed. */
.aw-scroll-enhanced.aw-scroll-has-overflow .aw-scroll-arrow,
.aw-scroll-enhanced.aw-scroll-has-overflow .aw-scroll-progress {
    display: flex;
}

/* We keep the native browser scrollbar as the primary horizontal scroll UI.
   The custom progress bar visually looks like a second scrollbar, so hide it
   to avoid the appearance of two horizontal scroll tracks. */
.aw-scroll-progress {
    display: none !important;
}

.aw-scroll-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    background: rgba(26, 78, 99, 0.85);
    color: #fff;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(26, 78, 99, 0.25);
    cursor: pointer;
    z-index: 2;
    transition: opacity 0.2s ease, background 0.2s ease;
}

.aw-scroll-arrow--left {
    left: 4px;
}

.aw-scroll-arrow--right {
    right: 4px;
}

.aw-scroll-arrow:disabled {
    opacity: 0.4;
    cursor: default;
}

.aw-scroll-progress {
    position: relative;
    width: 100%;
    margin-top: 0.5rem;
}

.aw-scroll-progress__track {
    height: 4px;
    width: 100%;
    border-radius: 999px;
    background: rgba(26, 78, 99, 0.15);
    overflow: hidden;
}

.aw-scroll-progress__bar {
    height: 100%;
    width: 0;
    background: linear-gradient(90deg, #1A4E63, #3E8DA8);
    transition: width 0.2s ease;
}