/* TT Beauty Lounge — Apple-inspired liquid glass layer */
:root{
  --glass-bg:rgba(255,255,255,.075);
  --glass-bg-strong:rgba(255,255,255,.11);
  --glass-line:rgba(255,255,255,.16);
  --glass-line-soft:rgba(255,255,255,.09);
  --glass-shadow:0 18px 55px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.12);
  --glass-blur:22px;
}

body{
  background:
    radial-gradient(circle at 12% 8%,rgba(216,156,150,.16),transparent 28%),
    radial-gradient(circle at 88% 4%,rgba(201,160,94,.18),transparent 30%),
    radial-gradient(circle at 50% 100%,rgba(255,255,255,.035),transparent 30%),
    linear-gradient(160deg,#17110f,#291b17 54%,#17110f);
  background-attachment:fixed;
}

.panel,.login,.card,.install-sheet,.crm-client-card,.crm-box,.crm-stat,.notification-choice,.ios-step,
#clientProfile .account-head{
  background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.045));
  border:1px solid var(--glass-line);
  box-shadow:var(--glass-shadow);
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(165%);
  backdrop-filter:blur(var(--glass-blur)) saturate(165%);
}

.panel,.login,.card,.install-sheet,.crm-client-card,.crm-box,.crm-stat,.ios-step{
  position:relative;
  overflow:hidden;
}

.panel::before,.login::before,.card::before,.install-sheet::before,.crm-client-card::before,.crm-box::before,.crm-stat::before,.ios-step::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.12),transparent 34%,rgba(255,255,255,.025) 72%,rgba(255,255,255,.08));
  opacity:.75;
}

.panel>*,.login>*,.card>*,.install-sheet>*,.crm-client-card>*,.crm-box>*,.crm-stat>*,.ios-step>*{position:relative;z-index:1}

nav.admin-nav{
  background:rgba(23,17,15,.58);
  border:1px solid var(--glass-line-soft);
  border-radius:18px;
  padding:8px;
  top:max(env(safe-area-inset-top),8px);
  box-shadow:0 12px 36px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08);
  -webkit-backdrop-filter:blur(26px) saturate(170%);
  backdrop-filter:blur(26px) saturate(170%);
}

nav.admin-nav button,.auth-tabs button,.crm-tabs button,.slots button,.ghost,.pdf-download{
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.12);
  color:var(--cream);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  backdrop-filter:blur(16px) saturate(150%);
}

nav.admin-nav button.active,.auth-tabs button.active,.crm-tabs button.active,.slots button.selected{
  background:linear-gradient(145deg,rgba(227,196,140,.95),rgba(201,160,94,.82));
  color:#1c130f;
  border-color:rgba(255,255,255,.28);
  box-shadow:0 8px 22px rgba(201,160,94,.18),inset 0 1px 0 rgba(255,255,255,.42);
}

button:not(.ghost):not(.reject):not(.pdf-download){
  box-shadow:0 8px 24px rgba(201,160,94,.14),inset 0 1px 0 rgba(255,255,255,.34);
}

input,textarea,select{
  background:rgba(8,7,7,.42);
  border-color:rgba(255,255,255,.13);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
}

input:focus,textarea:focus,select:focus{
  border-color:rgba(227,196,140,.72);
  box-shadow:0 0 0 3px rgba(201,160,94,.12),inset 0 1px 0 rgba(255,255,255,.06);
  outline:none;
}

.toolbar{
  background:rgba(255,255,255,.04);
  border:1px solid var(--glass-line-soft);
  border-radius:16px;
  padding:8px;
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  backdrop-filter:blur(18px) saturate(150%);
}

.brand{
  background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.11),rgba(255,255,255,.025) 58%,transparent);
  box-shadow:0 12px 45px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
}

.install-overlay{background:rgba(10,8,7,.56);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.crm-chip,.duration-chip{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.12);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.booking-photo,.crm-photo{box-shadow:0 12px 34px rgba(0,0,0,.24)}

@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .panel,.login,.card,.install-sheet,.crm-client-card,.crm-box,.crm-stat,.notification-choice,.ios-step,#clientProfile .account-head{background:#241b17}
  nav.admin-nav{background:#17110fee}
}

@media(max-width:560px){
  :root{--glass-blur:18px}
  .panel,.card,.login,.crm-box,.crm-client-card{box-shadow:0 12px 34px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.10)}
}

@media(prefers-reduced-transparency:reduce){
  .panel,.login,.card,.install-sheet,.crm-client-card,.crm-box,.crm-stat,.notification-choice,.ios-step,#clientProfile .account-head{background:rgba(36,27,23,.96);-webkit-backdrop-filter:none;backdrop-filter:none}
}