/* DriverLog AU V8.9.0 — Complete Three-Rail Signature Web UI
   Presentation-only enhancement. Existing auth, Supabase and DriverLog business logic remain untouched. */
:root{
  --dl-left-rail:220px;
  --dl-right-rail:292px;
  --dl-canvas:#f7fafc;
  --dl-ink:#102a43;
  --dl-muted:#61758c;
  --dl-line:#cbd6e3;
  --dl-input:#243449;
  --dl-blue:#2563eb;
  --dl-navy:#0b1f4d;
}

/* Strong, unmistakable input/value boundaries without using harsh pure black. */
body.driverlog-pro-web input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
body.driverlog-pro-web select,
body.driverlog-pro-web textarea{
  border:2px solid var(--dl-input)!important;
  border-radius:9px!important;
  background:rgba(255,255,255,.985)!important;
  color:var(--dl-ink)!important;
  box-shadow:inset 0 0 0 1px rgba(15,23,42,.025)!important;
}
body.driverlog-pro-web input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover,
body.driverlog-pro-web select:hover,
body.driverlog-pro-web textarea:hover{border-color:#111827!important}
body.driverlog-pro-web input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,
body.driverlog-pro-web select:focus,
body.driverlog-pro-web textarea:focus{
  outline:none!important;border-color:#0f5fd7!important;
  box-shadow:0 0 0 3px rgba(37,99,235,.14)!important;
}

/* Actual AppSign on the left rail. */
body.driverlog-pro-web .dl-left-brand{
  position:absolute;left:14px;right:14px;top:15px;display:flex;align-items:center;gap:10px;
  min-height:56px;padding:7px 8px;border-radius:14px;
  background:rgba(255,255,255,.045);border:1px solid rgba(143,187,239,.14);
}
body.driverlog-pro-web .dl-left-brand img{width:43px;height:43px;border-radius:12px;object-fit:cover;box-shadow:0 5px 18px rgba(0,0,0,.18)}
body.driverlog-pro-web .dl-left-brand strong{display:block;color:#fff;font-size:15px;line-height:1.15;letter-spacing:-.15px}
body.driverlog-pro-web .dl-left-brand span{display:block;color:#7fb6f0;font-size:8.5px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;margin-top:4px}

/* Embedded DriverLog signature artwork in every authenticated work screen. */
body.driverlog-pro-web #appShell>main{position:relative;isolation:isolate;background:rgba(247,250,252,.965)!important}
body.driverlog-pro-web #appShell>main::before{
  content:"";position:fixed;pointer-events:none;z-index:-1;
  left:var(--dl-left-rail);right:var(--dl-right-rail);top:76px;bottom:0;
  background-image:url('driverlog-appsign.png'),url('driverlog-appsign.png'),url('driverlog-appsign.png'),url('driverlog-appsign.png');
  background-repeat:no-repeat;
  background-size:150px 150px,92px 92px,185px 185px,110px 110px;
  background-position:82% 13%,21% 39%,72% 72%,34% 89%;
  opacity:.032;filter:saturate(.75) grayscale(.08);
}
body.driverlog-pro-web #appShell>main::after{
  content:"";position:fixed;pointer-events:none;z-index:-2;
  left:var(--dl-left-rail);right:var(--dl-right-rail);bottom:0;height:48vh;
  background:url('community-signature.svg') center bottom/1100px auto no-repeat;
  opacity:.10;
}
body.driverlog-pro-web #appShell>main>.page,
body.driverlog-pro-web #appShell>main>#desktopPortalBanner{position:relative;z-index:1}

/* Right Driver Brief rail. */
.driver-brief{
  display:none;position:fixed;right:0;top:0;bottom:0;width:var(--dl-right-rail);z-index:86;
  overflow-y:auto;overscroll-behavior:contain;padding:15px 13px 18px;
  background:linear-gradient(180deg,#f9fcff 0%,#f4f8fd 56%,#edf4fb 100%);
  border-left:1px solid #cad8e8;box-shadow:-10px 0 34px rgba(15,35,70,.065);
  color:var(--dl-ink);
}
.driver-brief::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url('driverlog-appsign.png'),url('driverlog-appsign.png'),url('community-signature.svg');
  background-repeat:no-repeat;background-size:115px,78px,540px auto;background-position:110% 29%,-8% 67%,center 98%;
  opacity:.025;
}
.driver-brief>*{position:relative;z-index:1}
.dl-brief-brand{display:flex;align-items:center;gap:9px;padding:3px 3px 12px;border-bottom:1px solid #d7e2ee}
.dl-brief-brand img{width:44px;height:44px;border-radius:12px;box-shadow:0 5px 17px rgba(15,35,70,.11)}
.dl-brief-brand strong{display:block;font-size:15px;letter-spacing:-.2px;color:#102d55}.dl-brief-brand span{display:block;font-size:8.5px;color:#627a96;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-top:3px}
.dl-brief-head{padding:13px 3px 7px}.dl-brief-head h3{margin:0;font-size:17px;color:#102a43;letter-spacing:-.35px}.dl-brief-date{margin-top:2px;font-size:10px;color:#75879b}
.dl-brief-card{margin-top:9px;padding:12px;border:1px solid #cfdae6;border-radius:13px;background:rgba(255,255,255,.92);box-shadow:0 4px 16px rgba(20,45,75,.035);font-size:10.5px;line-height:1.43}
.dl-brief-card b{color:#183650}.dl-brief-card .brief-title{display:flex;align-items:center;gap:7px;margin-bottom:5px;font-size:11.5px;font-weight:900;color:#173454}.dl-brief-card .brief-icon{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:#eaf3ff;font-size:13px}.dl-brief-card.focus{border-color:#ead6a2;background:#fffdf6}.dl-brief-card.progress-card{background:linear-gradient(135deg,#fff,#f3f8ff)}
.dl-brief-card p{margin:4px 0;color:#5b7088}.dl-brief-card .brief-stat{font-size:16px;font-weight:900;color:#12345c;margin:3px 0}.dl-brief-progress{height:7px;border-radius:999px;background:#e3eaf2;overflow:hidden;margin:7px 0}.dl-brief-progress i{display:block;height:100%;width:0;background:#1aa45b;border-radius:inherit;transition:width .25s ease}.dl-brief-action{width:100%;margin-top:7px;min-height:33px;border:1px solid #b8c9dd;border-radius:9px;background:#fff;color:#17456f;font-size:10.5px;font-weight:850;cursor:pointer}.dl-brief-action.primary{background:#2563eb;color:#fff;border-color:#2563eb}.dl-brief-action:hover{filter:brightness(.985);transform:translateY(-1px)}
.dl-brief-external{display:flex;gap:7px;align-items:center;color:#145bb0;font-weight:850;margin-top:7px;cursor:pointer;border:0;background:transparent;padding:0;font-size:10.5px}
.dl-brief-footer{text-align:center;color:#8090a3;font-size:8.5px;padding:14px 4px 2px}
.dl-brief-toggle{display:none;position:fixed;right:12px;bottom:20px;z-index:89;border:1px solid #a9bfd8;border-radius:999px;background:#fff;color:#17456f;box-shadow:0 9px 26px rgba(15,35,70,.18);padding:9px 13px;font-weight:850;font-size:11px;cursor:pointer}
.dl-brief-close{display:none;position:absolute;right:10px;top:10px;border:0;background:#eaf1f8;border-radius:9px;width:30px;height:30px;color:#24445f;cursor:pointer}

/* Desktop with both rails: main work stays intentionally centered and contained. */
@media (min-width:1380px){
  body.driverlog-pro-web:not(.auth-locked) #appShell{padding-left:var(--dl-left-rail)!important;padding-right:var(--dl-right-rail)!important}
  body.driverlog-pro-web:not(.auth-locked) nav{width:var(--dl-left-rail)!important;padding:88px 12px 18px!important}
  body.driverlog-pro-web:not(.auth-locked) nav::before,body.driverlog-pro-web:not(.auth-locked) nav::after{content:none!important;display:none!important}
  body.driverlog-pro-web:not(.auth-locked) .driver-brief{display:block}
  body.driverlog-pro-web:not(.auth-locked) #appShell>main{max-width:1160px!important;width:100%!important;margin:0 auto!important;padding:22px 24px 54px!important}
  body.driverlog-pro-web:not(.auth-locked) #appShell>header .header-row{max-width:1160px!important;margin:0 auto!important}
}

/* Medium desktop/laptop: keep a proper left rail and make Driver Brief an optional drawer. */
@media (min-width:900px) and (max-width:1379px){
  body.driverlog-pro-web:not(.auth-locked) #appShell{padding-left:210px!important;padding-right:0!important}
  body.driverlog-pro-web:not(.auth-locked) nav{width:210px!important;padding:88px 12px 18px!important}
  body.driverlog-pro-web:not(.auth-locked) nav::before,body.driverlog-pro-web:not(.auth-locked) nav::after{content:none!important;display:none!important}
  body.driverlog-pro-web:not(.auth-locked) #appShell>main{max-width:1120px!important;margin:0 auto!important;padding-left:20px!important;padding-right:20px!important}
  body.driverlog-pro-web:not(.auth-locked) #appShell>main::before,
  body.driverlog-pro-web:not(.auth-locked) #appShell>main::after{left:210px;right:0}
  body.driverlog-pro-web:not(.auth-locked) .dl-brief-toggle{display:block}
  body.driverlog-pro-web:not(.auth-locked) .driver-brief.drawer-open{display:block;width:min(300px,86vw);box-shadow:-18px 0 60px rgba(8,28,52,.24)}
  body.driverlog-pro-web:not(.auth-locked) .driver-brief.drawer-open .dl-brief-close{display:block}
}

/* Authentication remains sober, compact and signature-branded. */
body.driverlog-pro-web.auth-locked .dl-left-brand,body.driverlog-pro-web.auth-locked .driver-brief,body.driverlog-pro-web.auth-locked .dl-brief-toggle{display:none!important}
body.driverlog-pro-web.auth-locked .auth-gate{
  background-color:#f7fafc!important;
  background-image:linear-gradient(rgba(247,250,252,.91),rgba(247,250,252,.91)),url('driverlog-appsign.png'),url('driverlog-appsign.png'),url('community-signature.svg')!important;
  background-repeat:no-repeat!important;background-size:auto,150px,90px,1050px auto!important;
  background-position:center,77% 14%,57% 84%,center bottom!important;
}
body.driverlog-pro-web.auth-locked .web-auth-showcase{background:rgba(239,246,253,.92)!important;border-right:1px solid #cddaea!important;color:#16324f!important}
body.driverlog-pro-web.auth-locked .web-showcase-main h2,body.driverlog-pro-web.auth-locked .web-showcase-brand strong{color:#16324f!important}
body.driverlog-pro-web.auth-locked .web-showcase-main p,body.driverlog-pro-web.auth-locked .web-feature-chip span{color:#5f748b!important}

/* Cards remain readable above the signature artwork. */
body.driverlog-pro-web .card,body.driverlog-pro-web .hero,body.driverlog-pro-web .web-kpi{backdrop-filter:blur(1.5px)}

@media (max-width:899px){
  .driver-brief,.dl-brief-toggle,.dl-left-brand{display:none!important}
  body.driverlog-pro-web #appShell>main::before{left:0;right:0;top:0;background-size:95px,70px,125px,80px;background-position:94% 9%,3% 35%,87% 69%,17% 92%;opacity:.022}
  body.driverlog-pro-web #appShell>main::after{left:0;right:0;background-size:800px auto;opacity:.075}
}

@media print{.driver-brief,.dl-brief-toggle,.dl-left-brand{display:none!important}body.driverlog-pro-web #appShell{padding-left:0!important;padding-right:0!important}}

/* === V8.9.0 Visual Hotfix 3 — Hard-line fields, colour Driver Brief, visible entry watermarks, Driver Pulse === */
:root{
  --dl-field-hard:#0b1220;
  --dl-brief-sky:#e5f5ff;
  --dl-brief-lilac:#eee9ff;
  --dl-brief-violet:#e8e6ff;
}

/* Entry/value controls: deliberately strong, hard boundary requested for business data entry. */
body.driverlog-pro-web input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
body.driverlog-pro-web select,
body.driverlog-pro-web textarea,
body.driverlog-pro-web .odometer-card input:not([type="checkbox"]):not([type="radio"]),
body.driverlog-pro-web .vehicle-card input:not([type="checkbox"]):not([type="radio"]){
  border:2.5px solid var(--dl-field-hard)!important;
  border-radius:8px!important;
  background:#fbfdff!important;
  color:#0b1f35!important;
  box-shadow:0 1px 0 rgba(11,18,32,.08), inset 0 0 0 1px rgba(255,255,255,.55)!important;
}
body.driverlog-pro-web input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):hover,
body.driverlog-pro-web select:hover,
body.driverlog-pro-web textarea:hover{
  border-color:#000!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.12)!important;
}
body.driverlog-pro-web input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):focus,
body.driverlog-pro-web select:focus,
body.driverlog-pro-web textarea:focus{
  border-color:#0b1220!important;
  outline:3px solid rgba(37,99,235,.24)!important;
  outline-offset:1px!important;
  box-shadow:0 0 0 1px #2563eb!important;
}
body.driverlog-pro-web input::placeholder,
body.driverlog-pro-web textarea::placeholder{color:#6a7686!important;opacity:1!important}

/* Entry cards carry a clearly visible but still subtle AppSign watermark. */
body.driverlog-pro-web .dl-entry-card{
  position:relative!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.935)!important;
}
body.driverlog-pro-web .dl-entry-card::after{
  content:"";
  position:absolute;
  right:18px;
  bottom:14px;
  width:76px;
  height:76px;
  border-radius:18px;
  background:url('driverlog-appsign.png') center/contain no-repeat;
  opacity:.065;
  filter:saturate(.8) grayscale(.08);
  pointer-events:none;
  z-index:0;
}
body.driverlog-pro-web .dl-entry-card>*{position:relative;z-index:1}

/* Make the multiple page-level AppSign watermarks easier to notice without disturbing records. */
body.driverlog-pro-web #appShell>main::before{
  background-size:176px 176px,108px 108px,205px 205px,128px 128px!important;
  background-position:84% 11%,18% 36%,72% 70%,31% 91%!important;
  opacity:.052!important;
}
body.driverlog-pro-web #appShell>main::after{opacity:.12!important}

/* Right Driver Brief: sober sky-blue + lilac/purple blend instead of white. */
body.driverlog-pro-web .driver-brief{
  background:
    radial-gradient(circle at 88% 8%,rgba(122,92,255,.16),transparent 30%),
    radial-gradient(circle at 8% 35%,rgba(56,189,248,.18),transparent 34%),
    linear-gradient(155deg,var(--dl-brief-sky) 0%,#edf6ff 36%,var(--dl-brief-lilac) 72%,#f1eaff 100%)!important;
  border-left:1px solid #b8c4e8!important;
  box-shadow:-14px 0 34px rgba(54,70,135,.11)!important;
}
body.driverlog-pro-web .driver-brief::before{
  background-image:url('driverlog-appsign.png'),url('driverlog-appsign.png'),url('driverlog-appsign.png'),url('community-signature.svg')!important;
  background-repeat:no-repeat!important;
  background-size:122px,82px,64px,560px auto!important;
  background-position:112% 22%,-8% 51%,95% 76%,center 101%!important;
  opacity:.055!important;
}
body.driverlog-pro-web .dl-brief-card{
  background:rgba(255,255,255,.80)!important;
  border-color:#becce2!important;
  backdrop-filter:blur(8px)!important;
}
body.driverlog-pro-web .dl-brief-brand{border-bottom-color:#bcc9e0!important}

/* Left rail: reserve space and replace the passive footer with an actual Driver Pulse. */
@media (min-width:900px){
  body.driverlog-pro-web:not(.auth-locked) nav{padding-bottom:170px!important}
  body.driverlog-pro-web .web-sidebar-foot{display:none!important}
  body.driverlog-pro-web .dl-left-pulse{
    position:absolute;left:12px;right:12px;bottom:15px;
    min-height:132px;padding:12px 12px 10px;border-radius:14px;
    background:
      linear-gradient(145deg,rgba(32,92,170,.32),rgba(102,62,164,.23)),
      rgba(255,255,255,.045);
    border:1px solid rgba(154,196,240,.25);
    box-shadow:0 10px 26px rgba(0,0,0,.18);
    color:#dcecff;overflow:hidden;
  }
  body.driverlog-pro-web .dl-left-pulse::after{
    content:"";position:absolute;right:-13px;bottom:-16px;width:82px;height:82px;
    background:url('driverlog-appsign.png') center/contain no-repeat;opacity:.10;pointer-events:none;
  }
  body.driverlog-pro-web .dl-left-pulse>*{position:relative;z-index:1}
  body.driverlog-pro-web .dl-pulse-title{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#91caff}
  body.driverlog-pro-web .dl-pulse-line{margin-top:7px;font-size:11px;font-weight:850;color:#fff;line-height:1.35}
  body.driverlog-pro-web .dl-pulse-status{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:8px}
  body.driverlog-pro-web .dl-pulse-status span{display:block;padding:5px 4px;border-radius:8px;background:rgba(255,255,255,.075);text-align:center;font-size:8.5px;color:#b8cee6;line-height:1.25}
  body.driverlog-pro-web .dl-pulse-status b{display:block;color:#fff;font-size:11px;margin-bottom:1px}
  body.driverlog-pro-web .dl-pulse-slogan{margin-top:8px;padding-top:7px;border-top:1px solid rgba(175,211,246,.18);font-size:8.8px;line-height:1.35;color:#a9c4df}
}
@media (min-width:900px) and (max-height:700px){
  body.driverlog-pro-web:not(.auth-locked) nav{padding-bottom:118px!important}
  body.driverlog-pro-web .dl-left-pulse{min-height:82px;padding:9px;bottom:10px}
  body.driverlog-pro-web .dl-pulse-status{display:none}
  body.driverlog-pro-web .dl-pulse-slogan{margin-top:5px;padding-top:5px}
}

/* Auth, signup and onboarding entry areas also show embedded shaded AppSigns. */
body.driverlog-pro-web.auth-locked .auth-card,
body.driverlog-pro-web.auth-locked .auth-panel{
  position:relative!important;
}
body.driverlog-pro-web.auth-locked .auth-card::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url('driverlog-appsign.png'),url('driverlog-appsign.png'),url('driverlog-appsign.png');
  background-repeat:no-repeat;background-size:110px,72px,92px;
  background-position:92% 16%,68% 78%,18% 92%;opacity:.035;z-index:0;
}
body.driverlog-pro-web.auth-locked .auth-card>*{position:relative;z-index:1}

@media (max-width:899px){
  body.driverlog-pro-web #appShell>main::before{opacity:.035!important}
  body.driverlog-pro-web .dl-entry-card::after{width:58px;height:58px;opacity:.045}
}
