@import url('./base/variables.css');
@import url('./base/reset.css');
@import url('./base/typography.css');
@import url('./base/layout.css');

@import url('./components/cards.css');
@import url('./components/buttons.css');
@import url('./components/forms.css');
@import url('./components/alerts.css');
@import url('./components/badges.css');
@import url('./components/tables.css');

@import url('./modules/auth.css');
@import url('./modules/employees.css');
@import url('./modules/attendance.css');
@import url('./modules/attendance-month.css');
@import url('./modules/reports.css');
@import url('./modules/orders.css');
@import url('./modules/contracts.css');

html{
    overflow-y: scroll;
    scrollbar-gutter: stable;
}
.box-report-red{
    background:#fff1f2;
    border-color:#fecdd3;
}

.box-report-red .box-title{
    color:#991b1b;
}

.box-report-red:hover{
    background:#ffe4e6;
    border-color:#fda4af;
}


/* =========================================================
   Super Admin - globalny tryb "Podgląd jako użytkownik"
   ========================================================= */

.topbar-preview-form{
    display:flex;
    align-items:center;
    gap:6px;
    margin:0;
}

.topbar-preview-select{
    width:170px;
    min-height:30px;
    padding:0 28px 0 9px;
    border:1px solid rgba(249,115,22,.42);
    border-radius:7px;
    color:#e5e7eb;
    background:#111318;
    font:inherit;
    font-size:10px;
    outline:none;
}

.topbar-preview-select:focus{
    border-color:#f97316;
    box-shadow:0 0 0 2px rgba(249,115,22,.12);
}

.topbar-preview-button,
.auth-preview-stop-button{
    min-height:30px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 10px;
    border:1px solid #f97316;
    border-radius:7px;
    color:#f97316;
    background:transparent;
    font:inherit;
    font-size:10px;
    font-weight:700;
    cursor:pointer;
    white-space:nowrap;
    transition:.16s ease;
}

.topbar-preview-button:hover,
.topbar-preview-button:focus-visible,
.auth-preview-stop-button:hover,
.auth-preview-stop-button:focus-visible{
    color:#fff;
    background:#f97316;
    outline:none;
}

.auth-preview-banner{
    position:relative;
    z-index:90;
    border-bottom:1px solid rgba(249,115,22,.55);
    background:linear-gradient(90deg,#25140a 0%,#171a1f 44%,#25140a 100%);
    box-shadow:0 8px 20px rgba(17,24,39,.12);
}

.auth-preview-banner-inner{
    width:min(1320px,calc(100% - 32px));
    min-height:46px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}

.auth-preview-banner-copy{
    min-width:0;
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px 12px;
}

.auth-preview-banner-copy > strong{
    color:#f97316;
    font-size:10px;
    letter-spacing:.08em;
}

.auth-preview-banner-copy > span{
    color:#d1d5db;
    font-size:11px;
}

.auth-preview-banner-copy b{
    color:#fff;
    font-weight:700;
}

.auth-preview-stop-form{
    flex:0 0 auto;
    margin:0;
}

.auth-preview-mode .auth-preview-stop-button{
    background:#f97316;
    color:#fff;
}

.auth-preview-mode .auth-preview-stop-button:hover,
.auth-preview-mode .auth-preview-stop-button:focus-visible{
    background:#ea580c;
    border-color:#ea580c;
}

@media(max-width:980px){
    .topbar-preview-select{
        width:140px;
    }

    .auth-preview-banner-inner{
        width:min(100% - 24px,1320px);
    }
}

@media(max-width:760px){
    .topbar-preview-form{
        width:100%;
        order:20;
    }

    .topbar-preview-select{
        width:100%;
        flex:1 1 auto;
    }

    .auth-preview-banner-inner{
        padding:8px 0;
        align-items:flex-start;
        flex-direction:column;
        gap:8px;
    }
}
