/* ProfiBeauty 2.0 — appearance only. Existing dimensions, layout, icons and semantic colors are preserved. */
html.pb-design-v2 body{background:radial-gradient(ellipse at 80% 5%,#e6edff 0,transparent 46%),radial-gradient(ellipse at 10% 80%,#f0eaff 0,transparent 42%),#f5f7fc!important}
html.pb-design-v2{--pb-glass:rgba(255,255,255,.84);--pb-glass-line:rgba(187,202,230,.48);--pb-glass-shadow:0 10px 32px rgba(49,79,131,.075),inset 0 1px 0 rgba(255,255,255,.96)}
html.pb-design-v2 #app .app-shell{background:transparent!important}
html.pb-design-v2 body #app .app-shell:not(.wf-workspace):not(.attendance-workspace)>aside.sidebar{background-color:#edf2ff!important;background-image:linear-gradient(165deg,rgba(240,244,255,.97),rgba(231,238,255,.92) 72%,rgba(245,247,255,.94))!important;color:#354052!important;border-color:#d7e2fb!important;box-shadow:0 15px 38px #506da312,inset 0 1px #fff!important;backdrop-filter:blur(22px) saturate(135%)}
html.pb-design-v2 #app .sidebar .navbtn{color:#3e495b!important}
html.pb-design-v2 #app .sidebar .navbtn:hover{background:#e8efffc4!important;color:#2e5fc1!important}
html.pb-design-v2 #app .sidebar .navbtn.active{background:linear-gradient(120deg,#e3edff,#f3f6ff)!important;color:#3665d5!important;box-shadow:inset 0 0 0 1px #d1deff,inset 0 1px #fff,0 8px 20px #436ccc17!important}
html.pb-design-v2 #app .sidebar .side-label,html.pb-design-v2 #app .sidebar .brand small{color:#8c96aa!important}
html.pb-design-v2 #app .sidebar .sidebar-account{border-top-color:#d5dff0!important}
html.pb-design-v2 #app .sidebar .small-contact b{color:#2d3952!important}
html.pb-design-v2 #app .sidebar .small-contact span{color:#8792a8!important}
html.pb-design-v2 #app .sidebar .staff-face.sidebar-face:not(img){background:linear-gradient(145deg,#bdc3ff,#6d5dc2)!important;color:#fff!important;border-color:#b4b6ef!important}
html.pb-design-v2 #app :is(.panel,.console-card,.team-card,.team-detail-card,.att-overview-card,.wf-panel,.wf-stat,.service-card,.booking-service-panel,.stylist-daily-panel){background:var(--pb-glass);border-color:var(--pb-glass-line);box-shadow:var(--pb-glass-shadow);backdrop-filter:blur(20px) saturate(125%)}
html.pb-design-v2 #app :is(.calendar-toolbar,.stylist-calendar-toolbar,.list-toolbar,.audit-toolbar,.client-section-nav,.dialog-header,.service-picker-header){background:rgba(255,255,255,.72);border-color:var(--pb-glass-line);box-shadow:inset 0 1px #fff;backdrop-filter:blur(18px)}
html.pb-design-v2 #app :is(.dialog,.wf-dialog,.service-picker-dialog){background:linear-gradient(140deg,rgba(255,255,255,.98),rgba(246,249,255,.96));border-color:var(--pb-glass-line);box-shadow:0 26px 90px #243a6333,inset 0 1px #fff}
html.pb-design-v2 #app :is(input:not([type=checkbox]):not([type=radio]),select,textarea){background-color:rgba(255,255,255,.88);border-color:#d9e2f0}
html.pb-design-v2 #app .btn:not(.primary):not(.danger):not(.success){background-color:rgba(255,255,255,.84);border-color:#d9e1ec;box-shadow:inset 0 1px #fff,0 3px 10px #445b8410}
html.pb-design-v2 #app .btn.primary{background:linear-gradient(145deg,#7395e5,#4c6dd2)!important;border-color:#738ed2!important;color:#fff!important;box-shadow:inset 0 1px #ffffff7d,0 7px 18px #496cbb30}
html.pb-design-v2 #app :is(.btn.success,.attendance-in,.att-check-in){background:linear-gradient(140deg,#65a483,#398463)!important;border-color:#599c7b!important;color:#fff!important}
html.pb-design-v2 #app :is(.btn.danger,.attendance-out,.att-check-out){background-color:#b84f59;border-color:#ad4450;color:#fff}
html.pb-design-v2 #app :is(.mobile-nav,.wf-mobile-nav,.mobile-more-panel,.wf-mobile-more,.page-scroll-action-bar,.topbar){background:rgba(255,255,255,.93);border-color:#dce5f3;box-shadow:0 -5px 25px #394c7412;backdrop-filter:blur(22px) saturate(135%)}
html.pb-design-v2 #app .mobile-nav button.active{color:#3568d4!important}
html.pb-design-v2 body #app .app-shell.wf-workspace>aside.sidebar,html.pb-design-v2 body #app .app-shell.attendance-workspace>aside.sidebar{background-color:#3c319e!important;background-image:linear-gradient(155deg,#332d92,#473ab0 65%,#4b3fbd)!important;border-color:#6556bc!important;color:#d8d1ff!important;box-shadow:inset 0 1px #ffffff35,0 16px 42px #30248620!important}
html.pb-design-v2 #app :is(.wf-workspace,.attendance-workspace) .sidebar :is(.navbtn,.small-contact span){color:#d2cbf5!important}
html.pb-design-v2 #app :is(.wf-workspace,.attendance-workspace) .sidebar :is(.side-label,.brand small){color:#beb6ec!important}
html.pb-design-v2 #app :is(.wf-workspace,.attendance-workspace) .sidebar .small-contact b{color:#fff!important}
html.pb-design-v2 #app :is(.wf-workspace,.attendance-workspace) .sidebar .navbtn.active{background:linear-gradient(130deg,#ffffff37,#ffffff22)!important;color:#fff!important;box-shadow:inset 0 0 0 1px #ebe6ff40,inset 0 1px #ffffff50,0 8px 20px #21175c20!important}
html.pb-design-v2 #app :is(.wf-workspace,.attendance-workspace) .sidebar .navbtn:hover{background:#ffffff1c!important;color:#fff!important}
html.pb-design-v2 #app :is(.wf-workspace,.attendance-workspace) .btn.primary{background:linear-gradient(145deg,#7762d9,#5140b3)!important;border-color:#8573d0!important}
html.pb-design-v2 #app .sidebar .side-bottom .attendance-entry{background:linear-gradient(145deg,#5444bb,#3e309e)!important;color:#fff!important;border-color:#a89ae7!important;box-shadow:inset 0 1px #ffffff60,0 4px 14px #33247620!important}
html.pb-design-v2 #app .sidebar .side-bottom .loyalty-entry{background:linear-gradient(120deg,#fbf8ee,#eee4d0)!important;color:#594426!important;border-color:#d9c9a7!important;box-shadow:inset 0 1px #fff!important}
html.pb-design-v2 #app :is(.wf-workspace>.wf-mobile-nav,.attendance-view>.mobile-nav){background:linear-gradient(155deg,#3c319eee,#4838c3f5)!important;border-color:#7667cd!important;box-shadow:0 -6px 28px #291d7226}
html.pb-design-v2 #app :is(.wf-workspace>.wf-mobile-nav,.attendance-view>.mobile-nav) button{color:#d2cbfa!important}
html.pb-design-v2 #app :is(.wf-workspace>.wf-mobile-nav,.attendance-view>.mobile-nav) button.active{background:#ffffff2e!important;color:#fff!important}
html.pb-design-v2 #app :is(.wf-settings-person,.wf-settings-block){background:rgba(249,248,255,.85);border-color:#e2dff1}
html.pb-design-v2 #app .wf-table th{background:rgba(242,242,250,.75)}
html.pb-design-v2 body.is-staff{background:radial-gradient(ellipse at 90% 0,#efe6cb 0,transparent 48%),#f8f6f0!important}
html.pb-design-v2 #club-sidebar{background:linear-gradient(165deg,rgba(251,247,237,.97),rgba(242,236,220,.92))!important;border-color:#e2d7c0!important;box-shadow:inset 0 1px #fff,0 12px 32px #6f593313;backdrop-filter:blur(22px)}
html.pb-design-v2 #club-sidebar:before{background:none!important}
html.pb-design-v2 #club-sidebar .club-brand{background:linear-gradient(125deg,#faf7ef,#f1eadb)!important}
html.pb-design-v2 #club-sidebar .club-side-links button{color:#534533}
html.pb-design-v2 #club-sidebar .club-side-links button[aria-current=page]{background:linear-gradient(125deg,#352e22,#4b3c25)!important;color:#fff4d7!important;border-color:#735c35!important;box-shadow:inset 0 1px #ffffff55,0 6px 15px #6d543327!important}
html.pb-design-v2 body.is-staff :is(.panel,.staff-card-preview,.registration-panel,.scan-workspace){background:rgba(255,253,247,.87);border-color:#e6ddc9;box-shadow:0 10px 34px #6d59310c,inset 0 1px #fff;backdrop-filter:blur(18px)}
html.pb-design-v2 body.is-staff :is(button.primary,.btn.primary){background:linear-gradient(125deg,#352e22,#56442a);border-color:#77603d;color:#fff;box-shadow:inset 0 1px #ffffff55,0 5px 15px #6d543327}
html.pb-design-v2 body.is-staff #club-mobile-nav{background:rgba(247,240,223,.94);border-color:#dfd2b8;box-shadow:0 -5px 25px #6d593118;backdrop-filter:blur(20px)}
html.pb-design-v2 body.is-staff #club-mobile-nav>button[aria-current=page]{background:#e9ddc3;color:#594629;box-shadow:inset 0 1px #fff}
html.pb-design-v2 body:not(.is-staff) .shell>header,html.pb-design-v2 body:not(.is-staff) .client-top-nav{background:rgba(250,247,239,.94);border-color:#e5dcc8;box-shadow:inset 0 1px #fff;backdrop-filter:blur(20px)}
@media(prefers-reduced-transparency:reduce){html.pb-design-v2{--pb-glass:#fff}html.pb-design-v2 #app .panel{backdrop-filter:none}}

/* Preserve existing attendance action meaning. */
html.pb-design-v2 body #app .btn.primary.att-arrival-button{background:linear-gradient(140deg,#65a483,#398463)!important;border-color:#599c7b!important;color:#fff!important}
html.pb-design-v2 body #app .btn.primary.att-departure-button{background:linear-gradient(140deg,#c9797f,#b84f59)!important;border-color:#ad4450!important;color:#fff!important}

/* Preserve the contrast of attendance return controls and the club palette. */
html.pb-design-v2 #app :is(.wf-workspace,.attendance-workspace) .sidebar .side-bottom .attendance-return{color:#4434b1!important;background:#f5f2ff!important;border-color:#ded7ff!important}
html.pb-design-v2 body:has(>.shell){background:radial-gradient(ellipse at 90% 0,#efe6cb 0,transparent 48%),#f8f6f0!important}

/* V2 visual corrections: continuous logo surface and transparent client tabs. */
html.pb-design-v2 #app .client-section-nav{background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;border-bottom-color:transparent!important}
@media(min-width:761px){html.pb-design-v2 #club-sidebar .club-brand{background:transparent!important;box-shadow:none!important}}
@media(max-width:760px){html.pb-design-v2 #club-sidebar .club-brand{background:rgba(250,247,239,.97)!important;box-shadow:0 2px 12px #493b2008!important;backdrop-filter:blur(20px)}}
/* Keep the calendar's existing controls in consistent mobile rows. */
@media(max-width:700px){
 html.pb-design-v2 #app .calendar-toolbar{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
 html.pb-design-v2 #app .calendar-toolbar>.toolbar-group:first-child{display:flex;flex-wrap:nowrap;width:100%;gap:6px}
 html.pb-design-v2 #app .calendar-toolbar .date-ctrl{display:grid;grid-template-columns:34px minmax(0,1fr) 34px;flex:1;min-width:0;gap:5px}
 html.pb-design-v2 #app .calendar-toolbar .date-ctrl .btn.icon-only{width:34px;min-width:34px;padding:0}
 html.pb-design-v2 #app .calendar-toolbar .pb-date-picker{min-width:0;width:100%}
 html.pb-design-v2 #app .calendar-toolbar .pb-date-trigger{width:100%;min-width:0;padding-left:5px;padding-right:5px;font-size:clamp(10px,2.9vw,12px);gap:4px}
 html.pb-design-v2 #app .calendar-toolbar .pb-date-trigger .icon{width:16px;height:16px;flex:none}
 html.pb-design-v2 #app .calendar-toolbar>.toolbar-group>[data-today]{flex:none;min-width:48px;padding-left:8px;padding-right:8px}
 html.pb-design-v2 #app .calendar-toolbar>.toolbar-group:nth-child(2){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%;gap:8px}
 html.pb-design-v2 #app .calendar-toolbar>.toolbar-group:nth-child(2)>select{width:100%;min-width:0!important;max-width:100%;padding-left:8px;padding-right:8px;font-size:11px}
 html.pb-design-v2 #app .calendar-toolbar>.toolbar-group:nth-child(2)>.seg{grid-column:1/-1;justify-self:start}
}

/* Remove the inherited 420px cap from the pinned client navigation. */
html.pb-design-v2 body.is-client>.shell>nav.client-top-nav{width:100%!important;max-width:none!important;box-sizing:border-box;align-self:stretch;background:#faf7f1!important;backdrop-filter:none!important}

/* Continuous startup canvas and uniform mobile calendar control height. */
html.pb-design-v2 body{min-height:100vh;background-repeat:no-repeat!important;background-size:100vw 100vh!important;background-attachment:fixed!important}
@media(max-width:700px){
 html.pb-design-v2 #app .calendar-toolbar>.toolbar-group:first-child>.btn,html.pb-design-v2 #app .calendar-toolbar .date-ctrl>.btn,html.pb-design-v2 #app .calendar-toolbar .pb-date-trigger{min-height:44px;height:44px}
}
@media(max-width:360px){
 html.pb-design-v2 #app .calendar-toolbar .date-ctrl{grid-template-columns:28px minmax(0,1fr) 28px;gap:4px}
 html.pb-design-v2 #app .calendar-toolbar .date-ctrl .btn.icon-only{width:28px;min-width:28px}
 html.pb-design-v2 #app .calendar-toolbar .pb-date-trigger{padding-left:2px;padding-right:2px;font-size:10px;gap:2px}
 html.pb-design-v2 #app .calendar-toolbar .pb-date-trigger .icon{width:14px;height:14px}
 html.pb-design-v2 #app .calendar-toolbar>.toolbar-group>[data-today]{min-width:44px;font-size:10px;padding-left:6px;padding-right:6px}
}

html.pb-design-v2 body:has(>.shell){min-height:100vh;background-repeat:no-repeat!important;background-size:100vw 100vh!important;background-attachment:fixed!important}

/* Desktop: only the sidebar is a framed surface. The workspace has one canvas. */
@media(min-width:1001px){
 html.pb-design-v2 body{background:#f7f8fa!important}
 html.pb-design-v2 body #app .app-shell>.app-main{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;backdrop-filter:none!important;overflow:visible}
 html.pb-design-v2 body #app .app-shell>.app-main>.page{background:transparent!important}
 html.pb-design-v2 body.is-staff:has(>.shell){background:#faf8f2!important}
 html.pb-design-v2 body.is-staff .shell,html.pb-design-v2 body.is-staff main#content{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important}
}

/* One desktop sidebar geometry across reservations, attendance and Beauty Club. */
@media(min-width:1001px){
 html.pb-design-v2 body #app .app-shell{margin:0!important;width:100%!important;max-width:none!important;min-height:100dvh}
 html.pb-design-v2 body #app .app-shell>aside.sidebar,html.pb-design-v2 body.is-staff #club-sidebar{position:fixed!important;left:0!important;top:0!important;bottom:0!important;width:250px!important;height:100dvh!important;max-height:100dvh!important;box-sizing:border-box;padding:22px!important;border-radius:0!important;border-width:0 1px 0 0!important;overflow-y:auto;overscroll-behavior:contain;z-index:40}
 html.pb-design-v2 body #app .app-shell>.app-main{margin-left:250px!important;border-radius:0!important;min-width:0}
 html.pb-design-v2 body.is-staff .shell{padding-left:250px!important}
}

/* Same white mobile navigation in staff and client Beauty Club. */
@media(max-width:1000px){
 body #club-mobile-nav,html.pb-design-v2 body #club-mobile-nav{background:#fff!important;background-image:none!important;border-color:#dce4ef!important;box-shadow:0 -5px 24px #31425f12!important}
 body #club-mobile-nav :is(button,a),html.pb-design-v2 body #club-mobile-nav :is(button,a){color:#66717c!important;background:transparent!important;text-shadow:none!important;filter:none!important;box-shadow:none!important}
 body #club-mobile-nav button[aria-current=page],html.pb-design-v2 body #club-mobile-nav button[aria-current=page]{color:#3568d4!important;background:#edf3ff!important}
 body.is-client>.shell>nav.client-top-nav,html.pb-design-v2 body.is-client>.shell>nav.client-top-nav{background:#fff!important;background-image:none!important;border-color:#dce4ef!important}
 body.is-client>.shell>nav.client-top-nav button{color:#66717c!important;text-shadow:none!important}
 body.is-client>.shell>nav.client-top-nav button[aria-current=page]{color:#3568d4!important;background:#edf3ff!important}
}