/* CoproSécurit · shared visual identity. Loaded after each screen's layout CSS. */
:root {
  --brand-navy:#1f2230;
  --brand-navy-deep:#151a29;
  --brand-amber:#f6aa12;
  --brand-amber-light:#ffcb46;
  --brand-ink:#252b39;
  --brand-muted:#627082;
  --brand-line:#dce2eb;
  --brand-surface:#fff;
  --brand-canvas:#f4f6f9;
  --brand-soft:#f9fafc;
  --brand-shadow:0 14px 42px rgba(20,28,45,.065);
  --ink:var(--brand-ink);
  --accent:#bd6c00;
  --line:var(--brand-line);
  color:var(--brand-ink);
  background:var(--brand-canvas);
  color-scheme:light;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
html {scroll-behavior:smooth}
body {color:var(--brand-ink);background:var(--brand-canvas);line-height:1.5}
body:has(.portfolio-home),:root:has(.portfolio-home) {background:var(--brand-canvas)}
button,a,input,select,textarea {transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease,transform .16s ease}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible {outline:3px solid var(--brand-amber);outline-offset:3px}
button:active,.button:active,.primary:active {transform:translateY(1px)}
::selection {background:#ffe7a0;color:var(--brand-navy-deep)}

/* Global application chrome */
.app-header,.topbar,.toolbar {background:linear-gradient(115deg,#171d2e 0%,#26293a 65%,#34313a 100%);border-bottom:3px solid var(--brand-amber);box-shadow:0 7px 25px rgba(12,18,35,.15)}
.app-header {min-height:76px;height:auto}
.app-brand,.brand {gap:12px}
.app-brand-mark,.brand-mark {display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:13px;background:#0d2042;overflow:hidden;box-shadow:0 0 0 1px #ffffff30,0 7px 18px #0003}
.app-brand-mark img,.brand-mark img {width:100%;height:100%;object-fit:cover;display:block}
.app-brand-name strong,.brand strong {color:#fff;letter-spacing:-.025em;font-size:17px}
.app-brand-name small,.brand small {color:#ffcb65;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:10px}
.app-header .pill {background:#ffffff18;border:1px solid #ffffff38;color:#fff}
.app-header .pill.offline {background:#fff3d0;border-color:#ffc854;color:#6e4500}
.app-switch,#dossierBackLink {border-color:#ffffff50;background:#ffffff12;color:#fff}
.app-switch:hover,#dossierBackLink:hover {background:#ffffff24;border-color:var(--brand-amber-light);color:#fff}
.topbar nav a {color:#e2e5ef}.topbar nav a:hover,.topbar nav a[aria-current] {color:var(--brand-navy-deep);background:var(--brand-amber-light)}
.user-label {color:#d1d5e1}

/* Shells, panels and hierarchy */
main {color:var(--brand-ink)}
.card,.pref-form,.summary,.camera-panel,.imported-plan,.project-settings,.plan-exports,.client-estimate-details,.pref-checks,.pref-versions,.login-card,.client-copy-card {background:var(--brand-surface);border-color:var(--brand-line);box-shadow:var(--brand-shadow);border-radius:16px}
.card h1,.card h2,.card h3,.main h1,.main h2,.main h3,.main h4 {color:var(--brand-ink)}
.muted,.hint,.fine,.project-heading p,.section-heading p,.portfolio-sync {color:var(--brand-muted)}
.portfolio-home {max-width:940px}
.portfolio-heading {padding:21px 26px;margin:0 0 17px;border-radius:19px;background:linear-gradient(120deg,#212536,#303446);box-shadow:var(--brand-shadow);color:white;position:relative;overflow:hidden}
.portfolio-heading::after {content:"";position:absolute;width:190px;height:190px;right:-55px;top:-95px;border:27px solid #ffb91a2b;border-radius:50%;pointer-events:none}
.portfolio-heading h1 {color:#fff;font-size:clamp(28px,3.5vw,38px);letter-spacing:-.045em}
.portfolio-eyebrow,.eyebrow,.sidebar-head small {color:#b96e00;letter-spacing:.14em}
.portfolio-heading .portfolio-eyebrow {color:#ffce69}
.portfolio-count {position:relative;background:#ffffff1c;color:#fff;border:1px solid #ffffff45;font-size:13px;padding:6px 12px}
.portfolio-search input,.search input {background:#fff;border:1px solid var(--brand-line);min-height:47px;box-shadow:0 5px 18px #222a3a08}
.portfolio-item,.site-card,.project-item,.camera-item {border-color:var(--brand-line);background:#fff;color:var(--brand-ink);border-radius:13px}
.portfolio-item {min-height:78px;padding:15px 18px;box-shadow:0 6px 19px #20293b09}
.portfolio-item:hover,.portfolio-item:focus-visible,.site-row .site-entry:hover,.project-item:hover,.camera-item:hover {background:#fffaf0;border-color:#e5b44c;box-shadow:0 8px 25px #20293b10}
.portfolio-item strong {font-size:15px}.portfolio-item small,.project-item small,.site-info small {color:var(--brand-muted)}
.portfolio-arrow,.site-chevron {color:#bf7400}
.portfolio-empty {border-color:#d9dee8;background:#fff;color:var(--brand-muted)}
.sidebar {background:#fdfdfe;border-right-color:var(--brand-line)}
.sidebar-head h1 {color:var(--brand-ink)}
.project-item.active {background:#fff3d9;box-shadow:inset 3px 0 var(--brand-amber);border-color:#ffdb83}
.sidebar-foot {border-top-color:var(--brand-line);color:var(--brand-muted)}
.count,.status {background:#fff2d4;color:#815200}
.metric-grid article,.steps>div {border-color:var(--brand-line);border-radius:15px;box-shadow:0 6px 22px #20293b09}
.metric-grid strong {color:var(--brand-navy)}.metric-grid span,.steps span {color:var(--brand-muted)}
.steps b {background:#ffe8ad;color:#674000}
.tabs,.dossier-tabs {border-bottom-color:var(--brand-line)}
.tabs button,.tabs a,.dossier-tabs button {color:#586477}
.tabs button[aria-selected="true"],.dossier-tabs button[aria-current="page"],.tabs a:hover,.dossier-tabs button:hover {color:#9d5b00;border-bottom-color:var(--brand-amber)}
.site-dot {background:var(--brand-amber)}
.site-count {background:#f2f4f8;color:#566476}
.map,.plan-map,.plan-image {background:#eef1f6;border-color:var(--brand-line)}
.camera-item.active {background:#fff5df;border-color:#e2ac43}
.notice,.success {background:#edf4f1;border-color:#b8d4c8;color:#244e41}
.notice.warning,.warn,.warning {background:#fff6e3;border-color:#ebbe63;color:#704808}

/* Actions and forms */
button:not(.icon):not(.text-button):not(.photo-zoom),.button,.primary,.secondary-link {font-weight:700}
.primary-wide,.button:not(.secondary),.primary,.portfolio-create,.actions button:not(.secondary):not(.danger),.form-actions button:not(.secondary):not(.text-button),.login-card button[type=submit] {background:var(--brand-amber-light);border-color:#f0ad20;color:#25202a;box-shadow:0 5px 14px #b675111c}
.primary {text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.primary-wide:hover,.primary:hover,.portfolio-create:hover,.actions button:not(.secondary):not(.danger):hover,.form-actions button:not(.secondary):not(.text-button):hover,.login-card button[type=submit]:hover {background:#f6ad1f;border-color:#d48905;color:#201d26}
button.secondary,.button.secondary,.secondary-link {background:#fff;border:1px solid #cbd3e0;color:#30394a;box-shadow:none}
button.secondary:hover,.secondary-link:hover {background:#fff8e8;border-color:#e4b354;color:#6b4400}
.text-button,.legacy-link,.document-link {color:#9d5b00}
input,textarea,select {background:#fff;border-color:#cbd3df;color:var(--brand-ink);border-radius:10px}
input:focus,textarea:focus,select:focus,.search input:focus {border-color:#cb8c12;box-shadow:0 0 0 3px #ffc64445}
label,summary {color:var(--brand-ink)}
details,.plan-zones,.map-create-form,.map-settings,.pref-table-editor,.client-tools,.dossier-form-options {border-color:var(--brand-line);background:var(--brand-soft)}
details[open] {border-color:#d9bd7c}
details>summary:hover {color:#975a00}
.maintenance-tabs button[aria-selected=true],.mobile-plan-nav button[aria-pressed="true"] {background:var(--brand-navy);border-color:var(--brand-navy);color:#fff}
.maintenance-projections>div {background:#fff8e8}
.maintenance-estimate-row .actions {flex:0 1 350px;margin-top:0}
.maintenance-estimate-row .actions button {min-width:0;font-size:13px;padding:8px 10px}
#maintenanceContract {scroll-margin-top:90px}
#contractPreview {margin-top:18px;background:#fff8e8}
@media(max-width:699px) {.maintenance-estimate-row {display:block}.maintenance-estimate-row .actions {margin-top:12px}.maintenance-estimate-row .actions button {flex:1}}

/* Terrain navigation */
nav#bottom {background:#fff;border-color:var(--brand-line);box-shadow:0 -8px 27px #1b283313}
nav#bottom button {background:transparent;color:#536072}
nav#bottom button:hover,nav#bottom button:focus-visible {background:#fff3d6;color:#6f4600}
nav#bottom svg {width:23px;height:23px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
nav#bottom span {font-weight:700}
@media(min-width:1100px) {nav#bottom {box-shadow:5px 0 24px #1b28330b}nav#bottom button {border-radius:11px}}

/* Access screens and printable preview */
.center.card,.login-card {border:1px solid var(--brand-line);box-shadow:0 22px 70px #1822351c;padding:clamp(23px,4vw,38px)}
.center.card h1,.login-card h1 {font-size:clamp(25px,3vw,32px);letter-spacing:-.04em}
.login-logo {display:block;width:min(100%,245px);height:auto;margin:0 auto 22px}
.center.card {max-width:480px}
.login-panel {background:radial-gradient(circle at 10% 10%,#ffe9bc 0,transparent 32%),var(--brand-canvas)}
.empty-icon {background:#fff1d0;color:#975b00}
.empty-icon img {display:block;width:100%;height:100%;object-fit:cover;border-radius:24px}
.toolbar a {color:#ffd16b}.toolbar button {background:var(--brand-amber-light);color:var(--brand-navy)}
.cover {border-top:5px solid var(--brand-amber);padding-top:25px}
.cover-logo {display:block;width:220px;max-width:55%;height:auto;margin:0 0 22px}
.kicker {color:#9b5b00}.summary span {background:#fff3db;color:#5f420c}
th {background:#fff4dc;color:#3f3440}

@media(max-width:700px) {
  .app-header {min-height:64px}
  .app-brand-mark,.brand-mark {width:38px;height:38px;border-radius:11px}
  .app-brand-name strong {display:block;font-size:14px}
  .app-brand-name small {font-size:9px}
  .portfolio-heading {padding:20px;margin:0 0 16px}
  .portfolio-heading h1 {font-size:29px}
  .portfolio-item {min-height:76px}
  .tabs {background:#fff;border-color:var(--brand-line)}
  .mobile-plan-nav {background:#fff;border-color:var(--brand-line)}
  .sidebar .project-item {background:#fff;border-color:var(--brand-line)}
  .sidebar .project-item.active {background:#fff3d9;border-color:#ffd47c}
}
@media(max-width:420px) {.app-brand-name strong {font-size:13px}.app-brand-name small {font-size:9px}.app-header {gap:8px}}
@media(prefers-reduced-motion:reduce) {*,*::before,*::after {scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
@media print {html,body {background:#fff!important}.toolbar,nav#bottom {display:none!important}.cover {border-top:4px solid var(--brand-amber)}main {box-shadow:none!important}}
