@font-face{font-family:Assistant;src:url('/fonts/Assistant-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Assistant;src:url('/fonts/Assistant-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
:root {
    --blue: #185B84; --blue-dark: #104364; --focus: #2A7DA9;
    --ink: #1A3041; --muted: #66788A; --border: #DAE3EB;
    --surface: #FFFFFF; --background: #F3F6F9; --tint: #EAF3F9; --stripe: #F9FBFD; --link: #185B84;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--background); color: var(--ink); font-family: Arial, 'Noto Sans Hebrew', 'Segoe UI', sans-serif; line-height: 1.65; }
a { color: var(--link); }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }
.skip-link { position: absolute; inset-block-start: -5rem; inset-inline-start: 1rem; background: var(--surface); padding: .8rem; z-index: 1; }
.skip-link:focus { inset-block-start: .5rem; }
.topbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding: 1rem 2rem; background: var(--surface); box-shadow: 0 2px 8px #1a30410d; }
.brand { font-size: 1.3rem; font-weight: bold; text-decoration: none; }
.badge { display: inline-block; font-size: .85rem; background: var(--tint); color: var(--blue-dark); border-radius: 9px; padding: .25rem .65rem; }
.shell { display: grid; grid-template-columns: 15rem minmax(0, 1fr); min-height: 75vh; }
nav { background: var(--tint); padding: 1.5rem 1rem; }
.nav-title { font-weight: bold; padding-inline: .75rem; }
nav a, .nav-placeholder { display: flex; justify-content: space-between; align-items: center; gap: .5rem; padding: .7rem .75rem; border-radius: 9px; text-decoration: none; }
.nav-placeholder { color: var(--ink); }
.nav-placeholder small { color: var(--muted); }
nav a:hover, nav a[aria-current] { background: var(--surface); color: var(--blue-dark); }
main { padding: 2rem; max-width: 90rem; width: 100%; }
h1 { font-size: clamp(1.7rem, 4vw, 2.3rem); margin-block: .25rem .75rem; }
h2 { font-size: 1.2rem; margin-block-start: 0; }
p { margin-block: .5rem 1rem; }
.eyebrow, .intro { color: var(--muted); }
.panel { background: var(--surface); border: 1px solid var(--border); border-radius: 13px; padding: 1.5rem; margin-block: 1rem; }
.module-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.module-grid .panel { background: var(--stripe); }
.notice { border-inline-start: 3px solid var(--blue); padding-inline-start: 1rem; }
.button { background: var(--blue); color: white; padding: .6rem 1rem; border-radius: 9px; text-decoration: none; display: inline-block; }
.button:hover { background: var(--blue-dark); }
.ltr { direction: ltr; unicode-bidi: isolate; display: inline-block; }
footer { padding: 1rem 2rem; color: var(--muted); font-size: .85rem; }
@media (max-width: 800px) {
    .shell, .module-grid { grid-template-columns: 1fr; }
    nav { display: flex; flex-wrap: wrap; gap: .25rem; }
    .nav-title { flex-basis: 100%; }
    main, .topbar { padding: 1rem; }
    .module-grid { gap: 0; }
}

fieldset { min-inline-size: 0; }
legend { font-weight: bold; padding-inline: .5rem; }
form label { display: block; margin-block-end: .8rem; }
input, select, textarea { display: block; width: 100%; max-width: 38rem; border: 1px solid var(--border); border-radius: 9px; padding: .5rem; font: inherit; color: var(--ink); background: var(--surface); }
button.button { border: 0; font: inherit; cursor: pointer; margin-block-end: .5rem; }
button.button:disabled { opacity: .65; cursor: default; }
.work-list { padding-inline-start: 1.4rem; overflow-wrap: anywhere; }
.work-list li { margin-block: .7rem; }
.page-links { display: flex; gap: 1rem; flex-wrap: wrap; }

[hidden] { display: none !important; }
.order-progress { display: flex; gap: 1rem; flex-wrap: wrap; list-style: none; padding: 0; }
.order-progress li { padding: .7rem 1rem; border: 1px solid var(--border); border-radius: 9px; }
.order-progress .complete { background: var(--tint); }
.order-progress .current { border: 2px solid var(--blue); font-weight: bold; }

.page-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.table-scroll { overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; margin-block: .8rem; text-align: start; }
.data-table th, .data-table td { padding: .8rem; border-bottom: 1px solid var(--border); vertical-align: top; text-align: start; overflow-wrap: anywhere; }
.data-table thead { background: var(--tint); }
.data-table tbody tr:nth-child(even) { background: var(--stripe); }
.order-facts th { width: 16%; color: var(--muted); font-weight: normal; }
.order-facts td { width: 34%; }
.services-table { min-width: 46rem; }
.specification-table { min-width: 18rem; }
.specification-table th, .specification-table td { padding: .45rem; }
details > summary { cursor: pointer; color: var(--link); padding-block: .3rem; }
.muted { color: var(--muted); }
.audit-timeline { list-style: none; padding: 0; margin: 0; border-inline-start: 2px solid var(--border); }
.audit-timeline li { position: relative; padding-inline-start: 1.4rem; padding-block: .8rem; }
.audit-timeline li::before { content: ''; position: absolute; inset-inline-start: -.4rem; inset-block-start: 1.2rem; width: .7rem; height: .7rem; border-radius: 50%; background: var(--blue); }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 650px) {
    .order-facts, .order-facts tbody { display: block; }
    .order-facts tr { display: grid; grid-template-columns: 1fr 2fr; }
    .order-facts th, .order-facts td { width: auto; }
    .order-facts [colspan] { grid-column: 2; }
}

.checkbox-control { display: flex; align-items: center; gap: .65rem; }
.checkbox-control input[type="checkbox"] { width: auto; display: inline-block; }
.status-pill { display: inline-block; padding: .15rem .6rem; border-radius: 9px; background: var(--tint); color: var(--blue-dark); }
textarea { min-height: 5rem; }

:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] {
    color-scheme: dark;
    --ink: #E4EDF5; --muted: #A6B7C8; --border: #364D62;
    --surface: #192A3A; --background: #101C28; --tint: #223B50;
    --stripe: #1C3042; --link: #8BC9F0; --blue-dark: #A6D5F3; --focus: #86C9F2;
}
:root[data-theme="dark"] .button:hover { background: #104364; }
.brand { display: inline-flex; background: #FFFFFF; padding: .35rem .6rem; border-radius: 9px; }
.brand img { display: block; width: min(260px, 65vw); height: auto; }
.header-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem; }
.header-actions .button { margin: 0; }

input[type="checkbox"], input[type="radio"] { display: inline-block; width: auto; margin-inline-end: .5rem; accent-color: var(--blue); }

:root { --success-bg: #E5F5EB; --success-ink: #155D32; --success-border: #25804B; --warning-bg: #FFF1D9; --warning-ink: #713F06; --warning-border: #AD690D; --danger-bg: #FDE7E7; --danger-ink: #8A1C1C; }
:root[data-theme="dark"] { --success-bg: #153D30; --success-ink: #B6F0CE; --success-border: #5CC78A; --warning-bg: #47351C; --warning-ink: #FFD89B; --warning-border: #E8AD4D; --danger-bg: #482429; --danger-ink: #FFB9BE; }
.notice-success, [role="status"].notice { background: var(--success-bg); color: var(--success-ink); border: 1px solid var(--success-border); border-inline-start-width: 5px; border-radius: 9px; padding: 1rem; }
.notice-warning, .notice:has(li), .notice[role="alert"] { background: var(--warning-bg); color: var(--warning-ink); border: 1px solid var(--warning-border); border-inline-start-width: 5px; border-radius: 9px; padding: 1rem 1.5rem; }
[role="alert"] { background: var(--danger-bg); color: var(--danger-ink); border-radius: 9px; padding: 1rem; }
.button-secondary { background: var(--tint); color: var(--link); border: 1px solid var(--border); }
.button-secondary:hover { color: white; background: #185B84; }
.section-menu { display: flex; gap: .6rem; flex-wrap: wrap; margin-block: 1rem; }
.section-menu [aria-current] { border: 2px solid var(--focus); font-weight: bold; }
.page-heading > a:not(.button), .page-links > a:not(.button), .data-table td > a:not(.button), main > a:not(.button) { display: inline-block; padding: .5rem .85rem; background: var(--tint); border: 1px solid var(--border); border-radius: 9px; text-decoration: none; }
.page-heading > a:not(.button):hover, .page-links > a:not(.button):hover, .data-table td > a:not(.button):hover, main > a:not(.button):hover { outline: 2px solid var(--focus); }

/* Compact workspaces remain RTL; the content column is centered within the canvas. */
.shell { grid-template-columns: 13rem minmax(0, 1fr); width: 100%; max-width: none; margin-inline: 0; align-items: start; }
.shell > nav { position: sticky; top: 0; max-height: 100svh; overflow-y: auto; padding: 1rem .75rem; }
main { margin-inline: auto; max-width: 98rem; padding: 1.25rem; min-width: 0; }
.panel { padding: 1rem 1.2rem; margin-block: .75rem; }
h1 { font-size: clamp(1.5rem, 3vw, 2rem); }
.data-table th, .data-table td { padding: .55rem .65rem; }
.form-grid, .service-card { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem 1.2rem; align-items: start; }
.form-grid input, .form-grid select, .form-grid textarea, .service-card input, .service-card select, .service-card textarea { max-width: none; }
.form-grid .span-all, .service-card > legend, .service-card > p, .service-card > button { grid-column: 1 / -1; }
.form-grid > label { margin: 0; }
.form-grid > .notice, .form-grid > .muted { grid-column: 1 / -1; }
.product-create > summary { display: inline-flex; color: white; padding: .6rem 1rem; }
.product-create[open] > summary { margin-block-end: .8rem; }
.order-progress { gap: .5rem; }
.order-progress li { padding: .5rem .7rem; }
.order-progress .complete { background: var(--success-bg); color: var(--success-ink); border-color: var(--success-border); }
.preserve-lines { white-space: pre-wrap; overflow-wrap: anywhere; }
.auth-page { display: grid; place-items: center; min-height: 100svh; padding: 1.5rem 1rem; background: #F3F6F9; }
.auth-page .auth-main { width: min(100%, 30rem); max-width: 30rem; padding: 0; margin: auto; }
.auth-brand { display: flex; width: max-content; margin: 0 auto 1.5rem; }
.auth-main .panel { padding: 1.5rem; }
.auth-form input { max-width: none; }
.auth-form .button { width: 100%; }
@media (max-width: 800px) {
    .shell { grid-template-columns: 1fr; }
    .shell > nav { position: static; max-height: none; }
    main { padding: 1rem; }
}
@media (max-width: 650px) {
    .form-grid, .service-card { grid-template-columns: 1fr; }
}

.order-secondary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.order-secondary-grid .panel { min-width: 0; }
.order-history > summary { font-weight: bold; font-size: 1.1rem; }
@media (max-width: 1000px) { .order-secondary-grid { grid-template-columns: 1fr; } }

.dashboard-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;align-items:start}
.dashboard-grid .panel{margin:0;min-width:0;padding:1rem}
.dashboard-wide{grid-column:1/-1}
.dashboard-grid .data-table th,.dashboard-grid .data-table td{padding:.65rem}
.compact-form{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.compact-form select{max-width:12rem}
.sla-overdue td{background:color-mix(in srgb,#b42318 17%,var(--surface));border-color:#d94b42}
.sla-overdue td:first-child{border-inline-start:4px solid #d94b42}
.photo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,220px));gap:1rem}
.photo-grid figure{margin:0}.photo-grid img{width:100%;height:150px;object-fit:cover;border-radius:8px}
.installation-report{margin-top:1rem;border-top:1px solid var(--border);padding-top:1rem}
@media(max-width:1100px){.dashboard-grid{grid-template-columns:1fr}.dashboard-wide{grid-column:auto}}

.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

body{font-family:Assistant,Arial,sans-serif}
.auth-page .auth-main > .auth-brand{display:flex;justify-content:center;width:max-content;margin:0 auto 1.5rem;padding:.35rem .6rem;background:white}
.shell{align-items:stretch;min-height:calc(100svh - 9rem)}
.shell > nav{position:relative;top:auto;max-height:none;overflow:visible;display:flex;flex-direction:column;min-height:calc(100svh - 9rem)}
.nav-greeting{padding:.5rem;margin:0 0 .8rem;line-height:1.6}
.nav-main{flex:1}.nav-footer{margin-top:2rem;padding-top:1rem;border-top:1px solid var(--border)}
.nav-footer .button{width:100%}
.service-card > .span-all{grid-column:1/-1}
.ip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.equipment-card{background:var(--stripe);border:1px solid var(--border);border-radius:9px;padding:.8rem}
.equipment-card > div{margin-block:.5rem}
.contact-grid input{max-width:none}
.mfa-qr{display:block;background:white;padding:12px;margin:1rem auto;max-width:100%;height:auto}
.delivery-preview{width:100%;min-height:75vh;border:1px solid var(--border);border-radius:9px;background:white}
@media(max-width:700px){.ip-grid{grid-template-columns:1fr}.shell>nav{min-height:auto}.nav-footer{margin-top:1rem}}
