/* 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/Inter-latin-cyrillic-v1.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;
  --available-bg:#383e39;
  --unavailable-bg:#141718;
  --unavailable-stripe:#1d2223;
  --unavailable-text:#9da5a2;
  --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(--available-bg);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(--available-bg);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 .night-package { background:var(--available-bg);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,.night-package)[data-unavailable=true] {
  opacity:1;
  background:repeating-linear-gradient(135deg,var(--unavailable-bg),var(--unavailable-bg) 7px,var(--unavailable-stripe) 7px,var(--unavailable-stripe) 8px);
  color:var(--unavailable-text);
}
.customer-page .hour-select[data-unavailable=true] small { color:var(--unavailable-text) }
.customer-page :is(.hour-select[data-unavailable=true] strong,.half-slot[data-unavailable=true],.night-package[data-unavailable=true] strong) { text-decoration:line-through;text-decoration-thickness:1px }
/* Mute a fully unavailable tile, while preserving the boundary around a free half. */
.customer-page .hour-tile:has(.hour-select[data-unavailable=true]):not(:has(.hour-halves:not([hidden]) .half-slot[data-unavailable=false])),
.customer-page .night-package[data-unavailable=true] { border-color:var(--line);border-style:dashed }
.customer-page .legend i { width:12px;height:12px;background:var(--available-bg);border-color:var(--control-border) }
.customer-page .legend .busy-dot { background:var(--unavailable-bg);border-color:var(--subtle);border-style:dashed;position:relative }
.customer-page .legend .busy-dot::after { content:"";position:absolute;left:1px;right:1px;top:4px;border-top:1px solid var(--unavailable-text);transform:rotate(-45deg) }
.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 .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 }
}
.additional-contact-list{display:grid;gap:16px}
.additional-contact{min-width:0;margin:0;padding:14px;border:1px solid var(--line);border-radius:5px;display:grid;gap:12px}
.additional-contact legend{font-size:12px;color:var(--muted);padding:0 5px}
.additional-contact label{min-width:0;display:grid;gap:8px}
.additional-contact input,.additional-contact select{min-width:0;width:100%}
:is(.customer-page,.staff-page) .additional-contacts .add-contact,
:is(.customer-page,.staff-page) .additional-contacts .remove-contact{width:fit-content;max-width:100%;min-height:44px;margin:0;padding:10px 0;background:transparent;color:var(--ink);border:0;font-size:12px;text-align:left}
:is(.customer-page,.staff-page) .additional-contacts .remove-contact{color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.additional-contacts .form-status:empty{display:none}
.additional-contacts .add-contact{margin-top:4px}
.field-error{display:block;width:100%;color:var(--danger);font-size:12px;font-weight:400;line-height:1.5;margin-top:4px;overflow-wrap:anywhere}
.powered-by{display:flex;justify-content:center;margin-top:32px}
.powered-by a{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;max-width:100%;padding:8px 4px;color:var(--ink);text-decoration:none;border-radius:4px}
.powered-by-caption{font-size:12px;font-weight:400;color:var(--muted)}
.powered-by img{width:28px;height:28px;flex-shrink:0}
.powered-by-name{font-size:15px;font-weight:600;letter-spacing:-.375px;line-height:1.4}
.powered-by a:hover .powered-by-name{text-decoration:underline;text-underline-offset:4px}
.powered-by a:focus-visible{outline:2px solid var(--focus);outline-offset:4px}
:is(.customer-page,.staff-page) :is(input,select,textarea)[aria-invalid=true]{border-color:var(--danger);outline-color:var(--danger)}

/* A release notice appears only when an existing API response reports a new build. */
.app-update-notice{position:fixed;top:max(12px,env(safe-area-inset-top));right:12px;z-index:100;display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:420px;width:calc(100% - 24px);padding:16px;background:var(--surface);color:var(--ink);border:1px solid var(--control-border);border-radius:10px;box-shadow:0 8px 30px #0006}
.app-update-notice p{grid-column:1/-1;margin:0;font-size:13px;line-height:1.5}
.app-update-notice button{min-height:44px;padding:8px 12px;border:1px solid var(--control-border);border-radius:6px;background:var(--surface);color:var(--ink);font:inherit;font-size:13px}
.app-update-notice button:first-of-type{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
@media(max-width:760px){.staff-page .app-update-notice{top:76px}}