.booking-shell{width:min(100%,560px);margin:auto}.back-link{color:white;text-decoration:none;font-size:13px;display:inline-block;margin:0 0 24px}.screen-title{text-align:center;margin:0 0 30px}.screen-title h1{font-size:clamp(29px,7vw,39px)}.screen-title p:not(.eyebrow){font-size:14px;line-height:1.7;color:#ffffffcf}.mini-logo{display:inline-grid;place-items:center;border:1px solid #ffdf92;background:#17263e;border-radius:50%;font-size:30px;color:#ffda66;width:62px;height:62px;margin-bottom:20px}.glass{background:#17263ee0;backdrop-filter:blur(14px);border:1px solid #ffffff40;border-radius:28px;padding:26px;box-shadow:0 12px 40px #0002}.steps{display:flex;gap:12px;font-size:11px;margin:0 0 30px;justify-content:space-between}.steps span{color:#ffffff60;white-space:nowrap}.steps span.active{color:#ffe18d}.glass h2{font-size:23px;line-height:1.3;margin:0 0 12px;letter-spacing:-.6px}.muted,.loading{color:#ffffffa8;font-size:13px;line-height:1.8}.option-list{display:grid;gap:12px;margin:24px 0}.option{display:flex;align-items:center;gap:14px;width:100%;padding:17px;border:1px solid #ffffff33;border-radius:18px;background:#ffffff08;color:#fff;text-align:left;font-family:inherit;cursor:pointer}.option:hover,.option.selected{border-color:#ffcc00;background:#ffcc0012}.option .avatar{display:grid;place-items:center;width:45px;height:45px;border-radius:50%;background:#ffe18d;color:#17263e;font-weight:700;flex-shrink:0}.option strong{display:block;font-size:15px}.option small{display:block;color:#ffffffab;font-size:12px;margin-top:5px}.option .right{margin-left:auto;text-align:right;color:#ffe18d;font-size:14px;white-space:nowrap}label{display:block;color:#ffffffd8;font-size:13px;margin:18px 0}input,select,textarea{box-sizing:border-box;display:block;width:100%;padding:13px 14px;margin-top:8px;border:1px solid #ffffff40;border-radius:12px;background:#ffffff0d;color:#fff;font:inherit;font-size:14px;outline:none;color-scheme:dark}input:focus,select:focus,textarea:focus{border-color:#ffcc00;box-shadow:0 0 0 3px #ffcc0015}select option{background:#17263e}textarea{resize:vertical;min-height:90px}button{font-family:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.4}.primary{display:flex;align-items:center;justify-content:center;gap:12px;padding:14px 20px;border:0;border-radius:14px;background:#ffcc00;color:#17263e;font-weight:700;font-size:14px;text-decoration:none}.primary:hover{background:#ffe18d}.wide{width:100%}.quiet{border:1px solid #ffffff30;border-radius:12px;color:white;background:#ffffff08;padding:10px 14px;font-size:12px;text-decoration:none;display:inline-block}.quiet:hover{background:#ffffff15}.actions{display:flex;align-items:center;gap:12px;margin-top:26px}.actions .primary{margin-left:auto}.summary{background:#ffffff08;border:1px solid #ffffff20;border-radius:14px;padding:15px;font-size:13px;line-height:1.8;color:#ffffffd1;margin:18px 0}.summary strong{display:block;color:#fff;font-size:16px}.slots{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:20px 0}.slot{border:1px solid #ffffff40;border-radius:12px;background:#ffffff08;padding:12px 4px;color:#fff;font-size:14px}.slot.selected{border-color:#ffcc00;color:#17263e;background:#ffcc00;font-weight:700}.slot:disabled{text-decoration:line-through}.slot small{display:block;font-size:9px;margin-top:6px;text-decoration:none}.slot.closed{background:#ffffff06;color:#ffffff70;border-color:#ffffff20}.slot.open{border-color:#79d6a080}.slot.booked{border-color:#f5ca7660;color:#f5ca76;background:#f5ca760a}.slot.past{opacity:.4}.checkbox{display:flex;align-items:flex-start;gap:12px;line-height:1.8}.checkbox input{width:18px;height:18px;margin:4px 0 0;flex-shrink:0;accent-color:#ffcc00}.checkbox small{color:#ffffff90;display:block;font-size:11px}.error{color:#ffc7be;background:#e66c5c15;border:1px solid #e66c5c50;border-radius:12px;padding:13px;font-size:13px;line-height:1.7}.hidden{display:none!important}.success{text-align:center}.success-badge{margin:10px auto 24px;width:75px;height:75px;border-radius:50%;display:grid;place-items:center;font-size:35px;border:1px solid #ffe18d;color:#ffe18d}.success .primary{margin-top:22px}.panel-shell{width:min(100%,1000px);margin:auto}.panel-top{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:24px}.panel-top>a{color:white;text-decoration:none;font-size:13px}.login-box{max-width:440px;margin:0 auto;text-align:center}.login-box form{text-align:left}.panel-title{margin-bottom:26px}.panel-title h1{font-size:36px}.panel-title p{font-size:14px;color:#ffffffbd}.panel-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}.panel-tabs button{flex:1;min-width:100px;padding:12px 15px;border:1px solid #ffffff40;border-radius:14px;color:white;background:#ffffff0b}.panel-tabs button.active{background:#ffcc00;color:#17263e;border-color:#ffcc00;font-weight:700}.row{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap}.row>*{flex:1;min-width:180px}.row label{margin:12px 0}.row .quiet{flex:0;min-width:80px;margin-bottom:12px}.bookings{display:grid;gap:12px;margin-top:22px}.booking-card{padding:18px;border:1px solid #ffffff25;border-radius:18px;background:#ffffff06}.booking-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.booking-head strong{font-size:17px}.booking-head small{display:block;color:#ffffffb3;line-height:1.8;margin:8px 0}.booking-head a{color:#ffe18d;text-decoration:none}.status{white-space:nowrap;padding:5px 9px;font-size:10px;border-radius:9px;background:#87d9a922;color:#9becb9}.status.cancelled{background:#e96e6022;color:#ffb0a6}.status.completed,.status.no_show{background:#ffffff12;color:#ffffffa0}.booking-meta{font-size:12px;color:#ffffffb0;line-height:1.8}.booking-actions{display:flex;gap:7px;margin-top:14px;flex-wrap:wrap}.booking-actions button{padding:8px 11px;font-size:11px}.empty{padding:30px 10px;text-align:center;color:#ffffffaf;font-size:14px}.days{display:flex;flex-wrap:wrap;gap:9px}.days label{margin:0;font-size:12px}.days input{display:inline-block;width:16px;margin:0 5px 0 0;vertical-align:middle;accent-color:#ffcc00}.section-gap{margin-top:26px;padding-top:24px;border-top:1px solid #ffffff22}.team-card{margin:16px 0;padding:18px;border:1px solid #ffffff30;border-radius:16px;background:#ffffff05}.team-card .team-link{display:block;color:#ffe18d;font-size:13px;text-decoration:none;overflow-wrap:anywhere;margin:12px 0}.team-card form{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}.team-card form label{flex:1;min-width:180px;margin:10px 0}.team-card form button{margin-bottom:10px}.info{background:#ffffff06;border:1px solid #ffffff24;padding:18px;border-radius:16px;font-size:13px;line-height:1.9;color:#ffffffbd}.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#fff1c2;color:#17263e;padding:13px 22px;border-radius:16px;max-width:90vw;box-shadow:0 8px 24px #0004;font-size:13px;z-index:10}.total{font-size:12px;color:#ffe18d}.password-box{max-width:460px}a:focus-visible,button:focus-visible{outline:3px solid #ffe18d;outline-offset:4px}@media(max-width:560px){body{padding:26px 16px}.glass{padding:22px 18px;border-radius:24px}.steps{font-size:10px;gap:6px}.panel-title h1{font-size:30px}.panel-top{gap:10px}.slots{grid-template-columns:repeat(4,1fr)}.row{gap:4px}.row>*{min-width:100%}.booking-head strong{font-size:15px}.panel-tabs button{min-width:80px;font-size:12px;padding:11px 8px}.team-card form button{width:100%}}

.quiet.danger{color:#ffb6ab;border-color:#ec867650}.quiet.danger:hover{background:#ec86761a}

/* YÖNETİM PANELİ GÖRÜNÜMÜ
   Panel kutuları ve form alanlarının renklerini buradan düzenleyebilirsin. */
.panel-shell .glass {
  background: #202020;
  border-color: #ffffff26;
  border-radius: 16px;
}

.panel-shell .primary,
.panel-shell .panel-tabs button.active {
  background: #d4af37;
  color: #111111;
}

.panel-shell .primary:hover,
.panel-shell .panel-tabs button.active:hover {
  background: #e5c45b;
}

.panel-shell input,
.panel-shell select,
.panel-shell textarea {
  background: #303030;
  border-color: #ffffff33;
  border-radius: 8px;
}

.panel-shell select option {
  background: #303030;
}

.panel-shell input:focus,
.panel-shell select:focus,
.panel-shell textarea:focus {
  border-color: #d4af37;
  box-shadow: 0 0 0 3px #d4af3726;
}

/* Tüm yönetim ve berber panellerinde üstte büyük isim, altta küçük karşılama. */
.panel-title #shop-name {
  margin: 0 0 10px;
  font-size: clamp(30px, 6vw, 42px);
  line-height: 1.2;
  color: #ffffff;
  overflow-wrap: anywhere;
}

.panel-title #welcome {
  margin: 0 0 8px;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 500;
  color: #ffffffcf;
}