/* PROPHOTOHUB — sampled from https://www.prophotohub.com.ua/.
   Charcoal surfaces, Inter text and warm ivory actions. Semantic tokens: PALETTE.md. */
@font-face {
  font-family:"Inter";
  src:url("/fonts/InterVariable.woff2") format("woff2");
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}
:root {
  color-scheme:dark;
  --paper:#202122;
  --white:#282a2b;
  --ink:#f5f3ee;
  --muted:#c2c2bc;
  --subtle:#b1b2aa;
  --line:#55595b;
  --control-border:#8c9188;
  --accent:#e7dccd;
  --soft:#323436;
  --surface:#282a2b;
  --surface-raised:#323436;
  --surface-inset:#191b1c;
  --selected:#403c36;
  --on-accent:#202122;
  --pending-bg:#443621;
  --pending-text:#f6d596;
  --pending-edge:#e2b65e;
  --confirmed-bg:#213d33;
  --confirmed-text:#bce9d2;
  --confirmed-edge:#80c9a6;
  --blocked-bg:#293746;
  --blocked-stripe:#324253;
  --blocked-text:#ceddf0;
  --blocked-edge:#9bb9d7;
  --danger-bg:#482e30;
  --danger:#ffc2b8;
  --danger-edge:#ec9f96;
  --focus:#a6ceff;
  --radius:5px;
  font-family:"Inter",Arial,Helvetica,sans-serif;
  background:var(--paper);
  color:var(--ink);
}
.customer-page {
  background:var(--paper);
  font-weight:400;
  -webkit-font-smoothing:antialiased;
}
.customer-page .preview-banner { background:var(--surface-raised);color:var(--muted) }
.customer-page .masthead {
  background:#000;
  border-color:var(--line);
  box-shadow:0 0 0 100vmax #000;
  clip-path:inset(0 -100vmax);
}
.customer-page .wordmark { display:inline-flex;align-items:center;min-height:44px }
.customer-page .wordmark img { display:block;width:100px;height:auto }
.customer-page .contact-link { color:var(--accent);font-weight:300 }
.customer-page h1 { font-weight:300;letter-spacing:-1.3px }
.customer-page h2,.customer-page h3 { font-weight:400;color:var(--accent) }
.customer-page .accent { color:inherit }
.customer-page .eyebrow { color:var(--muted);font-weight:400;letter-spacing:2px }
.customer-page .intro-description { color:var(--muted);font-weight:300 }
.customer-page .step { border-radius:4px;color:var(--muted);border-color:var(--line) }
.customer-page .selection-count { background:var(--selected);color:var(--accent);border-radius:4px }
.customer-page .room {
  background:var(--surface);
  border-color:var(--line);
  border-radius:5px;
}
.customer-page .room strong { color:var(--accent);font-weight:400 }
.customer-page .room small { color:var(--muted);opacity:1 }
.customer-page .room-number { opacity:1;color:var(--muted) }
.customer-page .room .room-rate { color:var(--accent);font-weight:300 }
.customer-page .room:hover:not(:disabled):not([aria-checked=true]) { border-color:var(--muted);background:var(--surface-raised) }
.customer-page .room[aria-checked=true] { background:var(--selected);border-color:var(--accent) }
.customer-page .room-check { background:transparent;border-color:var(--control-border);color:var(--accent) }
.customer-page .room[aria-checked=true] .room-check { background:var(--accent);border-color:var(--accent);color:var(--on-accent) }
.customer-page :is(.calendar-card,.summary-panel) { background:var(--surface);border-color:var(--line);border-radius:5px }
.customer-page :is(.icon-button,.today-button) { color:var(--accent);border-radius:4px }
.customer-page :is(.icon-button,.today-button):hover:not(:disabled) { background:var(--selected) }
.customer-page .view-switch { background:var(--surface-inset);border-radius:5px }
.customer-page .view-switch button { border-radius:3px;color:var(--muted) }
.customer-page .view-switch button[aria-pressed=true] { background:var(--selected);color:var(--accent);box-shadow:none }
.customer-page .calendar-day { color:var(--ink);border-radius:4px }
.customer-page .calendar-day:hover:not(:disabled) { border-color:var(--muted) }
.customer-page .calendar-day[aria-pressed=true] { background:var(--accent);color:var(--on-accent) }
.customer-page .calendar-day[aria-pressed=true] small { color:var(--on-accent) }
.customer-page .calendar-day.outside-month:not([aria-pressed=true]) { color:var(--subtle) }
.customer-page .calendar-day[aria-current=date]:after { background:var(--accent) }
.customer-page .calendar-day[aria-current=date][aria-pressed=true]:after { background:var(--on-accent) }
.customer-page .hour-tile { background:var(--surface);border-color:var(--line);border-radius:5px }
.customer-page .hour-select { background:var(--surface);color:var(--accent) }
.customer-page .hour-select small { color:var(--muted) }
.customer-page .hour-select:disabled,.customer-page .hour-select:disabled small { color:var(--subtle) }
.customer-page .half-slot { background:var(--surface);color:var(--accent) }
.customer-page :is(.hour-select,.half-slot):hover:not(:disabled):not([aria-pressed=true]) { background:var(--selected) }
.customer-page :is(.hour-select,.half-slot)[aria-pressed=true] { background:var(--accent);color:var(--on-accent);border-color:var(--on-accent) }
.customer-page .hour-select[aria-pressed=true] small { color:var(--on-accent) }
.customer-page .half-slot:disabled {
  background:repeating-linear-gradient(135deg,var(--surface),var(--surface) 4px,var(--surface-raised) 4px,var(--surface-raised) 8px);
  color:var(--muted);
}
.customer-page .night-package { background:var(--surface-inset);border-color:var(--line);border-radius:5px;color:var(--accent) }
.customer-page .night-package[aria-pressed=true] { background:var(--selected);border-color:var(--accent) }
.customer-page .legend .selected-dot { background:var(--accent);border-color:var(--accent) }
.customer-page .legend .busy-dot { background:var(--surface-raised);border-color:var(--control-border) }
.customer-page .range-controls { background:var(--surface-raised);border-color:var(--line);border-radius:5px }
.customer-page .duration-control .icon-button { background:var(--paper) }
.customer-page .schedule-icon { background:var(--selected);color:var(--accent);border-radius:4px }
.customer-page .text-button { color:var(--accent) }
.customer-page input:not([type=checkbox]) {
  background:var(--surface-inset);color:var(--ink);border-color:var(--control-border);border-radius:4px;
}
.customer-page input::placeholder { color:var(--subtle);opacity:1 }
.customer-page input[type=checkbox] { accent-color:var(--accent) }
.customer-page .primary {
  background:var(--accent);
  color:var(--on-accent);
  border:1px solid var(--accent);
  border-radius:5px;
  font-weight:400;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.customer-page .primary:hover:not(:disabled) { background:var(--ink);color:var(--on-accent) }
.customer-page .primary:disabled { background:var(--surface-raised);border-color:var(--line);color:var(--subtle) }
.customer-page .mobile-summary {
  background:var(--surface-inset);border-color:var(--line);box-shadow:0 -5px 22px #0003;
}
.customer-page .mobile-summary-copy strong { color:var(--accent);font-weight:400 }
.customer-page .total strong { color:var(--accent);font-weight:300 }
.customer-page .notice { background:var(--danger-bg) }
.customer-page .error { color:var(--danger) }
.customer-page dialog { background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:5px }
.customer-page dialog::backdrop { background:#000b }
.customer-page .success-icon { background:var(--confirmed-bg);color:var(--confirmed-text);border:1px solid var(--confirmed-edge) }
.customer-page button { transition:border-color .15s }
@media(prefers-reduced-motion:reduce) { .customer-page button { transition:none } }
.customer-page button:hover:not(:disabled) { filter:none }
.customer-page :is(button,a,input,select,textarea,summary):focus-visible { outline:2px solid var(--focus);outline-offset:3px }
.customer-page :is(.half-slot,.hour-select):focus-visible { outline-offset:-4px }
.customer-page :is(.half-slot,.hour-select)[aria-pressed=true]:focus-visible { outline-color:var(--on-accent) }
@media(max-width:600px) {
  .customer-page .wordmark img { width:93px }
  .customer-page h1 { letter-spacing:-1px }
  .customer-page .primary { font-size:13px }
  .customer-page .room .room-rate { font-size:11px }
}

/* Essential controls are stronger than decorative card dividers. */
.customer-page :is(.room,.hour-tile,.night-package,.icon-button,.today-button,.contact-method) { border-color:var(--control-border) }
.customer-page :is(input,select,textarea) { background:var(--surface-inset);color:var(--ink);border-color:var(--control-border) }
.customer-page textarea::placeholder { color:var(--subtle);opacity:1 }
.customer-page .contact-method { color:var(--muted) }
.customer-page .contact-method[aria-checked=true],.customer-page .view-switch button[aria-pressed=true] { background:var(--accent);color:var(--on-accent);border-color:var(--accent) }
.customer-page :is(.hour-select,.half-slot):disabled {
  opacity:1;
  background:repeating-linear-gradient(135deg,var(--surface),var(--surface) 4px,var(--surface-raised) 4px,var(--surface-raised) 8px);
  color:var(--subtle);
}
.customer-page .night-package:disabled { opacity:1;color:var(--subtle);border-style:dashed }
.customer-page .legend i { background:var(--surface);border-color:var(--control-border) }
.customer-page .legend .busy-dot { background:repeating-linear-gradient(135deg,var(--surface),var(--surface) 2px,var(--control-border) 2px,var(--control-border) 3px) }
.customer-page :is(.hour-select,.half-slot) { position:relative }
.customer-page .hour-select,.customer-page .half-slot+.half-slot { border-color:var(--control-border) }
.customer-page :is(.hour-select,.half-slot)[aria-pressed=true]::after { content:"✓";position:absolute;right:3px;top:1px;font-size:9px;line-height:1 }
.customer-page .notice { color:var(--danger);border:1px solid var(--danger-edge) }
@media(forced-colors:active) {
  .customer-page :is(.room[aria-checked=true],button[aria-pressed=true]) { border:2px solid Highlight }
  .customer-page :is(button,a,input,select,textarea,summary):focus-visible { outline:2px solid Highlight }
}
