/* =========================================================
   BarberDesk v0.5.1 – Visual Fix Pack
   Removes legacy white surfaces + paw branding
   ========================================================= */
:root{
  --bd51-bg:#0f0f0f;
  --bd51-panel:#171717;
  --bd51-panel2:#1d1b18;
  --bd51-border:#3b3228;
  --bd51-gold:#d39a3a;
  --bd51-gold-soft:#e8c277;
  --bd51-cream:#f4eee4;
  --bd51-muted:#aaa196;
}

/* hard host-specific visual reset */
html[data-industry="hair_salon"] body,
body.business-hair-salon{
  background:var(--bd51-bg)!important;
  color:var(--bd51-cream)!important;
}

/* 1) THE WHITE "HEUTE" BOARD / PAGE HEADER */
body.business-hair-salon .page-head,
body.business-hair-salon .page-header,
body.business-hair-salon .content-header,
body.business-hair-salon .view-header,
body.business-hair-salon .section-header,
html[data-industry="hair_salon"] .page-head,
html[data-industry="hair_salon"] .page-header,
html[data-industry="hair_salon"] .content-header,
html[data-industry="hair_salon"] .view-header,
html[data-industry="hair_salon"] .section-header{
  background:linear-gradient(180deg,#191919,#151515)!important;
  color:var(--bd51-cream)!important;
  border:1px solid var(--bd51-border)!important;
  border-radius:8px!important;
  box-shadow:none!important;
  padding:14px 18px!important;
  margin:14px 18px!important;
  min-height:74px!important;
}

body.business-hair-salon .page-head h1,
body.business-hair-salon .page-header h1,
body.business-hair-salon .content-header h1,
body.business-hair-salon .view-header h1,
body.business-hair-salon .section-header h1,
html[data-industry="hair_salon"] .page-head h1,
html[data-industry="hair_salon"] .page-header h1,
html[data-industry="hair_salon"] .content-header h1,
html[data-industry="hair_salon"] .view-header h1,
html[data-industry="hair_salon"] .section-header h1{
  color:var(--bd51-gold-soft)!important;
  font-size:27px!important;
  line-height:1.05!important;
  margin:0!important;
  font-weight:850!important;
}

body.business-hair-salon .page-head p,
body.business-hair-salon .page-header p,
body.business-hair-salon .content-header p,
body.business-hair-salon .view-header p,
body.business-hair-salon .section-header p,
html[data-industry="hair_salon"] .page-head p,
html[data-industry="hair_salon"] .page-header p,
html[data-industry="hair_salon"] .content-header p,
html[data-industry="hair_salon"] .view-header p,
html[data-industry="hair_salon"] .section-header p{
  color:#d8d0c5!important;
  margin:5px 0 0!important;
}

/* legacy light icon box inside page header */
body.business-hair-salon .page-head .icon,
body.business-hair-salon .page-header .icon,
body.business-hair-salon .content-header .icon,
body.business-hair-salon .view-header .icon,
body.business-hair-salon .section-header .icon,
html[data-industry="hair_salon"] .page-head .icon,
html[data-industry="hair_salon"] .page-header .icon,
html[data-industry="hair_salon"] .content-header .icon,
html[data-industry="hair_salon"] .view-header .icon,
html[data-industry="hair_salon"] .section-header .icon{
  background:#30271b!important;
  color:var(--bd51-gold)!important;
  border:1px solid #5d4623!important;
  border-radius:7px!important;
}

/* breadcrumb must remain readable in dark header */
body.business-hair-salon .breadcrumb,
body.business-hair-salon .breadcrumbs,
html[data-industry="hair_salon"] .breadcrumb,
html[data-industry="hair_salon"] .breadcrumbs{
  color:#d9d0c4!important;
}
body.business-hair-salon .breadcrumb strong,
body.business-hair-salon .breadcrumbs strong,
html[data-industry="hair_salon"] .breadcrumb strong,
html[data-industry="hair_salon"] .breadcrumbs strong{
  color:var(--bd51-gold-soft)!important;
}

/* 2) REMOVE LEGACY WHITE SEARCH WRAPPERS */
body.business-hair-salon .search-wrap,
body.business-hair-salon .search-bar,
body.business-hair-salon .search-box,
body.business-hair-salon .global-search,
html[data-industry="hair_salon"] .search-wrap,
html[data-industry="hair_salon"] .search-bar,
html[data-industry="hair_salon"] .search-box,
html[data-industry="hair_salon"] .global-search{
  background:#151515!important;
  color:var(--bd51-cream)!important;
  border:1px solid var(--bd51-border)!important;
  border-radius:8px!important;
  box-shadow:none!important;
}

/* 3) GENERIC LEGACY WHITE PANELS */
body.business-hair-salon .white-card,
body.business-hair-salon .empty-state,
body.business-hair-salon .customer-empty,
body.business-hair-salon .results-empty,
html[data-industry="hair_salon"] .white-card,
html[data-industry="hair_salon"] .empty-state,
html[data-industry="hair_salon"] .customer-empty,
html[data-industry="hair_salon"] .results-empty{
  background:#151515!important;
  color:#e9dfd2!important;
  border:1px solid var(--bd51-border)!important;
  border-radius:8px!important;
}
body.business-hair-salon .empty-state h2,
body.business-hair-salon .empty-state h3,
html[data-industry="hair_salon"] .empty-state h2,
html[data-industry="hair_salon"] .empty-state h3{
  color:var(--bd51-gold)!important;
}

/* 4) BRAND LOGO – no paw */
body.business-hair-salon .brand-mark,
html[data-industry="hair_salon"] .brand-mark{
  position:relative!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,#d7a047,#bd812a)!important;
  color:#18120d!important;
  border-radius:6px!important;
  font-weight:900!important;
  letter-spacing:.02em!important;
  box-shadow:none!important;
}
body.business-hair-salon .brand-mark *,
html[data-industry="hair_salon"] .brand-mark *{
  display:none!important;
}
body.business-hair-salon .brand-mark::before,
html[data-industry="hair_salon"] .brand-mark::before{
  content:"BD"!important;
  display:grid!important;
  place-items:center!important;
  position:absolute!important;
  inset:0!important;
  color:#18120d!important;
  font-size:18px!important;
  font-weight:950!important;
}

/* Ensure legacy paw images are invisible */
body.business-hair-salon .brand-mark img,
body.business-hair-salon .brand-mark svg,
html[data-industry="hair_salon"] .brand-mark img,
html[data-industry="hair_salon"] .brand-mark svg{
  display:none!important;
}

/* 5) Top action alignment */
body.business-hair-salon .topbar,
html[data-industry="hair_salon"] .topbar{
  background:#141414!important;
  color:var(--bd51-cream)!important;
  border-bottom:1px solid #2b2722!important;
}
body.business-hair-salon .topbar button,
html[data-industry="hair_salon"] .topbar button{
  border-radius:6px!important;
}

/* Inputs */
body.business-hair-salon input,
body.business-hair-salon select,
body.business-hair-salon textarea,
html[data-industry="hair_salon"] input,
html[data-industry="hair_salon"] select,
html[data-industry="hair_salon"] textarea{
  background:#1b1917!important;
  color:#fff9f0!important;
  border:1px solid #4a4035!important;
  border-radius:6px!important;
}
body.business-hair-salon input::placeholder,
body.business-hair-salon textarea::placeholder,
html[data-industry="hair_salon"] input::placeholder,
html[data-industry="hair_salon"] textarea::placeholder{
  color:#9f9386!important;
  opacity:1!important;
}

/* testdata banner slimmer */
body.business-hair-salon .test-banner,
body.business-hair-salon .beta-banner,
html[data-industry="hair_salon"] .test-banner,
html[data-industry="hair_salon"] .beta-banner{
  background:#181714!important;
  color:#c9b896!important;
  border:1px solid #77551e!important;
  border-radius:8px!important;
  min-height:42px!important;
  padding:7px 12px!important;
}

/* visible release marker */
body.business-hair-salon .sidebar::after,
html[data-industry="hair_salon"] .sidebar::after{
  content:"BarberDesk v0.5.1"!important;
  display:block;
  margin:18px 16px 14px;
  padding-top:14px;
  border-top:1px solid #5b431f;
  color:var(--bd51-gold)!important;
  font-size:12px;
  font-weight:800;
}