@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@1,600&display=swap');
:root { --ink:#17231f; --muted:#68736e; --paper:#f4f1e9; --card:#fffdf8; --line:#ddd8cd; --accent:#cf5b3d; }
* { box-sizing:border-box; } body { margin:0; color:var(--ink); background:var(--paper); font-family:"DM Sans",sans-serif; }
button,input,textarea { font:inherit; }.overline { margin:0 0 10px; color:var(--accent); font-size:.72rem; font-weight:700; letter-spacing:.17em; text-transform:uppercase; }
.mark { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; color:white; background:var(--accent); font-family:"Playfair Display",serif; font-size:1.45rem; }
.login-layout { min-height:100vh; display:grid; grid-template-columns:1.1fr .9fr; }
.brand-panel { padding:clamp(45px,9vw,130px); display:flex; flex-direction:column; justify-content:center; background:#1d2b26; color:white; }
.brand-panel .mark { position:absolute; top:45px; }.brand-panel h1 { margin:8px 0 26px; font-size:clamp(3.4rem,7vw,7.4rem); line-height:.87; letter-spacing:-.065em; }
.brand-panel h1 em { color:#e87b5d; font-family:"Playfair Display",serif; }.lead { max-width:520px; color:#bac4bf; font-size:1.08rem; line-height:1.7; }
.login-card { width:min(430px,calc(100% - 48px)); margin:auto; display:grid; gap:20px; }.login-card h2 { margin:0 0 8px; font-size:2rem; }.login-card div>p:last-child { color:var(--muted); }
label { display:grid; gap:8px; color:var(--muted); font-size:.82rem; font-weight:600; } input { padding:14px; border:1px solid var(--line); border-radius:11px; background:white; outline:none; }
input:focus,textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px #cf5b3d18; }.login-card button { padding:14px; border:0; border-radius:11px; color:white; background:var(--accent); font-weight:700; cursor:pointer; }
.error { margin:0; color:#a63e2b; font-size:.82rem; }.workspace { min-height:100vh; display:grid; grid-template-columns:220px 1fr; }
aside { padding:28px 22px; display:flex; flex-direction:column; background:#192722; color:white; } nav { display:grid; gap:8px; margin-top:55px; } nav a { padding:11px 13px; border-radius:9px; color:#aebbb5; } nav a.active { color:white; background:#ffffff12; }
.logout { margin-top:auto; border:0; color:#aebbb5; background:transparent; text-align:left; cursor:pointer; }.content { padding:32px clamp(24px,5vw,72px); }
header { display:flex; justify-content:space-between; align-items:center; padding-bottom:27px; border-bottom:1px solid var(--line); } header h1 { margin:0; font-size:1.35rem; }.profile { display:grid; text-align:right; font-size:.85rem; font-weight:600; }.profile span { color:var(--muted); font-size:.72rem; font-weight:400; }
.welcome { margin:38px 0 28px; display:flex; align-items:end; justify-content:space-between; }.welcome h2 { margin:0 0 8px; font-size:2.2rem; }.welcome p { color:var(--muted); }.welcome>span { color:var(--muted); font-size:.8rem; text-transform:capitalize; }
.modules { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }.module { min-height:235px; padding:22px; border:1px solid var(--line); border-radius:18px; background:#ebe7de; opacity:.7; }.module.enabled { background:var(--card); opacity:1; box-shadow:0 16px 38px #42392d0b; }
.module-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; color:var(--accent); background:#cf5b3d13; font-weight:700; }.status { float:right; margin-top:-34px; color:var(--muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.1em; }
.module h3 { margin:32px 0 7px; }.module p { min-height:45px; color:var(--muted); font-size:.84rem; line-height:1.5; }.module-link { padding:0; border:0; color:var(--accent); background:transparent; font-size:.8rem; font-weight:700; cursor:pointer; }
.back { border:0; color:var(--muted); background:transparent; cursor:pointer; }.public-link { color:var(--accent); font-size:.82rem; font-weight:700; text-decoration:none; }.appointment-list { display:grid; gap:10px; }.appointment-list article { display:grid; grid-template-columns:54px 1fr auto; align-items:center; gap:16px; padding:15px 18px; border:1px solid var(--line); border-radius:14px; background:var(--card); }.appointment-list time { width:46px; height:52px; display:grid; place-content:center; border-radius:10px; color:var(--accent); background:#cf5b3d12; text-align:center; }.appointment-list time strong { font-size:1.15rem; line-height:1; }.appointment-list time span { font-size:.65rem; text-transform:uppercase; }.appointment-list h3 { margin:0 0 5px; font-size:.9rem; }.appointment-list p { margin:0; color:var(--muted); font-size:.78rem; }.appointment-status { padding:6px 9px; border-radius:20px; color:#317052; background:#dcecdf; font-size:.68rem; }.empty { padding:55px; border:1px dashed var(--line); border-radius:16px; color:var(--muted); text-align:center; }.empty h3 { color:var(--ink); }
@media(max-width:950px){.modules{grid-template-columns:repeat(2,1fr)}.login-layout{grid-template-columns:1fr}.brand-panel{display:none}}
@media(max-width:650px){.workspace{grid-template-columns:1fr}aside{display:none}.content{padding:24px 16px}.modules{grid-template-columns:1fr}.welcome{align-items:start}.welcome>span{display:none}.profile{display:none}}
.business-grid { display:grid; grid-template-columns:minmax(280px,420px) 1fr; gap:40px; margin-top:36px; }.create-business { display:grid; gap:16px; padding:25px; border:1px solid var(--line); border-radius:18px; background:var(--card); }.create-business h2,.business-grid section h2 { margin:0 0 8px; }.create-business fieldset { padding:14px; border:1px solid var(--line); border-radius:11px; }.create-business legend { color:var(--muted); font-size:.78rem; }.check { display:flex; align-items:center; margin:8px 0; }.check input { width:auto; margin-right:8px; }.create-business>button { padding:13px; border:0; border-radius:10px; color:white; background:var(--accent); font-weight:700; }.form-message { padding:12px; border-radius:10px; background:#edf3ea; font-size:.78rem; overflow-wrap:anywhere; }.form-message a { color:var(--accent); }.business-list { display:grid; gap:9px; }.business-list article { display:flex; justify-content:space-between; gap:15px; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--card); }.business-list h3,.business-list p { margin:0; }.business-list p { color:var(--muted); font-size:.75rem; }.business-list code { align-self:center; color:var(--muted); font-size:.67rem; }.invite { min-height:100vh; display:grid; place-items:center; padding:30px; background:linear-gradient(135deg,#f8f4ed,#e8e3d8); }.invite .login-card { padding:32px; border-radius:20px; background:var(--card); box-shadow:0 24px 60px #372f2418; }
@media(max-width:850px){.business-grid{grid-template-columns:1fr}.business-list code{display:none}}
.integration-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:28px; margin-top:38px; }.integration-layout>section { padding:28px; border:1px solid var(--line); border-radius:18px; background:var(--card); }.integration-layout h2 { margin:0 0 8px; }.integration-layout section>p { color:var(--muted); }.code-box { margin-top:24px; overflow:hidden; border-radius:14px; background:#17231f; }.code-box pre { margin:0; padding:22px; overflow:auto; color:#e7eee9; font-size:.76rem; line-height:1.65; }.copy-code { width:100%; padding:12px; border:0; color:white; background:var(--accent); font-weight:700; cursor:pointer; }.integration-note { font-size:.78rem; }.integration-help { display:block; padding:24px; border-radius:18px; color:var(--ink); background:#e9e4da; }.integration-help ol { padding-left:20px; color:var(--muted); font-size:.84rem; line-height:1.8; }.integration-help code { overflow-wrap:anywhere; font-size:.7rem; }.integration-help strong { font-size:.78rem; }.integration-help p { margin-top:28px; }
.integration-settings { display:grid; gap:18px; margin-top:34px; padding-top:28px; border-top:1px solid var(--line); }.integration-settings textarea { resize:vertical; padding:13px; border:1px solid var(--line); border-radius:11px; outline:none; }.integration-settings small { color:var(--muted); font-weight:400; line-height:1.5; }.brand-fields { display:grid; grid-template-columns:130px 1fr; gap:14px; }.brand-fields input[type="color"] { width:100%; height:47px; padding:5px; }.integration-settings>button,.regenerate-key { padding:12px 14px; border:0; border-radius:10px; color:white; background:var(--accent); font-weight:700; cursor:pointer; }.widget-preview { display:grid; justify-items:center; gap:9px; margin:16px 0 28px; padding:23px 16px; border-radius:14px; background:white; text-align:center; box-shadow:0 12px 30px #2b221514; }.widget-preview img { width:72px; height:52px; object-fit:contain; }.preview-mark { width:48px; height:48px; display:grid; place-items:center; border-radius:50%; color:white; background:var(--preview-color); font-size:1.2rem; font-weight:700; }.widget-preview strong { font-size:.9rem; }.widget-preview p { margin:0; color:var(--muted); font-size:.75rem; }.widget-preview button { width:100%; padding:10px; border:0; border-radius:9px; color:white; background:var(--preview-color); font-weight:700; }.regenerate-key { width:100%; margin-top:8px; color:#8b3825; background:#cf5b3d17; font-size:.74rem; }
@media(max-width:850px){.integration-layout{grid-template-columns:1fr}.integration-help{display:block}}
@media(max-width:560px){.brand-fields{grid-template-columns:1fr}}
select { font:inherit; }
.business-list button { align-self:center; padding:8px 11px; border:0; border-radius:8px; color:var(--accent); background:#cf5b3d12; font-size:.72rem; font-weight:700; cursor:pointer; }
.business-inactive { opacity:.62; }
.admin-actions { display:flex; align-items:center; gap:9px; margin:25px 0; }
.admin-actions button { padding:10px 13px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:var(--card); font-weight:700; cursor:pointer; }
.admin-actions span { margin-left:auto; color:var(--muted); font-size:.72rem; }
.business-admin-grid { display:grid; grid-template-columns:1fr 1fr 280px; gap:18px; }
.admin-card { padding:23px; border:1px solid var(--line); border-radius:17px; background:var(--card); }
.admin-card h2 { margin:0 0 20px; }
.business-control,.invite-user { display:grid; gap:15px; }
.business-control fieldset { padding:12px 15px; border:1px solid var(--line); border-radius:10px; }
.business-control legend { color:var(--muted); font-size:.78rem; }
.business-switch { display:flex; align-items:center; gap:8px; }
.business-switch input { width:auto; }
.business-control>button,.invite-user>button { padding:12px; border:0; border-radius:9px; color:white; background:var(--accent); font-weight:700; cursor:pointer; }
.user-list { display:grid; gap:8px; margin-bottom:24px; }
.user-list article { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px; border-radius:10px; background:var(--paper); }
.user-list article div { display:grid; gap:2px; }
.user-list span,.user-list small { color:var(--muted); font-size:.7rem; }
.invite-user { padding-top:20px; border-top:1px solid var(--line); }
.invite-user h3 { margin:0; font-size:.9rem; }
.invite-user select { padding:13px; border:1px solid var(--line); border-radius:11px; background:white; }
.business-summary dl { margin:0; }
.business-summary dt { margin-top:17px; color:var(--muted); font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.business-summary dd { margin:5px 0 0; overflow-wrap:anywhere; font-size:.78rem; line-height:1.55; }
.business-summary code { font-size:.66rem; }
.color-dot { width:11px; height:11px; display:inline-block; margin-right:7px; border-radius:50%; }
@media(max-width:1100px){.business-admin-grid{grid-template-columns:1fr 1fr}.business-summary{grid-column:1/-1}}
@media(max-width:760px){.business-admin-grid{grid-template-columns:1fr}.business-summary{grid-column:auto}.admin-actions{flex-wrap:wrap}.admin-actions span{width:100%;margin:0}}
.header-actions { display:flex; align-items:center; gap:10px; }.header-actions button { padding:9px 11px; border:0; border-radius:8px; color:var(--muted); background:transparent; cursor:pointer; }.header-actions .appointment-settings { color:var(--accent); background:#cf5b3d12; font-weight:700; }
.settings-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr); gap:22px; margin-top:32px; }.settings-card { padding:25px; border:1px solid var(--line); border-radius:18px; background:var(--card); }.settings-card h2 { margin:0 0 22px; }.service-head,.service-row { display:grid; grid-template-columns:minmax(130px,1fr) 85px 105px 75px 70px; align-items:center; gap:8px; }.service-head { padding:0 8px 8px; color:var(--muted); font-size:.66rem; font-weight:700; text-transform:uppercase; }.service-row { padding:8px; border-top:1px solid var(--line); }.service-row input { min-width:0; padding:9px; }.service-active { display:flex; align-items:center; gap:5px; font-size:.7rem; }.service-active input { width:auto; }.service-row button { padding:9px; border:0; border-radius:8px; color:var(--accent); background:#cf5b3d12; font-size:.7rem; font-weight:700; cursor:pointer; }.empty-inline { padding:20px; color:var(--muted); text-align:center; }.new-service { margin-top:25px; padding-top:22px; border-top:1px solid var(--line); }.new-service h3 { margin:0 0 13px; font-size:.9rem; }.new-service>div { display:grid; grid-template-columns:1fr 95px 110px auto; align-items:end; gap:9px; }.new-service button,.hours-form>button { padding:12px 15px; border:0; border-radius:9px; color:white; background:var(--accent); font-weight:700; cursor:pointer; }.hours-form { display:grid; gap:18px; }.hours-form select { padding:12px; border:1px solid var(--line); border-radius:10px; background:white; }.hours-list { display:grid; gap:5px; }.hours-row { display:grid; grid-template-columns:1fr 100px 16px 100px; align-items:center; gap:7px; padding:8px 0; border-bottom:1px solid var(--line); }.hours-row input[type="time"] { min-width:0; padding:8px; }.day-toggle { display:flex; align-items:center; gap:7px; color:var(--ink); }.day-toggle input { width:auto; }.hours-row>span { color:var(--muted); font-size:.7rem; text-align:center; }
@media(max-width:1050px){.settings-grid{grid-template-columns:1fr}}
@media(max-width:700px){.service-head{display:none}.service-row{grid-template-columns:1fr 80px}.service-row .service-active{grid-column:1}.new-service>div{grid-template-columns:1fr 1fr}.hours-row{grid-template-columns:1fr 88px 12px 88px}.header-actions{align-items:end;flex-direction:column}}
.appointment-status { padding:7px 9px; border:0; border-radius:20px; color:#317052; background:#dcecdf; font-size:.68rem; outline:none; cursor:pointer; }.appointment-status.status-pending { color:#8b641d; background:#f5e9c9; }.appointment-status.status-completed { color:#3d5877; background:#dfe9f4; }.appointment-status.status-cancelled { color:#8d4942; background:#f2dedb; }
.customer-list { display:grid; gap:9px; }.customer-list article { display:grid; grid-template-columns:42px 1fr 60px 110px; align-items:center; gap:14px; padding:14px 17px; border:1px solid var(--line); border-radius:13px; background:var(--card); }.customer-avatar { width:40px; height:40px; display:grid; place-items:center; border-radius:50%; color:var(--accent); background:#cf5b3d12; font-weight:700; }.customer-list h3,.customer-list p { margin:0; }.customer-list h3 { font-size:.86rem; }.customer-list p,.customer-list time { color:var(--muted); font-size:.72rem; }.customer-history { display:grid; text-align:center; }.customer-history strong { font-size:.9rem; }.customer-history span { color:var(--muted); font-size:.62rem; }.customer-list time { text-align:right; }.team-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr); gap:22px; margin-top:32px; }.team-list { display:grid; gap:8px; }.team-list article { display:grid; grid-template-columns:1fr 130px 70px; align-items:center; gap:9px; padding:11px; border-radius:10px; background:var(--paper); }.team-list article>div { display:grid; gap:2px; }.team-list strong { font-size:.82rem; }.team-list span { color:var(--muted); font-size:.7rem; }.team-list select { min-width:0; padding:8px; border:1px solid var(--line); border-radius:8px; background:white; font-size:.72rem; }.remove-user { padding:8px; border:0; color:#9a4636; background:transparent; font-size:.7rem; cursor:pointer; }.team-invite { display:grid; gap:15px; }.team-invite select { padding:13px; border:1px solid var(--line); border-radius:11px; background:white; }.team-invite>button { padding:12px; border:0; border-radius:9px; color:white; background:var(--accent); font-weight:700; cursor:pointer; }.pending-invites { margin-top:25px; padding-top:19px; border-top:1px solid var(--line); }.pending-invites h3 { font-size:.82rem; }.pending-invites p { display:flex; justify-content:space-between; gap:8px; margin:8px 0; font-size:.72rem; }.pending-invites span { color:var(--muted); }
@media(max-width:850px){.team-grid{grid-template-columns:1fr}.customer-list article{grid-template-columns:42px 1fr 50px}.customer-list time{display:none}}
@media(max-width:560px){.team-list article{grid-template-columns:1fr 110px}.team-list .remove-user{grid-column:2}.customer-list article{grid-template-columns:38px 1fr}.customer-history{display:none}}
.appointment-tabs { display:flex; gap:6px; margin:22px 0 4px; padding:6px; overflow-x:auto; border:1px solid var(--line); border-radius:12px; background:#ebe7de; }.appointment-tabs button,.appointment-tabs a { flex:0 0 auto; padding:10px 13px; border:0; border-radius:8px; color:var(--muted); background:transparent; font:inherit; font-size:.75rem; font-weight:700; text-decoration:none; cursor:pointer; }.appointment-tabs .active { color:var(--ink); background:var(--card); box-shadow:0 4px 12px #362c2010; }.integration-settings select { padding:13px; border:1px solid var(--line); border-radius:11px; background:white; }.widget-preview.theme-beauty { border:1px solid #ead7df; border-radius:24px; background:linear-gradient(145deg,#fffafd,#f8edf2); }.widget-preview.theme-wellness { border:1px solid #d6dfd3; background:#f5f9f2; }.widget-preview.theme-professional { border:1px solid #d8e0e8; border-radius:8px; background:#f5f8fb; }.direct-booking-link { margin:8px 0 10px!important; overflow-wrap:anywhere; }.direct-booking-link a { color:var(--accent); font-size:.72rem; }.copy-link { width:100%; padding:10px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:var(--card); font-weight:700; cursor:pointer; }
.professionals-section { grid-column:1/-1; }.section-copy { margin:-12px 0 22px; color:var(--muted); font-size:.82rem; }.professional-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.professional-card { display:grid; gap:15px; padding:18px; border:1px solid var(--line); border-radius:14px; background:var(--paper); }.professional-title { display:grid; grid-template-columns:1fr auto; align-items:center; gap:12px; }.professional-title input { font-weight:700; }.professional-card fieldset,.new-professional fieldset { margin:0; padding:12px; border:1px solid var(--line); border-radius:10px; }.professional-card legend,.new-professional legend { padding:0 5px; color:var(--muted); font-size:.72rem; }.professional-services { display:flex; flex-wrap:wrap; gap:5px 14px; }.professional-services .check { font-size:.72rem; }.professional-hours { display:grid; gap:2px; }.professional-card>button,.new-professional>button { padding:11px 14px; border:0; border-radius:9px; color:white; background:var(--accent); font-weight:700; cursor:pointer; }.new-professional { display:grid; grid-template-columns:minmax(180px,280px) 1fr auto; align-items:end; gap:14px; margin-top:20px; padding-top:20px; border-top:1px solid var(--line); }.new-professional h3 { grid-column:1/-1; margin:0; font-size:.95rem; }.new-professional .form-message { grid-column:1/-1; margin:0; }
@media(max-width:950px){.professional-list{grid-template-columns:1fr}.new-professional{grid-template-columns:1fr}}
@media(max-width:560px){.professional-card{padding:13px}.professional-title{grid-template-columns:1fr}.professional-hours .hours-row{grid-template-columns:1fr 82px 12px 82px}}