/* === ЛЕГЕНДА === */
.cal-legend{
  display:flex;justify-content:center;gap:30px;flex-wrap:wrap;
  padding:0 30px 30px;font-size:12px;letter-spacing:1px;opacity:.8;
}
.legend-item{display:flex;align-items:center;gap:8px}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.dot.free{background:#4ade80}
.dot.busy{background:#e89dac}
.dot.off{background:#555}
.dot.booked{background:#fbbf24}

/* По умолчанию админ-элементы скрыты, клиентские видны */
.admin-only{display:none !important}
body.admin-mode .admin-only{display:flex !important}
body.admin-mode .client-only{display:none !important}

/* === КАЛЕНДАРЬ === */
.calendar-wrap{
  max-width:900px;margin:0 auto;padding:20px 30px 60px;
}
.cal-nav{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:25px;
}
.cal-nav h2{
  font-size:22px;font-weight:300;letter-spacing:3px;text-transform:uppercase;
  background:linear-gradient(135deg,#fff,#e89dac);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.cal-nav button{
  width:44px;height:44px;border-radius:50%;
  background:rgba(232,157,172,0.1);border:1px solid rgba(232,157,172,0.3);
  color:#e89dac;font-size:22px;cursor:pointer;transition:all .3s;
}
.cal-nav button:hover{background:#e89dac;color:#0f0f0f}

.cal-weekdays{
  display:grid;grid-template-columns:repeat(7,1fr);gap:8px;
  margin-bottom:10px;text-align:center;
  font-size:11px;letter-spacing:2px;opacity:.5;text-transform:uppercase;
}

.cal-grid{
  display:grid;grid-template-columns:repeat(7,1fr);gap:8px;
}
.cal-day{
  aspect-ratio:1;
  background:linear-gradient(135deg,#1a1a1a,#161616);
  border:1px solid rgba(255,255,255,0.05);
  border-radius:6px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  cursor:pointer;transition:all .3s;
  position:relative;font-weight:300;
}
.cal-day:hover{border-color:rgba(232,157,172,0.5);transform:translateY(-2px)}
.cal-day.empty{visibility:hidden}
.cal-day.past{opacity:.25;cursor:not-allowed;pointer-events:none}
.cal-day.today{border-color:#e89dac;box-shadow:0 0 0 1px #e89dac}
.cal-day.selected{background:linear-gradient(135deg,#e89dac,#d4a5a5);color:#0f0f0f}
.cal-day .num{font-size:20px;font-weight:300}
.cal-day .info{font-size:9px;letter-spacing:1px;margin-top:4px;opacity:.7;text-transform:uppercase}

.cal-day.has-bookings::after{
  content:'';position:absolute;top:6px;right:6px;
  width:6px;height:6px;border-radius:50%;background:#fbbf24;
}
.cal-day.day-off{background:#1a1414;color:#666}
.cal-day.day-off::before{
  content:'🌙';position:absolute;top:4px;left:6px;font-size:10px;opacity:.7;
}
.cal-day.fully-busy{background:linear-gradient(135deg,#3a1f24,#2a1517);color:#e89dac}

/* === ПАНЕЛЬ ДНЯ === */
.day-panel{
  max-width:900px;margin:0 auto 60px;padding:30px;
  background:linear-gradient(135deg,#1a1a1a,#141414);
  border:1px solid rgba(232,157,172,0.2);
  border-radius:10px;
  margin-left:30px;margin-right:30px;
}
.day-panel-head{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:20px;padding-bottom:15px;
  border-bottom:1px solid rgba(255,255,255,.05);
}
.day-panel-head h3{
  font-size:22px;font-weight:300;letter-spacing:1px;color:#e89dac;
}
#dayClose{
  background:none;border:none;color:#666;font-size:22px;cursor:pointer;
  width:36px;height:36px;border-radius:50%;transition:all .3s;
}
#dayClose:hover{background:rgba(255,255,255,.05);color:#fff}

.admin-day-controls{gap:12px;margin-bottom:20px;flex-wrap:wrap}
.admin-day-controls button{
  padding:10px 18px;background:rgba(232,157,172,.1);
  border:1px solid rgba(232,157,172,.3);color:#e89dac;
  border-radius:6px;cursor:pointer;font-size:12px;letter-spacing:1px;
  transition:all .3s;
}
.admin-day-controls button:hover{background:#e89dac;color:#0f0f0f}

.hours-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:10px;
}
.hour-slot{
  padding:14px 10px;border-radius:6px;text-align:center;
  background:rgba(74,222,128,.08);border:1px solid rgba(74,222,128,.3);
  color:#a3e9bf;font-size:14px;letter-spacing:1px;cursor:pointer;
  transition:all .3s;position:relative;
}
.hour-slot:hover{background:rgba(74,222,128,.18)}
.hour-slot.busy{
  background:rgba(232,157,172,.1);border-color:rgba(232,157,172,.3);
  color:#e89dac;cursor:not-allowed;
}
.hour-slot.booked{
  background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.4);
  color:#fbbf24;cursor:pointer;
}
.hour-slot.break{
  background:rgba(120,120,120,.1);border-color:rgba(120,120,120,.3);
  color:#888;
}
.hour-slot .label{display:block;font-size:9px;opacity:.7;margin-top:4px;letter-spacing:.5px}
.hour-slot .client{
  display:block;font-size:10px;margin-top:4px;opacity:.85;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

.day-cta{
  margin-top:25px;padding-top:20px;
  border-top:1px solid rgba(255,255,255,.05);
  text-align:center;
}
.day-cta p{opacity:.6;font-size:13px;margin-bottom:18px}

/* Booking modal */
.booking-box{min-width:340px;max-width:90vw}
.booking-box input,.booking-box select,.booking-box textarea{
  padding:12px;background:#0f0f0f;border:1px solid #333;color:#fff;
  border-radius:4px;font-size:14px;font-family:inherit;
}
.booking-box textarea{resize:vertical}
.booking-btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:5px}
.booking-btns button{flex:1;min-width:90px}

/* мобильная адаптация */
@media (max-width:600px){
  .cal-legend{gap:14px;font-size:11px;padding:0 15px 30px}
  .calendar-wrap{padding:20px 15px 60px}
  .cal-nav h2{font-size:18px;letter-spacing:1px}
  .cal-nav button{width:38px;height:38px;font-size:18px}
  .cal-weekdays{gap:4px;font-size:10px;letter-spacing:1px}
  .cal-grid{gap:4px}
  .cal-day{border-radius:4px}
  .cal-day .num{font-size:16px}
  .cal-day .info{font-size:7px;letter-spacing:0.5px;margin-top:2px}
  .cal-day.has-bookings::after{top:4px;right:4px;width:5px;height:5px}
  .day-panel{padding:20px 15px;margin-left:15px;margin-right:15px}
  .day-panel-head h3{font-size:18px}
  .admin-day-controls{gap:8px}
  .admin-day-controls button{padding:8px 14px;font-size:11px}
  .hours-grid{grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:6px}
  .hour-slot{padding:10px 6px;font-size:12px}
  .hour-slot .label{font-size:8px;margin-top:3px}
  .hour-slot .client{font-size:9px;margin-top:3px}
  .booking-box{min-width:280px}
  .booking-box input,.booking-box select,.booking-box textarea{padding:10px;font-size:13px}
  .booking-btns button{font-size:12px;padding:10px}
}