/* DriverLog AU V8.9.0 — Left Sidebar Scenic Hotfix 10
   Scope: DESKTOP LEFT SIDEBAR ONLY. No centre, right rail, header, bottom navigation,
   auth, Supabase, calculations or record UI is changed by this stylesheet. */

.dl-calendar-nav{display:none!important}

@media (min-width:1280px){
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav{
    /* Preserve the exact rail width chosen by the existing responsive shell. */
    background-color:#0757aa!important;
    background-image:url('left-sidebar-scenic-h10.jpg')!important;
    background-repeat:no-repeat!important;
    background-position:center top!important;
    background-size:100% 100%!important;
    border-right:1px solid rgba(112,188,255,.72)!important;
    box-shadow:10px 0 30px rgba(6,39,85,.16)!important;
    padding-top:132px!important;
    padding-left:11px!important;
    padding-right:11px!important;
    padding-bottom:166px!important;
    gap:5px!important;
    overflow:hidden!important;
    isolation:isolate!important;
  }

  /* Remove old decorative landmark layers: the approved scenic artwork is now the rail surface. */
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    pointer-events:none!important;
    background:
      linear-gradient(180deg,rgba(0,53,126,.02) 0%,rgba(2,39,91,.04) 48%,rgba(1,30,73,.15) 100%)!important;
    opacity:1!important;
    filter:none!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav::after{display:none!important;content:none!important}
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav>*{position:relative!important;z-index:1!important}

  /* The approved artwork already contains the DriverLog AU master mark at the top. */
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .dl-left-brand{display:none!important}

  /* Live, clickable navigation recreated over the scenic artwork. */
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav button{
    width:100%!important;
    min-width:0!important;
    min-height:43px!important;
    height:43px!important;
    margin:0!important;
    padding:0 14px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:12px!important;
    border:1px solid transparent!important;
    border-radius:11px!important;
    background:rgba(4,68,143,.42)!important;
    color:#f7fbff!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
    backdrop-filter:blur(4px) saturate(1.05)!important;
    -webkit-backdrop-filter:blur(4px) saturate(1.05)!important;
    text-align:left!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    transform:none!important;
    transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav button:hover{
    background:rgba(7,105,207,.78)!important;
    border-color:rgba(165,218,255,.55)!important;
    color:#fff!important;
    transform:translateX(2px)!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav button.active{
    background:linear-gradient(100deg,#0577ff 0%,#1097ff 100%)!important;
    border-color:#72c5ff!important;
    color:#fff!important;
    box-shadow:0 9px 20px rgba(0,87,211,.33),inset 0 1px 0 rgba(255,255,255,.32)!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .nav-icon{
    flex:0 0 23px!important;
    width:23px!important;
    display:inline-grid!important;
    place-items:center!important;
    font-size:18px!important;
    line-height:1!important;
    filter:saturate(.9) brightness(1.13)!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .nav-label{
    display:block!important;
    min-width:0!important;
    color:inherit!important;
    font-size:13.5px!important;
    font-weight:760!important;
    letter-spacing:.005em!important;
    line-height:1.1!important;
    text-shadow:0 1px 2px rgba(0,31,73,.42)!important;
  }

  /* Calendar is a desktop-only left-rail shortcut into the existing monthly Reports view. */
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .dl-calendar-nav{display:flex!important}

  /* Keep the existing live Driver Pulse, but visually match the approved reference. */
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .dl-left-pulse{
    display:block!important;
    position:absolute!important;
    left:11px!important;
    right:11px!important;
    bottom:12px!important;
    min-height:126px!important;
    padding:10px 11px 9px!important;
    border-radius:12px!important;
    background:linear-gradient(145deg,rgba(4,52,121,.94),rgba(7,75,151,.88))!important;
    border:1px solid rgba(123,196,255,.50)!important;
    box-shadow:0 10px 24px rgba(0,32,76,.28),inset 0 1px 0 rgba(255,255,255,.10)!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
    color:#fff!important;
    overflow:hidden!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .dl-left-pulse::after{
    opacity:.08!important;
    right:-14px!important;
    bottom:-15px!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .dl-pulse-title{
    color:#8ed1ff!important;
    font-size:9px!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .dl-pulse-line{
    color:#fff!important;
    font-size:10.5px!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .dl-pulse-status span{
    background:rgba(255,255,255,.12)!important;
    color:#c9e5ff!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .dl-pulse-slogan{color:#d4eaff!important}
}

/* Short desktop windows: preserve the same look but avoid menu/pulse collision. */
@media (min-width:1280px) and (max-height:760px){
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav{
    padding-top:118px!important;
    padding-bottom:105px!important;
    gap:3px!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav button{
    min-height:36px!important;height:36px!important;border-radius:9px!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .nav-label{font-size:12.5px!important}
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .nav-icon{font-size:16px!important}
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .dl-left-pulse{
    min-height:82px!important;bottom:8px!important;padding:8px 9px!important;
  }
  body.driverlog-pro-web:not(.auth-locked) #appShell>nav .dl-pulse-status{display:none!important}
}

/* Below 1280px the existing Hotfix 5/9 tablet and bottom-navigation behaviour is intentionally untouched. */
@media (max-width:1279px){
  .dl-calendar-nav{display:none!important}
}