﻿/* Final presentation layer. No action, data, or layout contracts are changed.
   Theme-layer !important rules intentionally outrank injected Tailwind utilities. */
body:is([data-role="admin"],[data-role="staff"]){--ui-surface:#fff;--ui-soft:#eaf3f5;--ui-ink:#183746;--ui-muted:#506d7b;--ui-line:#c2d6dd;--ui-action:#126577;--ui-shadow:0 2px 4px #173e5010,0 8px 22px #173e5014;--ui-focus:#168a9a}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]){--ui-surface:#173442;--ui-soft:#244a59;--ui-ink:#edf7fa;--ui-muted:#b5cdd5;--ui-line:#486c7b;--ui-action:#a1e4eb;--ui-shadow:0 2px 4px #0002,0 8px 22px #0003;--ui-focus:#77d3df}
@layer theme {
body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) .btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:12px!important;min-height:42px;padding:9px 15px;font-family:inherit;line-height:1.5;transition:background-color .16s,border-color .16s,box-shadow .16s,transform .16s}
body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) .btn.primary{background:#146d7e!important;color:#fff!important;border:1px solid #105a6b!important;box-shadow:inset 0 1px 0 #ffffff26,0 3px 7px #134b6324!important}
body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) .btn.primary:hover:not(:disabled){background:#105667!important;box-shadow:0 5px 12px #134b6330!important}
body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) :is(.btn.secondary,.master-btn-ghost){background:var(--ui-surface)!important;color:var(--ui-ink)!important;border:1px solid var(--ui-line)!important;box-shadow:0 2px 4px #173e500b!important}
body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) :is(.btn.secondary,.master-btn-ghost):hover:not(:disabled){background:var(--ui-soft)!important;border-color:var(--ui-focus)!important}
body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) .danger-btn{background:#fbecef!important;border-color:#dbaab5!important;color:#992c42!important}
body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) .danger-btn:hover:not(:disabled){background:#f6dce3!important}
body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) button:active:not(:disabled){transform:translateY(1px)}
body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none!important}
body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--ui-focus)!important;outline-offset:3px}
body:is([data-role="admin"],[data-role="staff"]) #app :is(.text-btn,.ct-equipment footer button,.ops-equipment-open,.ops-equipment-body button[data-action="view-asset"],.ops-register-action){display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:7px 12px!important;border:1px solid var(--ui-line)!important;border-radius:10px;background:var(--ui-soft)!important;color:var(--ui-action)!important;font:600 12px/1.5 Sarabun,sans-serif;text-decoration:none;box-shadow:inset 0 1px 0 #ffffff12,0 2px 4px #173e500a}
body:is([data-role="admin"],[data-role="staff"]) #app :is(.text-btn,.ct-equipment footer button,.ops-equipment-open):hover{border-color:var(--ui-focus)!important;filter:brightness(.97)}
body.ops-admin #app :is(.ops-area-card,.ops-branch-card,.checklist-template-card,.ops-overview-grid .panel,.ops-report-grid .panel,.ops-task-card,.ct-type-detail){border:1px solid var(--ui-line)!important;box-shadow:var(--ui-shadow)!important;background:var(--ui-surface)!important;border-radius:18px!important}
body.ops-admin #app .ops-branch-stats>div{background:var(--ui-soft)!important;border:0!important;border-radius:12px!important;box-shadow:inset 0 1px 0 #ffffff16}
body.ops-admin #app .ops-branch-stats :is(strong,b){color:var(--ui-ink)!important}body.ops-admin #app .ops-branch-stats small{color:var(--ui-muted)!important}
body.ops-admin #app .ops-branch-card>button{background:var(--ui-soft)!important;color:var(--ui-action)!important;border-color:var(--ui-line)!important;border-radius:12px!important;min-height:44px}
body.ops-admin #app .ct-type-choice:not(.is-selected):hover{background:var(--ui-soft)!important}
body.ops-admin #app .ct-type-choice.is-selected{box-shadow:inset 3px 0 0 #72d4c8,0 4px 12px #153f501a!important}
body.ops-admin #app .ct-type-heading{border-bottom:1px solid var(--ui-line);margin-bottom:20px}
body.ops-admin #app .ct-checklist-title{padding:14px;background:var(--ui-soft);border-radius:12px}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) :is(.panel,.asset-card,.location-card,.modal,.master-menu-list,.ops-select-menu,.ops-select-menu button,.ops-asset-overflow>div,.ops-asset-overflow summary){background:var(--ui-surface)!important;color:var(--ui-ink)!important;border-color:var(--ui-line)!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) :is(.detail,.master-context,.worktype-checklist-box,.edit-asset-ma-info,.master-search,.master-chip-code,.master-count,.checklist-items-v3,.master-row-checklist,.ct-item .ct-dot){background:var(--ui-soft)!important;color:var(--ui-ink)!important;border-color:var(--ui-line)!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) :is(input,select,textarea){color:var(--ui-ink)!important;background:var(--ui-surface)!important;border-color:var(--ui-line)!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) ::placeholder{color:var(--ui-muted)!important;opacity:1}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) :is(.detail b,.detail small,.master-menu-list button,.master-callout p,.master-meta,.master-checklist-value,.ct-type-code,.ct-checklist-preview li,.ct-item,.ops-branch-card h2,.ops-branch-card p,.ops-area-card h3,.ops-area-card p,.ops-area-card-count span,.ops-register-group b,.ops-register-group strong){color:var(--ui-ink)!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) :is(.ct-equipment-mark,.ct-equipment-object small,.ct-equipment footer>span,.ct-type-index-note,.ct-checklist-preview li:before,.usedby-none){color:var(--ui-muted)!important}
html[data-cooltrack-theme="dark"] body.ops-admin #app .ct-checklist-preview li small{color:#f1d28e!important}
html[data-cooltrack-theme="dark"] body.ops-admin #app :is(.ct-ma-state){color:#b5e4e5!important}
html[data-cooltrack-theme="dark"] body.ops-admin #app .ct-equipment-overdue .ct-ma-state{color:#ffc0cc!important}
html[data-cooltrack-theme="dark"] body.ops-admin #app .ct-equipment-upcoming .ct-ma-state{color:#f1d28e!important}
html[data-cooltrack-theme="dark"] body.ops-admin #app :is(.master-btn-accent){background:#246575!important;color:#fff!important;border-color:#508491!important}
html[data-cooltrack-theme="dark"] body.ops-admin #app :is(.master-menu-list button:hover,.ops-register-group:hover,.ops-registry-row:hover){background:var(--ui-soft)!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) :is(.danger-btn,.badge.red){background:#57323f!important;color:#ffd1db!important;border-color:#966174!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) #app :is(.badge.green,.master-status.active){background:#234f44!important;color:#b5efd5!important;box-shadow:inset 0 0 0 1px #467b67!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) #app .badge.amber{background:#55482d!important;color:#ffe0a4!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) #app :is(.badge.blue,.badge.soft,.master-status.inactive){background:#294f63!important;color:#d2efff!important}
@media(max-width:700px){
body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) :is(.btn,.text-btn,.ct-equipment footer button,.master-menu-trigger){min-height:44px!important}
body:is([data-role="admin"],[data-role="staff"]) #app :is(.actions,.form-actions,.ct-equipment footer){flex-wrap:wrap;gap:8px}
body.ops-admin #app .ops-registry-row{grid-template-columns:minmax(0,1fr) auto!important;gap:8px;padding:12px 14px}
body.ops-admin #app .ops-register-main{grid-column:1;min-width:0}body.ops-admin #app .ops-register-site{grid-column:1;overflow-wrap:anywhere}
body.ops-admin #app .ops-register-action{display:inline-flex!important;grid-column:2;grid-row:1/4;min-height:44px}
body:is([data-role="admin"],[data-role="staff"]) #app :is(.ct-equipment-object>div,.ct-checklist-title>div,.ops-area-card-head>div){min-width:0;overflow-wrap:anywhere}
body.ops-admin #app .ct-checklist-title{flex-wrap:wrap}.ct-checklist-preview li span{min-width:0;overflow-wrap:anywhere}
body:is([data-role="admin"],[data-role="staff"]) #modal .modal{max-width:calc(100vw - 24px)!important;max-height:calc(100dvh - 24px)!important;overflow-y:auto!important;overscroll-behavior:contain}
body:is([data-role="admin"],[data-role="staff"]) #modal .form-actions{display:flex;flex-wrap:wrap;gap:8px}
}
@media(prefers-reduced-motion:reduce){body:is([data-role="admin"],[data-role="staff"]) :is(#app,#modal) *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
}
@layer theme {
html[data-cooltrack-theme="dark"] body.ops-admin #app :is(.master-menu-trigger,.ct-type-symbol,.ct-checklist-title>svg){color:#b9e8ec!important;background:var(--ui-soft)!important}
html[data-cooltrack-theme="dark"] body.ops-admin #app .master-search input{background:transparent!important}
}

/* Feedback surfaces: toast, confirmation dialog, session notice. Appended to body, outside #app/#modal. */
.toast{display:flex;align-items:center;gap:10px;max-width:min(430px,calc(100vw - 36px));padding:12px 16px;border:1px solid #c9dce8;border-radius:14px;background:#fff;color:#17384a;box-shadow:0 14px 34px #0d27332e;font-size:13px}
.toast .toast-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;flex:none}
.toast .toast-msg{min-width:0;overflow-wrap:anywhere;font-weight:500;line-height:1.45}
.toast.toast-success{border-color:#bfe3d4}.toast.toast-success .toast-icon{background:#e2f6ec;color:#0f7a56}
.toast.toast-error{border-color:#f0c5cb}.toast.toast-error .toast-icon{background:#fadadd;color:#c23542}
.toast.toast-warning{border-color:#f0d7a2}.toast.toast-warning .toast-icon{background:#fbeccb;color:#a96b0a}
.toast.toast-info{border-color:#c9dce8}.toast.toast-info .toast-icon{background:#e3eef6;color:#2a709c}
html[data-cooltrack-theme="dark"] .toast{background:#152c38;border-color:#33555f;color:#e9f4f6;box-shadow:0 14px 34px #00000059}
html[data-cooltrack-theme="dark"] .toast.toast-success{border-color:#2c5c4a}.toast.toast-success .toast-icon{background:#1d4437;color:#7fe0b8}
html[data-cooltrack-theme="dark"] .toast.toast-error{border-color:#6b3a41}.toast.toast-error .toast-icon{background:#4d282e;color:#ff9aa7}
html[data-cooltrack-theme="dark"] .toast.toast-warning{border-color:#6b5426}.toast.toast-warning .toast-icon{background:#4a3a1a;color:#ffca66}
html[data-cooltrack-theme="dark"] .toast.toast-info{border-color:#2f5566}.toast.toast-info .toast-icon{background:#1d4150;color:#7cc4e4}
.confirm-backdrop{backdrop-filter:blur(3px)}
.confirm-card.tone-normal .confirm-icon{background:#e3f4f6;color:#137988}
.confirm-card.tone-warning .confirm-icon{background:#fbeccb;color:#a96b0a}
.confirm-card .confirm-detail{margin:-11px 0 15px;padding:10px 13px;border:1px solid #e2ecf2;border-radius:10px;background:#f7fafc;color:#51687a;font-size:12.5px;line-height:1.5}
.confirm-card button:focus-visible{outline:3px solid var(--ui-focus,#168a9a)!important;outline-offset:2px}
html[data-cooltrack-theme="dark"] .confirm-card{background:#152c38;border-color:#33555f}
html[data-cooltrack-theme="dark"] .confirm-card h2{color:#eef7f9}
html[data-cooltrack-theme="dark"] .confirm-card p{color:#b5cdd5}
html[data-cooltrack-theme="dark"] .confirm-card .confirm-detail{background:#0f2330;border-color:#2c4f5c;color:#a4c0c8}
html[data-cooltrack-theme="dark"] .confirm-card .confirm-icon{background:#1d4150;color:#7cc4e4}
html[data-cooltrack-theme="dark"] .confirm-card.tone-warning .confirm-icon{background:#4a3a1a;color:#ffca66}
html[data-cooltrack-theme="dark"] .confirm-card.danger .confirm-icon,html[data-cooltrack-theme="dark"] .confirm-card.tone-danger .confirm-icon{background:#4d282e;color:#ff9aa7}
html[data-cooltrack-theme="dark"] .confirm-card .btn.secondary{background:#16303b!important;border-color:#3d6c7a!important;color:#d6ecef!important}
html[data-cooltrack-theme="dark"] .confirm-card .btn.secondary:hover{background:#1d3f4b!important}
html[data-cooltrack-theme="dark"] .confirm-card .btn.primary{background:#146d7e!important;border-color:#1a8496!important;color:#fff!important}
html[data-cooltrack-theme="dark"] .confirm-card .danger-btn{background:#57323f!important;border-color:#966174!important;color:#ffd1db!important}
@media print{.toast,.confirm-backdrop{display:none!important}}

/* Organization profile screen: shared dark tokens */
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) #app .org-field{color:var(--ui-muted)!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) #app .org-field small{color:var(--ui-muted)!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) #app :is(.org-field input,.org-field textarea){background:var(--ui-surface)!important;color:var(--ui-ink)!important;border-color:var(--ui-line)!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) #app :is(.org-field input,.org-field textarea):focus{border-color:var(--ui-focus)!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) #app .org-profile-panel{background:var(--ui-surface)!important;border-color:var(--ui-line)!important}

/* Quotation issuer identity block */
body:is([data-role="admin"],[data-role="staff"]) #app .quote-issuer{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;flex-wrap:wrap}
.quote-issuer-brand{display:flex;gap:12px;align-items:flex-start;min-width:0}
.quote-issuer-brand img{flex:none;border-radius:10px}
.quote-issuer-brand b{display:block;font-size:17px;color:var(--ui-ink,#183746);letter-spacing:-.01em;overflow-wrap:anywhere}
.quote-issuer-contact{display:grid;gap:1px;margin-top:4px;color:var(--ui-muted,#506d7b);font-size:11.5px;line-height:1.5}
.quote-issuer-contact span{display:block;max-width:340px;overflow-wrap:anywhere}
.quote-issuer-meta{display:grid;gap:3px;justify-items:end;text-align:right;color:var(--ui-muted,#506d7b);font-size:12px}
.quote-issuer-meta b{font-size:14px;color:var(--ui-ink,#183746);font-variant-numeric:tabular-nums}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) #app :is(.quote-issuer-brand b,.quote-issuer-meta b){color:var(--ui-ink)!important}
html[data-cooltrack-theme="dark"] body:is([data-role="admin"],[data-role="staff"]) #app :is(.quote-issuer-contact,.quote-issuer-meta){color:var(--ui-muted)!important}
@media(max-width:700px){.quote-issuer-meta{justify-items:start;text-align:left}}

/* Report print header: hidden on screen, printed at the top of the report page */
.report-print-header{display:none}
@media print{.report-print-header{display:grid;gap:2px;padding:0 0 10px;border-bottom:2px solid #126779;margin-bottom:14px}.report-print-header b{font-size:17px;color:#111}.report-print-header span{font-size:10.5px;color:#333}}

/* Mobile/tablet Work Order list: recompose the fixed-column row into a stacked card (<=820px).
   Presentation only: same markup, same click behavior, desktop row (>=~900px) untouched.
   820px covers 768px tablets where the fixed columns previously overflowed and overlapped. */
@layer theme {
@media(max-width:820px){
body.ops-admin .ops-job-row{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-areas:"type status" "copy copy" "when action" "owner owner"!important;row-gap:7px!important;column-gap:8px!important;align-items:center!important;padding:13px 14px!important}
body.ops-admin .ops-job-row>.ops-job-type{grid-area:type!important;justify-self:start!important;min-width:0!important;max-width:100%}
body.ops-admin .ops-job-row>.ops-status{grid-area:status!important;justify-self:end!important;font-size:11px!important;padding:4px 9px!important;max-width:60vw;overflow:hidden;text-overflow:ellipsis}
body.ops-admin .ops-job-row>.ops-job-copy{grid-area:copy!important;grid-column:1/-1!important}
body.ops-admin .ops-job-row>.ops-job-copy b{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;white-space:normal!important;overflow:hidden!important;overflow-wrap:anywhere!important;font-size:13px!important;line-height:1.45!important}
body.ops-admin .ops-job-row>.ops-job-copy small{display:block!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important;font-size:11px!important;line-height:1.5!important;margin-top:2px!important}
body.ops-admin .ops-job-row>.ops-job-when{grid-area:when!important;justify-self:start!important;justify-items:start!important;text-align:left!important;min-width:0!important;display:flex!important;flex-wrap:wrap!important;align-items:baseline!important;gap:5px!important}
body.ops-admin .ops-job-row>.ops-job-when b{font-size:12px!important}
body.ops-admin .ops-job-row>.ops-job-when small{font-size:10.5px!important}
body.ops-admin .ops-job-row>.ops-job-owner{grid-area:owner!important;display:flex!important;flex-wrap:wrap!important;align-items:baseline!important;gap:5px!important;min-width:0!important;text-align:left!important;font-size:11px!important;color:var(--ops-muted)!important}
body.ops-admin .ops-job-row>.ops-job-owner small{font-size:10.5px!important}
body.ops-admin .ops-job-row>svg:last-child{grid-area:action!important;justify-self:end!important;width:18px!important;height:18px!important;min-width:18px!important}
}
}
