/* Shared controls across Organizer, staff and company portals. */
:root{--ui-green:#153d37;--ui-line:#cbd8cf;--ui-muted:#596c64;--ui-radius:10px;--ui-gap:8px}
button,input,select,textarea{font-family:inherit}
button{min-height:44px;padding:8px 12px;border-radius:var(--ui-radius);font-size:.9rem;line-height:1.4}
input,select{min-height:44px;border-radius:8px}
button:disabled{cursor:not-allowed}
.primary{background:var(--ui-green);color:white;border-color:var(--ui-green)}
.primary:hover{background:#24594f}
.danger{color:#9d321e}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #b66e0b;outline-offset:3px}
.ga-actions,.actions,.editor-actions,.toolbar,.personnel-toolbar,.portal-toolbar{gap:var(--ui-gap)}
.ga-actions>button,.actions>button{flex:0 1 auto}
.ga-link,.link{min-height:44px;padding:8px 12px;line-height:1.4;font-size:.9rem;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--ui-radius)}
.ga-link{border:1px solid var(--ui-line);background:white;text-decoration:none}
.ga-link:hover,.link:hover{background:#eaf0e9}
.personnel-tabs,.ledger-tabs,.ui-tabs,#staff-main>nav,#company-main>nav{display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;max-width:100%;padding:4px 2px 8px;scroll-padding:2px}
.personnel-tabs>button,.ledger-tabs>button,.ui-tabs>button,#staff-main>nav>button,#company-main>nav>button{flex:0 0 auto;white-space:nowrap;min-height:44px;padding:8px 12px}
button[aria-pressed=true]{background:var(--ui-green);color:white;border-color:var(--ui-green)}
.ui-filters{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin:16px 0;padding:12px;border:1px solid var(--ui-line);border-radius:var(--ui-radius);background:#e9eee7}
.ui-filters>label{flex:1 1 160px;max-width:280px}
.ui-filters>label:first-child{flex-basis:220px}
.ui-filters>button{flex:0 0 auto}
.badge.ui-status{font-size:.78rem;line-height:1.4;padding:4px 8px;border-radius:6px;font-weight:600;white-space:normal}
.ui-status-draft{background:#edf0f2;color:#43515c}
.ui-status-pending{background:#fff1cc;color:#704c00}
.ui-status-attention{background:#ffebe5;color:#8b3020}
.ui-status-approved{background:#e1f0e4;color:#245d35}
.ui-status-closed{background:#e8edf1;color:#42576b}
.ui-notifications{margin:0 0 20px;min-width:0;border:1px solid var(--ui-line);border-radius:12px;background:white}
.ui-notifications>summary{cursor:pointer;min-height:44px;padding:12px 16px;font-weight:600}
.ui-notifications>summary .count{margin-left:6px}
.ui-notification-list{display:grid;gap:8px;padding:0 12px 12px;max-height:360px;overflow:auto}
.ui-notification{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--ui-line);border-radius:var(--ui-radius);border-left:4px solid #d6ad46;background:#fffdf7}
.ui-notification.attention{border-left-color:#b64d35;background:#fff8f5}
.ui-notification>div{min-width:0;flex:1}
.ui-notification strong{font-size:.9rem;display:block}
.ui-notification p{font-size:.85rem;color:var(--ui-muted);margin:4px 0 0;white-space:pre-wrap}
.ui-notification>button{flex:0 0 auto}
.ui-notification-empty{margin:0;padding:12px;color:var(--ui-muted);font-size:.9rem}
.ui-report{padding:16px;border:1px solid var(--ui-line);border-radius:12px;background:#f1f6ee;margin:16px 0}
.ui-report h2{font-size:1rem;margin-bottom:8px}
.ui-report p{font-size:.9rem;margin-bottom:10px}
.ui-report p:last-child{margin-bottom:0}
.ui-empty{padding:20px;border:1px dashed var(--ui-line);border-radius:12px;color:var(--ui-muted);background:#f9faf6}
.ui-row-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}
@media(max-width:600px){.ui-filters>label{max-width:none;flex-basis:130px}.ui-filters>label:first-child{flex-basis:100%}.ui-notification{gap:8px;padding:10px}.ui-notification>button{padding:8px}.ui-row-actions>button{flex:0 1 auto}}
@media(max-width:600px){
 .personnel-wide-table{border:0;overflow:visible}
 .personnel-wide-table table{min-width:0}
 .personnel-wide-table table,.personnel-wide-table tbody,.personnel-wide-table tr,.personnel-wide-table td{display:block;width:100%}
 .personnel-wide-table thead{display:none}
 .personnel-wide-table tr{margin-bottom:12px;padding:12px;background:white;border:1px solid var(--ui-line);border-radius:var(--ui-radius)}
 .personnel-wide-table td{border:0;padding:5px 0;min-width:0!important}
 .personnel-wide-table td[data-label]:not([data-label=""])::before{content:attr(data-label);display:block;font-size:.75rem;color:var(--ui-muted);font-weight:600;margin-bottom:2px}
 .personnel-wide-table td:last-child{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding-top:8px}
 .personnel-wide-table td:last-child button{margin:0}
 .personnel-wide-table td:last-child>p{flex-basis:100%;margin:0}
}

/* Section navigation stays compact; the browser scrolls long option lists. */
.section-select{display:flex;flex-direction:column;gap:5px;width:min(100%,380px);min-width:0;max-width:100%;font-weight:600}
.section-select select{width:100%;min-width:0;min-height:46px}
.personnel-tabs,.ledger-tabs,#staff-main>nav,#company-main>nav{overflow:visible;flex-wrap:wrap}
.mail-folders .section-select{width:100%}
@media(max-width:600px){.section-select{width:100%}}

/* Keep monitoring tables contained when the shared mobile table layout uses cards. */
#server-monitor .monitor-table{overflow:auto;max-height:480px;max-width:100%;position:relative;isolation:isolate;overscroll-behavior:contain}
#server-monitor .ga-panel>p,#server-monitor .ga-panel>h3{position:relative;clear:both}
#server-monitor .ga-panel>p.muted{margin:16px 0 0;padding-top:12px;border-top:1px solid var(--ui-line);line-height:1.6}
#server-monitor .summary{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:12px}
#server-monitor .summary strong,#server-monitor .summary span{display:block;overflow-wrap:anywhere}
#server-monitor .summary span{margin-top:6px;line-height:1.5}
#server-monitor .monitor-bar{grid-template-columns:minmax(0,1fr) auto;align-items:start}
#server-monitor .monitor-bar strong{max-width:150px;text-align:right;overflow-wrap:anywhere}
@media(max-width:600px){
 #server-monitor .monitor-table{overflow:auto;max-height: min(650px,70dvh)}
 #server-monitor .monitor-table td:last-child{display:block}
 #server-monitor .monitor-table tr:last-child{margin-bottom:0}
 #server-monitor .monitor-bar{grid-template-columns:minmax(0,1fr)}
 #server-monitor .monitor-bar strong{text-align:left;max-width:none}
}

/* IV controls share personnel tables, with independently wrapping form fields. */
.iv-day-form,.iv-settings-form{display:grid;gap:.7rem;max-width:44rem;margin:1rem 0}
.iv-day-form label,.iv-settings-form label{display:grid;gap:.3rem;min-width:0}
.iv-day-form input,.iv-day-form select,.iv-settings-form input,.iv-settings-form textarea{width:100%;max-width:100%;box-sizing:border-box}
.iv-day-form button,.iv-settings-form button{justify-self:start;white-space:normal}

/* Compact monthly times: no per-row night selection; preserve existing values. */
.sheet-row{grid-template-columns:110px 95px 80px 80px 65px minmax(120px,1fr) 200px;gap:6px;padding:8px 4px;align-items:center}
.sheet-row label{font-size:.82rem;gap:3px}
.sheet-row input,.sheet-row select{min-height:34px;padding:5px 7px;font-size:.9rem}
.sheet-day{gap:2px;line-height:1.2}
.sheet-total{gap:4px}
.sheet-row-actions{flex-direction:row;flex-wrap:wrap;gap:4px;align-items:center}
.sheet-row-actions button{padding:6px 7px;font-size:.8rem;white-space:nowrap}
.sheet-clock{gap:6px}
@media(max-width:1100px){.sheet-row{grid-template-columns:100px 90px 75px 75px 60px minmax(100px,1fr)}.sheet-row-actions{grid-column:1/-1}.sheet-clock{grid-column:2/-1}}
@media(max-width:650px){.sheet-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:9px 3px}.sheet-day{grid-column:auto}.sheet-total{grid-column:1/-1;flex-direction:row;gap:8px}.sheet-field-note,.sheet-clock{grid-column:1/-1}.sheet-row-actions{margin:0}.sheet-clock label{flex:1;min-width:75px}}

/* Native date fields and action buttons keep a horizontal control shape. */
input[type="date"],input[type="datetime-local"],input[type="time"]{height:46px;min-height:46px;max-height:46px;inline-size:100%;min-inline-size:0;writing-mode:horizontal-tb}
button{white-space:nowrap;overflow-wrap:normal;word-break:normal;writing-mode:horizontal-tb}
.form-grid>button{align-self:end;justify-self:start;width:auto}
.ga-actions>button,.actions>button,.editor-actions>button{flex-shrink:0}
#ledger-fields{align-items:start}
#ledger-fields>button{justify-self:start}