/* ============================================================
   FONT SYSTEM — Inter (Google Fonts, SIL Open Font License)
   Replaces the proprietary Bridgestone typeface.
   Inter is a clean, geometric, premium sans-serif that matches
   the previous design intent with zero licensing concerns.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

:root {
    --font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Apply Inter to every element in the solution */
* {
    font-family: inherit;
}

body,
html,
button,
input,
select,
textarea,
.dx-widget,
.dx-texteditor,
.dx-datagrid,
.dx-data-row,
.dx-header-row,
.dx-column-indicators,
.dx-datagrid-headers,
.dx-datagrid-rowsview,
.fluent-grid,
.font-inter,
.font-bridgestone {
    font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Table elements */
th,
td,
.table,
.grid,
.dynamic-grid-container {
    font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Fine-tune Inter for dashboard numbers — slightly tighter tracking */
.kpi-number, .kpi-title, h1, h2, h3, h4, h5, h6 {
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif !important;
    font-feature-settings: 'cv02', 'cv03', 'cv04', 'tnum';
}

/* Custom Back Button Theme */
.btn-back-custom {
    background-color: #f1f5f9 !important;
    /* slate-100 */
    color: #0f172a !important;
    border: 1px solid #334155 !important;
    /* slate-700 */
}

.btn-back-custom i {
    color: #0f172a !important;
}

.btn-back-custom:hover {
    background-color: #e2e8f0;
    /* slate-200 */
    transform: translateY(-1px);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.dark .btn-back-custom {
    background-color: #1e293b !important;
    /* slate-800 */
    color: #f8fafc !important;
    border: 1px solid #94a3b8 !important;
    /* slate-400 */
}

.dark .btn-back-custom i {
    color: #f8fafc !important;
}

.dark .btn-back-custom:hover {
    background-color: #334155;
    /* slate-700 */
}

/* ========================================
   Custom Export Button Style 
   ======================================== */
body .dx-datagrid .dx-datagrid-export-button.dx-button,
body .fluent-grid .dx-datagrid-export-button.dx-button {
    background-color: rgba(34, 139, 34, 0.1) !important;
    border-radius: 6px !important;
    border: 1px solid rgba(34, 139, 34, 0.2) !important;
    padding: 0 12px 0 8px !important;
    margin-right: 12px !important;
    cursor: pointer;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
}

/* Hover Styles - Premium Green Effect */
body .dx-datagrid .dx-datagrid-export-button.dx-button:hover,
body .fluent-grid .dx-datagrid-export-button.dx-button:hover {
    background-color: #1a7f37 !important;
    border-color: #1a7f37 !important;
}

body .dx-datagrid .dx-datagrid-export-button.dx-button:hover .dx-button-content::after,
body .fluent-grid .dx-datagrid-export-button.dx-button:hover .dx-button-content::after,
body .dx-datagrid .dx-datagrid-export-button.dx-button:hover .dx-icon,
body .fluent-grid .dx-datagrid-export-button.dx-button:hover .dx-icon {
    color: #ffffff !important;
}

body .dx-datagrid .dx-datagrid-export-button.dx-button .dx-button-content,
body .fluent-grid .dx-datagrid-export-button.dx-button .dx-button-content {
    padding: 0 !important;
    margin: 0 !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
}

/* "EXPORT" Text Alignment */
body .dx-datagrid .dx-datagrid-export-button.dx-button .dx-button-content::after,
body .fluent-grid .dx-datagrid-export-button.dx-button .dx-button-content::after {
    content: "EXPORT" !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #1a7f37 !important;
    text-transform: uppercase !important;
    display: inline-flex !important;
    align-items: center !important;
    height: 100% !important;
    transition: color 0.3s ease !important;
}

/* Icon Alignment */
body .dx-datagrid .dx-datagrid-export-button.dx-button .dx-icon,
body .fluent-grid .dx-datagrid-export-button.dx-button .dx-icon {
    color: #1a7f37 !important;
    font-size: 16px !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    transition: color 0.3s ease !important;
}