/* Shared vacancy styles. Colour values are provided by config.php via dashboard_theme.php. */
body.app-page { background:var(--page-bg) !important; color:var(--brand-text); font-family:var(--bs-font-sans-serif,Arial,sans-serif); }
.app-page .container { max-width:1180px; }
.app-page .app-brand-header { max-width:1180px; margin:0 auto 20px; padding:15px 22px; display:flex; align-items:center; gap:20px; background:var(--card-bg); border:1px solid var(--card-border); border-radius:14px; box-shadow:0 6px 24px rgba(0,0,0,.08); }
.app-page .app-brand-header img { width:110px; max-height:76px; object-fit:contain; }
.app-page .app-brand-name { font-weight:800; font-size:1.2rem; }
.app-page .card,.app-page .login-card,.app-page .box,.app-page .modal-content { background:var(--card-bg) !important; border:1px solid var(--card-border); border-radius:14px !important; box-shadow:0 6px 24px rgba(0,0,0,.08); }
.app-page .card-header { background:var(--brand-primary) !important; color:#fff !important; padding:14px 18px; border-bottom:3px solid var(--brand-secondary); border-radius:13px 13px 0 0 !important; }
.app-page .modal-header { background:var(--brand-primary); color:#fff; }
.app-page .table thead th { background:var(--brand-secondary) !important; color:#fff !important; border-color:var(--brand-secondary); }
.app-page h2,.app-page h3 { color:var(--brand-text); font-weight:750; }
.app-page .card-header h2,.app-page .card-header h3,.app-page .modal-header h2,.app-page .modal-header h3 { color:#fff; }
.app-page .text-muted { color:var(--brand-muted) !important; }
.app-page a:not(.btn):not(.badge):not(.shift-pill):not(.page-link) { color:var(--brand-primary); }
.app-page .btn { font-weight:650; border-radius:9px; }
.app-page .btn-primary { --bs-btn-bg:var(--brand-primary); --bs-btn-border-color:var(--brand-primary); --bs-btn-hover-bg:var(--brand-primary-hover); --bs-btn-hover-border-color:var(--brand-primary-hover); --bs-btn-active-bg:var(--brand-primary-hover); --bs-btn-active-border-color:var(--brand-primary-hover); --bs-btn-color:#fff; --bs-btn-hover-color:#fff; --bs-btn-active-color:#fff; }
.app-page .btn-secondary,.app-page .btn-dark { --bs-btn-bg:var(--brand-secondary); --bs-btn-border-color:var(--brand-secondary); --bs-btn-hover-bg:var(--brand-secondary-hover); --bs-btn-hover-border-color:var(--brand-secondary-hover); --bs-btn-active-bg:var(--brand-secondary-hover); --bs-btn-active-border-color:var(--brand-secondary-hover); --bs-btn-color:#fff; --bs-btn-hover-color:#fff; --bs-btn-active-color:#fff; }
.app-page .btn-info,.app-page .btn-success { --bs-btn-bg:var(--brand-teal); --bs-btn-border-color:var(--brand-teal); --bs-btn-hover-bg:var(--brand-teal-hover); --bs-btn-hover-border-color:var(--brand-teal-hover); --bs-btn-active-bg:var(--brand-teal-hover); --bs-btn-active-border-color:var(--brand-teal-hover); --bs-btn-color:#fff; --bs-btn-hover-color:#fff; --bs-btn-active-color:#fff; }
.app-page .btn-warning,.app-page .btn-light { --bs-btn-bg:var(--brand-neutral); --bs-btn-border-color:var(--card-border); --bs-btn-hover-bg:var(--brand-neutral-hover); --bs-btn-hover-border-color:var(--card-border); --bs-btn-active-bg:var(--brand-neutral-hover); --bs-btn-active-border-color:var(--card-border); --bs-btn-color:var(--brand-text); --bs-btn-hover-color:var(--brand-text); --bs-btn-active-color:var(--brand-text); }
.app-page .btn-danger { --bs-btn-color:#fff; --bs-btn-hover-color:#fff; }
.app-page .btn-outline-primary { --bs-btn-color:var(--brand-primary); --bs-btn-border-color:var(--brand-primary); --bs-btn-hover-bg:var(--brand-primary); --bs-btn-hover-border-color:var(--brand-primary); --bs-btn-active-bg:var(--brand-primary); --bs-btn-active-border-color:var(--brand-primary); }
.app-page .form-control:focus,.app-page .form-select:focus { border-color:var(--brand-primary); box-shadow:0 0 0 3px rgba(0,0,0,.1); }
.app-page .form-check-input:checked { background-color:var(--brand-primary); border-color:var(--brand-primary); }
.app-page .select2-container--default .select2-selection--single,.app-page .select2-container--default .select2-selection--multiple { border-color:var(--card-border); border-radius:7px; }
.app-page .select2-container--default .select2-selection--multiple .select2-selection__choice { background:var(--brand-neutral); border-color:var(--card-border); color:var(--brand-text); }
.app-page .page-link { color:var(--brand-primary); }
.app-page .page-item.active .page-link { background:var(--brand-primary); border-color:var(--brand-primary); color:#fff; }
.app-page .shift-pill:not(.shift-cancelled) { background:var(--brand-primary); color:#fff; }
.app-page .location-card { border-left-color:var(--brand-secondary); }
.app-page .availability-btn.active[data-value="day"] { background:var(--brand-primary); border-color:var(--brand-primary); }
.app-page .availability-btn.active[data-value="afternoon"] { background:var(--brand-teal); border-color:var(--brand-teal); }
.app-page .availability-btn.active[data-value="night"] { background:var(--brand-secondary); border-color:var(--brand-secondary); }
body.app-auth-page { min-height:100vh; height:auto; padding:24px 14px; display:flex; align-items:center; justify-content:center; }
.app-auth-page .login-card,.app-auth-page .auth-card { width:100%; max-width:440px; margin:auto; padding:30px; background:var(--card-bg); border:1px solid var(--card-border); border-radius:14px; box-shadow:0 6px 24px rgba(0,0,0,.08); }
.app-auth-page .auth-logo { display:block; max-width:240px; width:100%; max-height:120px; object-fit:contain; margin:0 auto 24px; }
.app-auth-page label { display:block; margin-bottom:12px; font-weight:600; }
.app-auth-page input:not([type="hidden"]) { display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--card-border); border-radius:8px; }
.app-auth-page button:not(.btn) { width:100%; padding:12px; border:0; border-radius:9px; color:#fff; background:var(--brand-primary); font-weight:700; }
@media(max-width:600px) {
    body.app-page:not(.app-auth-page) { padding:12px 8px 30px !important; }
    .app-page .app-brand-header { padding:13px 16px; gap:14px; }
    .app-page .app-brand-header img { width:85px; max-height:62px; }
    .app-page .app-brand-name { font-size:1.05rem; }
    .app-page .card-body.p-4 { padding:16px !important; }
    .app-auth-page .login-card,.app-auth-page .auth-card { padding:24px 20px; }
}
@media print {
    body.app-page { padding:0 !important; background:#fff !important; color:#000; }
    .app-brand-header { display:none !important; }
    .app-page .card { box-shadow:none !important; border-color:#ddd; }
}
.app-page .btn-primary,.app-page .btn-secondary,.app-page .btn-dark,.app-page .btn-info,.app-page .btn-success,.app-page .btn-warning,.app-page .btn-light { --bs-btn-disabled-bg:var(--bs-btn-bg); --bs-btn-disabled-border-color:var(--bs-btn-border-color); --bs-btn-disabled-color:var(--bs-btn-color); }
.app-page .btn-outline-success,.app-page .btn-outline-info { --bs-btn-color:var(--brand-teal); --bs-btn-border-color:var(--brand-teal); --bs-btn-hover-bg:var(--brand-teal); --bs-btn-hover-border-color:var(--brand-teal); --bs-btn-hover-color:#fff; --bs-btn-active-bg:var(--brand-teal); --bs-btn-active-border-color:var(--brand-teal); --bs-btn-active-color:#fff; }
.app-page .badge.bg-primary { background:var(--brand-primary) !important; color:#fff !important; }
.app-page .badge.bg-info { background:var(--brand-teal) !important; color:#fff !important; }
.app-page .app-brand-header .app-brand-name { color:var(--brand-text); }
.app-auth-page .box { width:100%; max-width:440px; }

/* Compact page header: logo, existing page title and navigation on one row. */
.app-page .compact-header-content { flex:1; min-width:0; }
.app-page .compact-header-content > .d-flex { margin:0 !important; align-items:center !important; gap:16px; }
.app-page .compact-header-content h2 { font-size:clamp(1.5rem,3vw,2rem); font-weight:800; margin-bottom:0; }
.app-page .compact-header-actions { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.app-page .compact-header-actions .btn { white-space:nowrap; }
@media(max-width:700px) {
    .app-page .compact-header { flex-wrap:wrap; }
    .app-page .compact-header-content { flex-basis:calc(100% - 105px); }
    .app-page .compact-header-content > .d-flex { flex-wrap:wrap; }
    .app-page .compact-header-actions { width:100%; flex-wrap:wrap; }
    .app-page .compact-header-actions .btn { flex:1; }
}

/* Keep active pagination numbers readable in every link state. */
.app-page .page-item.active .page-link,
.app-page .page-item.active .page-link:hover,
.app-page .page-item.active .page-link:focus { color:#fff !important; background:var(--brand-primary); border-color:var(--brand-primary); }

/* Delete/destructive button colours supplied by config.php. */
.app-page .btn-danger {
    --bs-btn-color:#fff;
    --bs-btn-bg:var(--brand-danger);
    --bs-btn-border-color:var(--brand-danger);
    --bs-btn-hover-color:#fff;
    --bs-btn-hover-bg:var(--brand-danger-hover);
    --bs-btn-hover-border-color:var(--brand-danger-hover);
    --bs-btn-active-color:#fff;
    --bs-btn-active-bg:var(--brand-danger-hover);
    --bs-btn-active-border-color:var(--brand-danger-hover);
    --bs-btn-disabled-color:#fff;
    --bs-btn-disabled-bg:var(--brand-danger);
    --bs-btn-disabled-border-color:var(--brand-danger);
}
.app-page .btn-outline-danger {
    --bs-btn-color:var(--brand-danger);
    --bs-btn-border-color:var(--brand-danger);
    --bs-btn-hover-color:#fff;
    --bs-btn-hover-bg:var(--brand-danger);
    --bs-btn-hover-border-color:var(--brand-danger);
    --bs-btn-active-color:#fff;
    --bs-btn-active-bg:var(--brand-danger-hover);
    --bs-btn-active-border-color:var(--brand-danger-hover);
    --bs-btn-disabled-color:var(--brand-danger);
    --bs-btn-disabled-border-color:var(--brand-danger);
}