/* Main CSS file for Konfeta Payroll application */

/* Brand theme variables (adjust to match https://konfeta29.ru) */
:root {
    /* Provided by customer */
    --brand-primary: #EC7723; /* menu/button color */
    --brand-primary-dark: #cf681b; /* hover/darker tone */
    --brand-navbar-bg: #F9EBDA; /* light header color */
    --brand-text-on-primary: #ffffff;
}

body {
    padding-top: 56px;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    font-family: 'Montserrat Alternates', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
}

.content {
    flex: 1;
}

/* Navbar branding */
.site-navbar {
    background-color: var(--brand-navbar-bg) !important;
}
.site-navbar .navbar-brand,
.site-navbar .nav-link,
.site-navbar .navbar-text {
    color: #212529 !important; /* Bootstrap navbar-light text color */
}
.site-navbar .nav-link:hover,
.site-navbar .navbar-brand:hover {
    color: var(--brand-primary) !important;
}
.brand-logo { height: 28px; width: auto; vertical-align: middle; }
.brand-title { vertical-align: middle; }

/* Footer */
.footer {
    margin-top: auto;
    padding: 1rem 0;
    background-color: #f8f9fa;
    border-top: 1px solid #e7e7e7;
}

/* Login */
.login-container {
    max-width: 400px;
    margin: 100px auto;
    padding: 20px;
    border: 1px solid #e7e7e7;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.login-logo { text-align: center; margin-bottom: 20px; }
.brand-logo-lg { height: 48px; width: auto; }
.login-logo.has-image i { display: none; }

.form-group { margin-bottom: 15px; }

.btn-block { display: block; width: 100%; }

.alert { margin-bottom: 15px; }

.table-responsive { margin-bottom: 20px; }

.card { margin-bottom: 20px; }

.card-header { background-color: #f8f9fa; }

.dashboard-card { height: 100%; }

.dashboard-icon { font-size: 2rem; margin-bottom: 10px; }

/* Theme mappings */
.btn-primary,
.btn-primary:disabled,
.btn-primary.disabled {
    background-color: var(--brand-primary);
    border-color: var(--brand-primary);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: var(--brand-primary-dark);
    border-color: var(--brand-primary-dark);
}
.text-primary { color: var(--brand-primary) !important; }

a { color: var(--brand-primary); }
a:hover { color: var(--brand-primary-dark); }

.nav-pills .nav-link.active {
    background-color: var(--brand-primary);
}

/* Fixed columns functionality for tables */
.fixed-columns-table {
    position: relative;
}

.fixed-columns-table .fixed-column {
    position: sticky;
    background-color: inherit;
    z-index: 10;
    border-right: 2px solid #dee2e6 !important;
}

.fixed-columns-table thead .fixed-column {
    z-index: 11;
    background-color: #f8f9fa;
}

.fixed-columns-table tbody .fixed-column {
    background-color: #ffffff;
}

.fixed-columns-table .fixed-column-1 {
    left: 0;
}

.fixed-columns-table .fixed-column-2 {
    left: 220px; /* Width of first column */
}
