body[data-template="8"]{
  --accent:var(--selected-accent,#f72585);
  --accent2:var(--selected-accent2,#9b32d4);
  --accent-wash:#fff0f8;
  --accent-line:#edccec;
  --text:#32104f;
  min-height:100vh;
  font-family:'Trebuchet MS',Arial,sans-serif;
  background:
    linear-gradient(rgba(255,253,251,.55),rgba(255,253,251,.55)),
    url('../../assets/artist-splash-bg.png');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;
}
body[data-template="8"] .wrap{ max-width:1180px; }
body[data-template="8"] .header,
body[data-template="8"] .card{
  border:1px solid rgba(123,44,191,.12);
  border-radius:26px;
  background:rgba(255,255,255,.84);
  box-shadow:0 18px 42px -24px rgba(72,20,104,.35);
}
body[data-template="8"] .header{ padding:22px; }
body[data-template="8"] .header h1,
body[data-template="8"] h1,
body[data-template="8"] h2,
body[data-template="8"] h3{ color:#32104f; }
body[data-template="8"] .panel{
  border:1px solid rgba(123,44,191,.13);
  border-radius:20px;
  background:rgba(255,255,255,.82);
  box-shadow:0 14px 34px -26px rgba(72,20,104,.38);
}
body[data-template="8"] .panel:nth-of-type(3n+1){ border-top:4px solid var(--accent); }
body[data-template="8"] .panel:nth-of-type(3n+2){ border-top:4px solid #2498ef; }
body[data-template="8"] .panel:nth-of-type(3n){ border-top:4px solid #20ca69; }
body[data-template="8"] .number{ background:linear-gradient(135deg,var(--accent),var(--accent2)); }
body[data-template="8"] input,
body[data-template="8"] select,
body[data-template="8"] textarea{
  border-color:#e4d4e8;
  border-radius:11px;
}
body[data-template="8"] input:focus,
body[data-template="8"] select:focus,
body[data-template="8"] textarea:focus{
  outline:3px solid rgba(247,37,133,.20);
  border-color:var(--accent);
}
body[data-template="8"] .btn,
body[data-template="8"] button:not(.nav-toggle){
  border-radius:999px;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  box-shadow:0 12px 24px -14px rgba(247,37,133,.72);
}
body[data-template="8"] .btn-outline{
  border-radius:999px;
  border-color:#7b2cbf;
  color:#7b2cbf;
}
body[data-template="8"] .bank{ border-color:rgba(36,152,239,.35); background:rgba(36,152,239,.08); }
body[data-template="8"] .notice,
body[data-template="8"] .deposit-box,
body[data-template="8"] .balance-box{ border-color:rgba(247,37,133,.26); background:linear-gradient(135deg,rgba(247,37,133,.09),rgba(36,152,239,.08)); }
body[data-template="8"] .cost-row{ border-color:#f0e5f1; }
body[data-template="8"] .total-row{ background:linear-gradient(90deg,var(--accent-wash),rgba(255,255,255,.8)); color:var(--accent2); }
body[data-template="8"] a{ color:#7b2cbf; }
@media(max-width:800px){
  body[data-template="8"] .header{ padding:16px; border-radius:20px; }
  body[data-template="8"] .panel,
  body[data-template="8"] .card{ border-radius:18px; }
}

/* Booking header logo position — available for every template. */
body[data-logo-position="left"] .header .logo{ order:-1; }
body[data-logo-position="center"] .header{
  flex-direction:column-reverse;
  align-items:center;
  text-align:center;
}
body[data-logo-position="center"] .header > div{ width:100%; }
body[data-logo-position="right"] .header .logo{ order:2; }
@media(max-width:800px){
  body[data-logo-position="left"] .header,
  body[data-logo-position="right"] .header{ align-items:center; }
}

body[data-logo-shape="circle"] .header .logo{
  width:145px;
  height:145px;
  max-width:145px;
  max-height:145px;
  border-radius:50%;
  object-fit:contain;
}
body[data-logo-shape="rectangle"] .header .logo{
  width:min(380px,46vw);
  height:auto;
  max-height:150px;
  border-radius:0;
  object-fit:contain;
}
@media(max-width:800px){
  body[data-logo-shape="circle"] .header .logo{
    width:105px;
    height:105px;
    max-width:105px;
    max-height:105px;
  }
  body[data-logo-shape="rectangle"] .header .logo{
    width:min(270px,58vw);
    height:auto;
    max-height:105px;
  }
}