/* Shared workspace design */
:root { --ink:#0b2545; --muted:#4a4e69; --accent:#134074; --line:#dce2eb; --surface:#fff; --wash:#fafafa; }
* { box-sizing:border-box; }
body { margin:0; background:var(--wash); color:var(--ink); font-family:Inter,"Segoe UI",sans-serif; font-size:14px; line-height:1.6; }
a { color:var(--accent); text-decoration:none; } a:hover { color:#0b2545; }
button,input,select { font:inherit; } button,.button,.btn-primary { border:1px solid var(--accent); background:var(--accent); color:white; border-radius:8px; padding:10px 17px; font-weight:600; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:16px; }
button:hover,.button:hover,.btn-primary:hover { background:#13315c; color:white; }
button[hidden] { display:none; }
:focus-visible { outline:3px solid #809bc2; outline-offset:3px; }
.button-secondary,.icon-button { background:white; color:var(--ink); border:1px solid var(--line); }
.button-danger { background:#fff4f2; border-color:#f0d7d1; color:#a33c30; margin-right:auto; }
.shell-width { width:min(1320px,calc(100% - 80px)); margin-inline:auto; }
.app-header { background:white; border-bottom:1px solid var(--line); }
.navbar { min-height:86px; padding:12px 0; }.brand { display:flex; align-items:center; font-size:25px; font-weight:750; letter-spacing:-1px; margin-right:54px; color:var(--ink); gap:9px; }.brand-dot { color:var(--accent); margin-left:-8px; }.brand-icon { display:inline-grid; place-items:center; width:34px; height:34px; background:var(--accent); color:white; border-radius:10px; font-size:27px; font-style:italic; }
.workspace-nav { gap:9px; }.navbar .nav-link { color:var(--muted)!important; padding:9px 13px!important; border-radius:7px; font-size:13px; }.navbar .nav-link.active { background:#edf2f8; color:var(--accent)!important; font-weight:650; }.navbar .navbar-nav:last-child { align-items:center; }.navbar .btn-link { background:none; border:0; }.navbar-toggler { padding:6px; background:white; border-color:var(--line); }
.workspace { padding-top:30px; min-height:calc(100vh - 165px); }.workspace-label { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:10px; font-weight:700; letter-spacing:1.7px; margin-bottom:27px; }.status-dot { display:inline-block; height:7px; width:7px; border-radius:50%; background:#4b9175; }.workspace-date { margin-left:auto; font-size:12px; font-weight:400; letter-spacing:0; }
h1,h2,h3 { color:var(--ink); letter-spacing:-.6px; font-weight:650; }h1 { font-size:42px; }h2 { font-size:25px; margin-bottom:20px; }h3 { font-size:18px; }p { color:var(--muted); }.eyebrow { color:var(--accent); font-weight:700; letter-spacing:1.7px; font-size:10px; margin-bottom:18px; }
.welcome-card { border:1px solid #dce2eb; border-radius:18px; background:#eef4ed; padding:48px; display:grid; grid-template-columns:1fr 1fr; gap:40px; overflow:hidden; }.welcome-copy h1 { font-size:clamp(32px,3.8vw,51px); line-height:1.12; letter-spacing:-2px; margin-bottom:22px; }.welcome-copy>p:not(.eyebrow) { font-size:15px; line-height:1.8; margin-bottom:25px; }.welcome-art { display:flex; align-items:center; justify-content:center; }.mini-calendar { width:100%; max-width:450px; background:#fff; border:1px solid #dce2eb; border-radius:13px; transform:rotate(-3deg); box-shadow:0 18px 40px #0b254510; overflow:hidden; }.mini-heading { display:flex; justify-content:space-between; padding:20px; font-weight:650; }.mini-days { display:grid; grid-template-columns:repeat(5,1fr); text-align:center; font-size:9px; color:var(--muted); padding:14px 0; border-block:1px solid var(--line); }.mini-grid { height:145px; display:grid; grid-template-columns:repeat(5,1fr); position:relative; }.mini-grid i { border-right:1px solid #f0f3ef; }.mini-shift { position:absolute; padding:8px 12px; font-size:10px; font-weight:600; border-radius:5px; }.mini-shift.one { top:16px; left:8px; width:55%; background:#e0eee4; color:#35694a; }.mini-shift.two { top:58px; left:41%; width:37%; background:#ece8f6; color:#67528a; }.mini-shift.three { top:99px; left:22%; width:55%; background:#faecd8; color:#8c6530; }.mini-footer { padding:13px 20px; border-top:1px solid var(--line); font-size:10px; color:var(--muted); }.mini-footer .status-dot { margin-right:7px; }
.section-heading { margin:34px 0 18px; }.section-heading h2 { font-size:21px; margin:0 0 4px; }.section-heading p { margin:0; font-size:13px; }.quick-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }.quick-card { background:white; padding:25px; border:1px solid var(--line); border-radius:12px; transition:transform .15s,border-color .15s; }.quick-card:hover { transform:translateY(-3px); border-color:#93a8c5; }.tile-icon { width:39px; height:39px; display:grid; place-items:center; background:#edf2f8; border-radius:10px; font-size:23px; margin-bottom:22px; color:var(--accent); }.lavender { background:#f0edf8; color:#766291; }.peach { background:#fbf0e2; color:#a27d43; }.quick-card h3 { display:flex; justify-content:space-between; font-size:17px; }.quick-card h3 span { color:#8c9c93; }.quick-card p { font-size:13px; max-width:270px; }.text-link { display:inline-block; font-size:12px; font-weight:650; margin-top:12px; }
.app-footer { display:flex; justify-content:space-between; padding:27px 0; color:#4a4e69; font-size:11px; }.app-footer a { color:inherit; }
.page-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; }.page-heading h1 { font-size:30px; margin:0 0 5px; }.page-heading p { margin:0; }.schedule-toolbar { background:white; border:1px solid var(--line); border-radius:12px 12px 0 0; padding:18px 22px; display:flex; align-items:center; justify-content:space-between; gap:18px; }.schedule-toolbar h2 { font-size:20px; margin:0; }.date-nav { display:flex; align-items:center; gap:12px; }.date-nav>a { padding:5px 10px; border:1px solid var(--line); border-radius:6px; color:var(--ink); }.view-tabs { display:flex; padding:4px; background:var(--wash); border-radius:8px; gap:3px; }.view-tabs a { color:var(--muted); padding:5px 13px; font-size:12px; border-radius:5px; }.view-tabs .active { background:white; box-shadow:0 1px 4px #0b254512; color:var(--accent); font-weight:650; }
.table-scroll { overflow-x:auto; border:1px solid var(--line); border-top:0; border-radius:0 0 12px 12px; background:white; }table { width:100%; background:white; border-collapse:collapse; margin:20px 0; border:1px solid var(--line); }th { text-align:left; color:var(--muted); font-size:11px; letter-spacing:.6px; background:#f4f6fa; padding:15px 20px; border-bottom:1px solid var(--line); }td { padding:17px 20px; border-bottom:1px solid var(--line); }table a { font-weight:600; }.calendar-table { table-layout:fixed; min-width:760px; border:0; margin:0; }.calendar-table th { text-align:center; padding:14px; }.calendar-table td { vertical-align:top; height:135px; padding:9px; border:1px solid var(--line); }.calendar-table td.outside { background:#f7f8fb; }.day-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }.day-number { display:inline-grid; place-items:center; width:27px; height:27px; font-size:12px; font-weight:600; }.today .day-number { border-radius:50%; background:var(--accent); color:white; }.add-day { border:0; background:transparent; color:#4a4e69; padding:0 6px; font-size:19px; }.shift-chip { display:block; width:100%; text-align:left; padding:7px 9px; margin-bottom:6px; background:#edf2f8; color:#13315c; border:0; border-left:3px solid var(--shift-color,#7f9e8d); border-radius:5px; font-size:11px; font-weight:600; }.shift-chip:hover { background:#e4ebf5; color:#0b2545; }.shift-chip small { display:block; color:#4a4e69; font-size:10px; font-weight:400; }.empty-state { padding:44px; text-align:center; background:white; border:1px dashed #c9d4e3; border-radius:12px; }.notice { padding:13px 18px; background:#fff5e6; border:1px solid #ead8ba; border-radius:8px; margin-bottom:18px; }.schedule-footnote { font-size:12px; margin-top:15px; }.daily-grid { background:white; padding:24px; border:1px solid var(--line); border-top:0; border-radius:0 0 12px 12px; min-height:240px; }.daily-grid .shift-chip { max-width:560px; padding:16px; font-size:14px; }
main>form:not(.form-inline) { background:white; border:1px solid var(--line); border-radius:12px; padding:25px; margin-bottom:24px; }label { display:block; font-size:13px; font-weight:600; margin:12px 0 7px; }input:not([type=checkbox]):not([type=hidden]):not([type=radio]),select,textarea { border:1px solid #c9d4e3; border-radius:7px; padding:10px 12px; background:white; color:var(--ink); max-width:100%; }main>form input:not([type=hidden]):not([type=checkbox]),main>form select { display:block; margin-bottom:16px; }input[type=checkbox] { accent-color:var(--accent); }.shift-dialog { border:1px solid var(--line); border-radius:16px; padding:28px; width:min(480px,calc(100% - 32px)); box-shadow:0 24px 80px #0b254526; color:var(--ink); }.shift-dialog::backdrop { background:#0b254565; backdrop-filter:blur(3px); }.dialog-heading { display:flex; justify-content:space-between; align-items:flex-start; }.dialog-heading .eyebrow { margin-bottom:8px; }.dialog-heading h2 { font-size:24px; }.icon-button { padding:0 10px; font-size:23px; }.shift-dialog input:not([type=hidden]),.shift-dialog select { width:100%; }.dialog-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; margin-top:28px; }.dialog-actions button { font-size:12px; padding:9px 12px; }
@media(max-width:991px) { .shell-width { width:calc(100% - 40px); }.navbar-collapse { padding-top:16px; }.workspace-nav { gap:3px; }.navbar .navbar-nav:last-child { align-items:flex-start; }.welcome-card { padding:30px; gap:24px; }.welcome-copy h1 { font-size:37px; }.quick-card { padding:20px; } }
@media(max-width:640px) { .shell-width { width:calc(100% - 28px); }.workspace { padding-top:20px; }.workspace-label { margin-bottom:20px; }.workspace-date { display:none; }.welcome-card { grid-template-columns:1fr; padding:27px; }.welcome-copy h1 { font-size:39px; }.welcome-art { padding:10px 0; }.quick-grid { grid-template-columns:1fr; gap:12px; }.quick-card { padding:22px; }.tile-icon { margin-bottom:16px; }.page-heading { align-items:flex-start; }.page-heading h1 { font-size:26px; }.page-heading>.button { font-size:12px; padding:10px; white-space:nowrap; }.schedule-toolbar { align-items:flex-start; flex-direction:column; padding:15px; }.schedule-toolbar h2 { font-size:18px; }.view-tabs { align-self:stretch; justify-content:space-between; }th,td { padding:12px; }main { overflow-wrap:anywhere; }.app-footer { gap:16px; }.dialog-actions { gap:6px; } }
@media(prefers-reduced-motion:reduce) { * { transition:none!important; } }

/* Keep empty-field hints centered; hide them once a value is present.
   Opacity preserves the associated label for assistive technologies. */
.form-floating > label {
    margin: 0;
    padding: 1rem .75rem;
    transform: none !important;
    pointer-events: none;
}
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-control-plaintext ~ label {
    opacity: 0;
}
.form-floating > .form-control:-webkit-autofill ~ label {
    opacity: 0;
}
.form-floating > .form-control,
.form-floating > .form-control:focus,
.form-floating > .form-control:not(:placeholder-shown) {
    padding: 1rem .75rem;
}

.schedule-with-hours { display:grid; grid-template-columns:minmax(0,1fr) 270px; gap:20px; align-items:start; }
.schedule-main { min-width:0; }
.hours-sidebar { background:white; border:1px solid var(--line); border-radius:12px; padding:22px; }
.hours-sidebar h2 { font-size:20px; margin-bottom:5px; }
.hours-sidebar .eyebrow { margin-bottom:10px; }
.hours-note,.hours-sidebar small { font-size:11px; color:var(--muted); }
.employee-hours { border-top:1px solid var(--line); padding-top:16px; margin-top:16px; }
.employee-hours h3 { font-size:14px; }
.employee-hours dl { margin:0; }
.employee-hours dl>div { display:flex; justify-content:space-between; gap:12px; margin:7px 0; font-size:12px; }
.employee-hours dt { font-weight:400; color:var(--muted); }
.employee-hours dd { margin:0; font-weight:650; }
.hours-pending { color:var(--muted); font-weight:400; }
.hours-entry-table { margin:0; border:0; }
.hours-entry-table input { width:100px; }
.hours-entry-table small,.hours-submit small { display:block; font-weight:400; color:var(--muted); }
.hours-submit { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:20px; }
.hours-submit p { margin:0; }
.hours-entry-form .table-scroll { border-top:1px solid var(--line); border-radius:8px; }
main>form.week-picker { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
main>form.week-picker input,main>form.week-picker label { margin:0; }
@media(max-width:1100px) { .schedule-with-hours { grid-template-columns:minmax(0,1fr); }.hours-sidebar { width:100%; } }
@media(max-width:640px) { .hours-submit { align-items:stretch; flex-direction:column; }.hours-entry-table input { width:72px; }.date-nav { flex-wrap:wrap; } }

.employee-filter { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
main>form.employee-filter label,main>form.employee-filter select { margin:0; }
.hours-entry-table input[type=time] { width:140px; }
.hours-entry-table td small { display:block; min-width:140px; color:var(--muted); }
.hours-entry-table { min-width:650px; }

.schedule-downloads { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:16px 0; }
.schedule-downloads>span { font-size:12px; color:var(--muted); margin-right:4px; }

.leave-card { background:white; border:1px solid var(--line); border-radius:12px; padding:24px; margin:20px 0; }
.leave-card textarea { width:100%; }
.dropdown-menu { border-color:var(--line); padding:8px; border-radius:10px; }.dropdown-item { border-radius:6px; padding:9px 14px; font-size:13px; }

.copy-week-form { display:flex; flex-wrap:wrap; align-items:center; gap:16px; }.copy-week-form span { color:var(--muted); font-size:12px; max-width:650px; }.availability-copy label { margin-top:12px; }.availability-copy input,.availability-copy select { display:block; }.leave-card details { margin-top:18px; }

/* Compact schedule controls; messages follow the schedule instead of pushing it down. */
.schedule-actions-row {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px 20px;
    width:fit-content;
    max-width:100%;
    margin:0 0 16px;
    padding:8px 12px;
    background:white;
    border:1px solid var(--line);
    border-radius:9px;
}
.schedule-actions-row .employee-filter,
.schedule-actions-row .schedule-downloads {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    margin:0;
    padding:0;
    border:0;
    background:transparent;
}
.schedule-actions-row label { margin:0; font-size:12px; }
.schedule-actions-row select { margin:0; padding:6px 10px; max-width:240px; font-size:12px; }
.schedule-actions-row button,
.schedule-actions-row .button { padding:6px 11px; font-size:12px; }
.schedule-actions-row .schedule-downloads>span { margin:0; font-size:11px; }
.schedule-bottom-actions { display:flex; justify-content:flex-end; margin-top:14px; }
.schedule-bottom-actions .copy-week-form {
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:6px;
    margin:0;
    padding:0;
    border:0;
    background:transparent;
    text-align:right;
    max-width:550px;
}
.schedule-bottom-actions .copy-week-form button { padding:8px 13px; font-size:12px; }
.schedule-bottom-actions .copy-week-form span { font-size:11px; }
.schedule-notifications { margin-top:18px; }
.schedule-notifications:has(> :only-child:empty) { display:none; }
.schedule-notifications .notice:last-child { margin-bottom:0; }
.schedule-notifications details ul { margin:10px 0 0; }
@media(max-width:640px) {
    .schedule-actions-row { gap:10px; padding:8px; }
    .schedule-actions-row select { max-width:185px; }
    .schedule-bottom-actions .copy-week-form { max-width:100%; }
}

.shift-group { margin:0 0 10px; border-left:3px solid var(--shift-color,#7f9e8d); border-radius:6px; overflow:hidden; break-inside:avoid; }
.shift-group-heading { padding:7px 9px; background:color-mix(in srgb,var(--shift-color,#7f9e8d) 22%,white); color:var(--ink); font-size:11px; }
.shift-group-heading strong,.shift-group-heading span,.shift-group-heading small { display:block; }
.shift-group-heading small { font-size:10px; color:var(--muted); }
.shift-group-employees { background:#fafafa; margin-top:2px; padding:4px 0; }
.shift-employee { display:block; width:100%; padding:4px 9px; text-align:left; border:0; border-radius:0; background:transparent; color:var(--ink); font-size:11px; font-weight:400; }
button.shift-employee:hover { color:var(--accent); background:#e4ebf5; }
.daily-grid .shift-group { max-width:560px; }.daily-grid .shift-group-heading,.daily-grid .shift-employee { font-size:14px; }
@media print {
    @page { size:A4 landscape; margin:10mm; }
    .app-header,.app-footer,.workspace-label,.schedule-actions-row,.schedule-bottom-actions,.schedule-notifications,.page-heading>button,.add-day,.date-nav>a,.view-tabs,dialog,.daily-grid>button { display:none!important; }
    body { background:white; }.shell-width { width:100%; }.workspace { padding:0; min-height:0; }
    .schedule-with-hours { display:block; }.table-scroll { overflow:visible; }.calendar-table { min-width:0; }
    .hours-sidebar { margin-top:15px; }.shift-group,.shift-group-heading,.shift-group-employees { print-color-adjust:exact; -webkit-print-color-adjust:exact; }
}

.employee-panel { background: white; border: 1px solid #dce2eb; border-radius: 16px; padding: 24px; margin-bottom: 24px; }
.employee-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px 24px; margin-bottom: 20px; }
.employee-fields input:not([type=checkbox]) { width: 100%; }
.employee-photo { width: 112px; height: 112px; object-fit: cover; border-radius: 50%; margin: 12px 0 20px; }
.employee-panel h2 { margin-top: 20px; }
.employee-permissions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
@media(max-width: 640px) { .employee-fields { grid-template-columns: 1fr; } }


/* Permanent left navigation, with its own header, search and scroll area. */
.module-sidebar { position:fixed; left:0; top:96px; bottom:0; width:56px; background:white; border-right:1px solid #dce2eb; z-index:20; display:flex; flex-direction:column; }
.sidebar-open .module-sidebar { width:260px; }
.sidebar-heading { display:flex; align-items:center; gap:12px; min-height:66px; padding:12px; border-bottom:1px solid #dce2eb; }
.sidebar-caption { display:none; min-width:0; flex:1; }
.sidebar-open .sidebar-caption { display:block; }
.sidebar-caption small { display:block; font-size:10px; color:var(--muted); letter-spacing:1px; }
.sidebar-caption strong { display:block; font-size:17px; overflow-wrap:anywhere; }
#sidebar-toggle { flex:none; width:30px; height:34px; padding:0; border:1px solid #dce2eb; background:white; color:#13315c; border-radius:6px; font-size:22px; }
#sidebar-menu { padding:12px; overflow-y:auto; flex:1; min-height:0; }
#sidebar-search { width:100%; min-width:0; padding:8px 10px; font-size:13px; margin-bottom:12px; border-radius:5px; }
.module-sidebar a { display:block; padding:10px 12px; border-radius:5px; color:#13315c; text-decoration:none; }
.module-sidebar a:hover { background:#f0f3f9; }
.module-sidebar a.current { background:#edf2f8; box-shadow:inset 3px 0 #134074; font-weight:700; }
.module-sidebar details { margin-top:12px; border-top:1px solid #dce2eb; padding-top:10px; }
.module-sidebar summary { font-weight:700; padding:8px 0; cursor:pointer; }
.module-sidebar details a { margin-left:8px; font-size:13px; }
.module-sidebar [hidden] { display:none!important; }
.has-module-sidebar .workspace,.has-module-sidebar .app-footer { width:calc(100% - 96px); max-width:none; margin-left:76px; margin-right:20px; }
.sidebar-open .workspace,.sidebar-open .app-footer { width:calc(100% - 300px); margin-left:280px; }
.platform-stats { display:flex; gap:18px; flex-wrap:wrap; }
.workspace-page-heading { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:16px; }
.workspace-page-heading h1 { margin:0; font-size:30px; }
.context-help { font-size:13px; white-space:nowrap; }
.help-topics { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:24px; }
.help-topic { scroll-margin-top:100px; }
@media(max-width:800px) { .sidebar-open .module-sidebar { width:min(260px,calc(100vw - 56px)); box-shadow:4px 0 18px #0b254520; } .sidebar-open .workspace,.sidebar-open .app-footer { width:calc(100% - 96px); margin-left:76px; } .workspace-page-heading { align-items:flex-start; flex-wrap:wrap; } }
@media print { .module-sidebar,.context-help { display:none!important; } .has-module-sidebar .workspace { width:100%; margin:0; } }

/* Compact, shared page chrome. */
.app-header .navbar { min-height:48px; padding:4px 0; }
.app-header .shell-width { width:calc(100% - 32px); }
.app-header .brand { font-size:23px; margin-right:20px; padding:0; }
.app-header .brand-icon { width:28px; height:28px; font-size:23px; border-radius:8px; }
.header-account { display:flex; align-items:center; gap:16px; flex-wrap:wrap; justify-content:flex-end; }
.header-account .navbar-nav { flex-direction:row; margin:0; flex-wrap:wrap; }
.header-account .nav-link { padding:5px 8px!important; }
.module-sidebar { top:var(--header-height, 49px); }
.sidebar-heading { align-items:flex-start; }
#sidebar-page-description { font-size:12px; line-height:1.5; margin:6px 0 0; }
#sidebar-page-description:empty { display:none; }
.has-module-sidebar .workspace { padding-top:16px; }
.has-module-sidebar .workspace-page-heading { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(max-width:600px) { .header-account { gap:4px; } .header-account .context-help { font-size:11px; } .app-header .brand { margin-right:8px; } }
@media print { .has-module-sidebar .workspace-page-heading { position:static; width:auto; height:auto; margin:0 0 16px; overflow:visible; clip-path:none; white-space:normal; } }

/* Reserve the final content width and hide relocated introductions before first paint. */
html { scrollbar-gutter:stable; }
.chrome-js #main-content h1 { display:none; }
.chrome-js .has-module-sidebar #main-content .page-heading p,
.chrome-js .has-module-sidebar #main-content h1 + p { display:none; }
.chrome-js .has-module-sidebar #main-content .page-heading { display:contents; }
.hours-clock { display:flex; align-items:center; gap:5px; }
.hours-clock select { padding:10px 7px; min-width:0; width:auto; }
.hours-clock .clock-hour { width:72px; }
.hours-clock .clock-minute { width:68px; }
.hours-clock .clock-period { width:94px; }
@media screen and (max-width:640px) {
    .hours-entry-table { min-width:0; width:100%; display:block; }
    .hours-entry-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
    .hours-entry-table tbody { display:block; }
    .hours-entry-table tr { display:block; padding:12px; border-bottom:1px solid var(--line); }
    .hours-entry-table th[scope=row] { display:block; padding:8px 0; border:0; }
    .hours-entry-table td { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:8px 0; border:0; }
    .hours-entry-table td::before { content:attr(data-label); width:100%; font-weight:600; }
    .hours-entry-table .hours-clock { width:100%; }
    .hours-entry-table .hours-clock select { flex:1; width:auto; min-height:44px; font-size:16px; }
    .hours-entry-form .table-scroll { overflow:visible; }
}
/* Screen-only mobile presentation. Desktop tables and print layout are retained. */
.mobile-only { display:none; }
.record-actions summary { cursor:pointer; }
@media screen and (min-width:801px) { .record-actions summary { display:none; } .record-actions { display:inline; } }
@media screen and (max-width:800px) {
    .mobile-only { display:block; }
    .app-header .navbar { min-height:54px; padding:4px 0; }
    .app-header .shell-width { width:calc(100% - 24px); flex-wrap:nowrap; gap:8px; }
    .app-header .header-account { display:none; }
    .app-header .brand { margin:0 auto 0 0; font-size:23px; }
    #mobile-menu-toggle,.mobile-account summary { width:44px; height:44px; display:flex; align-items:center; justify-content:center; padding:0; border:0; background:transparent; color:var(--accent); border-radius:8px; }
    #mobile-menu-toggle { font-size:25px; }
    .mobile-account { margin-left:auto; position:relative; }
    .mobile-account summary { cursor:pointer; list-style:none; }
    .mobile-account summary::-webkit-details-marker { display:none; }
    .mobile-account-panel { position:absolute; right:0; top:48px; width:min(300px,calc(100vw - 24px)); padding:12px; border:1px solid var(--line); border-radius:12px; background:white; box-shadow:0 8px 28px #0b254526; z-index:60; }
    .mobile-account-panel .navbar-nav { display:block; }
    .mobile-account-panel a,.mobile-account-panel button { display:block; padding:12px!important; text-align:left; overflow-wrap:anywhere; white-space:normal; }
    .has-module-sidebar .workspace,.has-module-sidebar .app-footer,.sidebar-open .workspace,.sidebar-open .app-footer { width:calc(100% - 28px); margin-left:14px; margin-right:14px; }
    .has-module-sidebar .workspace-page-heading { position:static; width:auto; height:auto; clip-path:none; overflow:visible; white-space:normal; margin:0 0 16px; }
    .workspace-page-heading h1 { font-size:24px; }
    .module-sidebar { display:none; }
    .sidebar-open .module-sidebar { display:flex; width:min(320px,calc(100vw - 48px)); top:var(--header-height,54px); z-index:51; box-shadow:4px 0 24px #0b254530; }
    .sidebar-open .sidebar-caption { display:block; }
    #sidebar-toggle { width:44px; height:44px; }
    #mobile-nav-backdrop { position:fixed; inset:var(--header-height,54px) 0 0; width:100%; border:0; border-radius:0; padding:0; background:#0b254566; z-index:50; }
    #mobile-nav-backdrop[hidden] { display:none; }
    body.mobile-nav-open { overflow:hidden; }
    .table-scroll { max-width:100%; overflow-x:auto; }
    .table-scroll table:not(.hours-entry-table) { min-width:650px; }
    .table-scroll:has(> .mobile-records) { overflow:visible; border:0; background:transparent; border-radius:0; }
    table.mobile-records { display:block; width:100%; min-width:0!important; border:0; background:transparent; margin:16px 0; }
    .mobile-records thead,.mobile-records .record-headings { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
    .mobile-records tbody { display:block; }
    .mobile-records tr:not(.record-headings) { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; padding:18px; margin-bottom:14px; border:1px solid var(--line); border-radius:14px; background:white; }
    .mobile-records td { display:flex; flex-direction:column; gap:4px; min-width:0; width:auto; padding:0; border:0; white-space:normal; word-break:normal; overflow-wrap:anywhere; font-size:15px; }
    .mobile-records td::before { content:attr(data-label); font-size:12px; font-weight:600; color:var(--muted); }
    .mobile-records td:first-child { font-size:18px; font-weight:700; }
    .mobile-records td a,.mobile-records td button { max-width:100%; white-space:normal; }
    .mobile-records td:empty { display:none; }
    .company-records tr:not(.record-headings) { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .company-records td:nth-child(-n+3),.company-records td:last-child { grid-column:1/-1; }
    .record-actions { margin:8px 0; }
    .record-actions summary { padding:10px 0; min-height:44px; font-weight:600; }
    .record-actions a { display:block; padding:12px; border:1px solid var(--line); border-radius:8px; }
    .employee-panel,.leave-card { padding:16px; max-width:100%; }
    .leave-card .page-heading { flex-wrap:wrap; gap:8px; }
    .leave-card textarea { width:100%; }
    main>form.employee-permissions,.employee-permissions { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; padding:16px; }
    .employee-permissions label { margin:0; }
    .employee-permissions input,.employee-permissions select,.employee-permissions button { width:100%; margin:0!important; }
    .schedule-actions-row { display:flex; flex-direction:column; align-items:stretch; }
    .schedule-actions-row form { display:flex; flex-wrap:wrap; gap:8px; }
    .schedule-actions-row select { max-width:100%; flex:1; }
    .schedule-with-hours { display:block; }
    .hours-sidebar { margin-top:16px; }
    .schedule-toolbar { flex-direction:column; align-items:stretch; gap:12px; padding:14px; }
    .date-nav { flex-wrap:wrap; gap:8px; }
    .view-tabs { display:flex; justify-content:space-between; width:100%; }
    .calendar-table { min-width:980px!important; }
    .calendar-table th,.calendar-table td { overflow-wrap:normal; }
    .calendar-table .shift-group-heading,.calendar-table .shift-employee { font-size:13px; }
    .daily-grid { padding:16px; }
    input,select,textarea { font-size:16px; }
    .dialog-actions { flex-wrap:wrap; }
    .dialog-actions button { min-height:44px; }
}
@media print { .mobile-only { display:none!important; } .record-actions summary { display:none; } }

@media screen and (max-width:800px) {
 .employee-records td { order:2; }
 .employee-records td:first-child { order:0; }
 .employee-records td:nth-child(6) { order:1; }
}
.clock-range-entry { margin:16px 0; max-width:520px; }
.clock-range-entry fieldset { border:0; padding:0; margin:0 0 12px; min-width:0; }
.clock-range-entry legend { font-size:14px; font-weight:600; margin:0 0 6px; }
.clock-range-entry .hours-clock select { display:inline-block; margin:0; min-height:44px; }
.clock-range-preview { color:var(--muted); font-size:14px; }
@media screen and (max-width:800px) {
 .clock-range-entry .hours-clock { width:100%; }
 .clock-range-entry .hours-clock select { flex:1; min-width:0; }
}

.capacity-form { display: grid; gap: .75rem; max-width: 38rem; margin-block: 1rem 1.5rem; }
.capacity-form label { display: block; }
.capacity-form label > select, .capacity-form label > input:not([type=checkbox]) { display: block; width: 100%; margin-top: .35rem; }
.capacity-form input[type=checkbox] { width: auto; margin-right: .5rem; }
.capacity-form button { justify-self: start; }
.duty-link { display: block; font-size: .75rem; padding: .1rem .5rem .45rem; }
@media print { .duty-link { display:none; } }

.duty-summary { display: block; font-size: .75rem; padding: .15rem .5rem; overflow-wrap: anywhere; }

.request-card { border-top: 1px solid var(--line, #d9e3df); padding: 1.25rem 0; }
.request-card h3 { font-size: 1.05rem; }
.request-card button { margin: .25rem; }

.profile-assigned-duties { grid-column: 1 / -1; min-width: 0; }
.profile-assigned-duties summary { cursor: pointer; padding: .5rem 0; }
.weekly-staffing-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .75rem; }
.weekly-staffing-grid input { width: 100%; min-width: 0; }
.location-choice { display: block; margin-block: .5rem; }
@media (max-width: 767px) { .weekly-staffing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.cross-location-choice { display: flex; align-items: center; gap: .5rem; }
.cross-location-choice input[type="checkbox"] { width: auto; flex: 0 0 auto; }

.coverage-group { margin-block: .65rem; }
.coverage-group > summary { cursor: pointer; font-weight: 600; padding-block: .4rem; }
.suggestion-card { background: var(--surface, #fff); border: 1px solid #dce2eb; border-radius: .75rem; padding: 1rem; margin-block: .75rem; }
.suggestion-card h3 { font-size: 1.05rem; }
.suggestion-card form { display: flex; align-items: end; flex-wrap: wrap; gap: .75rem; }
.suggestion-card label { flex: 1 1 18rem; min-width: 0; }
.suggestion-card select { width: 100%; }
@media print { .coverage-review { display: none; } }

.approval-tabs { display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1.25rem; }
.approval-tabs a { padding:.65rem .9rem; border:1px solid #dce2eb; border-radius:.6rem; background:white; }
.approval-tabs a[aria-current="page"] { background:#edf2f8; border-color:#134074; font-weight:700; }

.language-picker { display:flex; align-items:center; gap:.35rem; margin:0; flex:0 0 auto; }
.language-picker label { margin:0; }
.language-picker select { width:auto; min-width:6.5rem; padding:.35rem .5rem; margin:0; }
.language-picker button { padding:.35rem .6rem; font-size:.8rem; }
@media (max-width:767px) { .language-picker { flex-wrap:wrap; padding:.25rem 0; } }
@media print { .language-picker { display:none; } }

/* Shared navy workspace: consistent surfaces, controls and page actions. */
:root { --accent-soft:#edf2f8; --radius:12px; --bs-primary:#134074; --bs-primary-rgb:19,64,116; --bs-body-color:var(--ink); --bs-link-color:var(--accent); --bs-link-hover-color:#0b2545; }
body { -webkit-font-smoothing:antialiased; }
h1,h2,h3 { letter-spacing:-.35px; }
a:not(.button):not(.nav-link):hover { text-decoration:underline; text-underline-offset:3px; }
button,.button,.btn { gap:8px; line-height:1.45; }
.button-secondary:hover,.icon-button:hover { background:var(--accent-soft); color:var(--accent); border-color:#93a8c5; }
.button-danger:hover,.btn-danger:hover { background:#a33c30; border-color:#a33c30; color:white; }
.btn-primary,.btn-primary:focus,.btn-primary:active { background:var(--accent); border-color:var(--accent); }
.nav-pills .nav-link.active { background:var(--accent); }
.nav-pills .nav-link { color:var(--accent); border-radius:8px; }
.text-muted { color:var(--muted)!important; }
.app-header { box-shadow:0 1px 4px #0b254506; }
.module-sidebar { background:#fff; }
.module-sidebar a:hover { text-decoration:none; }
.sidebar-heading { padding:18px 12px; }
.sidebar-caption strong { color:var(--ink); }
.sidebar-links summary { font-size:12px; letter-spacing:.3px; }
.module-sidebar a.current { color:var(--accent); }
.employee-panel,.leave-card,.hours-sidebar,.quick-card,main>form:not(.form-inline) { border-color:var(--line); border-radius:var(--radius); }
.employee-panel>h2:first-child { margin-top:0; }
.employee-panel h2 { font-size:21px; }
.employee-panel>p,.help-topic p { max-width:85ch; }
.chrome-js .has-module-sidebar #main-content .page-heading { display:flex; }
.page-heading>.button { flex-shrink:0; }
.section-toolbar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; margin-bottom:20px; }
.section-toolbar p { flex:1 1 32rem; margin:0; max-width:85ch; }
.section-toolbar .button { flex-shrink:0; }
main>form.settings-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:14px 20px; }
.settings-toolbar label { margin:0; display:flex; align-items:center; gap:10px; }
.location-shifts { padding:20px; }
.location-shifts h2 { font-size:18px; margin:0 0 16px; }
.location-shifts .table-scroll { border:1px solid var(--line); border-radius:8px; }
.location-shifts table { margin:0; border:0; }
#main-content>.table-scroll { border:1px solid var(--line); border-radius:var(--radius); margin-bottom:20px; }
#main-content>.table-scroll>table { margin:0; border:0; }
.location-shifts td { vertical-align:middle; }
.location-shifts td:last-child { min-width:145px; }
.location-shifts td:last-child a { display:inline-block; margin-top:8px; font-size:12px; }
.shift-color-swatch { display:inline-block; width:30px; height:24px; border:1px solid #0b254533; border-radius:6px; vertical-align:middle; }
table:not(.calendar-table) th { color:var(--ink); font-weight:600; letter-spacing:.2px; font-size:12px; }
table:not(.calendar-table) td { vertical-align:middle; }
table:not(.calendar-table) td form { margin:4px 0; }
table:not(.calendar-table) td button { padding:7px 10px; font-size:12px; }
table:not(.calendar-table) tbody tr:hover { background:#f8faff; }
.workspace-form { max-width:760px; }
.workspace-form>input:not([type=hidden]):not([type=checkbox]):not([type=color]),.workspace-form>select,.workspace-form>textarea { display:block; width:100%; }
.workspace-form>label:first-of-type { margin-top:0; }
.workspace-form fieldset:not(.clock-range-entry fieldset) { padding:16px; border:1px solid var(--line); border-radius:8px; margin:20px 0; }
fieldset legend { float:none; width:auto; font-size:14px; font-weight:650; padding:0 4px; margin:0; }
.workspace-form input[type=color] { display:block; width:76px; height:44px; padding:4px; cursor:pointer; }
.location-choice { display:flex; align-items:center; gap:8px; }
.workspace-form .dialog-actions { border-top:1px solid var(--line); padding-top:18px; align-items:center; }
.workspace-form .dialog-actions>a { margin-right:auto; font-weight:600; }
.capacity-form { max-width:760px; }
.form-control:focus,input:focus,select:focus,textarea:focus { border-color:#809bc2; box-shadow:0 0 0 3px #13407418; }
input[readonly],textarea[readonly] { background:#f4f6fa!important; }
input[type=checkbox],input[type=radio] { min-width:16px; min-height:16px; vertical-align:middle; }
.form-check-input:checked { background-color:var(--accent); border-color:var(--accent); }
.help-topics a { background:white; border:1px solid var(--line); border-radius:8px; padding:8px 12px; }
.coverage-review { background:#f2f5fa; border-color:var(--line); }
.coverage-group>summary { color:var(--ink); }
.shift-dialog { border-radius:var(--radius); }
/* Account forms use the same card treatment as management forms. */
#main-content .row>div>section:has(>form),#main-content .row>div>form { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:24px; }
#main-content .row>div>section>form { margin:0; }
#main-content .row>div>section>form h2 { font-size:22px; }
@media screen and (max-width:800px) {
 .section-toolbar { align-items:stretch; gap:12px; }
 .section-toolbar .button { align-self:flex-start; }
 .location-shifts { padding:16px; }
 .location-shifts .table-scroll:has(.mobile-records) { border:0; }
 .location-shifts table.mobile-records { margin:0; }
 .location-shifts .mobile-records tr { background:#f8faff; }
 main>form.workspace-form { padding:18px; }
 .workspace-form .dialog-actions { gap:14px; }
 .page-heading { flex-wrap:wrap; }
 #main-content .row>div>section:has(>form),#main-content .row>div>form { padding:18px; }
}

/* Public content and workspace registration share the application palette. */
.chrome-js .public-page #main-content h1, .chrome-js .public-page #main-content h1 + p { display:block; }
.public-welcome { grid-template-columns:1fr; }
.registration-card { max-width: 850px; margin: 24px auto; padding: clamp(20px,4vw,40px); background: var(--surface); border: 1px solid var(--line); border-radius: 18px; }
.registration-card h1 { font-size: clamp(1.7rem,4vw,2.4rem); }
.registration-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin:26px 0; }
.registration-grid > div { min-width:0; }
.registration-grid label { display:block; margin-bottom:8px; font-weight:600; }
.registration-grid input, .registration-grid select { width:100%; min-width:0; }
.registration-grid small { display:block; margin-top:7px; color:var(--muted); }
.registration-wide { grid-column:1 / -1; }
.password-entry { display:flex; gap:6px; align-items:stretch; }
.password-entry input { flex:1; width:0; }
.password-entry button { padding:8px 12px; }
.registration-consent { display:flex; align-items:flex-start; gap:12px; margin:20px 0 8px; }
.registration-consent input { width:20px; height:20px; flex:0 0 20px; margin-top:3px; }
.registration-submit { width:100%; margin-top:20px; }
.registration-signin { text-align:center; margin-top:20px; }
.public-features { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin:24px 0; }
.public-features .employee-panel { margin:0; }
.public-features h2 { font-size:1.4rem; }
.public-welcome .welcome-copy { max-width:900px; }
.legal-page { max-width:960px; margin:auto; }
.legal-page h2 { margin-top:28px; font-size:1.4rem; }
.app-footer { flex-wrap:wrap; gap:16px; }
@media(max-width:600px) { .registration-grid,.public-features { grid-template-columns:1fr; } .registration-card { margin:8px 0; } .registration-grid { gap:18px; } .brand { font-size:1.3rem; } }
/* HR and inventory reuse the workspace palette and readable mobile forms. */
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:16px; margin-block:20px; }
.stats-grid>*, .stat-card { border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); padding:20px; }
.stats-grid strong { display:block; font-size:1.75rem; color:var(--ink); }
.list-toolbar,.pagination-bar { display:flex; align-items:end; flex-wrap:wrap; gap:16px; margin-block:20px; }
.pagination-bar { justify-content:center; align-items:center; }
.status-badge { display:inline-block; padding:4px 10px; border-radius:20px; background:var(--wash,#eef2f8); font-size:.875rem; }
.empty-state { text-align:center; padding:32px; border:1px dashed var(--line); border-radius:var(--radius); }
.record-actions { position:relative; min-width:110px; }
.record-actions summary { min-height:44px; padding:10px; list-style:none; }
.business-module .record-actions summary { display:block; }
.record-actions[open] { padding:8px; background:var(--surface); border:1px solid var(--line); border-radius:8px; }
.record-actions a,.record-actions button { display:block; margin-block:4px; }
.assignment-advanced { border-top:1px solid var(--line); margin-block:16px; padding-top:12px; }
.assignment-advanced summary { cursor:pointer; padding:10px 0; }
#scanner-video { border:2px solid var(--accent); border-radius:12px; object-fit:contain; }
#scanner-controls { max-width:480px; }
#detected-original { white-space:pre-wrap; overflow-wrap:anywhere; }
.business-module table { width:100%; border-collapse:collapse; background:var(--surface); }
.business-module th { color:var(--ink); text-align:left; }
.business-module td,.business-module th { padding:14px; border-bottom:1px solid var(--line); }
@media(max-width:800px) {
 .business-module .mobile-records,.business-module .mobile-records tbody { display:block; overflow:visible; width:100%; }
 .business-module .mobile-records tr:not(.record-headings) { display:block; padding:12px; border:1px solid var(--line); border-radius:12px; margin-block:12px; }
 .business-module .mobile-records .record-headings { display:none; }
 .business-module .mobile-records td { display:grid; grid-template-columns:minmax(95px,35%) minmax(0,1fr); gap:12px; min-width:0; overflow-wrap:anywhere; border:0; padding:8px; }
 .business-module .mobile-records td:before { content:attr(data-label); font-weight:600; color:var(--muted); }
 .business-module .mobile-records td[colspan] { display:block; }
 .business-module .mobile-records td[colspan]:before { display:none; }
 .list-toolbar>* { flex:1 1 100%; }
 dialog { max-width:calc(100vw - 20px); max-height:calc(100dvh - 24px); }
}
.business-module .employee-fields { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:16px; }
.business-module main form label { display:flex; flex-direction:column; gap:6px; margin-bottom:12px; font-weight:600; }
.business-module main form input:not([type=checkbox]):not([type=hidden]), .business-module main form select, .business-module main form textarea { width:100%; min-height:44px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:white; color:var(--ink); font:inherit; }
.business-module main form input[type=checkbox] { width:18px; height:18px; }
.business-module main form label:has(input[type=checkbox]) { flex-direction:row; align-items:center; }
.business-module .permission-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:8px; }
.business-module table { display:block; overflow-x:auto; white-space:normal; }
.business-module th, .business-module td { min-width:120px; overflow-wrap:break-word; }
.business-module main details { margin-block:16px; }
.business-module main details summary { cursor:pointer; font-weight:600; padding:10px 0; }
.business-module .help-topics { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px; }
.business-module .help-topics a { padding:8px 12px; border:1px solid var(--line); border-radius:8px; }
.business-module .help-topics a[aria-current=page] { color:white; background:var(--accent); }
@media(max-width:600px) { .business-module .employee-panel { padding:16px; } .business-module td,.business-module th { padding:12px; } }

/* Compact list controls keep actions next to their task, not at the far edge. */
main .management-toolbar, main .section-toolbar {
 display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-start;
 gap:12px; width:fit-content; max-width:100%; margin:0 0 18px;
 padding:12px 16px; background:var(--surface,white); border:1px solid var(--line); border-radius:8px;
}
main .management-toolbar > div { flex:0 1 auto; max-width:65ch; }
main .management-toolbar p, main .section-toolbar p { flex:0 1 auto; max-width:65ch; margin:0; }
main .management-toolbar > .button, main .section-toolbar > .button { flex:0 0 auto; }
main > form.list-toolbar, main > form.settings-toolbar {
 display:flex; align-items:center; justify-content:flex-start; flex-wrap:wrap;
 width:fit-content; max-width:100%; gap:10px; padding:12px 16px; margin:0 0 18px; border-radius:8px;
}
main form.list-toolbar > *, main form.settings-toolbar > * { flex:0 1 auto; }
main form.list-toolbar label, .business-module form.list-toolbar label {
 display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; gap:10px; margin:0;
}
main > form.list-toolbar input:not([type=hidden]), .business-module form.list-toolbar input:not([type=hidden]) {
 width:15rem; max-width:100%; min-width:0; margin:0; min-height:44px;
}
main .skills-panel { max-width:1120px; padding:20px; }
.inline-record-actions { display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
.inline-record-actions form { display:inline-flex; margin:0; padding:0; }
.inline-record-actions .button-secondary { display:inline-flex; align-items:center; min-height:44px; margin:0; padding:8px 12px; white-space:nowrap; font-size:.875rem; }
main .skills-panel td { padding-top:10px; padding-bottom:10px; }
@media(max-width:600px) {
 main .management-toolbar, main .section-toolbar, main > form.list-toolbar, main > form.settings-toolbar { width:100%; padding:12px; }
 main form.list-toolbar label { flex:1 1 100%; }
 main > form.list-toolbar input:not([type=hidden]), .business-module form.list-toolbar input:not([type=hidden]) { flex:1 1 10rem; width:10rem; }
 main .management-toolbar > .button { font-size:inherit; }
 main .skills-panel { padding:16px; }
 .inline-record-actions { gap:8px; }
}

@media(min-width:801px) {
 .skills-panel td:last-child { width:1%; white-space:nowrap; }
 .skills-panel .inline-record-actions { flex-wrap:nowrap; }
}

.skill-defaults-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:12px 20px; margin-bottom:20px; }
.skill-defaults-toolbar p { flex:0 1 65ch; margin:0; }
.skill-defaults-toolbar .button { flex:0 0 auto; }
main details.skill-actions { display:inline-block; margin:0; min-width:110px; white-space:normal; }
main details.skill-actions > summary { cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px; list-style:none; min-height:44px; padding:8px 12px; border:1px solid var(--line); border-radius:7px; font-weight:500; }
.skill-actions > summary::-webkit-details-marker { display:none; }
.skill-actions-list { min-width:160px; padding:6px; margin-top:6px; border:1px solid var(--line); border-radius:7px; background:var(--surface,white); }
.skill-actions-list form { margin:0; padding:0; }
main .skill-actions-list a, main .skill-actions-list button { display:block; width:100%; text-align:left; min-height:44px; padding:10px; margin:0; border:0; border-radius:4px; background:transparent; color:var(--ink); font:inherit; white-space:nowrap; }
.skill-actions-list a:hover, .skill-actions-list button:hover { background:var(--wash); }
@media(max-width:800px) { main .skills-panel td:last-child { width:auto; white-space:normal; } }

/* Grid forms must not stretch action buttons into an entire input column. */
.business-module form.employee-fields > button,
.business-module main form .employee-fields > button,
main form .compact-form-action {
 width:auto; min-width:0; min-height:44px; height:auto;
 justify-self:start; align-self:end; flex:0 0 auto;
 padding:10px 18px; margin-bottom:12px;
}

.account-settings { max-width:1120px; }
.account-settings-tabs .nav { display:flex; flex-direction:row!important; flex-wrap:wrap; gap:8px; margin-bottom:20px; padding:0; list-style:none; }
.account-settings-tabs .nav-link { border:1px solid var(--line); border-radius:8px; padding:10px 16px; min-height:44px; }
.account-settings-content { min-width:0; }
.profile-facts { display:grid; grid-template-columns:minmax(150px,1fr) minmax(0,3fr); gap:10px 20px; }
.profile-facts dt,.profile-facts dd { margin:0; overflow-wrap:anywhere; }
.profile-skill-list { list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.profile-skill-list li { border:1px solid var(--line); border-radius:8px; padding:8px 12px; }
.primary-skill { background:var(--accent); color:white; margin-left:8px; font-size:.8rem; }
.profile-editor { margin-top:18px; border-top:1px solid var(--line); padding-top:12px; }
.profile-editor summary { cursor:pointer; min-height:44px; padding:10px 0; }
.profile-settings-form { margin-bottom:24px; }
.profile-settings-form input:not([type=checkbox]),.profile-settings-form select { max-width:100%; }
@media(max-width:600px) { .profile-facts { grid-template-columns:1fr; gap:4px; } .profile-facts dd { margin-bottom:12px; } }

main img.profile-avatar { width:80px; height:80px; min-width:80px; object-fit:cover; border-radius:50%; margin-bottom:16px; }

.hours-navigation { justify-content:flex-start; flex-wrap:wrap; border-radius:10px; margin-bottom:18px; }
.hours-navigation .date-nav { flex-wrap:wrap; }
.hours-navigation form.week-picker { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:0; padding:0; border:0; }
.hours-navigation .week-picker label,.hours-navigation .week-picker input { margin:0; }
.empty-state { color:var(--ink); }

.hours-navigation .hours-time-hint { flex:0 1 260px; margin:0 0 0 auto; font-size:12px; line-height:1.45; color:var(--muted); }
.feature-navigation { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:24px; }
.feature-navigation a { padding:10px 14px; border:1px solid var(--line); border-radius:8px; background:var(--surface,white); }
.feature-detail { scroll-margin-top:90px; }
.feature-detail:target { border-color:var(--accent); box-shadow:0 0 0 2px var(--line); }
.feature-detail p { max-width:80ch; }
.product-modules a.quick-card { color:var(--ink); text-decoration:none; }
.product-modules a.quick-card:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.public-welcome .hero-actions { display:flex; flex-wrap:wrap; gap:10px; }
@media(max-width:800px) {
 .hours-navigation .hours-time-hint { flex-basis:100%; margin-left:0; }
 .product-modules .quick-grid { grid-template-columns:minmax(0,1fr); }
 .feature-detail { padding:20px; }
 .public-welcome .welcome-copy h1 { font-size:clamp(28px,8vw,40px); }
 .mobile-account-panel { max-width:calc(100vw - 24px); max-height:calc(100dvh - 80px); overflow-y:auto; }
}

.feature-benefits { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:24px; }
.feature-benefits h3 { font-size:1.1rem; }
.workflow-guide summary { cursor:pointer; font-size:1.15rem; font-weight:600; min-height:44px; }
.workflow-guide li { margin-bottom:12px; max-width:85ch; }
.workflow-guide h3 { font-size:1rem; margin-top:20px; }
@media(max-width:700px) { .feature-benefits { grid-template-columns:1fr; } }

.planning-grid { min-width:1000px; table-layout:fixed; }
.planning-grid th:first-child { width:180px; }
.planning-grid td { padding:6px; vertical-align:top; }
.planning-grid .board-cell { width:100%; min-height:72px; font-size:13px; padding:8px; white-space:normal; }
.board-cell.is-draft { background:#e8f0fb; border:2px dashed var(--accent); }
.board-existing { padding:8px; border-radius:6px; background:var(--wash); font-size:13px; }
.board-existing small { display:block; }
#board-drafts tr[data-state="Blocked"] { border-left:4px solid #b42318; }
#board-drafts tr[data-state="Warning"] { border-left:4px solid #946200; }
#board-drafts select { max-width:220px; }

.schedule-toolbar { flex-wrap:wrap; }
.schedule-toolbar .date-nav { flex-wrap:wrap; }
.schedule-toolbar .view-tabs { flex-wrap:wrap; margin-left:auto; }
.schedule-date-picker { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0; }
.schedule-date-picker label { display:flex; align-items:center; gap:8px; margin:0; }
.schedule-date-picker input { width:150px; min-height:40px; }
.schedule-date-picker button { min-height:40px; padding:8px 12px; }
main>form.board-filters { width:100%; padding:12px 16px; }
.board-navigation { border-radius:12px 12px 0 0; }
.board-instructions { margin:12px 0; }
.board-instructions summary { cursor:pointer; padding:8px 0; }
.board-scroll { max-height:65vh; overflow:auto; }
.planning-grid { margin:0; }
.planning-grid thead th { position:sticky; top:0; z-index:2; background:#f4f6fa; }
.planning-grid th:first-child { position:sticky; left:0; z-index:1; background:#f4f6fa; }
.planning-grid thead th:first-child { z-index:3; }
@media(max-width:800px) {
 .schedule-toolbar .view-tabs { margin-left:0; width:100%; }
 .schedule-date-picker { width:100%; }
 .schedule-date-picker label { flex-wrap:wrap; }
 .board-scroll { max-height:70vh; }
}

/* Compact scheduling controls; the calendar and planning grid retain their width. */
.schedule-toolbar:has(.view-tabs) { justify-content:flex-start; gap:10px; padding:12px 14px; }
.schedule-toolbar .date-nav { gap:8px; }
.schedule-toolbar .date-nav h2 { font-size:1.15rem; margin:0; white-space:nowrap; }
.schedule-toolbar .view-tabs { margin-left:0; width:auto; gap:2px; }
.schedule-toolbar .view-tabs a { padding:9px 11px; white-space:nowrap; }
.schedule-date-jump { position:relative; flex:0 0 auto; }
.schedule-date-jump summary { cursor:pointer; border:1px solid var(--line); border-radius:8px; padding:10px 12px; min-height:40px; font-size:.875rem; }
.schedule-date-jump .schedule-date-picker { position:absolute; top:100%; left:0; z-index:10; width:210px; padding:12px; background:white; border:1px solid var(--line); border-radius:8px; box-shadow:0 6px 20px #0b254522; }
.schedule-date-jump label { flex-direction:column; align-items:flex-start; }
main>form.board-filters { display:flex; align-items:center; flex-wrap:wrap; gap:10px 14px; width:100%; padding:12px 14px; }
main>form.board-filters label { display:flex; flex-direction:row; align-items:center; gap:6px; margin:0; font-size:.875rem; }
.board-filters select,.board-filters input { width:155px; min-width:0; min-height:40px; padding:8px; margin:0; font-size:.875rem; }
.board-filters #board-shift { width:190px; }
.board-filters button { width:auto; min-height:40px; padding:8px 12px; margin:0; font-size:.875rem; }
.board-filters .status-badge { white-space:nowrap; font-size:.8rem; }
#board-switch-dialog { max-width:440px; width:calc(100% - 32px); border:1px solid var(--line); border-radius:12px; padding:24px; }
#board-switch-dialog::backdrop { background:#0b254566; }
@media(max-width:800px) {
 .schedule-toolbar:has(.view-tabs) { flex-direction:row; align-items:center; }
 .schedule-toolbar .view-tabs { flex-basis:100%; }
 main>form.board-filters label { flex:1 1 230px; justify-content:space-between; }
 .schedule-toolbar .date-nav h2 { font-size:1rem; }
 .schedule-toolbar a,.schedule-date-jump summary,.board-filters button { min-height:44px; }
}

/* Match calendar control typography and separate planning draft actions. */
main>form.board-filters label,main>form.board-filters select,main>form.board-filters input { font-size:14px!important; font-weight:400; }
main>form.board-filters label { font-weight:500; }
main>form.board-filters select,main>form.board-filters input { height:40px; min-height:40px; padding:8px 10px; width:160px; }
main>form.board-filters #board-search { width:180px; }
main>form.board-filters #board-shift { width:200px; }
main>form.board-filters { margin-bottom:0; }
.board-draft-toolbar { display:flex; align-items:center; gap:10px; padding:6px 14px; margin-bottom:12px; font-size:13px; }
.board-draft-toolbar button { width:auto; min-height:32px; padding:5px 10px; font-size:13px; }
#board-selection-message:empty { display:none; }
#board-selection-message { margin:8px 14px; color:#b42318; font-size:14px; }
.board-filters [aria-invalid=true] { outline:2px solid #b42318; outline-offset:2px; }
.schedule-toolbar .view-tabs { margin-left:24px; }
.board-navigation { margin-bottom:14px; }
@media(max-width:800px) {
 .schedule-toolbar .view-tabs { margin-left:0; }
 .board-draft-toolbar button { min-height:44px; }
}

.account-link-row { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.account-link-row label { margin:0; white-space:nowrap; }
.account-link-row input { flex:1 1 280px; width:auto; min-width:0; margin:0; }
.account-link-row form { display:flex; margin:0; padding:0; border:0; width:auto; }
.account-link-row button { margin:0; white-space:nowrap; }
[data-invitation-option] { display:flex; align-items:center; gap:8px; }
[data-invitation-option][hidden] { display:none; }
[data-invitation-option] input { width:auto; }

.login-help-links { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:12px; font-size:14px; }

.candidate-languages{border:0;padding:0;margin:0;min-width:0}.candidate-languages legend{font-size:inherit;font-weight:600}.candidate-language-row{display:flex;align-items:center;gap:8px;margin-bottom:8px}.candidate-language-row select{min-width:0;flex:1}.candidate-language-row button{flex:none}.candidate-languages [data-add-language]{margin-top:4px}

/* Keep publication summaries compact; small screens scroll the table. */
.publication-table { min-width: 780px; font-size: .9rem; }
.publication-table th, .publication-table td { padding: 12px; }
.publication-table td:nth-child(2), .publication-table td:nth-child(4) { white-space: nowrap; }
.publication-table .status-badge { white-space: nowrap; }

/* Shared schedule publication state and compact planning filters. */
.schedule-publication-status{display:flex;align-items:center;gap:10px;font-size:14px;}
.schedule-publication-status .button{white-space:nowrap;font-size:14px;}
main form.board-filters label, main form.board-filters select, main form.board-filters input{font-size:14px!important;}
main form.board-filters select, main form.board-filters input{height:40px;min-height:40px;padding:8px 10px;}
.publication-change-group{padding:12px 0;border-bottom:1px solid #d0deeb;}
.publication-change-group summary{cursor:pointer;font-weight:600;}
.publication-tabs [aria-current=page]{background:#184878;color:white;}

main form.board-filters{flex-wrap:nowrap;overflow-x:auto;align-items:center;gap:10px;}
main form.board-filters label,main form.board-filters .schedule-publication-status{flex:0 0 auto;white-space:nowrap;}
main form.board-filters select{width:145px;}main form.board-filters #board-search{width:145px;}main form.board-filters #board-shift{width:180px;}

/* TeamFelsen vector logo: readable on the shared navy header. */
.app-header .brand .teamfelsen-brand-mark{display:block;width:32px;height:38px;flex:0 0 auto;object-fit:contain;}
.teamfelsen-wordmark{white-space:nowrap;letter-spacing:-.8px;}
.teamfelsen-wordmark-f{color:#5ca9e8;}.teamfelsen-wordmark-stone{color:#d8e0e7;}
@media(max-width:600px){.app-header .brand .teamfelsen-brand-mark{width:26px;height:32px;}}
