:root{--navy:#061b3a;--navy2:#0a254d;--blue:#1769e8;--red:#d91d26;--bg:#f4f7fb;--text:#17263d;--muted:#6d7d95;--border:#e2e9f2;--card:#fff;--shadow:0 7px 22px rgba(22,43,74,.08)}
*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}
.app-shell{min-height:100vh}.sidebar{position:fixed;left:0;top:0;bottom:0;width:200px;background:linear-gradient(180deg,#061b3a,#04152f);color:#fff;z-index:100;display:flex;flex-direction:column;padding:17px 10px 14px}.sidebar-brand{height:52px;display:flex;align-items:center;gap:10px;padding:0 9px;margin-bottom:24px}.atc-logo{font-weight:1000;font-style:italic;font-size:36px;line-height:1;color:#e31e26;letter-spacing:-3px}.brand-title{font-size:10px;font-weight:800;line-height:1.1;color:#fff;white-space:nowrap}.side-nav{display:flex;flex-direction:column;gap:5px}.nav-item{display:flex;align-items:center;gap:13px;color:#dce6f6;padding:12px 11px;border-radius:8px;font-size:14px;font-weight:600;transition:.15s}.nav-item:hover{background:rgba(255,255,255,.08)}.nav-item.active{background:#d91d26;color:#fff;box-shadow:0 6px 14px rgba(217,29,38,.25)}.nav-ico{width:23px;text-align:center;font-size:21px;line-height:1}.logout-side{margin-top:auto;color:#ff2c34;font-size:14px;font-weight:700;padding:12px 12px}.logout-side span{font-size:20px;margin-right:8px}.mobile-overlay{display:none}
.main-area{margin-left:200px;min-height:100vh}.app-header{height:68px;background:#071d3e;color:#fff;display:flex;align-items:center;gap:24px;padding:0 28px;position:sticky;top:0;z-index:50}.menu-button{display:none;border:0;background:transparent;color:#fff;font-size:25px}.header-search{height:42px;max-width:730px;flex:1;display:flex;align-items:center;background:#122e57;border-radius:8px;padding:0 16px}.search-icon{font-size:25px;line-height:1;margin-right:12px;color:#dce6f6}.header-search form{flex:1}.header-search input{width:100%;border:0;outline:0;background:transparent;color:#fff;font-size:14px}.header-search input::placeholder{color:#b8c5d8}.header-user{margin-left:auto;display:flex;align-items:center;gap:10px}.header-chat{display:flex;align-items:center;gap:6px;color:#fff;text-decoration:none;background:#17335e;border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:8px 10px;font-size:13px;font-weight:700}.header-chat:hover{background:#21446f}.header-chat:first-letter{font-size:18px}.notification{font-size:25px;position:relative;margin-right:6px}.notification b{position:absolute;top:-3px;right:-7px;background:#ed2029;border:2px solid #071d3e;border-radius:20px;font-size:9px;padding:2px 5px}.avatar{width:38px;height:38px;border-radius:50%;background:#f1f5fb;color:#1d5cc4;display:grid;place-items:center;font-weight:900}.user-text{display:flex;flex-direction:column;line-height:1.1}.user-text strong{font-size:13px}.user-text small{font-size:11px;color:#b9c7dc;margin-top:4px}.chevron{font-size:20px;color:#d8e2f1;margin-left:5px}
.page-content{padding:23px 24px 28px;max-width:1600px;margin:0 auto}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.page-heading h1{margin:0;font-size:26px;letter-spacing:-.5px}.page-heading p{margin:5px 0 0;color:var(--muted);font-size:13px}.primary-action{background:#1769e8;color:#fff;padding:10px 16px;border-radius:8px;font-size:13px;font-weight:800;box-shadow:0 4px 12px rgba(23,105,232,.2)}
.stat-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:14px}.stat-card{background:#fff;border:1px solid var(--border);border-radius:9px;box-shadow:var(--shadow);padding:15px 13px;display:flex;align-items:center;gap:12px;min-height:86px}.stat-icon{width:42px;height:42px;border-radius:9px;display:grid;place-items:center;font-size:23px;font-weight:900}.stat-icon.blue{background:#e9f1ff;color:#1769e8}.stat-icon.orange{background:#fff1df;color:#ef7900}.stat-icon.red{background:#ffe8e9;color:#df1d29}.stat-icon.purple{background:#f0e9ff;color:#6233c8}.stat-icon.green{background:#eaf7ec;color:#23852e}.stat-card small{display:block;color:#687990;font-size:12px}.stat-card strong{display:inline-block;font-size:24px;line-height:1.1;margin-top:3px}.stat-card em{font-style:normal;color:#2e942e;font-size:11px;margin-left:7px}.stat-card div{min-width:0}
.dashboard-card{background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow);overflow:hidden;margin-bottom:14px}.section-title-bar{background:#061b3a;color:#fff;font-size:14px;font-weight:900;letter-spacing:.1px;padding:10px 14px}.map-frame{position:relative;width:100%;overflow:hidden;background:#0b1424;line-height:0}.map-frame img{width:100%;height:auto;display:block}.outside-dashboard-map{border-radius:0}.shop-dashboard-map{border-radius:0}.truck-pin{position:absolute;transform:translate(-50%,-50%);z-index:10;display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:30px;padding:0 8px;border-radius:16px;background:#e82029;color:#fff;border:2px solid #fff;box-shadow:0 3px 9px rgba(0,0,0,.45);font-size:10px;font-weight:900;white-space:nowrap;line-height:1}.truck-pin:hover{transform:translate(-50%,-50%) scale(1.08);background:#b81219}.tag-pin{font-size:10px}
.bottom-grid{display:grid;grid-template-columns:1fr 1.75fr 1fr;gap:10px}.dark-card{background:linear-gradient(180deg,#09234a,#061b3a);color:#fff;border-color:#0f315e;padding:0 14px 13px}.dark-card-title{font-size:12px;font-weight:900;padding:14px 2px 10px;letter-spacing:.3px;display:flex;justify-content:space-between;align-items:center}.total-outside-title strong{color:#2b78ff;font-size:27px}.location-row{display:grid;grid-template-columns:14px 1fr auto;align-items:center;gap:8px;padding:7px 6px;border-radius:5px;font-size:11px}.location-row:nth-of-type(even){background:rgba(255,255,255,.045)}.location-row b{font-size:12px}.dot{width:10px;height:10px;border-radius:2px;display:block}.yellow{background:#f5c400}.orange{background:#ef7900}.blue{background:#1769e8}.red{background:#e51e2a}.violet{background:#6737c9}.green{background:#2f8d31}.dark-total{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.15);margin-top:6px;padding:11px 6px 0;font-size:12px;font-weight:800}.recent-head,.recent-row{display:grid;grid-template-columns:.55fr 1.4fr 1.2fr 1.1fr;gap:10px;align-items:center}.recent-head{color:#9fb1ca;font-size:10px;border-bottom:1px solid rgba(255,255,255,.16);padding:0 0 7px}.recent-row{padding:7px 0;font-size:10px;border-bottom:1px solid rgba(255,255,255,.08)}.location-badge{display:inline-block;padding:5px 7px;border-radius:5px;color:#fff;font-size:10px;line-height:1.05}.parking{background:#e8b900}.incoming-lot{background:#ef7900}.rt-pickup{background:#1769e8}.waiting-repair{background:#e51e2a}.estimate-critical-parts{background:#6737c9}.new-inventory{background:#2f8d31}.view-all{display:inline-block;color:#2380ff;font-size:12px;font-weight:700;padding:12px 0 2px}.empty-dark{color:#9fb1ca;font-size:11px;padding:14px 0}.unassigned-card{padding:14px}.section-title{font-size:13px;font-weight:900}.results-heading{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--border)}.results-heading p{margin:4px 0 0;color:var(--muted);font-size:11px}.results-heading>span{color:var(--muted);font-size:11px}table{width:100%;border-collapse:collapse}th,td{padding:10px 13px;text-align:left;border-bottom:1px solid var(--border);font-size:11px}th{font-size:10px;color:#687990;text-transform:uppercase;background:#f8faff}.small-action{display:inline-block;background:#1769e8;color:#fff;border-radius:5px;padding:6px 10px;font-size:10px;font-weight:800}.empty{text-align:center;color:var(--muted);padding:22px}footer{text-align:center;color:#73839a;font-size:12px;padding:8px 0 2px}
/* Compatibility for existing pages */
.topbar{background:#071d3e;color:#fff;min-height:68px;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}.topbar .brand{font-weight:900}.topbar nav{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.topbar a{color:#fff}.user-chip{background:#17335e;padding:7px 10px;border-radius:20px;font-size:12px}.container{max-width:1250px;margin:24px auto;padding:0 18px}.container.narrow{max-width:1050px}.panel,.map-card,.stat{background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow)}.panel{padding:20px;margin-bottom:18px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}.stat{padding:18px}.stat span{color:#687990;font-size:12px}.stat strong{display:block;font-size:28px;margin-top:4px}.panel-head{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:15px}.panel h1,.panel h2,.map-card h1,.map-card h2{margin:0}.muted{color:var(--muted)}.btn{display:inline-block;border:1px solid #d0dae7;background:#fff;color:#17263d;border-radius:7px;padding:9px 13px;cursor:pointer}.btn.primary{background:#1769e8;border-color:#1769e8;color:#fff}.btn.danger{background:#d91d26;border-color:#d91d26;color:#fff}.btn.small{padding:6px 9px;font-size:11px}.btn.full{width:100%;margin-top:8px}input,select,textarea{width:100%;padding:10px;border:1px solid #d0dae7;border-radius:7px;background:#fff}label{font-weight:700;font-size:12px;display:flex;flex-direction:column;gap:5px}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.full-field{grid-column:1/-1}.actions{display:flex;gap:10px;margin-top:15px}.alert{padding:10px 12px;border-radius:7px;margin-bottom:13px}.alert.success{background:#e7f8ea;color:#1f7a2b}.alert.danger{background:#ffe8e9;color:#a9161d}.login-page{min-height:100vh;background:linear-gradient(135deg,#061b3a,#0e315e);display:grid;place-items:center}.login-shell{width:min(430px,92vw)}.login-card{background:#fff;border-radius:15px;box-shadow:0 20px 55px rgba(0,0,0,.25);padding:30px}.login-card .brand{font-weight:900;font-size:19px;margin-bottom:18px}.login-card form{display:grid;gap:8px}.search{display:flex;gap:8px}.search input{min-width:280px}
.map-legend{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.legend-chip{background:#f8faff;border:1px solid var(--border);border-radius:999px;padding:7px 10px;font-size:11px}.table-wrap{overflow:auto}
@media(max-width:1150px){.stat-grid{grid-template-columns:repeat(3,1fr)}.bottom-grid{grid-template-columns:1fr 1fr}.bottom-grid .dark-card:last-child{grid-column:1/-1}.recent-row,.recent-head{grid-template-columns:.6fr 1.2fr 1.2fr 1fr}}
@media(max-width:900px){.sidebar{transform:translateX(-100%);transition:transform .2s ease;width:230px}.sidebar.open{transform:translateX(0)}.mobile-overlay.show{display:block;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:90}.main-area{margin-left:0}.app-header{padding:0 15px;gap:12px}.menu-button{display:block}.header-search{height:40px}.user-text,.chevron{display:none}.header-chat span{display:none}.header-chat{padding:8px 9px;font-size:18px}.page-content{padding:17px 12px}.stat-grid{grid-template-columns:repeat(2,1fr)}.bottom-grid{grid-template-columns:1fr}.bottom-grid .dark-card:last-child{grid-column:auto}}
@media(max-width:600px){.page-heading{align-items:flex-start;gap:12px}.page-heading h1{font-size:23px}.primary-action{padding:9px 11px;font-size:12px}.stat-grid{grid-template-columns:1fr 1fr;gap:8px}.stat-card{padding:12px 10px;min-height:76px}.stat-icon{width:36px;height:36px;font-size:19px}.stat-card strong{font-size:21px}.stat-card em{display:none}.section-title-bar{font-size:12px;padding:9px 11px}.truck-pin{min-width:30px;height:26px;font-size:9px;padding:0 5px}.dark-card{padding-left:11px;padding-right:11px}.recent-head{display:none}.recent-row{grid-template-columns:1fr 1.3fr;gap:5px;font-size:10px;padding:8px 0}.recent-row span:nth-child(3),.recent-row span:nth-child(4){grid-column:2}.recent-row span:nth-child(2){grid-column:2}.recent-row span:nth-child(1){grid-row:1/4}.results-heading{padding:12px}.table-wrap{overflow:visible}table,thead,tbody,th,td,tr{display:block}thead{display:none}tbody tr{border:1px solid var(--border);border-radius:8px;margin:8px;padding:8px;background:#f8faff}tbody td{display:flex;justify-content:space-between;gap:10px;border:0;padding:5px 2px;font-size:11px;text-align:right}tbody td::before{content:attr(data-label);font-weight:800;color:#6d7d95;text-align:left}.container{padding:0 9px}.grid{grid-template-columns:1fr}.full-field{grid-column:auto}.topbar{padding:10px 12px}.topbar nav{display:grid;grid-template-columns:repeat(2,1fr);width:100%}.topbar nav a,.topbar nav .user-chip{padding:9px;text-align:center;background:#17335e;border-radius:7px}.stats{grid-template-columns:1fr 1fr}.search{display:block}.search input{min-width:0;margin-bottom:7px}}
@media(max-width:390px){.stat-grid{grid-template-columns:1fr}.stat-card{min-height:70px}.header-search{padding:0 10px}.notification{display:none}}
.login-logo{display:flex;align-items:center;gap:12px;margin-bottom:20px}.login-logo .atc-logo{font-size:48px}.login-logo strong{display:block;font-size:12px}.login-logo small{display:block;color:#6d7d95;font-size:10px;margin-top:3px}.login-card h1{margin:0;font-size:27px}.login-card .muted{font-size:13px;margin:5px 0 20px}.login-button{border:0;width:100%;text-align:center;cursor:pointer;font-size:14px}

/* Dashboard truck-results Username / Action filters */
.truck-result-filters{display:flex;align-items:flex-end;gap:10px;padding:0 16px 14px;border-bottom:1px solid #e7ecf2}
.truck-filter-field{min-width:170px}
.truck-filter-field label{display:block;font-size:10px;font-weight:750;color:#6d798b;margin:0 0 5px}
.truck-filter-field select{min-height:38px;padding:7px 10px;border-radius:10px;font-size:12px;background:#fff}
.filter-apply{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 14px;background:#0a84ff;color:#fff;border:0;border-radius:10px;font-weight:750;cursor:pointer}
.filter-clear{font-size:11px;color:#6d798b;padding:10px 5px}
@media(max-width:760px){
  .truck-result-filters{display:grid;grid-template-columns:1fr 1fr;align-items:end}
  .truck-filter-field{min-width:0}
  .filter-apply{width:100%}
  .filter-clear{align-self:center}
}

/* Unread chat notification */
.header-user .notification{position:relative;align-items:center;justify-content:center;text-decoration:none;font-size:18px;color:#d92727;width:34px;height:34px;border-radius:50%;background:#fff1f1;flex:none;}
.header-user .notification b{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:#d92727;color:#fff;font-size:10px;line-height:18px;text-align:center;font-weight:800;box-sizing:border-box;}

/* Estimates */
.estimate-select-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}
.estimate-select-row select{min-height:42px}
.estimate-truck-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.estimate-truck-summary>div{background:#f8faff;border:1px solid var(--border);border-radius:8px;padding:11px}
.estimate-truck-summary span{display:block;color:#718199;font-size:9px;font-weight:800;text-transform:uppercase;margin-bottom:5px}
.estimate-truck-summary strong{display:block;font-size:12px;word-break:break-word}
.estimate-upload-note{color:#718199;font-size:10px;margin-top:10px}
@media(max-width:760px){.estimate-select-row{grid-template-columns:1fr}.estimate-truck-summary{grid-template-columns:1fr 1fr}}
@media(max-width:450px){.estimate-truck-summary{grid-template-columns:1fr}}

.estimate-add-banner{border:2px solid #1769e8}.estimate-add-banner .truck-section-title{color:#1769e8}
/* Shop > Tools Room submenu */
.side-nav details.nav-group{margin:0;padding:0}.side-nav details.nav-group>summary{list-style:none;cursor:pointer}.side-nav details.nav-group>summary::-webkit-details-marker{display:none}.side-nav .nav-sub{margin-left:18px;border-left:1px solid rgba(255,255,255,.14);padding-left:6px}.side-nav .nav-sub .nav-item{font-size:13px}

/* Global incoming card notification badge */
.atc-card-notification{align-items:center;justify-content:center;text-decoration:none}
.atc-card-notification b{pointer-events:none}


/* Header search: centered, live-search ready, with clear button. */
@media(min-width:901px){
  .app-header .header-search{max-width:730px;margin-left:auto;margin-right:auto;flex:1 1 730px}
  .app-header .header-user{margin-left:0}
}
.header-search form{display:flex;align-items:center;min-width:0;width:100%}
.header-search input{min-width:0;flex:1}
.header-search-clear{width:30px;height:30px;flex:0 0 30px;border:0;border-radius:6px;background:transparent;color:#dce6f6;font-size:22px;line-height:1;display:grid;place-items:center;cursor:pointer;padding:0;margin-left:6px}
.header-search-clear:hover,.header-search-clear:focus{background:rgba(255,255,255,.12);outline:none}
@media(max-width:600px){.header-search-clear{width:28px;height:28px;flex-basis:28px;margin-left:3px}}

/* Header search layout refinement - search centered farther right with clear button beside it */
.app-header .header-search-layout{flex:1 1 auto;min-width:0;display:flex;align-items:center;justify-content:center;gap:9px;padding-left:84px}
.app-header .header-search-layout .header-search{flex:0 1 650px;width:min(650px,100%);max-width:650px;margin:0}
.app-header .header-search-layout .header-search form{display:block;flex:1;min-width:0;width:100%}
.app-header .header-search-layout .header-search input{width:100%;min-width:0}
.app-header .header-search-layout .header-search-clear{width:38px;height:38px;flex:0 0 38px;margin:0;border:1px solid rgba(255,255,255,.14);border-radius:8px;background:#17335e;color:#fff;font-size:22px;line-height:1;display:grid;place-items:center;cursor:pointer;padding:0}
.app-header .header-search-layout .header-search-clear:hover,.app-header .header-search-layout .header-search-clear:focus{background:#21446f;outline:none}
.app-header .header-user{margin-left:0}
@media(max-width:1100px){.app-header .header-search-layout{padding-left:28px}.app-header .header-search-layout .header-search{flex-basis:560px;max-width:560px}}
@media(max-width:900px){.app-header .header-search-layout{padding-left:0;gap:6px;justify-content:flex-start}.app-header .header-search-layout .header-search{flex:1 1 auto;width:auto;max-width:none}.app-header .header-search-layout .header-search-clear{width:36px;height:36px;flex-basis:36px}}
@media(max-width:520px){.app-header .header-search-layout{min-width:0}.app-header .header-search-layout .header-search-clear{width:34px;height:34px;flex-basis:34px}.app-header .header-search-layout .search-icon{margin-right:6px}}

/* 2026-09-04 Header organization: balanced search area and account controls */
@media(min-width:901px){
  .app-header{display:grid;grid-template-columns:minmax(420px,760px) auto;justify-content:end;column-gap:28px;padding-left:42px;padding-right:28px}
  .app-header .menu-button{display:none}
  .app-header .header-search-layout{width:100%;min-width:0;padding-left:0;display:grid;grid-template-columns:minmax(320px,1fr) 40px;align-items:center;gap:8px;justify-self:end}
  .app-header .header-search-layout .header-search{width:100%;max-width:none;min-width:0;margin:0;flex:none}
  .app-header .header-search-layout .header-search-clear{width:40px;height:40px;flex:none;margin:0}
  .app-header .header-user{margin:0;justify-self:end;white-space:nowrap}
}
@media(min-width:1200px){
  .app-header{grid-template-columns:minmax(520px,760px) auto}
}
@media(max-width:900px){
  .app-header{display:flex}
  .app-header .header-search-layout{flex:1 1 auto;display:grid;grid-template-columns:minmax(0,1fr) 36px;gap:6px;padding-left:0}
  .app-header .header-search-layout .header-search{width:100%;max-width:none;margin:0}
  .app-header .header-user{margin-left:0}
}
@media(max-width:520px){
  .app-header{gap:7px;padding-left:10px;padding-right:10px}
  .app-header .header-search-layout{grid-template-columns:minmax(0,1fr) 34px}
  .app-header .header-chat{display:none}
  .app-header .avatar{width:34px;height:34px}
}

/* Header search field filter */
.app-header .header-search form{display:flex!important;align-items:center;gap:8px}
.app-header .header-search #headerSearchType{width:auto;min-width:112px;height:32px;padding:0 24px 0 8px;border:0;border-right:1px solid rgba(255,255,255,.18);border-radius:0;background:#122e57;color:#fff;font-size:12px;font-weight:700;outline:none}
.app-header .header-search #headerSearchType option{background:#fff;color:#17263d}
@media(max-width:700px){.app-header .header-search #headerSearchType{min-width:82px;max-width:96px;font-size:11px;padding-left:5px;padding-right:18px}.app-header .header-search form{gap:5px}}
@media(max-width:430px){.app-header .header-search #headerSearchType{min-width:70px;max-width:76px;font-size:10px}.app-header .header-search .search-icon{display:none}}

/* 2026-09-04 Header redesign: cleaner command-bar layout */
.app-header{
  min-height:74px;
  height:74px;
  background:linear-gradient(90deg,#061a37 0%,#0a2852 58%,#071d3e 100%);
  border-bottom:1px solid rgba(255,255,255,.10);
  box-shadow:0 3px 12px rgba(5,22,48,.12);
}
@media(min-width:901px){
  .app-header{
    display:grid;
    grid-template-columns:minmax(520px,780px) auto;
    align-items:center;
    justify-content:end;
    column-gap:24px;
    padding:0 28px 0 38px;
  }
  .app-header .header-search-layout{
    width:100%;
    display:grid;
    grid-template-columns:minmax(0,1fr) 42px;
    gap:10px;
    padding:0;
    justify-self:end;
  }
}
.app-header .header-search{
  height:46px;
  padding:0 12px 0 14px;
  background:#fff;
  border:1px solid rgba(255,255,255,.22);
  border-radius:12px;
  box-shadow:0 2px 8px rgba(0,0,0,.12);
}
.app-header .header-search .search-icon{
  color:#63758e;
  font-size:21px;
  margin-right:8px;
}
.app-header .header-search form{
  gap:10px!important;
}
.app-header .header-search #headerSearchType{
  min-width:125px;
  height:34px;
  padding:0 26px 0 10px;
  color:#17335e;
  background:#edf3fb;
  border:1px solid #d8e3f0;
  border-radius:8px;
  font-size:12px;
  font-weight:800;
}
.app-header .header-search input{
  color:#17263d;
  font-size:14px;
  font-weight:600;
}
.app-header .header-search input::placeholder{color:#8b9bb0;font-weight:500}
.app-header .header-search:focus-within{
  border-color:#6ea6ef;
  box-shadow:0 0 0 3px rgba(76,139,226,.16),0 2px 8px rgba(0,0,0,.10);
}
.app-header .header-search-layout .header-search-clear{
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:11px;
  background:rgba(255,255,255,.10);
  color:#fff;
  font-size:23px;
  box-shadow:none;
}
.app-header .header-search-layout .header-search-clear:hover,
.app-header .header-search-layout .header-search-clear:focus{
  background:#e62b36;
  border-color:#e62b36;
}
.app-header .header-user{
  min-height:46px;
  padding:4px 8px 4px 6px;
  gap:9px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(255,255,255,.06);
}
.app-header .header-chat{
  min-height:36px;
  padding:7px 10px;
  border-radius:9px;
  background:rgba(255,255,255,.08);
}
.app-header .header-chat:hover{background:rgba(255,255,255,.15)}
.app-header .avatar{
  width:36px;
  height:36px;
  border:2px solid rgba(255,255,255,.22);
  background:#fff;
}
.app-header .user-text strong{font-size:12px}
.app-header .user-text small{font-size:10px;color:#c8d5e6}
.app-header .chevron{font-size:17px;margin-left:1px}
@media(max-width:1050px) and (min-width:901px){
  .app-header{grid-template-columns:minmax(430px,1fr) auto;column-gap:14px;padding-left:22px}
  .app-header .header-search #headerSearchType{min-width:105px}
}
@media(max-width:900px){
  .app-header{height:66px;min-height:66px;padding:0 12px;gap:8px}
  .app-header .header-search-layout{display:grid;grid-template-columns:minmax(0,1fr) 38px;gap:6px}
  .app-header .header-search{height:42px;padding-left:10px;padding-right:8px;border-radius:10px}
  .app-header .header-search-layout .header-search-clear{width:38px;height:38px;border-radius:9px}
  .app-header .header-user{min-height:40px;padding:2px 4px;border:0;background:transparent}
}
@media(max-width:620px){
  .app-header .header-search #headerSearchType{min-width:82px;max-width:92px;height:31px;font-size:10px;padding-left:6px;padding-right:17px}
  .app-header .header-search form{gap:5px!important}
  .app-header .header-search .search-icon{display:none}
}
@media(max-width:470px){
  .app-header .header-search-layout{grid-template-columns:minmax(0,1fr) 34px}
  .app-header .header-search-layout .header-search-clear{width:34px;height:34px}
  .app-header .header-user{display:none}
  .app-header .header-search #headerSearchType{min-width:70px;max-width:76px}
}

/* ATC HEADER REDESIGN v2 - visibly different command-bar layout */
.app-header{
  height:82px!important;
  min-height:82px!important;
  background:#06162f!important;
  border-bottom:4px solid #e31f2b!important;
  box-shadow:0 5px 18px rgba(4,18,40,.22)!important;
  padding:0 26px!important;
  gap:18px!important;
}
@media(min-width:901px){
  .app-header{
    display:grid!important;
    grid-template-columns:46px minmax(540px,820px) minmax(260px,auto)!important;
    justify-content:center!important;
    align-items:center!important;
  }
  .app-header .menu-button{display:none!important}
  .app-header .header-search-layout{grid-column:2;width:100%!important;display:flex!important;align-items:center!important;gap:10px!important;justify-self:center!important}
  .app-header .header-user{grid-column:3;justify-self:end!important;margin-left:0!important}
}
.app-header .header-search-layout:before{
  content:"TRUCK SEARCH";
  flex:0 0 auto;
  font-size:10px;
  letter-spacing:.12em;
  font-weight:900;
  color:#9fb0c7;
  margin-right:2px;
}
.app-header .header-search{
  height:50px!important;
  flex:1 1 auto!important;
  max-width:none!important;
  padding:0 8px 0 12px!important;
  background:#f7f9fc!important;
  border:1px solid #cbd6e4!important;
  border-radius:8px!important;
  box-shadow:inset 0 1px 0 #fff,0 2px 7px rgba(0,0,0,.14)!important;
}
.app-header .header-search .search-icon{
  width:32px;height:32px;display:grid;place-items:center;
  margin-right:8px!important;border-radius:7px;background:#e8eef7;color:#173b68!important;font-size:19px!important
}
.app-header .header-search form{display:flex!important;align-items:center!important;gap:8px!important;width:100%!important}
.app-header .header-search #headerSearchType{
  min-width:138px!important;max-width:138px!important;height:36px!important;
  background:#0d3261!important;color:#fff!important;border:0!important;border-radius:7px!important;
  font-size:11px!important;font-weight:800!important;padding:0 28px 0 10px!important
}
.app-header .header-search input{
  height:38px!important;background:#fff!important;border:1px solid #d8e0ea!important;border-radius:7px!important;
  padding:0 12px!important;color:#10233f!important;font-size:14px!important;font-weight:600!important
}
.app-header .header-search input:focus{border-color:#6a9cda!important;box-shadow:0 0 0 3px rgba(60,126,211,.12)!important}
.app-header .header-search-layout .header-search-clear{
  width:auto!important;min-width:92px!important;height:42px!important;padding:0 14px!important;
  border:1px solid #e15a62!important;border-radius:8px!important;background:#fff!important;color:#c8212b!important;
  font-size:12px!important;font-weight:900!important;box-shadow:0 2px 6px rgba(0,0,0,.10)!important
}
.app-header .header-search-layout .header-search-clear:after{content:" Clear"}
.app-header .header-search-layout .header-search-clear:hover{background:#e31f2b!important;color:#fff!important;border-color:#e31f2b!important}
.app-header .header-user{
  min-height:50px!important;padding:5px 8px!important;border:1px solid #274364!important;border-radius:9px!important;
  background:#0b2548!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important
}
.app-header .header-chat{background:#143967!important;border-color:#30547d!important;border-radius:7px!important}
.app-header .avatar{background:#fff!important;border:0!important;width:38px!important;height:38px!important}
.app-header .user-text strong{color:#fff!important}.app-header .user-text small{color:#a9bad0!important}
@media(max-width:1100px) and (min-width:901px){
  .app-header{grid-template-columns:1fr minmax(470px,1.8fr) auto!important;padding:0 16px!important}
  .app-header .header-search-layout:before{display:none}
  .app-header .header-search #headerSearchType{min-width:112px!important;max-width:112px!important}
  .app-header .header-search-layout .header-search-clear{min-width:44px!important;width:44px!important;padding:0!important;font-size:21px!important}
  .app-header .header-search-layout .header-search-clear:after{content:""}
}
@media(max-width:900px){
  .app-header{height:68px!important;min-height:68px!important;border-bottom-width:3px!important;padding:0 10px!important;display:flex!important}
  .app-header .header-search-layout{display:flex!important;gap:6px!important;min-width:0!important;flex:1!important}
  .app-header .header-search-layout:before{display:none!important}
  .app-header .header-search{height:44px!important;min-width:0!important;padding:0 6px!important}
  .app-header .header-search .search-icon{display:none!important}
  .app-header .header-search #headerSearchType{min-width:86px!important;max-width:86px!important;height:34px!important;padding-left:7px!important;font-size:10px!important}
  .app-header .header-search input{height:34px!important;font-size:16px!important;padding:0 8px!important}
  .app-header .header-search-layout .header-search-clear{min-width:38px!important;width:38px!important;height:38px!important;padding:0!important;font-size:20px!important}
  .app-header .header-search-layout .header-search-clear:after{content:""}
}


/* ATC SHARED DASHBOARD HEADER - ALL PAGES */
/* ATC HEADER REDESIGN v2 - visibly different command-bar layout */
.app-header{
  height:82px!important;
  min-height:82px!important;
  background:#06162f!important;
  border-bottom:4px solid #e31f2b!important;
  box-shadow:0 5px 18px rgba(4,18,40,.22)!important;
  padding:0 26px!important;
  gap:18px!important;
}
@media(min-width:901px){
  .app-header{
    display:grid!important;
    grid-template-columns:46px minmax(540px,820px) minmax(260px,auto)!important;
    justify-content:center!important;
    align-items:center!important;
  }
  .app-header .menu-button{display:none!important}
  .app-header .header-search-layout{grid-column:2;width:100%!important;display:flex!important;align-items:center!important;gap:10px!important;justify-self:center!important}
  .app-header .header-user{grid-column:3;justify-self:end!important;margin-left:0!important}
}
.app-header .header-search-layout:before{
  content:"TRUCK SEARCH";
  flex:0 0 auto;
  font-size:10px;
  letter-spacing:.12em;
  font-weight:900;
  color:#9fb0c7;
  margin-right:2px;
}
.app-header .header-search{
  height:50px!important;
  flex:1 1 auto!important;
  max-width:none!important;
  padding:0 8px 0 12px!important;
  background:#f7f9fc!important;
  border:1px solid #cbd6e4!important;
  border-radius:8px!important;
  box-shadow:inset 0 1px 0 #fff,0 2px 7px rgba(0,0,0,.14)!important;
}
.app-header .header-search .search-icon{
  width:32px;height:32px;display:grid;place-items:center;
  margin-right:8px!important;border-radius:7px;background:#e8eef7;color:#173b68!important;font-size:19px!important
}
.app-header .header-search form{display:flex!important;align-items:center!important;gap:8px!important;width:100%!important}
.app-header .header-search #headerSearchType{
  min-width:138px!important;max-width:138px!important;height:36px!important;
  background:#0d3261!important;color:#fff!important;border:0!important;border-radius:7px!important;
  font-size:11px!important;font-weight:800!important;padding:0 28px 0 10px!important
}
.app-header .header-search input{
  height:38px!important;background:#fff!important;border:1px solid #d8e0ea!important;border-radius:7px!important;
  padding:0 12px!important;color:#10233f!important;font-size:14px!important;font-weight:600!important
}
.app-header .header-search input:focus{border-color:#6a9cda!important;box-shadow:0 0 0 3px rgba(60,126,211,.12)!important}
.app-header .header-search-layout .header-search-clear{
  width:auto!important;min-width:92px!important;height:42px!important;padding:0 14px!important;
  border:1px solid #e15a62!important;border-radius:8px!important;background:#fff!important;color:#c8212b!important;
  font-size:12px!important;font-weight:900!important;box-shadow:0 2px 6px rgba(0,0,0,.10)!important
}
.app-header .header-search-layout .header-search-clear:after{content:" Clear"}
.app-header .header-search-layout .header-search-clear:hover{background:#e31f2b!important;color:#fff!important;border-color:#e31f2b!important}
.app-header .header-user{
  min-height:50px!important;padding:5px 8px!important;border:1px solid #274364!important;border-radius:9px!important;
  background:#0b2548!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important
}
.app-header .header-chat{background:#143967!important;border-color:#30547d!important;border-radius:7px!important}
.app-header .avatar{background:#fff!important;border:0!important;width:38px!important;height:38px!important}
.app-header .user-text strong{color:#fff!important}.app-header .user-text small{color:#a9bad0!important}
@media(max-width:1100px) and (min-width:901px){
  .app-header{grid-template-columns:1fr minmax(470px,1.8fr) auto!important;padding:0 16px!important}
  .app-header .header-search-layout:before{display:none}
  .app-header .header-search #headerSearchType{min-width:112px!important;max-width:112px!important}
  .app-header .header-search-layout .header-search-clear{min-width:44px!important;width:44px!important;padding:0!important;font-size:21px!important}
  .app-header .header-search-layout .header-search-clear:after{content:""}
}
@media(max-width:900px){
  .app-header{height:68px!important;min-height:68px!important;border-bottom-width:3px!important;padding:0 10px!important;display:flex!important}
  .app-header .header-search-layout{display:flex!important;gap:6px!important;min-width:0!important;flex:1!important}
  .app-header .header-search-layout:before{display:none!important}
  .app-header .header-search{height:44px!important;min-width:0!important;padding:0 6px!important}
  .app-header .header-search .search-icon{display:none!important}
  .app-header .header-search #headerSearchType{min-width:86px!important;max-width:86px!important;height:34px!important;padding-left:7px!important;font-size:10px!important}
  .app-header .header-search input{height:34px!important;font-size:16px!important;padding:0 8px!important}
  .app-header .header-search-layout .header-search-clear{min-width:38px!important;width:38px!important;height:38px!important;padding:0!important;font-size:20px!important}
  .app-header .header-search-layout .header-search-clear:after{content:""}
}

/* ATC v - top header Chat text must remain white on every page/state */
.app-header .header-chat,
.app-header .header-chat:link,
.app-header .header-chat:visited,
.app-header .header-chat:hover,
.app-header .header-chat:active,
.app-header .header-chat:focus,
.app-header .header-chat span{color:#fff!important;-webkit-text-fill-color:#fff!important}
