*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --bg:#F5F5F5;--surface:#FFFFFF;--border:#E0E0E0;
  --text:#2A3236;--muted:#69818C;--deep:#4D7182;
  --accent:#DBC788;--accent2:#C3DED8;
  --danger:#C0392B;--success:#2E7D5C;--radius:2px;
  --shadow:0 2px 12px rgba(77,113,130,.08);
}
body{background:var(--bg);color:var(--text);font-family:'Raleway',sans-serif;font-size:14px;-webkit-font-smoothing:antialiased;}

.wrap{max-width:900px;margin:0 auto;padding:clamp(16px,3vw,32px);}

/* HEADER */
.cal-header{
  background:linear-gradient(135deg,var(--deep),#3a5f6f);
  border-radius:var(--radius);padding:clamp(20px,4vw,32px);
  margin-bottom:20px;color:#fff;
}
.cal-header h2{font-family:'Raleway',sans-serif;font-weight:900;font-size:clamp(20px,4vw,28px);margin-bottom:6px;}
.cal-header p{font-size:13px;opacity:.8;font-weight:500;}

/* VEHICLE FILTER */
.vehicle-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;}
.vf-btn{
  display:flex;align-items:center;gap:6px;padding:8px 16px;
  border:2px solid var(--border);border-radius:20px;background:var(--surface);
  color:var(--muted);font-family:'Raleway',sans-serif;font-size:13px;
  font-weight:600;cursor:pointer;transition:all .2s;
}
.vf-btn:hover{border-color:var(--deep);color:var(--deep);}
.vf-btn.active{border-color:var(--deep);background:var(--deep);color:#fff;}

/* CALENDAR */
.cal-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(14px,3vw,24px);box-shadow:var(--shadow);}
.cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:12px;flex-wrap:wrap;}
.cal-nav-btn{
  background:transparent;border:2px solid var(--border);border-radius:var(--radius);
  color:var(--deep);font-family:'Raleway',sans-serif;font-weight:700;font-size:13px;
  padding:8px 18px;cursor:pointer;transition:all .2s;
}
.cal-nav-btn:hover{border-color:var(--deep);background:rgba(77,113,130,.06);}
.cal-month-title{font-family:'Raleway',sans-serif;font-weight:800;font-size:clamp(16px,3vw,22px);color:var(--text);}

/* WEEKDAY HEADER */
.cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px;}
.cal-weekday{text-align:center;font-size:11px;font-weight:700;color:var(--muted);padding:6px 2px;}
.cal-weekday.weekend{color:var(--deep);}

/* DAY CELLS */
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;}
.cal-day{
  min-height:clamp(48px,8vw,72px);border-radius:6px;padding:5px;
  display:flex;flex-direction:column;gap:2px;position:relative;
  background:var(--bg);border:1px solid transparent;transition:all .2s;
}
.cal-day.available:hover{border-color:var(--success);background:rgba(46,125,92,.04);cursor:pointer;}
.cal-day.other-month{opacity:.3;}
.cal-day.today .day-num{color:var(--deep);font-weight:800;}
.cal-day.today{border-color:rgba(77,113,130,.3);}
.cal-day.past{opacity:.4;}
.day-num{font-size:12px;font-weight:600;color:var(--text);line-height:1;}

/* STATUS DOTS */
.day-dots{display:flex;gap:2px;flex-wrap:wrap;margin-top:2px;}
.day-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}

/* BLOCKED BAR */
.day-blocked{
  font-size:9px;font-weight:700;padding:2px 4px;border-radius:3px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  border-left:2px solid;
}

/* AVAILABLE INDICATOR */
.day-avail-all{
  position:absolute;bottom:4px;right:4px;
  width:8px;height:8px;border-radius:50%;
  background:var(--success);opacity:.6;
}

/* LEGEND */
.legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;padding-top:16px;border-top:1px solid var(--border);}
.legend-item{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--muted);}
.legend-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;}
.legend-bar{width:12px;height:12px;border-radius:2px;flex-shrink:0;}

/* MONTH OVERVIEW */
.month-overview{margin-top:16px;padding:14px 16px;background:rgba(195,222,216,.15);border:1px solid rgba(195,222,216,.4);border-radius:var(--radius);}
.month-overview-title{font-size:12px;font-weight:700;color:var(--deep);margin-bottom:8px;text-transform:uppercase;letter-spacing:1px;}
.avail-bars{display:flex;flex-direction:column;gap:6px;}
.avail-bar-row{display:flex;align-items:center;gap:8px;font-size:12px;}
.avail-bar-label{width:140px;color:var(--text);font-weight:600;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.avail-bar-track{flex:1;height:8px;background:var(--border);border-radius:4px;overflow:hidden;}
.avail-bar-fill{height:100%;border-radius:4px;background:var(--success);transition:width .4s;}
.avail-bar-pct{width:36px;text-align:right;color:var(--muted);font-weight:600;}

/* LOADING */
.spinner{display:inline-block;width:16px;height:16px;border:2px solid var(--border);border-top-color:var(--deep);border-radius:50%;animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.loading{display:flex;align-items:center;gap:10px;padding:32px;color:var(--muted);justify-content:center;font-weight:500;}

@media(max-width:480px){
  .cal-weekday span{display:none;}
  .cal-weekday::after{content:attr(data-short);}
  .day-num{font-size:11px;}
  .day-blocked{display:none;}
}