:root {
    --oasis-primary: #28415f;
    --oasis-primary-dark: #1c2d43;
    --oasis-soft: #f5f7fb;
}
body { background: var(--oasis-soft); }
.bg-oasis { background: linear-gradient(90deg, var(--oasis-primary-dark), var(--oasis-primary)); }
.card { border: 0; box-shadow: 0 10px 30px rgba(25, 35, 55, .08); border-radius: 16px; }
.card-header { background: #fff; border-bottom: 1px solid rgba(0,0,0,.06); border-top-left-radius: 16px !important; border-top-right-radius: 16px !important; }
.btn-primary { background: var(--oasis-primary); border-color: var(--oasis-primary); }
.btn-primary:hover { background: var(--oasis-primary-dark); border-color: var(--oasis-primary-dark); }
.small-muted { color: #6c757d; font-size: .875rem; }
.required::after { content: ' *'; color: #dc3545; }
.document-chip { background: #f8f9fa; border: 1px solid #e9ecef; border-radius: 999px; padding: .35rem .55rem; font-size: .875rem; }
.login-panel { max-width: 460px; margin: 6vh auto; }

/* V13 employee schedule */
.employee-shift-card { background:#fff; border:1px solid #e5e7eb; border-left:5px solid var(--oasis-primary); border-radius:12px; padding:.75rem; box-shadow:0 6px 18px rgba(20,20,40,.04); }


/* V21 employee portal visual refresh */
:root {
    --oasis-primary: #28415f;
    --oasis-primary-dark: #1c2d43;
    --oasis-accent: #4b6f95;
    --oasis-soft: #f4f7fb;
    --oasis-border: #e4e9f2;
    --oasis-text: #1f2937;
}

body {
    color: var(--oasis-text);
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background:
        radial-gradient(circle at top left, rgba(75,111,149,.10), transparent 34rem),
        var(--oasis-soft);
}

main.container-fluid.container-xl {
    padding-top: 2rem;
    padding-bottom: 2.5rem;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 {
    color: #172033;
    letter-spacing: -.01em;
}

.employee-navbar {
    padding-top: .75rem;
    padding-bottom: .75rem;
}

.employee-navbar .navbar-brand {
    font-size: 1rem;
    letter-spacing: .01em;
}

.employee-navbar .nav-link,
.employee-navbar .dropdown-toggle {
    color: rgba(255,255,255,.9);
    border-radius: .75rem;
    padding: .55rem .85rem;
    font-weight: 600;
}

.employee-navbar .nav-link:hover,
.employee-navbar .dropdown-toggle:hover,
.employee-navbar .nav-link:focus,
.employee-navbar .dropdown-toggle:focus {
    color: #fff;
    background: rgba(255,255,255,.12);
}

.employee-navbar .nav-link.active,
.employee-navbar .dropdown-toggle.active {
    color: #fff;
    background: rgba(255,255,255,.18);
}

.employee-navbar .dropdown-menu {
    border-radius: .95rem;
    padding: .5rem;
    min-width: 220px;
}

.employee-navbar .dropdown-item {
    border-radius: .7rem;
    padding: .58rem .75rem;
    font-weight: 600;
}

.employee-navbar .dropdown-item:hover {
    background: #f4f7fb;
}

.employee-navbar .dropdown-item.active,
.employee-navbar .dropdown-item:active {
    background: #edf4fb;
    color: var(--oasis-primary);
}

.btn-user-menu {
    background: rgba(255,255,255,.14);
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: .85rem;
    padding: .5rem .85rem;
}

.btn-user-menu:hover,
.btn-user-menu:focus,
.btn-user-menu.show {
    background: rgba(255,255,255,.20);
    color: #fff !important;
    border-color: rgba(255,255,255,.24);
}

.btn-user-menu::after {
    border-top-color: #fff !important;
}

.user-menu-name {
    display: inline-block;
    max-width: 185px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
}

.card {
    border: 1px solid var(--oasis-border);
    border-radius: 1.15rem;
    box-shadow: 0 14px 36px rgba(25, 35, 55, .075);
    overflow: hidden;
}

.card-header,
.card-footer {
    background: linear-gradient(180deg, #fff, #fbfcfe);
    border-color: var(--oasis-border);
    padding: 1rem 1.25rem;
}

.card-body {
    padding: 1.25rem;
}

.btn {
    border-radius: .82rem;
    font-weight: 700;
    padding: .58rem .95rem;
}

.btn-sm {
    border-radius: .72rem;
}

.btn-primary {
    background: linear-gradient(135deg, var(--oasis-accent), var(--oasis-primary));
    border-color: var(--oasis-primary);
    box-shadow: 0 8px 18px rgba(40,65,95,.16);
}

.btn-primary:hover,
.btn-primary:focus {
    background: linear-gradient(135deg, #527aa5, var(--oasis-primary-dark));
    border-color: var(--oasis-primary-dark);
}

.btn-outline-primary {
    color: var(--oasis-primary);
    border-color: #cbd8e7;
    background: #fff;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background: #f0f5fb;
    color: var(--oasis-primary-dark);
    border-color: #b8cade;
}

.form-control,
.form-select {
    min-height: 44px;
    border-radius: .82rem;
    border-color: #d7dee9;
    box-shadow: none;
}

.form-control:focus,
.form-select:focus {
    border-color: #8da8c5;
    box-shadow: 0 0 0 .22rem rgba(40,65,95,.12);
}

.table > :not(caption) > * > * {
    padding: .95rem 1rem;
    border-bottom-color: #edf1f6;
}

.table thead th {
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: .74rem;
    font-weight: 800;
    color: #667085;
    background: #fafcff;
}

.table-hover tbody tr:hover {
    background: #fbfdff;
}

.badge {
    border-radius: 999px;
    padding: .45em .7em;
    font-weight: 800;
}

.alert {
    border: 0;
    border-radius: 1rem;
    box-shadow: 0 10px 24px rgba(25,35,55,.06);
}

.progress {
    border-radius: 999px;
    background: #e9eef6;
    overflow: hidden;
}

.progress-bar {
    background: linear-gradient(90deg, var(--oasis-accent), var(--oasis-primary));
}

.portal-quick-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
    gap: .85rem;
}

.portal-action-card {
    display: block;
    text-decoration: none;
    color: inherit;
    background: #fff;
    border: 1px solid var(--oasis-border);
    border-radius: 1rem;
    padding: 1rem;
    box-shadow: 0 10px 24px rgba(25,35,55,.055);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.portal-action-card:hover {
    transform: translateY(-2px);
    color: inherit;
    border-color: #cdd9e8;
    box-shadow: 0 16px 30px rgba(25,35,55,.09);
}

.portal-action-card .action-title {
    font-weight: 800;
    margin-bottom: .25rem;
}

.portal-action-card .action-subtitle {
    color: #6b7280;
    font-size: .86rem;
}

.employee-shift-card {
    border-radius: 1rem;
    padding: 1rem;
    border-color: var(--oasis-border);
    border-left-color: var(--oasis-primary);
    box-shadow: 0 10px 24px rgba(25,35,55,.06);
}

.document-chip {
    background: #fbfcfe;
    border-color: var(--oasis-border);
    border-radius: .9rem;
    padding: .55rem .65rem;
}

.login-panel .card,
.login-card {
    border-radius: 1.25rem;
}

@media (max-width: 991.98px) {
    .employee-navbar .navbar-collapse {
        margin-top: .85rem;
        background: rgba(8, 20, 36, .18);
        border: 1px solid rgba(255,255,255,.08);
        border-radius: 1rem;
        padding: .75rem;
        backdrop-filter: blur(10px);
    }
    .employee-navbar .dropdown-menu {
        background: rgba(255,255,255,.98);
        margin-top: .35rem;
    }
    .employee-user-menu {
        margin-top: .75rem;
    }
    .btn-user-menu {
        width: 100%;
        text-align: left;
    }
}

@media (max-width: 767.98px) {
    .card-body,
    .card-header,
    .card-footer {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .table > :not(caption) > * > * {
        padding: .8rem .75rem;
    }
}


/* V34 clickable employee dashboard cards */
.employee-dashboard-link {
    display: block;
    color: inherit;
    text-decoration: none;
    height: 100%;
}

.employee-dashboard-link:hover,
.employee-dashboard-link:focus {
    color: inherit;
    text-decoration: none;
}

.employee-dashboard-link .card {
    transition: transform .15s ease, box-shadow .15s ease;
}

.employee-dashboard-link:hover .card,
.employee-dashboard-link:focus .card {
    transform: translateY(-2px);
    box-shadow: 0 18px 40px rgba(25,35,55,.10);
}


/* V35 mobile-first Today dashboard */
.employee-today-wrap {
    display: block;
}

.employee-today-hero {
    background: linear-gradient(135deg, #3f1268 0%, #6d3c98 100%);
    color: #fff;
    border-radius: 24px;
    padding: 1.25rem;
    box-shadow: 0 18px 45px rgba(63, 18, 104, .20);
}

.employee-kicker {
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: .72rem;
    font-weight: 800;
    opacity: .78;
}

.employee-today-title {
    font-weight: 800;
}

.employee-today-subtitle {
    color: rgba(255,255,255,.82);
}

.employee-today-shift {
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 18px;
    padding: 1rem;
}

.employee-today-empty {
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 18px;
    padding: 1rem;
    color: rgba(255,255,255,.88);
}

.employee-task-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .75rem;
}

.employee-task-card {
    display: block;
    text-decoration: none;
    color: inherit;
    background: #fff;
    border: 1px solid rgba(25,35,55,.08);
    border-radius: 18px;
    padding: .9rem;
    box-shadow: 0 10px 28px rgba(25,35,55,.06);
    transition: transform .15s ease, box-shadow .15s ease;
}

.employee-task-card:hover,
.employee-task-card:focus {
    color: inherit;
    transform: translateY(-2px);
    box-shadow: 0 18px 38px rgba(25,35,55,.10);
}

.task-number {
    font-size: 1.7rem;
    line-height: 1;
    font-weight: 800;
    color: #3f1268;
}

.task-label {
    margin-top: .35rem;
    font-size: .82rem;
    color: #607086;
    font-weight: 700;
}

@media (max-width: 991.98px) {
    .employee-task-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .employee-today-hero {
        border-radius: 20px;
        padding: 1rem;
    }

    .employee-task-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .task-number {
        font-size: 1.45rem;
    }

    .task-label {
        font-size: .78rem;
    }
}


/* V36 employee notifications */
.employee-notification-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .75rem;
}

.employee-notification-item {
    border-left: 4px solid rgba(63, 18, 104, .18);
}

.employee-notification-item:hover {
    background: rgba(63, 18, 104, .025);
}

@media (max-width: 767.98px) {
    .employee-notification-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .employee-notification-item .btn {
        width: 100%;
    }
}


/* Dashboard shift card cleanup */
.employee-today-hero {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(255,255,255,.16), transparent 34%),
        linear-gradient(135deg, #4a1674 0%, #6d3c98 100%);
}

.employee-today-hero,
.employee-today-hero h1,
.employee-today-hero h2,
.employee-today-hero h3,
.employee-today-hero h4,
.employee-today-hero .h4 {
    color: #fff;
}

.employee-today-title {
    color: #fff !important;
    letter-spacing: -.03em;
}

.employee-today-hero > .d-flex {
    position: relative;
    z-index: 1;
}

.employee-today-hero .btn-light {
    border: 0;
    border-radius: .85rem;
    padding: .65rem 1rem;
    font-weight: 800;
    box-shadow: 0 10px 24px rgba(26, 12, 43, .18);
}

.employee-today-shift {
    position: relative;
    z-index: 1;
    background: #fff;
    color: #162033;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 1.1rem;
    padding: 1.1rem;
    box-shadow: 0 16px 38px rgba(26, 12, 43, .18);
}

.employee-today-shift .employee-kicker {
    color: #6d3c98;
    opacity: 1;
    font-size: .7rem;
}

.employee-today-shift .h4 {
    color: #162033 !important;
    font-weight: 850;
    letter-spacing: -.02em;
}

.employee-today-shift .mb-1 {
    color: #2f3a4c;
    font-weight: 700;
}

.employee-today-shift .small {
    color: #607086;
    opacity: 1 !important;
}

.employee-today-status-stack {
    display: flex;
    flex-direction: column;
    gap: .45rem;
    align-items: flex-end;
}

.employee-today-shift .badge {
    border-radius: 999px;
    padding: .45rem .7rem;
    font-size: .78rem;
    font-weight: 800;
    background: #f4f0f8 !important;
    color: #3f1268 !important;
    border: 1px solid #e5d8ef;
}

.employee-today-actions {
    border-top: 1px solid #edf0f5;
    padding-top: .85rem;
}

.employee-today-actions .btn {
    border-radius: .8rem;
    font-weight: 800;
    padding: .55rem .9rem;
}

.employee-today-actions .btn-outline-danger {
    background: #fff;
}

.employee-today-empty {
    background: #fff;
    color: #2f3a4c;
    border: 1px solid rgba(255,255,255,.35);
    box-shadow: 0 16px 38px rgba(26, 12, 43, .15);
}

@media (max-width: 767.98px) {
    .employee-today-hero .btn-light {
        width: 100%;
    }

    .employee-today-status-stack {
        align-items: flex-start;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .employee-today-shift {
        padding: 1rem;
    }

    .employee-today-actions .btn {
        flex: 1 1 100%;
    }
}