/* Salon Standar Pro V0.7 — GalaxyAccess-inspired visual skin
   Visual-only reskin: navigation structure and application logic remain unchanged. */
:root{
  --ivory:#f4f5f7;
  --paper:#ffffff;
  --white:#ffffff;
  --forest:#474b50;
  --forest-2:#373a3e;
  --sage:#dce9e3;
  --sage-2:#eef6f2;
  --peach:#e7a098;
  --peach-2:#f6dfdc;
  --gold:#c98b83;
  --ink:#3f4449;
  --muted:#7c8289;
  --line:#d9dde2;
  --line-2:#cbd0d6;
  --red:#c75757;
  --red-bg:#fdeaea;
  --amber:#a87828;
  --amber-bg:#fff3d7;
  --blue:#668caf;
  --blue-bg:#e9f1f8;
  --galaxy-coral:#e79c94;
  --galaxy-coral-dark:#d98981;
  --galaxy-coral-soft:#f4d2ce;
  --galaxy-blue:#668caf;
  --galaxy-green:#6ca78b;
  --galaxy-charcoal:#45494e;
  --shadow:0 2px 10px rgba(52,58,64,.09);
  --header:66px;
  --ops:72px;
}

html,body{background:var(--ivory);color:var(--ink);font-family:Arial,"Helvetica Neue",sans-serif;font-size:14px}
h1,h2,h3,h4{font-family:Arial,"Helvetica Neue",sans-serif;color:var(--galaxy-charcoal);font-weight:600;letter-spacing:0}
h1{font-size:2rem;line-height:1.15}h2{font-size:1.28rem}h3{font-size:1rem}
.eyebrow,.page-kicker{font-size:.67rem;letter-spacing:.09em;color:#9b6b66;font-weight:700}

/* App chrome */
.topbar{
  background:linear-gradient(180deg,#eaa49d 0%,#e3968f 100%);
  border-bottom:1px solid #d78982;
  box-shadow:none;
  padding:0 18px;
}
.brand-button{background:#fff;border:1px solid rgba(255,255,255,.7);border-radius:5px;padding:3px 8px;height:50px;box-shadow:0 1px 3px rgba(60,50,50,.12)}
.brand-logo{width:116px;height:44px}
.salon-identity{margin-left:14px}.salon-identity strong{color:#fff;font-size:1rem}.salon-identity span{color:rgba(255,255,255,.83);font-size:.7rem}
.live-pill{background:#fff;color:#47715f;border-radius:5px;height:31px;border:1px solid rgba(255,255,255,.65);font-size:.67rem}.live-pill span{background:#5fa47f}
.clock-card{background:#fff;border:1px solid rgba(255,255,255,.8);border-radius:5px;height:48px;box-shadow:0 1px 3px rgba(62,49,49,.10)}
.clock-card strong{color:#4c5156}.clock-card span{color:#8a8f95}
.location-select{border-radius:5px;border-color:rgba(255,255,255,.95);background:#fff;color:#555b60}
.user-pill{border-radius:5px;background:#4b4f54;border:1px solid #3f4347;width:40px;height:40px}
.menu-trigger{border-radius:5px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.35);height:40px;width:42px;margin-left:8px}.menu-trigger span{background:#fff}

.ops-nav{
  background:#e7a098;
  border-bottom:1px solid #d78d86;
  padding:8px 14px;
  gap:7px;
  box-shadow:0 2px 5px rgba(74,57,55,.12);
}
.op-btn{
  min-width:100px;
  height:56px;
  padding:5px 12px;
  border-radius:6px;
  border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.16);
  color:#fff;
  gap:4px;
  font-weight:600;
}
.op-btn:hover{background:rgba(255,255,255,.28);color:#fff}
.op-btn.active{background:#fff;color:#5d6267;border-color:#fff;box-shadow:0 2px 5px rgba(87,55,52,.16)}
.op-btn.active:after{display:none}.op-btn svg{width:21px;height:21px;stroke-width:1.8}.op-btn span{font-size:.69rem;text-transform:uppercase;letter-spacing:.02em}

.pagebar{background:#fff;border-bottom:1px solid var(--line);padding:12px 20px 10px}.pagebar h2{font-size:1.2rem;color:#4b5055}.content{padding:14px 20px 28px}

/* Controls */
.btn{min-height:36px;padding:.5rem .82rem;border-radius:5px;font-size:.78rem;font-weight:600;box-shadow:none}
.btn.primary{background:var(--galaxy-coral);color:#fff;border:1px solid #da8d86}.btn.primary:hover{background:var(--galaxy-coral-dark)}
.btn.secondary{background:var(--galaxy-blue);color:#fff;border:1px solid #587fa2}.btn.secondary:hover{background:#587fa2}
.btn.subtle{background:#fff;color:#54595e;border:1px solid #cfd4da}.btn.subtle:hover{background:#f1f2f4;border-color:#bec4ca}
.btn.danger{background:#fff;color:#b84e4e;border:1px solid #e0b4b4}.btn.danger:hover{background:var(--red-bg)}
.select,.field input,.field select,.field textarea{border-radius:5px;border:1px solid #cfd4da;padding:8px 9px;background:#fff;min-height:36px}
.select:focus,.field input:focus,.field select:focus,.field textarea:focus{border-color:#d58e87;box-shadow:0 0 0 2px rgba(231,160,152,.16)}
.search-box{border:1px solid #ccd1d6!important;border-radius:5px!important;background:#fff!important;padding:8px 10px!important}
.segmented{background:#e7e9ec;border:1px solid #d6d9dd;border-radius:5px;padding:2px}.segmented button{border-radius:4px;padding:.48rem .72rem;font-size:.75rem}.segmented button.active{background:#fff;color:#4c5156;box-shadow:0 1px 3px rgba(0,0,0,.10)}

/* Dashboard and panels */
.status-strip{border-radius:6px;border:1px solid #d9dde1;box-shadow:var(--shadow);margin-bottom:12px}
.status-stat{padding:9px 14px;min-width:126px;background:#fff}.status-stat span{font-size:.62rem;color:#8a9096}.status-stat strong{font-size:.96rem;color:#4a4f54}
.command-grid{gap:10px}
.command-panel{border-radius:6px;border:1px solid #d6dade;box-shadow:var(--shadow)}
.panel-head{min-height:48px;padding:9px 12px;background:linear-gradient(180deg,#f3d0cc,#ecc0bb);border-bottom:1px solid #dca39d}.panel-head h3{color:#555a5f;font-size:.9rem}.panel-head small{color:#806d6b}
.panel-body{padding:6px 10px}.panel-foot{background:#f7f7f8;padding:8px 10px}
.queue-card,.tech-card,.ticket-card{padding:9px 6px;border-color:#e1e4e7}.queue-card:hover,.tech-card:hover,.ticket-card:hover{background:#fafafa}
.avatar-sm{background:#e7a098;color:#fff;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}
.turn-pill{border-radius:5px;background:#eef2f5;color:#5a6874;border:1px solid #d9e0e5;padding:5px 7px}
.empty-icon{border-radius:6px;background:#f1d9d6;color:#9a5f59}

/* Cards, tables, rows */
.card,.payroll-sheet,.employee-rail,.table-shell{border-radius:6px;border-color:#d8dce0;box-shadow:var(--shadow)}
.card{padding:14px}.section-head{margin-bottom:10px}.section-head h3{color:#51565b}
.metric strong{font-family:Arial,"Helvetica Neue",sans-serif;font-size:1.55rem;color:#4b5055}
.table-shell{overflow:hidden}.table-toolbar{background:#f1f2f4;padding:8px 10px;border-color:#d8dce0}
.table th,.table td{padding:9px 10px;font-size:.78rem;border-color:#e2e5e8}.table th{background:#e6e8eb;color:#5b6065;font-size:.64rem;letter-spacing:.045em;text-transform:uppercase}.table tbody tr:nth-child(even){background:#fbfbfc}.table tbody tr:hover{background:#fff1ef}
.floor-row,.queue-row,.list-row{padding:9px 0;border-color:#e2e5e8}
.ticket-detail{border-color:#dde0e3}.ticket-tabs{background:#e5e7ea;border-radius:5px}.ticket-tabs button{border-radius:4px;font-size:.72rem}.ticket-tabs button.active{color:#4e5358}
.tabs{border-color:#d8dce0}.tabs button{font-size:.75rem;padding:9px 11px}.tabs button.active{color:#b26660;border-bottom-color:#e29b94}
.employee-rail button.active,.employee-rail button:hover{background:#f6dfdc}

/* Status chips - slightly squared like a desktop POS */
.status{border-radius:4px;padding:.27rem .46rem;font-size:.64rem}
.status.available,.status.confirmed{background:#e3f1e9;color:#4a8268;border:1px solid #c7e0d2}
.status.busy{background:#f8eadf;color:#986032;border:1px solid #ecd3bd}
.status.off{background:#eceeef;color:#71777d;border:1px solid #d9dde0}
.status.pending{background:#fff1d7;color:#987027;border:1px solid #ead5a9}
.status.cancelled{background:#fbe4e4;color:#a94e4e;border:1px solid #efc5c5}
.status.in_service{background:#e4eef7;color:#567b9c;border:1px solid #cbddea}
.notice{background:#fff4e8;color:#826646;border:1px solid #efd9bd;border-radius:5px}

/* Calendar */
.calendar-shell,.calendar-modern{border-radius:6px!important;border-color:#d8dce0!important;box-shadow:var(--shadow)!important;background:#fff}
.calendar-header>div{background:#f1f2f4!important;border-color:#d9dde1!important;height:58px!important}.tech-head{background:#f7dedb!important;color:#4f555a!important}
.calendar-body{background:#fff}.time-gutter{background:#f8f8f9!important;border-color:#d9dde1!important}.tech-day{border-color:#dfe2e5!important;background:repeating-linear-gradient(to bottom,#fff 0,#fff 21px,#f0f1f2 22px)!important}.tech-day:before{background:repeating-linear-gradient(to bottom,transparent 0,transparent 43px,#dfe2e5 44px)!important}
.cal-event{border-radius:4px!important;box-shadow:0 1px 3px rgba(55,60,65,.12)!important;border-left-width:5px!important}.cal-event.tech1{background:#f6dcd8!important;border-left-color:#d7847b!important}.cal-event.tech2{background:#e3edf6!important;border-left-color:#678daf!important}.cal-event.block{background:#eceeef!important;border-left-color:#8a9096!important}.cal-event.pending{background:#fff1d7!important;border-left-color:#d5a646!important}
.week-grid,.month-grid{background:#f4f5f7}.day-card,.month-day{border-radius:5px!important;border-color:#d9dde1!important}.day-card .appt-mini{border-radius:4px!important;background:#f6dcd8!important}

/* Drawers / menus */
.sidebar{background:#fff;box-shadow:-8px 0 28px rgba(45,50,55,.18);padding:16px;border-left:1px solid #d8dce0}.drawer-shade{background:rgba(43,46,50,.38)}.drawer-head{border-color:#d9dde1}.drawer-close,.close{border-radius:4px;background:#eceeef;color:#555b60}.drawer-group{border-color:#e0e3e6}.drawer-title{color:#9b6b66;font-size:.65rem}.nav-btn{border-radius:4px;padding:9px 8px}.nav-btn:hover,.nav-btn.active{background:#f6dfdc;color:#555a5f}.nav-btn svg{color:#c37770}.nav-btn .lock-mark{border-radius:4px;background:#eceeef;color:#73797f}

/* Modals / popups */
.modal-backdrop{background:rgba(42,45,49,.48);backdrop-filter:blur(1px)}
.modal{border-radius:7px;box-shadow:0 18px 55px rgba(35,39,43,.30);padding:0;border:1px solid #cfd3d7;background:#fff}
.modal-head{margin:0;padding:13px 16px;background:#eceeef;border-bottom:1px solid #d3d7db}.modal-head h2{font-size:1.05rem;color:#4e5358}.modal .form-grid{padding:16px 18px 2px}.modal .actions{padding:13px 18px 16px;margin-top:12px;border-top:1px solid #e0e3e6;background:#fafafa}.modal .quick-grid,.modal .permission-grid,.modal .signature-pad,.modal>p,.modal>h3,.modal>.notice,.modal>.ticket-layout,.modal>.grid,.modal>.table-shell{margin-left:18px;margin-right:18px}.quick-card{border-radius:5px}.quick-card:hover{border-color:#e1a19a;background:#fff5f4}.toggle{border-radius:5px}.switch{background:#d4d7da}.switch.on{background:#e2948d}.signature-pad{border-radius:5px;background:#fafafa}

/* Lock screen */
.lock-screen{background:linear-gradient(135deg,#f5dfdc 0%,#f0bcb6 50%,#e79c94 100%)}
.lock-card{border-radius:8px;border:1px solid rgba(255,255,255,.7);box-shadow:0 16px 40px rgba(85,55,52,.18);padding:34px}.lock-card h1{font-size:1.65rem;color:#4c5156}.lock-card .eyebrow{color:#b36d67}.pin-input{border-radius:5px;letter-spacing:.34em}.pin-input:focus{border-color:#dd958e;box-shadow:0 0 0 2px rgba(231,160,152,.22)}

/* Booking and kiosk receive the same visual system */
.booking-body{background:#f4f5f7}.booking-shell{max-width:900px}.booking-header{background:#e79c94;margin:-28px -28px 20px;padding:14px 28px;border-bottom:1px solid #d78d86}.booking-header img{background:#fff;border-radius:5px;padding:4px 9px;width:168px}.booking-card{border-radius:7px;border-color:#d7dbe0;box-shadow:var(--shadow);padding:28px}.booking-card h1{font-family:Arial,"Helvetica Neue",sans-serif;font-size:1.75rem}.booking-steps .step-dot{border-radius:2px}.booking-steps .step-dot.active{background:#e79c94}.option,.time-btn{border-radius:5px}.option.selected{border-color:#dd958e;background:#fff1ef}.time-btn:hover{background:#fff1ef;border-color:#de9a93}
.kiosk .card{border-radius:7px!important;box-shadow:0 3px 14px rgba(50,55,60,.10)!important}.kiosk h1{font-size:1.6rem!important}.kiosk input,.kiosk select{border-radius:5px!important;border-color:#cfd4da!important}

/* Mobile */
@media(max-width:760px){
  :root{--header:62px;--ops:64px}
  .topbar{padding:0 9px}.brand-button{height:44px;padding:2px 6px}.brand-logo{width:96px;height:38px}
  .ops-nav{padding:6px 5px;gap:4px}.op-btn{min-width:79px;height:51px;border-radius:5px}.op-btn span{font-size:.62rem}
  .pagebar{padding:10px 10px 8px}.content{padding:10px 8px 20px}
  .modal{width:min(96vw,760px)}.modal .form-grid{padding:12px}.modal .actions{padding:12px}
  .booking-header{margin:-14px -14px 16px;padding:12px 14px}
}
