/* Atelier Expert — restrained workspace */
:root {
  --primary: #c72d2b;
  --primary-light: #d94843;
  --dark: #1d232b;
  --text: #29313a;
  --text-light: #69727e;
  --text-lighter: #9aa3ad;
  --border: #e2e6eb;
  --white: #fff;
  --bg-light: #f7f8fa;
  --bg-card: #fff;
  --shadow-sm: 0 1px 2px rgba(20,30,42,.03);
  --shadow-md: 0 8px 24px rgba(20,30,42,.05);
  --shadow-lg: 0 12px 32px rgba(20,30,42,.055);
}
html { scroll-behavior: smooth; }
body, body.dark-mode { font-family: Inter,system-ui,sans-serif; }
body { background: #f7f8fa; color: var(--text); line-height: 1.5; }
button, input, textarea { font: inherit; }
button:focus-visible, input:focus-visible, textarea:focus-visible, .tool-card:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.sidebar-menu {
  width: 230px; background: #fff; border-right: 1px solid #e8ebef;
  box-shadow: none; padding: 32px 14px; align-items: stretch; justify-content: flex-start;
  gap: 3px; backdrop-filter: none;
}
.brand { margin: 0 12px 50px; gap: 10px; color: #1d232b; }
.brand-mark { background: #c72d2b; border-radius: 8px; width: 36px; height: 36px; font-size: 25px; }
.brand-copy { font-size: 12px; letter-spacing: .11em; }
.brand-copy b { color: #c72d2b; }
.brand-copy small { color: #89939f; font-size: 11px; }
.nav-caption { color: #a0a8b1; margin: 0 12px 11px; font-size: 10px; }
.sidebar-btn {
  color: #697480; border-radius: 8px; width: 100%; height: 46px;
  justify-content: flex-start; gap: 13px; padding: 0 13px; margin: 0;
  font-size: 13px; font-weight: 600; transition: background .18s,color .18s;
}
.sidebar-btn svg { width: 18px; height: 18px; }
.sidebar-btn:hover { background: #f6f7f9; color: #202932; transform: none; }
.sidebar-btn.active { background: #f8eeee; color: #b62725; box-shadow: none; }
.sidebar-btn.active:before { display: none; }
.page,.menu-page { margin-left: 230px; padding: 0; min-height: 100vh; animation: none; }
.page.active { display: flex; flex-direction: column; align-items: stretch; }
.workspace-top {
  background: #fff; border-bottom: 1px solid #e8ebef; height: 64px;
  padding: 0 clamp(26px,4vw,64px); color: #9aa3ac;
  font-size: 11px; letter-spacing: .12em;
}
.top-divider { color: #cdd3d9; }
.top-right { color: #9aa3ac; font-weight: 500; }
.container {
  max-width: 1100px; width: calc(100% - 72px); margin: 38px auto 70px;
  background: #fff; border: 1px solid #e8ebef; box-shadow: none;
  padding: clamp(26px,4vw,52px); border-radius: 12px; animation: none;
}
.container h2,.dashboard-header h1 { background: none; color: #1e252d; -webkit-text-fill-color: initial; letter-spacing: -.04em; text-align: left; }
.container h2 { font-size: clamp(1.75rem,2.7vw,2.2rem); line-height: 1.15; }
.page-intro { margin-bottom: 28px; padding-bottom: 25px; border-bottom: 1px solid #e7ebef; }
.page-intro h2 { margin: 11px 0 9px; }
.page-intro p { font-size: 15px; line-height: 1.55; color: #76808b; }
.eyebrow { color: #b52d2a; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.eyebrow:before { width: 16px; }
#livraison .container { max-width: 1190px; padding: 0; border: 0; background: transparent; }
#livraison .page-intro { border: 0; padding: 0; margin: 0 0 28px; }
#livraison .page-intro h2 { font-size: clamp(2rem,3vw,2.65rem); margin: 12px 0 9px; }
.delivery-workspace { display: grid; grid-template-columns: minmax(0,1.22fr) minmax(340px,.82fr); gap: 22px; align-items: start; }
.delivery-inputs,.delivery-output {
  background: #fff; border: 1px solid #e6e9ed; border-radius: 12px;
  box-shadow: 0 2px 12px rgba(24,34,46,.025);
}
.delivery-inputs { padding: clamp(24px,3vw,38px); }
.delivery-output { min-height: 554px; position: sticky; top: 18px; overflow: hidden; }
.section-kicker { margin: 0 0 15px; gap: 10px; font-size: 11px; letter-spacing: .04em; color: #b52d2a; }
.section-kicker span { font-size: 14px; color: #2a333c; }
.section-kicker:after { background: #e9edf0; }
.magasin-selector { gap: 9px; padding: 0; border: 0; box-shadow: none; background: none; margin: 0 0 29px; }
.magasin-option {
  flex: 1; background: #fafbfc; color: #52606d; border: 1px solid #e0e5e9;
  border-radius: 8px; text-align: center; padding: 12px 15px; font-size: 14px;
  font-weight: 600; box-shadow: none; transform: none; transition: border-color .18s,background .18s;
}
.magasin-option:hover { background: #f5f6f8; border-color: #abb6bf; }
.magasin-option.active { background: #fff; color: #b62b28; border: 1px solid #c72d2b; box-shadow: 0 0 0 2px rgba(199,45,43,.065); transform: none; }
.form-row { gap: 16px; }
.form-group { margin-bottom: 18px; min-width: 0; }
.form-group label { color: #495561; font-size: 13px; text-transform: none; letter-spacing: 0; font-weight: 650; margin-bottom: 7px; }
input,select,textarea {
  background: #fff; border: 1px solid #dbe1e6; border-radius: 7px;
  color: #26313a; box-shadow: none; font-size: 14px;
}
input,select { padding: 11px 13px; min-height: 44px; }
input::placeholder,select::placeholder { color: #a5aeb7; }
input:focus,select:focus { border-color: #c72d2b; box-shadow: 0 0 0 3px rgba(199,45,43,.09); transform: none; }
.delivery-actions { display: flex; gap: 10px; margin-top: 7px; }
.delivery-actions .main-btn { min-width: 0; flex: 1; }
.delivery-actions .secondary-btn { min-width: 0; width: auto; margin: 0; }
.main-btn,.secondary-btn { border-radius: 7px; font-size: 13px; letter-spacing: 0; text-transform: none; font-weight: 700; padding: 12px 17px; box-shadow: none; transition: background .18s,border-color .18s,box-shadow .18s; }
.main-btn { background: #c72d2b; }
.main-btn:hover { background: #a92322; transform: none; box-shadow: none; }
.main-btn:before { display: none; }
.secondary-btn { background: #fff; color: #5d6974; border: 1px solid #dce2e6; }
.secondary-btn:hover { background: #f5f7f8; color: #29323b; border-color: #bec8d0; transform: none; box-shadow: none; }
.result-placeholder { min-height: 554px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 45px; }
.result-placeholder-icon { width: 48px; height: 48px; display: grid; place-items: center; color: #c72d2b; background: #f9eeee; border-radius: 10px; margin-bottom: 32px; }
.result-placeholder-icon svg { width: 27px; height: 27px; }
.result-overline { color: #b52d2a; font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.result-placeholder h3 { font-size: 1.35rem; margin: 9px 0 7px; letter-spacing: -.025em; color: #27313a; }
.result-placeholder p { font-size: 14px; line-height: 1.6; color: #86919b; max-width: 280px; }
#resultsContainer { padding: 25px; margin: 0 !important; animation: none !important; }
#livraison .results-box { margin: 0; padding: 0; background: none; border: 0; box-shadow: none; animation: none; }
#livraison .results-box h3 { font-size: 1.1rem; margin-bottom: 16px; color: #25303a; }
#livraison .result-table { border-spacing: 0; }
#livraison .result-table td { padding: 12px 6px; border: 0; border-bottom: 1px solid #e9edf0; border-radius: 0; background: none; font-size: 13px; }
#livraison .result-table td:first-child { color: #697580; }
#livraison .result-table td:last-child { color: #29333c; white-space: nowrap; }
#livraison .result-table tr[style] td { background: #f7f8fa; border: 0; padding: 14px 8px; }
#map { height: 270px; margin-top: 24px; border: 1px solid #e6eaee; border-radius: 8px; box-shadow: none; }
#promo .container,#itineraire .container,#entreprise .container,#admin .container { max-width: 940px; }
.promo-card,.promo-results,.help-box { border: 1px solid #e6eaee; border-radius: 9px; box-shadow: none; }
.promo-card { padding: 22px; }
.promo-card-title { color: #6b7580; font-size: 12px; text-transform: none; letter-spacing: 0; }
.promo-input-wrap input { background: #fff; border: 1px solid #dbe1e6; border-radius: 7px; color: #26313a; }
#promo .main-btn { background: #c72d2b !important; }
#promo .main-btn:hover { background: #a92322 !important; }
.help-box { background: #f8fafb; }
.results-box { box-shadow: none; border-color: #e6eaee; background: #fff; }
.result-table td { background: #fff; border-color: #e6eaee; }
.dashboard-container { max-width: 1100px; width: calc(100% - 72px); padding: 0; margin: 38px auto 80px; }
.dashboard-header { display: block; background: none; box-shadow: none; border: 0; padding: 0; margin-bottom: 34px; animation: none; }
.dashboard-header h1 { font-size: clamp(2.1rem,3vw,2.7rem); margin: 9px 0; }
.dashboard-header p { color: #737e89; font-size: 15px; }
.dashboard-header .main-btn { width: auto; }
.dashboard-header .hero-actions { margin-top: 22px; }
.tools-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; }
.tool-card { background: #fff; border: 1px solid #e6e9ed; border-radius: 10px; box-shadow: none; padding: 25px; transition: border-color .18s,transform .18s; }
.tool-card:hover { border-color: #c6cfd6; box-shadow: none; transform: translateY(-2px); }
.card-icon { background: #f8eeee; color: #be2e2a; box-shadow: none; }
.tool-card h3 { color: #29323b; }
.tool-card p { color: #78838d; }
.stats-bar { background: #fff; border: 1px solid #e6e9ed; box-shadow: none; color: #697580; }
body.dark-mode { background: #151a20; color: #e4e8ed; }
body.dark-mode .sidebar-menu,body.dark-mode .workspace-top { background: #1c2229; border-color: #323a43; }
body.dark-mode .brand { color: #f0f2f5; }
body.dark-mode .sidebar-btn { color: #a9b3bd; }
body.dark-mode .sidebar-btn:hover { background: #29313a; color: #fff; }
body.dark-mode .sidebar-btn.active { background: #382929; color: #ffaaa5; }
body.dark-mode .container,body.dark-mode .delivery-inputs,body.dark-mode .delivery-output,body.dark-mode .tool-card,body.dark-mode .promo-card,body.dark-mode .promo-results,body.dark-mode .dashboard-header,body.dark-mode .results-box,body.dark-mode #adminContent > div[style*="background"] { background: #202730 !important; border-color: #36414b !important; color: #e7ebef; box-shadow: none; }
body.dark-mode #livraison .container,body.dark-mode .dashboard-header { background: transparent !important; border: 0 !important; }
body.dark-mode .container h2,body.dark-mode .dashboard-header h1,body.dark-mode .section-kicker span,body.dark-mode .result-placeholder h3,body.dark-mode .tool-card h3,body.dark-mode #livraison .results-box h3 { color: #f0f2f5; -webkit-text-fill-color: initial; }
body.dark-mode .page-intro,body.dark-mode .section-kicker:after { border-color: #36414b; }
body.dark-mode .section-kicker:after { background: #36414b; }
body.dark-mode .magasin-option { background: #252e37; border-color: #3e4a55; color: #d1d9df; }
body.dark-mode .magasin-option.active { background: #382929; color: #ffb1ab; border-color: #c9514a; }
body.dark-mode input,body.dark-mode select,body.dark-mode textarea,body.dark-mode .promo-input-wrap input { background: #252e37; border-color: #40505c; color: #e7edf1; }
body.dark-mode .form-group label,body.dark-mode .promo-card-title { color: #c4ced6; }
body.dark-mode .secondary-btn { background: #252e37; color: #d0d9e0; border-color: #42505b; }
body.dark-mode .result-placeholder-icon { background: #3c2a2c; color: #f09790; }
body.dark-mode #livraison .result-table td { background: none; border-color: #38434e; color: #d4dce2; }
body.dark-mode #livraison .result-table tr[style] td { background: #29333c; }
body.dark-mode .help-box,body.dark-mode .stats-bar { background: #252e37 !important; border-color: #3e4a55; color: #d4dce2; }
@media(max-width:1050px) { .delivery-workspace { grid-template-columns: minmax(0,1fr); } .delivery-output { position: static; min-height: 0; } .result-placeholder { min-height: 220px; padding: 30px; } }
@media(max-width:960px) { .sidebar-menu { width: 74px; padding: 25px 9px; align-items: center; } .brand-copy,.nav-caption,.nav-label { display: none; } .sidebar-btn { width: 52px; justify-content: center; padding: 0; } .page,.menu-page { margin-left: 74px; } .container,.dashboard-container { width: calc(100% - 44px); } }
@media(max-width:650px) {
  .sidebar-menu { width: 100%; height: 64px; padding: 6px 4px; top: auto; bottom: 0; left: 0; right: 0; flex-direction: row; justify-content: space-around; border: 0; border-top: 1px solid #e8ebef; }
  .brand,.nav-caption { display: none; }
  .sidebar-btn { width: 16.6%; height: 51px; flex-direction: column; justify-content: center; padding: 3px; gap: 2px; font-size: 10px; }
  .sidebar-btn svg { width: 19px; height: 19px; }
  .nav-label { display: block; font-size: 10px; white-space: nowrap; }
  .page,.menu-page { margin: 0; padding-bottom: 70px; min-height: calc(100vh - 64px); }
  .workspace-top { height: 56px; padding: 0 19px; }
  .top-right { display: none; }
  .container,.dashboard-container { width: calc(100% - 30px); margin: 24px auto 36px; }
  #livraison .page-intro { margin-bottom: 22px; }
  #livraison .page-intro h2 { font-size: 2rem; }
  .delivery-workspace { gap: 14px; }
  .delivery-inputs { padding: 22px 18px; }
  .form-row { display: block; }
  .magasin-option { padding: 12px 8px; }
  .delivery-actions { flex-direction: column; }
  .delivery-actions .main-btn,.delivery-actions .secondary-btn { width: 100%; }
  .result-placeholder { min-height: 200px; padding: 26px; }
  .result-placeholder-icon { margin-bottom: 18px; }
  .tools-grid { grid-template-columns: 1fr; }
  .dashboard-header .main-btn { width: 100%; }
}
@media(prefers-reduced-motion: reduce) { *,*:before,*:after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }
/* Complete dark palette for legacy panels and generated results. */
body.dark-mode {
  --white: #202730; --bg-card: #202730; --bg-light: #252e37;
  --text: #e7ebef; --text-light: #b7c3cc; --text-lighter: #a3b0bb;
  --dark: #eef1f4; --border: #3b4751; --primary: #e2746e;
  --primary-light: #f18d86;
}
body.dark-mode .page-intro p,body.dark-mode .tool-card p,body.dark-mode .dashboard-header p,
body.dark-mode .result-placeholder p { color: #b2bec8; }
body.dark-mode .promo-result-cell,body.dark-mode .promo-result-footer {
  background: #202730; color: #e7ebef; border-color: #39454e;
}
body.dark-mode .promo-result-grid { background: #39454e; }
body.dark-mode .promo-result-cell .cell-label,body.dark-mode .promo-card-title { color: #b7c3cc; }
body.dark-mode .promo-result-cell .cell-value { color: #f2f4f6; }
body.dark-mode .promo-result-cell .cell-value.highlight { color: #f0a39c; }
body.dark-mode .promo-result-cell .cell-value.success { color: #78d0a0; }
body.dark-mode .promo-copy-btn { background: #36434e; color: #f0f3f5; }
body.dark-mode .promo-copy-btn:hover { background: #465663; }
body.dark-mode .promo-check-row,body.dark-mode .promo-input-unit { color: #d5dde3; }
body.dark-mode #promo .container > div[style*="background"] { background: #3a3129 !important; color: #f3c991 !important; border-color: #82613d !important; }
body.dark-mode .help-box h4,body.dark-mode .help-box li,body.dark-mode .help-box p { color: #d4dce3; }
body.dark-mode .help-box p { background: #29343e; border-color: #43515c; }
body.dark-mode #itineraire .container > div[style*="background"] { background: #252e37 !important; border-color: #3d4a55 !important; }
body.dark-mode #itineraire .container > div[style*="background"] h3,
body.dark-mode #itineraire .container > div[style*="background"] p { color: #e0e6eb !important; }
body.dark-mode #startPointDisplay { background: #202730 !important; color: #d4dce3 !important; border: 1px solid #40505b; }
body.dark-mode #destinationList [style*="background"] { background: #29343e !important; border-color: #755f7e; }
body.dark-mode #destinationList [style*="color: #333"] { color: #e7ebef !important; }
body.dark-mode #destinationList [style*="color: #999"] { color: #b7c3cc !important; }
body.dark-mode #itineraireDetails > div { background: #29343e !important; border-color: #54756a !important; }
body.dark-mode #itineraireDetails [style*="color: #666"] { color: #c3cdd5 !important; }
body.dark-mode #totalDistance { color: #78d0a0 !important; }
body.dark-mode #totalDuration { color: #8dc0f4 !important; }
body.dark-mode #itineraireTable thead { background: #2d3842 !important; color: #edf1f4; }
body.dark-mode #itineraireTable th,body.dark-mode #itineraireTable td { border-color: #45515c !important; }
body.dark-mode .result-table td { background: #252e37; color: #dce3e9; border-color: #40505b; }
body.dark-mode .result-table tr[style] td { background: #2d3842; }
body.dark-mode .result-table td:first-child { color: #bac6cf; }
body.dark-mode .result-table td:last-child { color: #f0a39c; }
body.dark-mode #citySuggestions,body.dark-mode #postalSuggestions,
body.dark-mode #startCitySuggestions,body.dark-mode #startPostalSuggestions,
body.dark-mode #destCitySuggestions,body.dark-mode #destPostalSuggestions,
body.dark-mode #entrepriseSuggestions { background: #27313a !important; border-color: #46545e !important; color: #edf1f4; }
body.dark-mode #citySuggestions > div,body.dark-mode #postalSuggestions > div,
body.dark-mode #startCitySuggestions > div,body.dark-mode #startPostalSuggestions > div,
body.dark-mode #destCitySuggestions > div,body.dark-mode #destPostalSuggestions > div,
body.dark-mode #entrepriseSuggestions > div { color: #e6ecf0; border-color: #46545e !important; }
body.dark-mode #adminContent > div[style*="background"] { background: #202730 !important; }
body.dark-mode #adminContent h2 { background: none !important; color: #f0f3f5 !important; -webkit-text-fill-color: #f0f3f5 !important; }
body.dark-mode #adminContent [style*="background:#f8f9fa"],
body.dark-mode #historyContainer [style*="background:var(--white)"],
body.dark-mode #favorisContainer [style*="background"] { background: #29343e !important; border-color: #485660 !important; }
body.dark-mode #adminContent [style*="color:#999"],
body.dark-mode #adminContent [style*="color: #999"] { color: #aebbc5 !important; }
body.dark-mode #statsBars [style*="background:#f0f0f0"] { background: #3c4852 !important; }
body.dark-mode .hist-filter-btn { background: #26313a; color: #d3dce3; border-color: #45525d; }
body.dark-mode .hist-filter-btn.active { background: #793b38; border-color: #bd5952; color: #fff; }
body.dark-mode .modal-content { background: #202730; border-color: #46525b; }
body.dark-mode .modal-content h3 { color: #edf1f4; }
body.dark-mode .modal-content p { color: #bbc6ce; }
body.dark-mode .modal-btn.cancel { background: #303c46; color: #e7ebef; border-color: #50606b; }
/* Align the remaining tools with the quieter visual system. */
#itineraire .container > div[style*="background"] { background: #f8fafb !important; border: 1px solid #e4e9ed !important; border-radius: 9px !important; }
#itineraire .container > div[style*="background"] h3 { color: #34404a !important; }
#itineraire .container > div[style*="background"] p { color: #6d7883 !important; }
#startPointDisplay { border: 1px solid #e2e7eb; }
#itineraireDetails > div { background: #f8fafb !important; border-color: #dce5e9 !important; }
#itineraireTable thead { background: #f6f8f9 !important; }
#adminContent { margin: 35px auto 70px; padding: 0 22px; max-width: 980px !important; }
#adminContent > div[style*="background"] { background: #fff !important; border: 1px solid #e6eaee !important; border-radius: 10px !important; box-shadow: none !important; }
#adminContent [style*="background:#f8f9fa"] { background: #f8fafb !important; border-radius: 8px !important; }
#adminContent h2 { background: none !important; color: #242d36 !important; -webkit-text-fill-color: #242d36 !important; }
#adminContent .hist-filter-btn { background: #fff; border: 1px solid #dfe5e9; border-radius: 6px; box-shadow: none; color: #596570; }
#adminContent .hist-filter-btn.active { background: #f8eeee; border-color: #e5c7c6; color: #a72b28; }
#adminContent .main-btn[style*="background:#2e7d32"],#adminContent .main-btn[style*="background:#f57c00"] { background: #eef1f3 !important; color: #35414b; }
#adminContent .main-btn[style*="background:#d32f2f"] { background: #c72d2b !important; }
body.dark-mode #itineraire .container > div[style*="background"] { background: #252e37 !important; border-color: #3d4a55 !important; }
body.dark-mode #itineraire .container > div[style*="background"] h3,
body.dark-mode #itineraire .container > div[style*="background"] p { color: #e1e7ec !important; }
body.dark-mode #adminContent > div[style*="background"] { background: #202730 !important; border-color: #36414b !important; }
body.dark-mode #adminContent [style*="background:#f8f9fa"] { background: #29343e !important; }
body.dark-mode #adminContent h2 { color: #f0f3f5 !important; -webkit-text-fill-color: #f0f3f5 !important; }
body.dark-mode #adminContent .hist-filter-btn { background: #26313a; color: #d3dce3; border-color: #45525d; }
body.dark-mode #adminContent .hist-filter-btn.active { background: #793b38; border-color: #bd5952; color: #fff; }
body.dark-mode #adminContent .main-btn[style*="background:#2e7d32"],
body.dark-mode #adminContent .main-btn[style*="background:#f57c00"] { background: #303c46 !important; color: #e9eef1; }
body.dark-mode #adminStatTotal { color: #f0a39c !important; }
body.dark-mode #adminStatLivraison { color: #8dc0f4 !important; }
body.dark-mode #adminStatPromo { color: #f5c279 !important; }
body.dark-mode #adminStatItineraire { color: #78d0a0 !important; }
body.dark-mode #adminStatEntreprise { color: #c4a8f6 !important; }
body.dark-mode #historyContainer span[style*="color:"] { color: #dce3e9 !important; background: #35414b !important; }
body.dark-mode #historyContainer [style*="background:var(--white)"] { background: #29343e !important; }
body.dark-mode #entrepriseSuggestions [style*="color:#999"],
body.dark-mode #entrepriseSuggestions [style*="color: #999"] { color: #bac6cf !important; }
@media(max-width:650px) { #adminContent { padding: 0 15px; margin: 22px auto 50px; } }
body.dark-mode #livraison .result-table td:first-child { color: #bac6cf; }
body.dark-mode #livraison .result-table td:last-child { color: #f0a39c; }
/* Keep interactive maps measurable and let Leaflet controls and popups escape the result card. */
.delivery-output { position: static; overflow: visible; }
#map,#mapItineraire { min-width: 0; background: #edf1f3; overflow: hidden; }
.leaflet-container img { max-width: none !important; }
.map-unavailable { display: flex !important; align-items: center; justify-content: center; padding: 24px; text-align: center; color: #56616c; font-size: 14px; line-height: 1.5; }
body.dark-mode .map-unavailable { color: #d0d9e0; background: #29343e !important; }
/* IGN map tiles adapt visually to the browser's dark theme; route and markers stay unfiltered. */
body.dark-mode .leaflet-container { background: #222b34; }
body.dark-mode .leaflet-tile.theme-map-tiles { filter: invert(.92) hue-rotate(180deg) saturate(.65) brightness(.72) contrast(1.08); }
body.dark-mode .leaflet-control-attribution { background: rgba(28,35,43,.88); color: #dce3e8; }
body.dark-mode .leaflet-control-attribution a { color: #bcd8f2; }

/* Notifications use a solid surface and readable text in both browser themes. */
.toast-notification,
body.dark-mode .toast-notification {
  background: #27313b;
  color: #f5f7f8;
  border: 1px solid #3c4b57;
  border-left: 4px solid #86b8e2;
  border-radius: 9px;
  box-shadow: 0 12px 32px rgba(8,15,23,.26);
  max-width: min(380px, calc(100vw - 32px));
  line-height: 1.45;
}
.toast-notification.success,
body.dark-mode .toast-notification.success { background: #27313b; border-left-color: #77c89e; box-shadow: 0 12px 32px rgba(8,15,23,.26); }
.toast-notification.error,
body.dark-mode .toast-notification.error { background: #27313b; border-left-color: #f18e89; box-shadow: 0 12px 32px rgba(8,15,23,.26); }
.toast-notification.warning,
body.dark-mode .toast-notification.warning { background: #27313b; border-left-color: #f0bd74; box-shadow: 0 12px 32px rgba(8,15,23,.26); }
.toast-notification.info,
body.dark-mode .toast-notification.info { background: #27313b; border-left-color: #86b8e2; box-shadow: 0 12px 32px rgba(8,15,23,.26); }
.toast-notification .toast-icon { flex: none; font-size: 16px; line-height: 1; }
@media (max-width: 650px) {
  .toast-container { bottom: 80px; left: 16px; right: 16px; max-width: none; }
  .toast-notification { max-width: none; }
}

/* Fixed foreground colors for controls that used the legacy --white token. */
body.dark-mode .main-btn,
body.dark-mode .promo-mode-pill.active { color: #fff !important; }
body.dark-mode .copy-btn-small { background: #35434f; color: #f4f6f7; }
body.dark-mode .copy-btn-small:hover { background: #455665; }
body.dark-mode .secondary-btn:hover { color: #f4f6f7; }
body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder { color: #aebac5; }
body.dark-mode #destinationList [style*="color:#999"],
body.dark-mode #destinationList [style*="color: #999"],
body.dark-mode #itineraireDetails [style*="color:#333"],
body.dark-mode #itineraireDetails [style*="color: #333"],
body.dark-mode #itineraireDetails [style*="color:#666"],
body.dark-mode #itineraireDetails [style*="color: #666"],
body.dark-mode #itineraire [style*="color: #666"],
body.dark-mode #itineraire [style*="color: #999"] { color: #cbd5dd !important; }
body.dark-mode #promoResultContainer .promo-result-header { color: #f4f6f7; }
body.dark-mode .leaflet-popup-content-wrapper,
body.dark-mode .leaflet-popup-tip { background: #27313b; color: #eef2f5; }
body.dark-mode .leaflet-popup-content [style*="color:#333"] { color: #eef2f5 !important; }
body.dark-mode .leaflet-popup-content [style*="color:#666"] { color: #c3cfd8 !important; }

/* Fence calculator: dimensions remain beside the live 3D view on wide screens. */
.fence-container { max-width: 1240px; }
.fence-workspace { display: grid; grid-template-columns: minmax(280px, .85fr) minmax(0, 1.35fr); gap: 24px; align-items: start; }
.fence-controls,.fence-stage,.fence-summary { background: #fff; border: 1px solid #e2e8ec; border-radius: 11px; }
.fence-controls { padding: 22px; }
.fence-fieldset { border: 0; padding: 0; margin: 0 0 23px; min-width: 0; }
.fence-fieldset:last-of-type { margin-bottom: 0; }
.fence-fieldset legend { width: 100%; padding: 0 0 12px; font-size: 14px; color: #26323c; font-weight: 750; }
.fence-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.fence-fields label { display: block; font-size: 13px; line-height: 1.4; color: #51606b; font-weight: 650; }
.fence-fields label span:not(.fence-field-name) { float: right; font-size: 12px; color: #8b98a2; }
.fence-fields .fence-field-name { color: inherit; }
.fence-wall-field { margin-top: 12px; }
.fence-wall-field[hidden] { display: none; }
.fence-fields label[hidden],.fence-panel-info[hidden] { display: none; }
.fence-panel-info { margin: 12px 0 0; border-left: 3px solid #b72d2b; padding: 8px 12px; background: #fff6f5; color: #586773; border-radius: 3px; font-size: 14px; line-height: 1.5; }
.fence-fields input { display: block; width: 100%; margin-top: 7px; min-width: 0; font-size: 16px; }
.fence-model-label { display: block; font-size: 14px; font-weight: 650; color: #51606b; margin-bottom: 7px; }
.fence-model-select { display: block; width: 100%; min-height: 46px; padding: 9px 12px; border: 1px solid #dce3e8; border-radius: 7px; background: #fff; color: #26323d; font: inherit; font-size: 15px; }
.fence-model-select:focus-visible { outline: 2px solid #c72d2b; outline-offset: 2px; }
.fence-model-details { margin: 10px 0 0; color: #657580; font-size: 13px; line-height: 1.5; }
.fence-fixing { margin-top: 13px; }
.fence-fixing[hidden] { display: none; }
.fence-fixing label { display: block; color: #51606b; font-size: 14px; font-weight: 650; margin-bottom: 7px; }
.fence-materials { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.fence-materials label { position: relative; cursor: pointer; }
.fence-materials input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.fence-materials span { display: block; text-align: center; padding: 10px 8px; border: 1px solid #dce3e8; border-radius: 7px; color: #5c6974; background: #f9fafb; font-size: 14px; font-weight: 650; }
.fence-materials input:checked + span { background: #f8eeee; border-color: #c72d2b; color: #af2b28; }
.fence-materials input:focus-visible + span { outline: 2px solid #c72d2b; outline-offset: 2px; }
.fence-assumption,.fence-note { font-size: 13px; line-height: 1.6; color: #71808a; margin: 16px 0 0; }
.fence-results { min-width: 0; }
.fence-stage { overflow: hidden; background: linear-gradient(180deg,#f8fafb 0%,#e9eef1 100%); }
.fence-stage-top,.fence-stage-bottom { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 20px; font-size: 13px; color: #64727e; }
.fence-stage-top strong { color: #28333d; font-size: 15px; }
.fence-stage-top span { border: 1px solid #dce3e7; border-radius: 20px; padding: 5px 10px; background: #fff; }
.fence-stage-bottom { padding-top: 3px; }
.fence-stage-bottom span { font-weight: 700; color: #384550; }
#fenceCanvas { display: block; width: 100%; height: 345px; touch-action: none; cursor: grab; }
#fenceCanvas:active { cursor: grabbing; }
.fence-cut-view { margin: 0 19px 12px; padding: 16px 18px 12px; border: 1px solid #dce4e9; border-radius: 8px; background: rgba(255,255,255,.82); }
.fence-cut-view > strong { display: block; color: #34414c; font-size: 14px; margin-bottom: 9px; }
.fence-cut-diagram { --fence-measure: #b72d2b; --fence-blade: #a7b1b8; --fence-blade-edge: #76848e; max-width: 460px; }
.fence-cut-diagram[data-material="composite"] { --fence-blade: #94775d; --fence-blade-edge: #6c523e; }
.fence-measure-horizontal { margin-left: 92px; height: 38px; position: relative; color: var(--fence-measure); border-top: 1.5px solid currentColor; top: 20px; text-align: center; }
.fence-measure-horizontal:before,.fence-measure-horizontal:after { content: ''; position: absolute; top: -5px; border-top: 4px solid transparent; border-bottom: 4px solid transparent; }
.fence-measure-horizontal:before { left: 0; border-left: 8px solid currentColor; }
.fence-measure-horizontal:after { right: 0; border-right: 8px solid currentColor; }
.fence-measure-horizontal span { position: relative; top: -17px; display: inline-block; padding: 0 8px; background: #fff; font-size: 13px; font-weight: 750; white-space: nowrap; }
.fence-cut-row { display: grid; grid-template-columns: 82px 1fr; gap: 10px; align-items: stretch; height: 48px; margin-bottom: 18px; }
.fence-measure-vertical { position: relative; display: grid; place-items: center start; color: var(--fence-measure); font-size: 13px; font-weight: 750; white-space: nowrap; }
.fence-measure-vertical:before { content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 1.5px; background: currentColor; }
.fence-measure-vertical:after { content: '▲'; position: absolute; right: -4px; top: -6px; font-size: 9px; line-height: 1; }
.fence-measure-vertical span:after { content: '▼'; position: absolute; right: -4px; bottom: -6px; font-size: 9px; }
.fence-cut-blade { background: linear-gradient(135deg,var(--fence-blade),var(--fence-blade-edge)); border: 1px solid var(--fence-blade-edge); border-radius: 2px; box-shadow: inset 0 2px 0 rgba(255,255,255,.2); }
.fence-cut-view p { color: #667581; font-size: 12px; margin: 10px 0 0 92px; }
.fence-detail.fence-actual-height { color: #a92b27; font-weight: 700; }
.fence-detail.fence-actual-height strong { color: #a92b27; }
body.dark-mode .fence-cut-view { background: #25303a; border-color: #45525d; }
body.dark-mode .fence-cut-view > strong { color: #edf1f4; }
body.dark-mode .fence-cut-diagram { --fence-measure: #f2aaa4; }
body.dark-mode .fence-measure-horizontal span { background: #25303a; }
body.dark-mode .fence-cut-view p { color: #b8c4cc; }
body.dark-mode .fence-detail.fence-actual-height,body.dark-mode .fence-detail.fence-actual-height strong { color: #f2aaa4; }
.fence-summary { margin-top: 14px; padding: 20px; }
.fence-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; margin-bottom: 17px; }
.fence-metrics div,.fence-metrics .fence-pack-trigger { background: #f6f8f9; border-radius: 7px; padding: 13px 9px; min-width: 0; }
.fence-metrics strong { display: block; font-size: clamp(20px,2vw,27px); line-height: 1.15; color: #28333d; }
.fence-metrics span { display: block; font-size: 12px; line-height: 1.3; color: #64727e; margin-top: 6px; }
.fence-pack-trigger { border: 1px solid #e0d4d3; text-align: left; cursor: pointer; font: inherit; width: 100%; transition: border-color .2s,background .2s; }
.fence-pack-trigger:hover,.fence-pack-trigger[aria-expanded="true"] { background: #fcf0ef; border-color: #c72d2b; }
.fence-pack-trigger em { display: block; margin-top: 9px; font-style: normal; color: #ad302d; font-size: 11px; font-weight: 750; }
.fence-pack-panel { margin-top: 12px; padding: 18px 20px; border: 1px solid #e6d2d0; border-radius: 9px; background: #fff8f7; }
.fence-pack-panel[hidden] { display: none; }
.fence-pack-panel label { display: block; color: #34414a; font-size: 14px; font-weight: 700; margin-bottom: 8px; }
.fence-pack-panel input { width: min(100%,180px); min-height: 44px; font-size: 16px; background: #fff; }
.fence-pack-panel p { margin: 10px 0 0; color: #586773; font-size: 13px; line-height: 1.5; }
.fence-pack-panel p strong { display: block; color: #a82b28; font-size: 18px; }
.fence-pack-panel p span { display: block; margin-top: 3px; }
.fence-detail { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 12px; padding: 9px 0; border-top: 1px solid #e7ecef; font-size: 14px; color: #596874; }
.fence-order { margin: 0 0 16px; border: 1px solid #e6d2d0; background: #fff8f7; border-radius: 9px; padding: 15px; }
.fence-order-title { display: block; margin-bottom: 10px; color: #a82b28; font-size: 14px; font-weight: 750; }
.fence-order > div { padding: 10px 0; border-top: 1px solid #eadbd9; }
.fence-order strong,.fence-order > div span { display: block; }
.fence-order strong { font-size: 16px; color: #26323d; }
.fence-order a { color: #a82b28; text-decoration: underline; text-underline-offset: 3px; }
.fence-order > div span { margin-top: 3px; font-size: 13px; line-height: 1.5; color: #596874; }
.fence-variant-note { margin: -4px 0 17px; color: #657580; font-size: 13px; line-height: 1.5; }
.fence-variant-note a { color: #a82b28; text-decoration: underline; text-underline-offset: 3px; }
.fence-detail strong { color: #26323d; text-align: right; }
.fence-cut-list { display: flex; flex-wrap: wrap; gap: 7px; padding: 4px 0 13px; color: #586773; font-size: 13px; }
.fence-cut-list strong { flex-basis: 100%; color: #34414a; }
.fence-cut-list span { background: #f5f7f8; border-radius: 5px; padding: 5px 8px; }
.fence-note { margin: 12px 0 0; }
.fence-error { color: #b72f2b; line-height: 1.5; margin: 0; }
body.dark-mode .fence-controls,body.dark-mode .fence-summary { background: #202730; border-color: #394651; }
body.dark-mode .fence-stage { background: linear-gradient(180deg,#28343f,#1d262f); border-color: #394651; }
body.dark-mode .fence-fieldset legend,body.dark-mode .fence-stage-top strong,body.dark-mode .fence-metrics strong,body.dark-mode .fence-detail strong,body.dark-mode .fence-stage-bottom span { color: #f0f3f5; }
body.dark-mode .fence-fields label,body.dark-mode .fence-stage-top,body.dark-mode .fence-stage-bottom,body.dark-mode .fence-detail { color: #c4ced6; }
body.dark-mode .fence-fields label span,body.dark-mode .fence-assumption,body.dark-mode .fence-note,body.dark-mode .fence-metrics span { color: #aebbc5; }
body.dark-mode .fence-fields .fence-field-name { color: inherit; }
body.dark-mode .fence-model-label,body.dark-mode .fence-model-details,body.dark-mode .fence-fixing label { color: #c4ced6; }
body.dark-mode .fence-model-select { background: #2b3640; color: #f0f3f5; border-color: #46535e; color-scheme: dark; }
body.dark-mode .fence-panel-info { background: #3c3030; color: #e5c8c6; border-color: #ef9991; }
body.dark-mode .fence-order { background: #2a3038; border-color: #60504f; }
body.dark-mode .fence-order-title,body.dark-mode .fence-order a { color: #f2aaa4; }
body.dark-mode .fence-order > div { border-color: #564949; }
body.dark-mode .fence-order strong { color: #f0f3f5; }
body.dark-mode .fence-order > div span { color: #c0ccd5; }
body.dark-mode .fence-variant-note { color: #c0ccd5; }
body.dark-mode .fence-variant-note a { color: #f2aaa4; }
body.dark-mode .fence-materials span,body.dark-mode .fence-stage-top span { background: #2b3640; color: #dae2e7; border-color: #46535e; }
body.dark-mode .fence-materials input:checked + span { background: #493130; border-color: #e07670; color: #ffd1cd; }
body.dark-mode .fence-metrics div { background: #2b3640; }
body.dark-mode .fence-pack-trigger { background: #2b3640; border-color: #604645; }
body.dark-mode .fence-pack-trigger:hover,body.dark-mode .fence-pack-trigger[aria-expanded="true"] { background: #403030; border-color: #e1847d; }
body.dark-mode .fence-pack-trigger em { color: #f2aaa4; }
body.dark-mode .fence-pack-panel { background: #2a3038; border-color: #60504f; }
body.dark-mode .fence-pack-panel label { color: #edf1f4; }
body.dark-mode .fence-pack-panel p { color: #c0ccd5; }
body.dark-mode .fence-pack-panel p strong { color: #f2aaa4; }
body.dark-mode .fence-detail { border-color: #3b4852; }
body.dark-mode .fence-cut-list { color: #d2dce3; }
body.dark-mode .fence-cut-list strong { color: #edf1f4; }
body.dark-mode .fence-cut-list span { background: #303b46; }
body.dark-mode .fence-error { color: #f1a29c; }
/* Fence composer: readable controls and a compact preparation sheet. */
.fence-container { max-width: 1280px; }
.fence-workspace { gap: 24px; }
.fence-controls,.fence-summary,.fence-stage { border-radius: 15px; }
.fence-controls { padding: 26px; }
.fence-fieldset { margin-bottom: 26px; padding-bottom: 24px; border-bottom: 1px solid #e8edf0; }
.fence-fieldset:last-of-type { border-bottom: 0; padding-bottom: 0; }
.fence-fieldset legend { font-size: 15px; padding-bottom: 13px; }
.fence-families span { text-align: left; padding: 13px 15px; min-height: 69px; }
.fence-families span strong,.fence-families span small { display: block; }
.fence-families span strong { font-size: 15px; }
.fence-families span small { margin-top: 4px; font-size: 12px; font-weight: 500; opacity: .82; }
.fence-layout-options span { min-height: 68px; text-align: left; padding: 12px 13px; }
.fence-layout-options small { display: block; margin-top: 5px; font-size: 12px; line-height: 1.3; font-weight: 500; opacity: .82; }
.fence-layout-options input:disabled + span { opacity: .55; cursor: not-allowed; }
#fenceLayoutHint[hidden] { display: none; }
.fence-decor-options { margin-top: 15px; }
.fence-decor-options[hidden] { display: none; }
.fence-decor-options .fence-fields label { grid-column: 1 / -1; font-size: 13px; }
.fence-decor-options .fence-model-select { margin-top: 7px; font-size: 14px; }
.fence-decor-options .fence-model-details { margin-top: 12px; }
.fence-model-select { min-height: 52px; color-scheme: light; }
.fence-model-select option { background: #fff; color: #26323d; }
.fence-model-details { background: #f5f7f8; border-radius: 8px; padding: 11px 13px; font-size: 12px; color: #465460; }
.fence-summary { padding: 22px; background: #fff; border: 1px solid #e1e7eb; }
.fence-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-bottom: 22px; }
.fence-metrics div { min-height: 89px; padding: 15px; border: 1px solid #e8edf0; border-radius: 10px; }
.fence-metrics strong { font-size: 27px; }
.fence-metrics strong small { font-size: 14px; font-weight: 600; }
.fence-metrics span { font-size: 13px; margin-top: 7px; }
.fence-order { padding: 0; margin: 0 0 20px; border: 1px solid #e2e8ec; background: #fff; border-radius: 11px; overflow: hidden; }
.fence-order-title { display: block; margin: 0; padding: 16px 17px; font-size: 15px; color: #26323d; font-weight: 750; }
.fence-order-title small { font-weight: 500; font-size: 12px; color: #7a8790; }
.fence-order .fence-order-item { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 14px 17px; border-top: 1px solid #e8edf0; }
.fence-order-item b { display: block; font-size: 14px; color: #2c3944; }
.fence-order-item small { display: block; margin-top: 4px; font-size: 12px; line-height: 1.45; color: #64727e; }
.fence-order .fence-order-item strong { font-size: 15px; white-space: nowrap; text-align: right; }
.fence-order .fence-order-item a { text-decoration: none; border-bottom: 1px solid currentColor; }
.fence-technical { border: 1px solid #e2e8ec; border-radius: 11px; padding: 0 17px 7px; }
.fence-technical .fence-order-title { padding-left: 0; }
.fence-technical .fence-detail:first-of-type { border-top: 0; }
.fence-warning { margin: 0 0 16px; padding: 13px 15px; background: #fff1ee; border: 1px solid #e7c6c1; border-radius: 8px; font-size: 13px; }
.fence-decor-alert { margin: 0 0 12px; padding: 11px 13px; background: #f4f7f9; border: 1px solid #dce5ea; border-radius: 8px; color: #3f505b; font-size: 13px; line-height: 1.45; }
.fence-extras { margin: 16px 0 0; border: 1px solid #e2e8ec; border-radius: 9px; padding: 13px 16px; color: #465460; font-size: 13px; line-height: 1.55; }
.fence-extras summary { cursor: pointer; color: #34414c; font-weight: 700; }
.fence-extras p { margin: 11px 0 0; }
.fence-summary .fence-note { margin-top: 15px; font-size: 12px; }
body.dark-mode .fence-fieldset { border-color: #3b4852; }
body.dark-mode .fence-model-select option { background: #2b3640; color: #f0f3f5; }
body.dark-mode .fence-model-details,body.dark-mode .fence-metrics div { background: #29343e; border-color: #414e59; color: #c9d4dc; }
body.dark-mode .fence-summary,body.dark-mode .fence-order { background: #202730; border-color: #394651; }
body.dark-mode .fence-order-title,body.dark-mode .fence-order-item b,body.dark-mode .fence-extras summary { color: #eef2f4; }
body.dark-mode .fence-order-title small,body.dark-mode .fence-order-item small { color: #b8c5ce; }
body.dark-mode .fence-order .fence-order-item { border-color: #394651; }
body.dark-mode .fence-technical,body.dark-mode .fence-extras { border-color: #394651; color: #c7d2da; }
body.dark-mode .fence-warning { background: #422d2c; border-color: #744947; }
body.dark-mode .fence-decor-alert { background: #29343e; border-color: #46535e; color: #dbe4ea; }
.fence-step { display: inline-grid; place-items: center; width: 25px; height: 25px; margin-right: 8px; border-radius: 50%; background: #f8eeee; color: #af2b28; font-size: 12px; font-weight: 800; }
.fence-choice { margin-bottom: 18px; }
.fence-choice span { text-align: left; padding: 12px 14px; min-height: 69px; }
.fence-choice small { display: block; margin-top: 4px; font-size: 11px; font-weight: 500; opacity: .82; }
.fence-subheading { margin: 0 0 9px; font-size: 12px; font-weight: 750; color: #667581; }
.fence-extra-field { margin-top: 16px; }
.fence-extra-field[hidden],.fence-extra-field div[hidden],.fence-families label[hidden] { display: none; }
.fence-extra-field .fence-model-details { margin-bottom: 0; }
.fence-installations { margin-bottom: 9px; }
.fence-fieldset:nth-of-type(3) > .fence-fields { margin-top: 18px; }
body.dark-mode .fence-step { background: #493130; color: #ffd1cd; }
body.dark-mode .fence-subheading { color: #bcc8d0; }
.fence-height-limit { margin: 9px 0 0; font-size: 12px; line-height: 1.45; color: #60717d; }
.fence-stage-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px; }
.fence-preview-button { padding: 6px 10px; border: 1px solid #d5dde2; border-radius: 20px; background: #fff; color: #34414c; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.fence-preview-button:hover { border-color: #b72d2b; color: #a82b28; }
.fence-preview-button:focus-visible { outline: 2px solid #b72d2b; outline-offset: 2px; }
.fence-preview-button[hidden] { display: none; }
.fence-zoom-controls { display: inline-flex; align-items: center; border: 1px solid #d5dde2; border-radius: 20px; background: #fff; overflow: hidden; }
.fence-zoom-controls button { min-width: 29px; height: 29px; padding: 0 6px; border: 0; border-right: 1px solid #d5dde2; background: transparent; color: #34414c; font: inherit; font-size: 16px; font-weight: 750; cursor: pointer; }
.fence-zoom-controls button:last-child { border-right: 0; }
.fence-zoom-controls button:nth-child(2) { min-width: 53px; font-size: 11px; }
.fence-zoom-controls button:hover { background: #f8eeee; color: #a82b28; }
.fence-zoom-controls button:focus-visible { outline: 2px solid #b72d2b; outline-offset: -2px; }
.fence-zoom-controls button:disabled { opacity: .4; cursor: default; }
body.dark-mode .fence-height-limit { color: #b8c7d1; }
body.dark-mode .fence-preview-button { background: #2b3640; border-color: #46535e; color: #f0f3f5; }
body.dark-mode .fence-zoom-controls { background: #2b3640; border-color: #46535e; }
body.dark-mode .fence-zoom-controls button { color: #f0f3f5; border-color: #46535e; }
body.dark-mode .fence-zoom-controls button:hover { background: #493130; color: #ffd1cd; }
/* Tile adhesive and grout calculator. */
.tile-container { max-width: 1140px; }
.tile-workspace { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.05fr); gap: 20px; align-items: start; }
.tile-controls,.tile-results { background: #fff; border: 1px solid #e1e7eb; border-radius: 11px; padding: 25px; }
.tile-fieldset { border: 0; padding: 0; margin: 0 0 26px; min-width: 0; }
.tile-fieldset:last-child { margin-bottom: 0; }
.tile-fieldset[hidden] { display: none; }
.tile-fieldset legend { padding: 0 0 12px; width: 100%; font-size: 14px; font-weight: 750; color: #26323d; }
.tile-bond-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.tile-bond-options label { position: relative; cursor: pointer; }
.tile-bond-options input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.tile-bond-options span { display: block; padding: 12px 8px; text-align: center; background: #f9fafb; border: 1px solid #dce3e8; border-radius: 7px; color: #596773; font-size: 14px; font-weight: 650; }
.tile-bond-options input:checked + span { background: #f8eeee; border-color: #c72d2b; color: #af2b28; }
.tile-bond-options input:focus-visible + span { outline: 2px solid #c72d2b; outline-offset: 2px; }
.tile-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px 12px; }
.tile-fields label { display: block; min-width: 0; font-size: 14px; font-weight: 650; color: #4d5964; }
.tile-fields label span { float: right; font-size: 12px; color: #8b98a2; }
.tile-fields input { display: block; width: 100%; margin-top: 8px; min-width: 0; font-size: 16px; }
.tile-fields label[for="tileArea"] { grid-column: 1 / -1; }
.tile-joint-fieldset { border-top: 1px solid #e8ecef; padding-top: 23px; }
.tile-results-head { padding-bottom: 20px; border-bottom: 1px solid #e8ecef; }
.tile-results-head h3 { margin: 7px 0 0; font-size: 22px; color: #27333d; }
.tile-result-cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; margin-top: 20px; }
.tile-result { display: flex; flex-direction: column; min-height: 146px; padding: 17px; background: #f7f9fa; border: 1px solid #e7ecef; border-radius: 8px; }
.tile-spacer-result { grid-column: 1 / -1; min-height: 120px; }
.tile-result > span { font-size: 14px; color: #586773; font-weight: 650; }
.tile-result strong { display: block; margin: 17px 0 3px; color: #b12d29; font-size: clamp(23px,2.5vw,32px); line-height: 1.1; letter-spacing: -.03em; }
.tile-result small { margin-top: auto; font-size: 12px; line-height: 1.4; color: #74828c; }
.tile-message { min-height: 42px; margin: 19px 0 0; font-size: 14px; line-height: 1.5; color: #52616c; }
.tile-message[data-state="error"] { color: #b32c29; }
.tile-method { margin: 0; padding-top: 16px; border-top: 1px solid #e8ecef; font-size: 12px; color: #7a8790; line-height: 1.6; }
.tile-spacer-method { margin-top: 12px; }
body.dark-mode .tile-controls,body.dark-mode .tile-results { background: #202730; border-color: #394651; }
body.dark-mode .tile-fieldset legend,body.dark-mode .tile-results-head h3 { color: #f0f3f5; }
body.dark-mode .tile-fields label,body.dark-mode .tile-result > span,body.dark-mode .tile-message { color: #c7d1d9; }
body.dark-mode .tile-fields label span,body.dark-mode .tile-result small,body.dark-mode .tile-method { color: #aebbc5; }
body.dark-mode .tile-bond-options span { background: #2b3640; color: #dae2e7; border-color: #46535e; }
body.dark-mode .tile-bond-options input:checked + span { background: #493130; border-color: #e07670; color: #ffd1cd; }
body.dark-mode .tile-result { background: #29343e; border-color: #414e59; }
body.dark-mode .tile-result strong { color: #f1aaa4; }
body.dark-mode .tile-results-head,body.dark-mode .tile-joint-fieldset,body.dark-mode .tile-method { border-color: #3b4852; }
body.dark-mode .tile-message[data-state="error"] { color: #f1a29c; }
@media (max-width: 1050px) { .fence-workspace { grid-template-columns: 1fr; } }
@media (max-width: 1050px) { .tile-workspace { grid-template-columns: 1fr; } }
@media (max-width: 650px) {
  .fence-container { padding: 21px 16px; }
  .fence-controls { padding: 17px; }
  #fenceCanvas { height: 280px; }
  .fence-cut-view { margin: 0 12px 10px; padding: 14px 12px; }
  .fence-cut-row { grid-template-columns: 72px 1fr; gap: 8px; }
  .fence-measure-horizontal { margin-left: 80px; }
  .fence-cut-view p { margin-left: 80px; }
  .fence-stage-top,.fence-stage-bottom { padding-left: 14px; padding-right: 14px; }
  .fence-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .fence-order .fence-order-item { grid-template-columns: 1fr; gap: 7px; }
  .fence-order .fence-order-item strong { text-align: left; }
  .fence-families span { padding: 11px; }
  .tile-controls,.tile-results { padding: 20px 17px; }
  .tile-result { padding: 14px; }
  .sidebar-btn { width: 12.5%; min-width: 0; font-size: 8px; padding: 3px 1px; }
  .nav-label { font-size: 8px; letter-spacing: -.04em; }
}

/* Promotion, route and company search share one quiet workspace. */
#promo .utility-container,#itineraire .utility-container,#entreprise .utility-container { max-width: 1210px; background: transparent; border: 0; padding: 0; box-shadow: none; }
.utility-container .page-intro { border-bottom: 0; padding-bottom: 0; margin-bottom: 27px; }
.utility-workspace { display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); align-items: start; gap: 20px; }
.utility-panel { min-width: 0; background: #fff; border: 1px solid #e1e7eb; border-radius: 14px; padding: clamp(20px,2.5vw,30px); box-shadow: 0 2px 12px rgba(24,34,46,.025); }
.utility-controls { min-width: 0; }
.utility-panel-heading { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 23px; }
.utility-step { display: grid; place-items: center; flex: 0 0 34px; height: 34px; border-radius: 9px; background: #f8eeee; color: #b52e2a; font-size: 12px; font-weight: 800; }
.utility-panel-heading h3,.utility-output-heading h3 { margin: 0; color: #28343e; font-size: 19px; font-weight: 750; letter-spacing: -.025em; }
.utility-panel-heading p { margin: 4px 0 0; color: #77848e; font-size: 13px; line-height: 1.5; }
.utility-label { display: block; margin: 0 0 8px; color: #495963; font-size: 13px; font-weight: 700; }
.utility-divider { height: 1px; background: #e9edf0; margin: 24px 0; }
.utility-hint { color: #76848e; font-size: 12px; line-height: 1.55; margin: 11px 0 0; }
.utility-reset { margin-top: 24px; }
.utility-output { min-height: 330px; }
.utility-output-heading { border-bottom: 1px solid #e8edf0; padding-bottom: 18px; margin-bottom: 20px; }
.utility-output-heading h3 { margin-top: 7px; font-size: 21px; }
.utility-placeholder { min-height: 220px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.utility-placeholder-mark { display: grid; place-items: center; width: 50px; height: 50px; margin-bottom: 22px; border: 1px solid #efdbda; border-radius: 12px; background: #fbf3f2; color: #b82f2b; font-size: 27px; font-weight: 650; }
.utility-placeholder strong { color: #34414b; font-size: 17px; letter-spacing: -.02em; }
.utility-placeholder p { margin-top: 8px; color: #83909a; font-size: 13px; line-height: 1.6; max-width: 330px; }
.utility-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.utility-actions .main-btn { flex: 1 1 180px; }
.utility-actions .secondary-btn { flex: 0 1 auto; margin: 0; }
.utility-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.utility-fields .form-group { min-width: 0; margin-bottom: 14px; position: relative; }
.utility-fields input { width: 100%; min-width: 0; }
.utility-suggestions { position: absolute; top: 100%; left: 0; right: 0; z-index: 30; overflow: auto; max-height: 240px; background: #fff; border: 1px solid #dbe3e8; border-radius: 0 0 9px 9px; box-shadow: 0 12px 25px rgba(20,30,42,.12); }
.utility-suggestion-status { padding: 15px; color: #73808c; font-size: 13px; }

#promo .promo-input-wrap input { min-height: 54px; padding: 11px 48px 11px 14px; border: 1px solid #dbe3e8; border-radius: 9px; background: #fff; color: #27333d; font-size: 21px; font-weight: 700; }
#promo .promo-input-unit { right: 16px; color: #7d8b95; font-size: 16px; }
.promo-rate-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.promo-rate-button { min-height: 73px; padding: 10px 6px; border: 1px solid #dce3e8; border-radius: 9px; background: #f9fafb; color: #3f4d59; font-size: 18px; font-weight: 750; cursor: pointer; }
.promo-rate-button small { display: block; margin-top: 3px; color: #7c8993; font-size: 11px; font-weight: 550; }
.promo-rate-button.active { background: #fbf1f0; border-color: #c72d2b; color: #ad302d; box-shadow: 0 0 0 2px rgba(199,45,43,.06); }
.promo-rate-button.active small { color: #ad514d; }
.promo-rate-button:hover { border-color: #bd716c; }
.promo-rate-button:focus-visible { outline: 2px solid #c72d2b; outline-offset: 2px; }
#promo .promo-check-row { align-items: flex-start; gap: 11px; color: #3e4c57; line-height: 1.5; font-size: 13px; }
#promo .promo-check-row input { margin-top: 2px; min-height: 18px; padding: 0; }
#promo #promoExistingContainer { margin-top: 18px; }
#promo .promo-results { margin: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; animation: none; }
#promo .promo-result-header { background: #f8f3f2; border: 1px solid #efdfdd; border-radius: 9px; padding: 16px 18px; }
#promo .promo-result-header .header-title { color: #6b5b59; text-transform: none; letter-spacing: 0; font-size: 13px; }
#promo .promo-result-header .header-taux { color: #a82c28; font-size: 21px; }
#promo .promo-result-grid { display: block; background: none; }
#promo .promo-result-cell { padding: 21px 0 17px; border-bottom: 1px solid #e7ecef; background: transparent; }
#promo .promo-result-cell .cell-label { color: #6a7984; font-size: 12px; letter-spacing: 0; text-transform: none; }
#promo .promo-result-cell .cell-value { font-size: clamp(27px,3vw,36px); letter-spacing: -.03em; }
#promo .promo-result-cell .cell-value.highlight { color: #a92f2b; }
#promo .promo-result-cell .cell-value.success { color: #257553; }
#promo .promo-result-footer { padding: 19px 0 0; border: 0; background: transparent; }
#promo .promo-copy-btn { background: #29343e; border-radius: 7px; padding: 11px 15px; }

.route-workspace { grid-template-columns: minmax(0,.93fr) minmax(0,1.07fr); }
.route-workspace .utility-controls { display: grid; gap: 14px; }
.route-section { padding-bottom: 24px; }
.route-section .utility-panel-heading { margin-bottom: 19px; }
.utility-choice-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-bottom: 14px; }
.utility-choice { padding: 11px 8px; border: 1px solid #dae2e7; border-radius: 8px; background: #f9fafb; color: #4c5c68; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.utility-choice.active { border-color: #c72d2b; background: #fbf1f0; color: #a92f2b; }
.utility-choice:focus-visible { outline: 2px solid #c72d2b; outline-offset: 2px; }
#startPointDisplay { min-height: 49px; display: flex; align-items: center; justify-content: flex-start; padding: 11px 14px; border: 1px solid #e0e6ea; border-radius: 8px; background: #f8fafb; color: #697781; font-size: 13px; font-weight: 650; text-align: left; }
.route-manual { margin-top: 17px; padding-top: 16px; border-top: 1px solid #e9edf0; }
.route-manual .main-btn { width: 100%; }
.route-add { width: 100%; }
.route-destination-list { margin-top: 17px; }
.utility-empty-list { padding: 21px 12px; border: 1px dashed #dce4e9; border-radius: 9px; text-align: center; color: #81909a; font-size: 13px; }
.route-stops { display: grid; gap: 8px; }
.route-stop { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid #e3e9ed; border-radius: 9px; background: #fafbfc; }
.route-stop-number { display: grid; place-items: center; flex: 0 0 27px; height: 27px; background: #edf1f3; border-radius: 50%; color: #475662; font-size: 12px; font-weight: 750; }
.route-stop-name { flex: 1; min-width: 0; overflow-wrap: anywhere; color: #34414c; font-size: 13px; font-weight: 650; }
.route-stop-remove { flex: 0 0 30px; height: 30px; border: 0; border-radius: 6px; background: transparent; color: #a34440; font-size: 20px; line-height: 1; cursor: pointer; }
.route-stop-remove:hover { background: #f8eeee; }
.route-output { min-height: 420px; }
.route-output .results-box,#entreprise .utility-output .results-box { padding: 0; margin: 0; background: transparent; border: 0; box-shadow: none; }
.route-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-bottom: 22px; }
.route-metric { min-width: 0; padding: 17px; border: 1px solid #e2e9ed; border-radius: 9px; background: #f8fafb; }
.route-metric span { display: block; color: #647480; font-size: 12px; }
.route-metric strong { display: block; margin-top: 8px; color: #293842; font-size: 23px; letter-spacing: -.025em; }
.route-table-wrap { overflow-x: auto; }
#itineraireTable { width: 100%; border-collapse: collapse; }
#itineraireTable th,#itineraireTable td { padding: 11px 9px !important; border: 0 !important; border-bottom: 1px solid #e6ebee !important; border-radius: 0 !important; background: transparent !important; text-align: left !important; color: #4a5964; font-size: 12px; }
#itineraireTable th { background: #f6f8f9 !important; color: #657480; font-weight: 750; }
#itineraireTable td:nth-child(n+3),#itineraireTable th:nth-child(n+3) { text-align: right !important; white-space: nowrap; }
#itineraireTable td:nth-child(2) { overflow-wrap: anywhere; }
#mapItineraire { width: 100%; min-height: 330px; height: 330px; margin-top: 21px; border: 1px solid #e0e7eb; border-radius: 9px; }

.enterprise-search-field { position: relative; margin-bottom: 0; }
#entrepriseQuery { width: 100%; min-width: 0; min-height: 52px; padding-right: 16px; font-size: 15px; }
.enterprise-suggestions { top: 100%; }
.enterprise-suggestion { display: block; padding: 12px 14px; border-bottom: 1px solid #e7ecef; background: #fff; cursor: pointer; }
.enterprise-suggestion:last-child { border-bottom: 0; }
.enterprise-suggestion:hover,.enterprise-suggestion:focus-visible { background: #f7f9fa; outline: none; }
.enterprise-suggestion strong { display: block; color: #2e3943; font-size: 13px; }
.enterprise-suggestion small { display: block; margin-top: 4px; color: #76848f; font-size: 12px; line-height: 1.4; }
.utility-source { margin-top: 28px; padding: 16px; border: 1px solid #e5eaee; border-radius: 9px; background: #f8fafb; }
.utility-source span,.utility-source small { display: block; font-size: 12px; color: #76848f; }
.utility-source strong { display: block; margin: 5px 0 3px; color: #34414b; font-size: 13px; }
#entrepriseFicheTable { width: 100%; border-collapse: collapse; }
#entrepriseFicheTable td { width: 50%; padding: 11px 0; border: 0; border-bottom: 1px solid #e7ecef; background: transparent; color: #35444f; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
#entrepriseFicheTable td:first-child { padding-right: 12px; color: #687783; }
#entrepriseFicheTable td:last-child { text-align: right; font-weight: 700; }
.enterprise-actions .secondary-btn { flex: 1 1 145px; }
body.dark-mode #promo .utility-container,body.dark-mode #itineraire .utility-container,body.dark-mode #entreprise .utility-container { background: transparent !important; border: 0 !important; }
body.dark-mode .utility-panel { background: #202730; border-color: #394651; box-shadow: none; }
body.dark-mode #promo .promo-results,body.dark-mode .route-output .results-box,body.dark-mode #entreprise .utility-output .results-box { background: transparent !important; border: 0 !important; box-shadow: none !important; }
body.dark-mode .utility-panel-heading h3,body.dark-mode .utility-output-heading h3,body.dark-mode .utility-placeholder strong { color: #f0f3f5; }
body.dark-mode .utility-panel-heading p,body.dark-mode .utility-hint,body.dark-mode .utility-placeholder p { color: #b6c3cc; }
body.dark-mode .utility-label,body.dark-mode #promo .promo-check-row { color: #d0dbe2; }
body.dark-mode .utility-divider { background: #394651; }
body.dark-mode .utility-output-heading,body.dark-mode .route-manual { border-color: #394651; }
body.dark-mode .utility-step,body.dark-mode .utility-placeholder-mark { background: #403030; border-color: #6a4543; color: #f2aaa4; }
body.dark-mode .utility-suggestions,body.dark-mode #entrepriseSuggestions { background: #27313b !important; border-color: #495762 !important; box-shadow: 0 12px 25px rgba(0,0,0,.25); }
body.dark-mode .utility-suggestion-status { color: #c3ced6; }
body.dark-mode #promo .promo-input-wrap input { background: #2b3640; border-color: #46535e; color: #f1f4f6; }
body.dark-mode #promo .promo-input-unit { color: #b5c3cc; }
body.dark-mode .promo-rate-button,body.dark-mode .utility-choice { background: #29343e; border-color: #46535e; color: #d6e0e6; }
body.dark-mode .promo-rate-button small { color: #b2c1ca; }
body.dark-mode .promo-rate-button.active,body.dark-mode .utility-choice.active { background: #493130; border-color: #e07670; color: #ffd1cd; }
body.dark-mode .promo-rate-button.active small { color: #ffc3be; }
body.dark-mode #promo .promo-result-header { background: #302d31; border-color: #574449; }
body.dark-mode #promo .promo-result-header .header-title { color: #d6c4c5; }
body.dark-mode #promo .promo-result-header .header-taux,body.dark-mode #promo .promo-result-cell .cell-value.highlight { color: #f1aaa4; }
body.dark-mode #promo .promo-result-cell { border-color: #394651; background: transparent; }
body.dark-mode #promo .promo-result-cell .cell-label { color: #b6c3cc; }
body.dark-mode #promo .promo-result-cell .cell-value.success { color: #82d5a9; }
body.dark-mode #promo .promo-copy-btn { background: #35434f; color: #f0f3f5; }
body.dark-mode #startPointDisplay { background: #29343e !important; border-color: #46535e !important; color: #d8e0e6 !important; }
body.dark-mode .utility-empty-list,body.dark-mode .route-stop { border-color: #46535e; color: #b9c7d0; background: #29343e; }
body.dark-mode .route-stop-number { background: #3a4651; color: #e2eaf0; }
body.dark-mode .route-stop-name { color: #edf1f4; }
body.dark-mode .route-stop-remove { color: #f1aaa4; }
body.dark-mode .route-stop-remove:hover { background: #493130; }
body.dark-mode #itineraireDetails > .route-metric { background: #29343e !important; border-color: #46535e !important; }
body.dark-mode .route-metric span { color: #bdcad3; }
body.dark-mode .route-metric strong,body.dark-mode #totalDistance,body.dark-mode #totalDuration { color: #eef2f5 !important; }
body.dark-mode #itineraireTable th { background: #2d3842 !important; color: #d6e0e6; }
body.dark-mode #itineraireTable td { background: transparent !important; color: #e1e8ed; }
body.dark-mode #itineraireTable th,body.dark-mode #itineraireTable td { border-color: #46535e !important; }
body.dark-mode #mapItineraire { border-color: #46535e; }
body.dark-mode .enterprise-suggestion { background: #27313b; border-color: #46535e; }
body.dark-mode .enterprise-suggestion:hover,body.dark-mode .enterprise-suggestion:focus-visible { background: #36434e; }
body.dark-mode .enterprise-suggestion strong { color: #eef2f5; }
body.dark-mode .enterprise-suggestion small { color: #bdcad3; }
body.dark-mode .utility-source { background: #29343e; border-color: #46535e; }
body.dark-mode .utility-source strong { color: #eef2f5; }
body.dark-mode .utility-source span,body.dark-mode .utility-source small { color: #bdcad3; }
body.dark-mode #entrepriseFicheTable td { background: transparent; color: #eef2f5; border-color: #46535e; }
body.dark-mode #entrepriseFicheTable td:first-child { color: #bdcad3; }
@media (max-width: 1080px) { .utility-workspace,.route-workspace { grid-template-columns: 1fr; } }
@media (max-width: 650px) {
  .utility-container .page-intro { margin-bottom: 22px; }
  .utility-workspace { gap: 14px; }
  .utility-panel { padding: 20px 17px; }
  .promo-rate-options { gap: 6px; }
  .promo-rate-button { font-size: 15px; min-height: 68px; }
  .promo-rate-button small { font-size: 10px; }
  .utility-fields { grid-template-columns: 1fr; gap: 0; }
  .route-metrics { gap: 8px; }
  .route-metric { padding: 12px; }
  .route-metric strong { font-size: 20px; }
  #mapItineraire { height: 300px; min-height: 300px; }
}

/* Home */
#menu .dashboard-container { max-width: 1240px; margin-top: 34px; margin-bottom: 80px; }
.home-hero { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(275px,.8fr); gap: 34px; align-items: center; padding: clamp(30px,4vw,58px); min-height: 360px; background: #f7f4f1; border: 1px solid #eee8e3; border-radius: 18px; overflow: hidden; }
.home-hero-content { min-width: 0; }
.home-eyebrow,.home-section-kicker,.home-aside-label,.home-stats-heading { font-size: 11px; font-weight: 800; letter-spacing: .13em; }
.home-eyebrow { display: inline-flex; align-items: center; gap: 9px; color: #9a514c; }
.home-eyebrow-dot { width: 7px; height: 7px; border-radius: 50%; background: #c72d2b; }
.home-hero h1 { margin: 22px 0 16px; color: #26313a; font-size: clamp(2.25rem,4vw,3.7rem); font-weight: 750; letter-spacing: -.055em; line-height: 1.09; }
.home-hero h1 em { font-style: normal; color: #bb3531; }
.home-hero-content > p { max-width: 570px; margin: 0; font-size: 15px; line-height: 1.7; color: #65717a; }
.home-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.home-primary-action,.home-secondary-action { min-height: 45px; display: inline-flex; align-items: center; justify-content: center; gap: 18px; padding: 0 18px; border-radius: 8px; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; transition: transform .18s,background .18s,border-color .18s; }
.home-primary-action { background: #c72d2b; border: 1px solid #c72d2b; color: #fff; }
.home-primary-action:hover { background: #a92322; transform: translateY(-2px); }
.home-secondary-action { background: #fff; border: 1px solid #ddd6d1; color: #38434d; }
.home-secondary-action:hover { border-color: #b9a6a0; transform: translateY(-2px); }
.home-hero-aside { display: flex; flex-direction: column; gap: 4px; padding: 19px; border-radius: 13px; background: #fff; border: 1px solid #eae4df; box-shadow: 0 15px 40px rgba(66,43,35,.06); }
.home-aside-label { color: #84909a; margin: 3px 7px 12px; }
.home-hero-aside button { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 64px; border: 0; border-radius: 8px; padding: 8px; background: transparent; text-align: left; color: #35404a; cursor: pointer; }
.home-hero-aside button:hover { background: #f8f4f1; }
.home-aside-icon { flex: none; display: grid; place-items: center; width: 40px; height: 40px; background: #f8eeee; border-radius: 8px; color: #ba403a; font-size: 16px; }
.home-hero-aside button > span:nth-child(2) { flex: 1; min-width: 0; }
.home-hero-aside strong,.home-hero-aside small { display: block; }
.home-hero-aside strong { font-size: 13px; }
.home-hero-aside small { margin-top: 3px; font-size: 11px; color: #84909a; }
.home-hero-aside button > i:last-child { font-size: 12px; color: #9ba5ac; }
.home-section { margin-top: 43px; }
.home-section-secondary { margin-top: 45px; }
.home-section-heading { margin-bottom: 17px; }
.home-section-kicker { color: #ba403a; }
.home-section-heading h2 { margin: 7px 0 3px; color: #27313a; font-size: clamp(1.45rem,2vw,1.85rem); letter-spacing: -.035em; }
.home-section-heading p { margin: 0; color: #78848e; font-size: 13px; }
.home-tool-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px; }
.home-tool-grid-secondary { grid-template-columns: repeat(4,minmax(0,1fr)); }
.home-tool { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; min-height: 220px; padding: 23px; border-radius: 12px; border: 1px solid #e6e9ed; background: #fff; color: #29343d; text-align: left; font: inherit; cursor: pointer; transition: transform .18s,border-color .18s,box-shadow .18s; }
.home-tool:hover { transform: translateY(-3px); border-color: #d7aaa5; box-shadow: 0 12px 30px rgba(34,43,51,.055); }
.home-tool-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 9px; background: #f8eeee; color: #be3d38; font-size: 16px; }
.home-tool-title { margin-top: 22px; font-size: 17px; font-weight: 750; letter-spacing: -.025em; }
.home-tool-description { margin-top: 8px; color: #77838d; font-size: 12px; line-height: 1.55; }
.home-tool-link { display: flex; align-items: center; gap: 9px; margin-top: auto; padding-top: 20px; color: #b43531; font-size: 12px; font-weight: 750; }
.home-tool-link i { transition: transform .18s; }
.home-tool:hover .home-tool-link i { transform: translateX(3px); }
.home-stats { flex-wrap: wrap; align-items: center; gap: 10px 20px; margin-top: 32px; padding: 18px 22px; border: 1px solid #e6e9ed; border-radius: 11px; background: #fff; color: #63717a; font-size: 12px; }
.home-stats-heading { color: #b43531; }
#menu button:focus-visible { outline: 3px solid #c72d2b; outline-offset: 3px; }
body.dark-mode .home-hero { background: #252930; border-color: #3a434d; }
body.dark-mode .home-hero h1,body.dark-mode .home-section-heading h2,body.dark-mode .home-tool-title { color: #f1f3f5; }
body.dark-mode .home-hero h1 em,body.dark-mode .home-section-kicker,body.dark-mode .home-tool-link,body.dark-mode .home-stats-heading { color: #ef9b93; }
body.dark-mode .home-eyebrow { color: #eeada6; }
body.dark-mode .home-hero-content > p,body.dark-mode .home-section-heading p,body.dark-mode .home-tool-description { color: #b9c4cc; }
body.dark-mode .home-hero-aside,body.dark-mode .home-tool,body.dark-mode .home-stats { background: #202730; border-color: #3b4751; color: #dce4e9; box-shadow: none; }
body.dark-mode .home-hero-aside button { color: #edf1f4; }
body.dark-mode .home-hero-aside button:hover { background: #2c3640; }
body.dark-mode .home-aside-icon,body.dark-mode .home-tool-icon { background: #423033; color: #f0a19a; }
body.dark-mode .home-aside-label,body.dark-mode .home-hero-aside small,body.dark-mode .home-hero-aside button > i:last-child { color: #b3c0c9; }
body.dark-mode .home-secondary-action { background: #303940; border-color: #4b5963; color: #ecf1f4; }
body.dark-mode .home-secondary-action:hover { border-color: #e3978f; }
body.dark-mode .home-tool:hover { border-color: #bb716b; }
.fence-height-explainer { margin: 12px 0 20px; padding: 12px 15px; border: 1px solid #e3e9ed; border-radius: 8px; background: #f8fafb; color: #4e5e6a; font-size: 12px; line-height: 1.55; }
.fence-order-post > span { min-width: 0; }
.fence-order-post .fence-model-select { max-width: 420px; min-height: 44px; margin-top: 9px; font-size: 13px; }
.fence-order-post strong { align-self: center; }
.fence-height-breakdown { display: flex; flex-wrap: wrap; gap: 8px; padding: 2px 20px 12px; }
.fence-height-breakdown[hidden] { display: none; }
.fence-height-breakdown span { display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border: 1px solid #dde5e9; border-radius: 7px; background: #fff; color: #60717c; font-size: 12px; }
.fence-height-breakdown strong { color: #a92b27; font-weight: 750; }
body.dark-mode .fence-height-explainer { background: #27323b; border-color: #46535e; color: #cbd7df; }
body.dark-mode .fence-height-breakdown span { background: #27323b; border-color: #46535e; color: #c3d0d9; }
body.dark-mode .fence-height-breakdown strong { color: #ffc1ba; }
@media(max-width:1120px) { .home-tool-grid-secondary { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:900px) { .home-hero { grid-template-columns: 1fr; } .home-hero-aside { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); } .home-aside-label { grid-column: 1/-1; } .home-hero-aside button > i:last-child { display: none; } }
@media(max-width:740px) { .home-tool-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:650px) { #menu .dashboard-container { margin: 18px auto 38px; } .home-hero { padding: 28px 22px; gap: 24px; min-height: 0; } .home-hero h1 { font-size: clamp(2.05rem,9vw,2.6rem); } .home-hero h1 br { display: none; } .home-hero-actions { flex-direction: column; } .home-primary-action,.home-secondary-action { width: 100%; } .home-hero-aside { grid-template-columns: 1fr; } .home-hero-aside button > i:last-child { display: inline-block; } .home-section,.home-section-secondary { margin-top: 34px; } .home-tool-grid,.home-tool-grid-secondary { grid-template-columns: 1fr; } .home-tool { min-height: 190px; } }

#fenceCutLayoutOptions[hidden], #fenceDecorLengthField[hidden] { display: none; }

/* Keep the no-cut constraint prominent beside the decor selection. */
.fence-decor-no-cut { margin: 12px 0 14px; padding: 14px; border: 1px solid #e5aa32; border-left: 5px solid #bd7200; border-radius: 8px; background: #fff5da; color: #663d00; line-height: 1.5; }
.fence-decor-no-cut strong { display: block; font-size: 15px; font-weight: 800; margin-bottom: 6px; }
.fence-decor-no-cut span { display: block; font-size: 13px; }
.fence-decor-no-cut[hidden] { display: none; }
body.dark-mode .fence-decor-no-cut { background: #3e3017; color: #ffe4a5; border-color: #b88a37; }
/* Shared choices for every configurator. */
select.atelier-native-choice{display:none!important}.atelier-choice{width:100%;min-width:0}.atelier-choice[hidden],.atelier-choice-menu[hidden]{display:none}.atelier-choice-toggle{position:relative;width:100%;min-height:44px;border:1px solid #dce3e8;border-radius:8px;padding:11px 34px 11px 12px;background:#fff;color:#26323d;font:inherit;font-size:14px;text-align:left;line-height:1.4;cursor:pointer;white-space:normal}.atelier-choice-toggle:after{content:'';position:absolute;right:14px;top:calc(50% - 4px);width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}.atelier-choice-toggle[aria-expanded=true],.atelier-choice-toggle:focus-visible{border-color:var(--primary);outline:2px solid #c72d2b20;outline-offset:1px}.atelier-choice-toggle:disabled{opacity:.55;cursor:default}.atelier-choice-menu{position:fixed;z-index:10000;padding:6px;background:#fff;border:1px solid #dce3e8;border-radius:9px;box-shadow:0 12px 30px #1d232b1c;overflow:auto}.atelier-choice-menu button{display:block;width:100%;padding:10px;border:0;border-radius:6px;background:transparent;color:#29313a;text-align:left;cursor:pointer;font:inherit;font-size:13px;line-height:1.5;white-space:normal}.atelier-choice-menu button:hover,.atelier-choice-menu button:focus-visible{background:#f6f8f9;outline:0}.atelier-choice-menu button[aria-selected=true]{background:#f8eeee;color:#af2b28;font-weight:650}.atelier-choice-menu button:disabled{opacity:.45;cursor:default}.atelier-choice-group{padding:9px;font-size:10px;letter-spacing:.1em;color:#89939f;font-weight:750}body.dark-mode .atelier-choice-toggle,body.dark-mode .atelier-choice-menu{background:#25303a;color:#edf1f4;border-color:#46535e}body.dark-mode .atelier-choice-menu button{color:#dae2e7}body.dark-mode .atelier-choice-menu button:hover,body.dark-mode .atelier-choice-menu button:focus-visible{background:#2b3640}body.dark-mode .atelier-choice-menu button[aria-selected=true]{background:#382929;color:#ffb1ab}.deck-item .atelier-choice{margin-top:8px;max-width:300px}.deck-item .atelier-choice-toggle{font-size:12px;min-height:36px;padding:8px 31px 8px 10px}

/* Address suggestions overlay the form instead of changing its height. */
#livraison .form-group:has(.delivery-address-suggestions){position:relative;min-width:0}
#livraison .delivery-address-suggestions{position:absolute;top:100%;right:0;width:max(100%,280px);max-width:calc(100vw - 40px);z-index:1200;max-height:240px;overflow:auto;overscroll-behavior:contain;margin-top:5px;padding:5px;background:#fff;border:1px solid #dce3e8;border-radius:9px;box-shadow:0 10px 28px #1b2c3a26;text-align:left}
#livraison #citySuggestions{left:0;right:auto}
#livraison .delivery-address-suggestions>.delivery-address-option{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 10px;margin:0;border-radius:5px;border:0;font-size:13px;line-height:1.4;transition:none;transform:none;cursor:pointer}
.delivery-address-option strong{font-weight:600;overflow-wrap:anywhere}.delivery-address-option span{font-size:12px;color:#71808a;flex-shrink:0}
#livraison .delivery-address-option:hover,#livraison .delivery-address-option[aria-selected=true]{background:#f8eeee;color:#af2b28;transform:none}
#livraison .delivery-address-suggestions>.delivery-address-message{font-size:12px;color:#71808a;padding:12px 10px;margin:0;cursor:default;transform:none;background:transparent}
.delivery-address-retry{margin:0 10px 9px;border:1px solid #e1c5c1;border-radius:6px;background:#fff5f4;color:#ad302a;padding:8px 12px;font-size:12px;cursor:pointer}
body.dark-mode #livraison .delivery-address-option:hover,body.dark-mode #livraison .delivery-address-option[aria-selected=true]{background:#493130;color:#ffd1cd}
body.dark-mode .delivery-address-option span{color:#b7c3cc}
.company-pdf-controls{margin-top:22px;padding-top:22px;border-top:1px solid var(--border,#dfe4e8)}
.company-pdf-controls h4{font-size:17px;margin:7px 0;color:var(--text-dark,#25323e)}
.company-pdf-controls p{font-size:13px;line-height:1.6;color:var(--text-light,#65717c);margin:0 0 14px}
.company-pdf-controls button{width:100%;display:flex;align-items:center;justify-content:center;gap:9px;white-space:normal}
.company-pdf-controls .company-pdf-ready{margin:12px 0 0}.company-pdf-ready a{color:var(--primary,#bb2e29);text-decoration:underline;font-weight:600;cursor:pointer}
.company-pdf-dialog{position:fixed;inset:0;margin:auto;box-sizing:border-box;width:min(480px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;padding:30px;border:1px solid var(--border,#dfe4e8);border-radius:16px;background:var(--bg-white,#fff);color:var(--text-dark,#25323e);box-shadow:0 24px 80px #15212f38}
.company-pdf-dialog::backdrop{background:#17263180;backdrop-filter:blur(3px)}
.company-pdf-dialog h3{font-size:23px;line-height:1.25;margin:10px 0 16px}
.company-pdf-dialog .company-pdf-name{padding:12px 14px;border:1px solid var(--border,#dfe4e8);border-radius:8px;background:var(--bg-light,#f5f7f9);font-size:14px;font-weight:700;overflow-wrap:anywhere}
#companyPdfDescription{font-size:14px;line-height:1.6;color:var(--text-light,#65717c);margin:16px 0 22px}
.company-pdf-dialog .form-group{margin-bottom:18px}.company-pdf-dialog input{box-sizing:border-box;width:100%;min-width:0}
.company-pdf-note{font-size:12px;line-height:1.6;color:var(--text-light,#65717c);margin:0}
.company-pdf-status{font-size:13px;line-height:1.5;color:#c1302a;margin:12px 0 0}.company-pdf-status:empty{display:none}
.company-pdf-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}.company-pdf-actions button{width:auto;margin:0;font-size:13px}
#companyPdfDownload:disabled{opacity:.65;cursor:wait}.company-pdf-dialog :focus-visible{outline:3px solid #d82d2880;outline-offset:3px}
body.dark-mode .company-pdf-dialog{background:#222c38;color:#e5eaf1}body.dark-mode .company-pdf-dialog .company-pdf-name{background:#2c3744;color:#e5eaf1}body.dark-mode .company-pdf-status{color:#ffaaa5}
@media(max-width:520px){.company-pdf-dialog{padding:22px}.company-pdf-actions{flex-direction:column-reverse}.company-pdf-actions button{width:100%}}

/* Remembered home store, shared by delivery and professional documents. */
.atelier-store-switch{display:flex;align-items:center;gap:8px;width:100%;padding:10px;border:1px solid #e5d3d1;border-radius:9px;background:#fff8f7;color:#923230;font:600 12px Inter,system-ui,sans-serif;cursor:pointer;text-align:left;margin:12px 0 2px}
.atelier-store-switch small{margin-left:auto;font-size:10px;font-weight:400}.atelier-store-switch>span:first-child{font-size:19px}
.atelier-store-dialog{position:fixed;inset:0;margin:auto;width:min(480px,calc(100vw - 36px));max-height:calc(100dvh - 48px);box-sizing:border-box;padding:32px;border:1px solid #e5e9ec;border-radius:20px;background:#fff;color:#29343e;box-shadow:0 25px 100px #16212c40;overflow:auto}
.atelier-store-dialog::backdrop{background:#18273180;backdrop-filter:blur(4px)}
.atelier-store-eyebrow{font:700 10px Inter,system-ui,sans-serif;color:#a72e2b;letter-spacing:.12em}.atelier-store-dialog h2{font-size:25px;line-height:1.2;letter-spacing:-.6px;margin:15px 0 12px;padding-right:16px}.atelier-store-dialog p{font-size:13px;line-height:1.65;color:#667681;margin:0 0 18px}
.atelier-store-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0}.atelier-store-options button{padding:23px 12px;border:1px solid #dce3e8;border-radius:12px;background:#fafbfc;text-align:left;color:inherit;cursor:pointer}.atelier-store-options button:hover,.atelier-store-options button[aria-pressed=true]{background:#fff3f1;border-color:#b0332f}.atelier-store-options strong{display:block;font-size:20px;margin-bottom:8px}.atelier-store-options span{color:#73808b;font-size:12px}.atelier-store-options button:focus-visible{outline:3px solid #a92b27;outline-offset:3px}
.atelier-store-dialog .atelier-store-remember{font-size:11px;margin-bottom:0}.atelier-store-close{position:absolute;top:12px;right:14px;background:transparent;border:0;color:#667681;font-size:25px;cursor:pointer;min-width:32px;min-height:32px}.atelier-store-close[hidden]{display:none}.atelier-store-dialog #atelierStoreStatus:empty{display:none}.company-pdf-store,.delivery-store-result{font-size:12px;color:#667681;margin:8px 0 14px}
body.dark-mode .atelier-store-dialog{background:#25303a;color:#edf1f4;border-color:#46535e}body.dark-mode .atelier-store-options button{background:#2b3640;border-color:#46535e}body.dark-mode .atelier-store-switch,body.dark-mode .atelier-store-options button:hover,body.dark-mode .atelier-store-options button[aria-pressed=true]{background:#382929;color:#ffb1ab;border-color:#744947}body.dark-mode .atelier-store-dialog p,body.dark-mode .atelier-store-options span{color:#b7c3cc}
@media(min-width:541px) and (max-width:960px){.atelier-store-switch{width:52px;padding:8px 3px;justify-content:center}.atelier-store-switch small,.atelier-store-switch>span:first-child{display:none}.atelier-store-switch>span:nth-child(2){font-size:9px;text-align:center}}
@media(max-width:540px){.atelier-store-switch{position:fixed;top:10px;right:12px;width:auto;max-width:180px;margin:0;z-index:1200;padding:8px 10px;box-shadow:0 3px 12px #18273118}.atelier-store-switch small{display:none}.atelier-store-dialog{padding:25px}.atelier-store-dialog h2{font-size:23px}.atelier-store-options button{padding:20px 12px}.atelier-store-options strong{font-size:18px}}

.delivery-selected-store{margin:0 0 25px;padding:12px 14px;border:1px solid #e1e7ec;border-radius:9px;background:#f8fafb;font-size:13px;color:#667681}.delivery-selected-store strong{color:#29343e}body.dark-mode .delivery-selected-store{background:#28343f;border-color:#46535e;color:#b7c3cc}body.dark-mode .delivery-selected-store strong{color:#edf1f4}