:root {
  --c-coral: #F06B8A;
  --c-blush: #F9D0D0;
  --c-dark: #1A0E14;
  --c-dark-mid: #2E1A22;
  --c-dark-soft: #3E2530;
  --c-cream: #FFF5F8;
  --c-white: #FFFFFF;
  --c-success: #25D366;
  --f-display: 'Cormorant Garamond', Georgia, serif;
  --f-body: 'Montserrat', system-ui, sans-serif;
  --glass-bg: rgba(255, 255, 255, 0.06);
  --glass-border: rgba(240, 107, 138, 0.18);
  --glass-blur: blur(18px);
  --sidebar-w: 240px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; }
body {
  font-family: var(--f-body);
  font-weight: 300;
  background: linear-gradient(135deg, var(--c-dark) 0%, var(--c-dark-mid) 50%, #3A1A28 100%);
  min-height: 100vh;
  color: var(--c-cream);
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

.glass {
  background: var(--glass-bg);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border: 1px solid var(--glass-border);
}

.admin-layout {
  display: flex;
  min-height: 100vh;
}

.sidebar {
  width: var(--sidebar-w);
  flex-shrink: 0;
  position: fixed;
  top: 0; left: 0; bottom: 0;
  display: flex;
  flex-direction: column;
  padding: 2rem 1.5rem;
  border-right: 1px solid var(--glass-border);
  border-radius: 0;
  z-index: 50;
}

.sidebar__brand {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 2.5rem;
}

.sidebar__logo {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: cover;
  border: 1.5px solid rgba(240, 107, 138, 0.4);
}

.sidebar__name {
  font-family: var(--f-body);
  font-weight: 500;
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(249, 208, 208, 0.7);
}

.sidebar__nav {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.sidebar__link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.7rem 1rem;
  border-radius: 8px;
  font-size: 0.8125rem;
  font-weight: 400;
  color: rgba(249, 208, 208, 0.6);
  transition: background 200ms, color 200ms;
}

.sidebar__link svg { width: 16px; height: 16px; flex-shrink: 0; }
.sidebar__link:hover { background: rgba(240, 107, 138, 0.1); color: var(--c-blush); }
.sidebar__link--active { background: rgba(240, 107, 138, 0.15); color: var(--c-coral); }
.sidebar__link--logout { margin-top: auto; color: rgba(249, 208, 208, 0.35); }
.sidebar__link--logout:hover { color: #ff6b6b; background: rgba(255, 107, 107, 0.1); }

.admin-main {
  margin-left: var(--sidebar-w);
  flex: 1;
  padding: 2.5rem clamp(1.5rem, 4vw, 3rem);
  max-width: 900px;
}

.admin-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 2rem;
  gap: 1rem;
  flex-wrap: wrap;
}

.admin-title {
  font-family: var(--f-display);
  font-weight: 400;
  font-size: 2.25rem;
  color: var(--c-cream);
  line-height: 1.1;
}

.admin-subtitle {
  font-size: 0.8125rem;
  font-weight: 300;
  color: rgba(249, 208, 208, 0.45);
  margin-top: 0.25rem;
}

.card {
  border-radius: 16px;
  padding: 2rem;
  margin-bottom: 1.5rem;
}

.card__title {
  font-family: var(--f-display);
  font-weight: 400;
  font-size: 1.5rem;
  color: var(--c-cream);
  margin-bottom: 1.25rem;
}

.card__subtitle {
  font-size: 0.875rem;
  font-weight: 400;
  color: rgba(249, 208, 208, 0.6);
  margin: 1.75rem 0 1rem;
  letter-spacing: 0.04em;
}

.tabs {
  display: flex;
  gap: 0.25rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid rgba(240, 107, 138, 0.15);
  padding-bottom: 0;
}

.tab {
  font-family: var(--f-body);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: transparent;
  border: none;
  padding: 0.6rem 1.2rem;
  color: rgba(249, 208, 208, 0.4);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color 200ms, border-color 200ms;
}

.tab:hover { color: var(--c-blush); }
.tab--active { color: var(--c-coral); border-bottom-color: var(--c-coral); }

.tab-panel { display: block; }
.tab-panel--hidden { display: none; }

.field-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.field--full { grid-column: 1 / -1; }

.field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.field__label {
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(249, 208, 208, 0.5);
}

.field__input,
.field__textarea {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(240, 107, 138, 0.2);
  border-radius: 8px;
  padding: 0.7rem 1rem;
  font-family: var(--f-body);
  font-size: 0.875rem;
  font-weight: 300;
  color: var(--c-cream);
  width: 100%;
  transition: border-color 200ms, background 200ms;
  outline: none;
}

.field__input:focus,
.field__textarea:focus {
  border-color: var(--c-coral);
  background: rgba(240, 107, 138, 0.06);
}

.field__textarea {
  min-height: 80px;
  resize: vertical;
  line-height: 1.6;
}

.services-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.service-toggle {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.9rem 1rem;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(240, 107, 138, 0.1);
  border-radius: 10px;
  cursor: pointer;
  transition: background 200ms, border-color 200ms;
}

.service-toggle:hover { background: rgba(240, 107, 138, 0.06); border-color: rgba(240, 107, 138, 0.2); }

.service-toggle input[type="checkbox"] { display: none; }

.service-toggle__check {
  width: 20px;
  height: 20px;
  border-radius: 5px;
  border: 1.5px solid rgba(240, 107, 138, 0.4);
  flex-shrink: 0;
  position: relative;
  transition: background 200ms, border-color 200ms;
}

.service-toggle input:checked + .service-toggle__check {
  background: var(--c-coral);
  border-color: var(--c-coral);
}

.service-toggle input:checked + .service-toggle__check::after {
  content: '';
  position: absolute;
  left: 5px; top: 2px;
  width: 7px; height: 11px;
  border: 2px solid white;
  border-top: none; border-left: none;
  transform: rotate(45deg);
}

.service-toggle__info {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.service-toggle__info strong {
  font-size: 0.9rem;
  font-weight: 400;
  color: var(--c-cream);
}

.service-toggle__info small {
  font-size: 0.75rem;
  font-weight: 300;
  color: rgba(249, 208, 208, 0.4);
}

.form-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 2rem;
  padding-bottom: 3rem;
}

.btn-admin {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--f-body);
  font-weight: 400;
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.85rem 2rem;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  transition: transform 150ms, box-shadow 150ms, background 150ms;
  text-decoration: none;
}

.btn-admin:hover { transform: translateY(-2px); }
.btn-admin--primary { background: var(--c-coral); color: white; box-shadow: 0 4px 20px rgba(240,107,138,0.3); }
.btn-admin--primary:hover { background: #C04060; box-shadow: 0 8px 32px rgba(240,107,138,0.4); }
.btn-admin--ghost { background: transparent; border: 1px solid rgba(249,208,208,0.2); color: rgba(249,208,208,0.6); }
.btn-admin--ghost:hover { border-color: rgba(240,107,138,0.4); color: var(--c-blush); }
.btn-admin--lg { padding: 1rem 2.5rem; font-size: 0.8125rem; }

.badge {
  display: inline-flex;
  align-items: center;
  padding: 0.3rem 0.9rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: rgba(249, 208, 208, 0.1);
  color: rgba(249, 208, 208, 0.5);
}

.badge--success {
  background: rgba(37, 211, 102, 0.15);
  color: #25D366;
  border: 1px solid rgba(37, 211, 102, 0.2);
}

.alert { padding: 0.8rem 1rem; border-radius: 8px; font-size: 0.875rem; margin-bottom: 1rem; }
.alert--error { background: rgba(255, 80, 80, 0.12); border: 1px solid rgba(255, 80, 80, 0.25); color: #ff8080; }

.empty-note {
  font-size: 0.8125rem;
  color: rgba(249, 208, 208, 0.35);
  text-align: center;
  padding: 1.5rem;
  border: 1px dashed rgba(240, 107, 138, 0.15);
  border-radius: 10px;
}

.sidebar__group-label {
  font-size: .6rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(249,208,208,.22);
  padding: 1.25rem 1rem .35rem;
}

.status-badge {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .28rem .8rem;
  border-radius: 99px;
  white-space: nowrap;
}
.status-badge--pending          { background: rgba(251,191,36,.12);  color: #fbbf24; border:1px solid rgba(251,191,36,.2); }
.status-badge--confirmed_client { background: rgba(96,165,250,.12);  color: #60a5fa; border:1px solid rgba(96,165,250,.2); }
.status-badge--confirmed_owner  { background: rgba(37,211,102,.12);  color: #25D366; border:1px solid rgba(37,211,102,.2); }
.status-badge--cancelled        { background: rgba(255,80,80,.12);   color: #ff6b6b; border:1px solid rgba(255,80,80,.2); }

.appt-table { width:100%; border-collapse:collapse; }
.appt-table th { font-size:.68rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:rgba(249,208,208,.4); padding:.7rem 1rem; text-align:left; border-bottom:1px solid rgba(240,107,138,.1); }
.appt-table td { padding:.85rem 1rem; border-bottom:1px solid rgba(240,107,138,.06); font-size:.85rem; font-weight:300; color:rgba(255,245,248,.8); vertical-align:middle; }
.appt-table tr:last-child td { border-bottom:none; }
.appt-table tr:hover td { background:rgba(240,107,138,.03); }

.filter-bar { display:flex; gap:.75rem; align-items:center; margin-bottom:1.5rem; flex-wrap:wrap; }
.filter-tab { font-family:var(--f-body); font-size:.7rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase; background:transparent; border:1px solid rgba(240,107,138,.15); border-radius:99px; padding:.45rem 1.1rem; color:rgba(249,208,208,.45); cursor:pointer; transition:all 150ms; text-decoration:none; }
.filter-tab:hover { border-color:rgba(240,107,138,.4); color:var(--c-blush); }
.filter-tab--active { background:rgba(240,107,138,.15); border-color:var(--c-coral); color:var(--c-coral); }
.filter-date { background:rgba(255,255,255,.05); border:1px solid rgba(240,107,138,.2); border-radius:8px; padding:.5rem .9rem; font-family:var(--f-body); font-size:.8125rem; color:var(--c-cream); outline:none; transition:border-color 200ms; }
.filter-date:focus { border-color:var(--c-coral); }

.slot-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); gap:.5rem; }
.slot-chip { display:flex; align-items:center; justify-content:space-between; gap:.5rem; background:rgba(255,255,255,.04); border:1px solid rgba(240,107,138,.12); border-radius:8px; padding:.5rem .85rem; font-size:.8125rem; color:rgba(249,208,208,.7); }
.slot-chip--taken { opacity:.4; }
.slot-chip__del { background:none; border:none; cursor:pointer; color:rgba(255,80,80,.5); line-height:1; padding:0; transition:color 150ms; }
.slot-chip__del:hover { color:#ff6b6b; }

.service-check-list { display:flex; flex-direction:column; gap:.5rem; }
.svc-check-item { display:flex; align-items:center; gap:.9rem; padding:.75rem 1rem; background:rgba(255,255,255,.04); border:1px solid rgba(240,107,138,.1); border-radius:10px; cursor:pointer; transition:border-color 150ms,background 150ms; }
.svc-check-item:has(input:checked) { border-color:rgba(240,107,138,.4); background:rgba(240,107,138,.06); }
.svc-check-item input { display:none; }
.svc-check-item__box { width:18px; height:18px; border-radius:4px; border:1.5px solid rgba(240,107,138,.35); flex-shrink:0; position:relative; transition:background 150ms,border-color 150ms; }
.svc-check-item:has(input:checked) .svc-check-item__box { background:var(--c-coral); border-color:var(--c-coral); }
.svc-check-item:has(input:checked) .svc-check-item__box::after { content:''; position:absolute; left:4px; top:1px; width:6px; height:10px; border:2px solid white; border-top:none; border-left:none; transform:rotate(45deg); }
.svc-check-item__info { flex:1; }
.svc-check-item__name { font-size:.875rem; font-weight:400; color:var(--c-cream); }
.svc-check-item__meta { font-size:.72rem; color:rgba(249,208,208,.38); margin-top:.15rem; }
.svc-check-item__price { font-family:var(--f-display); font-size:1.1rem; color:var(--c-coral); flex-shrink:0; }

.summary-box { background:rgba(240,107,138,.07); border:1px solid rgba(240,107,138,.18); border-radius:10px; padding:1rem 1.25rem; margin-top:1rem; }
.summary-row { display:flex; justify-content:space-between; font-size:.8125rem; padding:.3rem 0; color:rgba(249,208,208,.65); }
.summary-row--total { font-weight:500; color:var(--c-cream); border-top:1px solid rgba(240,107,138,.15); margin-top:.35rem; padding-top:.65rem; font-size:.9rem; }

.login-page {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 2rem;
}

.login-card {
  width: 100%;
  max-width: 400px;
  border-radius: 20px;
  padding: 2.5rem;
  text-align: center;
}

.login-logo {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  object-fit: cover;
  margin-inline: auto;
  margin-bottom: 1.25rem;
  border: 2px solid rgba(240, 107, 138, 0.35);
  filter: drop-shadow(0 0 20px rgba(240,107,138,0.3));
}

.login-title {
  font-family: var(--f-display);
  font-weight: 400;
  font-size: 1.75rem;
  color: var(--c-cream);
  margin-bottom: 1.75rem;
}

.login-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  text-align: left;
}

@media (max-width: 640px) {
  .admin-layout { flex-direction: column; }
  .sidebar { position: static; width: 100%; flex-direction: row; align-items: center; padding: 1rem 1.25rem; }
  .sidebar__nav { flex-direction: row; gap: 0.5rem; }
  .sidebar__brand { margin-bottom: 0; margin-right: auto; }
  .admin-main { margin-left: 0; }
  .field-grid { grid-template-columns: 1fr; }
}
