@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;800&display=swap');
:root{--bg:#f7f8fa;--ink:#202b38;--muted:#7a8491;--line:#e7ebef;--green:#284e45;--lime:#d8ef98;--purple:#eeeafb}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px 'DM Sans',sans-serif}button,input,select{font:inherit}button{cursor:pointer}button,a,input,select{outline-offset:4px}button{border:0;background:none;color:inherit}svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;vertical-align:middle;flex-shrink:0}.shell{display:grid;grid-template-columns:228px 1fr;min-height:100vh}.sidebar{background:#fff;border-right:1px solid var(--line);padding:32px 20px;display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;width:228px}.brand{font:800 36px Manrope;letter-spacing:-2px;display:flex;gap:9px;align-items:center;padding:0 13px}.brand svg{width:32px;height:32px;color:#6a8357}.workspace{margin:32px 0 24px;padding:13px;border:1px solid var(--line);border-radius:10px;display:flex;align-items:center;gap:10px}.avatar{display:inline-flex;justify-content:center;align-items:center;width:36px;height:36px;background:#eee9e1;border-radius:10px;font-weight:700;color:#756747;flex-shrink:0}.small{font-size:12px;color:var(--muted);line-height:1.6}.nav-label{text-transform:uppercase;letter-spacing:1.5px;font-size:10px;color:#99a1ab;padding:14px}.nav{display:flex;gap:12px;align-items:center;text-align:left;width:100%;padding:13px;border-radius:8px;margin:3px 0;color:#77818c}.nav.active{background:#edf3ec;color:#34533e;font-weight:650}.nav .count{margin-left:auto;background:#dbe8d8;padding:2px 7px;border-radius:5px;font-size:11px}.side-bottom{margin-top:auto;padding-top:40px}.profile{display:flex;align-items:center;gap:10px;padding:18px 10px 0;border-top:1px solid var(--line)}.main{grid-column:2;min-width:0}.topbar{height:82px;border-bottom:1px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 38px;gap:16px}.mode{display:flex;padding:4px;background:#f3f5f6;border-radius:9px;gap:4px}.mode button{padding:9px 15px;border-radius:6px;font-size:12px}.mode .selected{background:#fff;box-shadow:0 1px 4px #0000000a;font-weight:650}.top-right{display:flex;align-items:center;gap:20px}.demo{font-size:11px;border:1px solid #e6dac1;color:#927543;background:#fcf8ef;border-radius:20px;padding:6px 10px}.content{padding:35px 38px;max-width:1700px;margin:auto}.heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px}h1{font:700 28px Manrope;letter-spacing:-1px;margin:0 0 8px}h2{font:700 16px Manrope;margin:0}h3{font:700 15px Manrope;margin:0 0 7px}p{line-height:1.6}.muted{color:var(--muted)}.actions{display:flex;gap:10px;align-items:center}.btn{background:var(--green);color:white;padding:11px 17px;border-radius:8px;font-size:12px;font-weight:600;display:inline-flex;justify-content:center;align-items:center;gap:8px}.btn.secondary{background:#fff;color:var(--ink);border:1px solid var(--line)}.btn.light{background:#edf3ec;color:#395642}.btn:disabled{opacity:.45;cursor:not-allowed}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:28px}.metric{background:#fff;border:1px solid var(--line);border-radius:12px;padding:19px 21px}.metric-top{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.metric-top svg{color:#889485}.metric strong{display:block;font:700 29px Manrope;margin:10px 0 5px;letter-spacing:-1px}.positive{color:#658255;font-size:11px}.grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px}.panel{background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:21px 23px;border-bottom:1px solid var(--line);gap:12px}.panel-head .small{margin-top:5px}.link{color:#536d4b;font-weight:600;font-size:12px}.schedule-toolbar{padding:16px 23px;display:flex;gap:12px;justify-content:space-between;border-bottom:1px solid var(--line)}.date{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:600}.pill{font-size:10px;padding:5px 8px;border-radius:5px;display:inline-block;white-space:nowrap;background:#eef2ed;color:#557149}.pill.purple{background:#efeafb;color:#8272a7}.pill.orange{background:#fff1df;color:#b47e3c}.pill.gray{background:#eef1f5;color:#7c8797}.schedule{display:grid;grid-template-columns:65px repeat(3,minmax(115px,1fr));padding:0 16px 18px;overflow:auto}.col-title{text-align:center;padding:18px 4px;border-bottom:1px solid var(--line);font-size:12px;font-weight:650}.col-title small{display:block;font-weight:400;color:var(--muted);font-size:10px;margin-top:4px}.timecol,.bedcol{height:390px;position:relative;background:repeating-linear-gradient(to bottom,transparent 0,transparent 64px,#edf0f3 64px,#edf0f3 65px)}.timecol{font-size:10px;color:#929ba5;background:none}.timecol span{display:block;height:65px;padding-top:7px}.bedcol{border-left:1px solid #f0f2f4}.booking{position:absolute;left:6px;right:6px;background:#eaf0e6;border-left:3px solid #a2b18c;border-radius:6px;padding:9px 10px;text-align:left;overflow:hidden;min-height:57px}.booking.purple{background:#efebf8;border-color:#b1a0d0}.booking.peach{background:#fbefdf;border-color:#d8b78a}.booking b{font-size:11px;display:block}.booking small{font-size:10px;display:block;color:#798275;margin-top:4px}.booking .book-status{display:flex;justify-content:space-between;font-size:9px;margin-top:7px}.right-stack{display:flex;flex-direction:column;gap:20px}.beds{padding:4px 20px}.bed{padding:17px 0;border-bottom:1px solid var(--line)}.bed:last-child{border:0}.bed-line{display:flex;justify-content:space-between;gap:8px;align-items:center}.bed-name{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:600}.bed-icon{padding:8px;background:#f5f5f1;border-radius:8px;color:#839074}.bed-detail{padding-left:44px;margin-top:9px}.progress{height:4px;background:#edf0f1;border-radius:4px;margin-top:11px;overflow:hidden}.progress i{height:100%;background:#b4c791;display:block;width:55%}.queue-item{padding:16px 22px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:11px}.queue-item:last-child{border:0}.queue-item .info{flex:1}.queue-item b{font-size:12px}.queue-item .avatar{font-size:11px;width:33px;height:33px;border-radius:50%}.queue-item button{padding:7px 10px;font-size:10px}.footer-note{margin-top:20px;display:flex;justify-content:space-between;gap:15px;font-size:11px;color:#939ca6}.account-hero{padding:30px;background:#eaf0e4;border:1px solid #dbe5d4;border-radius:14px;display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.account-hero h1{font-size:30px}.salon-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.salon-card{padding:25px}.salon-art{height:115px;border-radius:8px;background:linear-gradient(125deg,#e8c8a1,#f2e9d9);display:flex;align-items:center;justify-content:center;margin-bottom:20px;font:600 30px Manrope;letter-spacing:6px;color:#927652}.salon-art.alt{background:linear-gradient(125deg,#ccd9ce,#e7ece1);color:#5e7968}.balance{font:700 30px Manrope;margin:20px 0}.balance small{font:12px 'DM Sans';color:var(--muted)}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:12px}th,td{text-align:left;padding:17px 22px;border-bottom:1px solid var(--line)}th{font-size:10px;letter-spacing:.7px;text-transform:uppercase;color:var(--muted);background:#fafbfc}td .small{font-size:11px}.full{margin-top:24px}.empty{padding:35px;color:var(--muted);text-align:center}dialog{border:1px solid var(--line);border-radius:16px;padding:0;width:470px;max-width:calc(100% - 32px);box-shadow:0 30px 120px #172a3340;color:var(--ink)}dialog::backdrop{background:#182b3c55;backdrop-filter:blur(3px)}.modal-head{padding:23px 26px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.form{padding:24px 26px}.field{display:block;margin-bottom:17px;font-size:12px;font-weight:600}.field input,.field select{display:block;margin-top:8px;width:100%;padding:11px 13px;border:1px solid #dde3e8;border-radius:7px;background:#fff;color:var(--ink)}select{appearance:none;padding-inline-end:38px!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237a8491' stroke-width='1.7'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 12px center!important}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}.notice{font-size:12px;padding:13px;background:#f4f6f2;border-radius:8px;line-height:1.6;margin:14px 0}.form .btn{width:100%;margin-top:8px}.error{color:#b05640;font-size:12px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#284e45;color:white;padding:14px 22px;border-radius:10px;box-shadow:0 10px 40px #0002;display:none;z-index:20;max-width:90vw}.settings{padding:24px;max-width:660px}.subtle{border:1px dashed #dce1e5;padding:14px;border-radius:8px;margin-top:14px;font-size:12px;color:var(--muted)}@media(min-width:1500px){.grid{grid-template-columns:minmax(0,1fr) 360px}.timecol,.bedcol{height:450px}}@media(max-width:1150px){.grid{grid-template-columns:1fr}.right-stack{display:grid;grid-template-columns:1fr 1fr}.sidebar{width:195px;padding:25px 12px}.shell{grid-template-columns:195px 1fr}.content{padding:28px 24px}.topbar{padding:0 24px}.metrics{gap:10px}.metric{padding:16px}}@media(max-width:760px){.sidebar{position:static;width:auto;padding:12px;grid-column:1/-1;flex-direction:row;align-items:center;overflow:auto;gap:8px;border-bottom:1px solid var(--line)}.brand{font-size:26px;padding:0 10px}.brand svg{width:23px}.workspace,.nav-label,.side-bottom{display:none}.sidebar nav{display:flex}.nav{width:auto;padding:10px;font-size:11px}.nav svg,.nav .count{display:none}.shell{display:block}.topbar{padding:12px 18px;height:auto;flex-wrap:wrap}.top-right .small{display:none}.content{padding:24px 16px}.heading{align-items:flex-start;flex-wrap:wrap}h1{font-size:25px}.metrics{grid-template-columns:repeat(2,1fr)}.metric strong{font-size:25px}.right-stack,.salon-cards{grid-template-columns:1fr}.schedule{grid-template-columns:44px repeat(3,minmax(100px,1fr));padding:0 8px 15px}.booking{left:3px;right:3px;padding:8px 5px}.booking b{font-size:10px}.panel-head{padding:18px}.account-hero{padding:22px;display:block}.account-hero .btn{margin-top:10px}.footer-note{flex-direction:column}.top-right{gap:8px}.demo{font-size:10px}.date{font-size:10px}.schedule-toolbar{padding:15px}.mode button{padding:8px 10px}}
