/*
| The admin panel (H9.1): Orchid's palette, type and shell, as Trip Builder's
| panel wears them, cut to what this panel draws. Bootstrap, its icons and
| Inter are served from this server; nothing comes from a CDN.
*/

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format("woff2");
  
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --ground:      #F5F6FA;   
  --surface:     #FFFFFF;   
  --sunken:      #F2F3F8;   
  --rule:        #E9ECF3;   
  --rule-strong: #D8DCE8;   

  --ink:         #1E2436;   
  --ink-quiet:   #6B7385;   
  --ink-faint:   #9AA1B5;   

  
  --signal:       #4F46E5;   
  --signal-accent: #22D3EE;  
  --signal-soft:  #EEEDFC;   
  --signal-edge:  #C7C2F5;
  --brand-gradient: linear-gradient(90deg, var(--signal), var(--signal-accent));

  
  --good:        #0C7A4E;
  --good-soft:   #E3F9F0;
  --good-edge:   #B8ECD8;
  --bad:         #D01414;
  --bad-soft:    #FDECEC;
  --bad-edge:    #F8C9C9;

  --sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", SFMono-Regular, "JetBrains Mono", Menlo, Consolas, monospace;

  
  --radius: .625rem;
  --radius-card: 1rem;

  
  --row: 2.25rem;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
      --ground:      #0F1220;
      --surface:     #171A2B;
      --sunken:      #1E2338;
      --rule:        #232842;
      --rule-strong: #2F3555;
  
      --ink:         #E6E8F2;
      --ink-quiet:   #8891A8;
      --ink-faint:   #5B6280;
  
      --signal:       #818CF8;
      --signal-accent: #22D3EE;
      --signal-soft:  #201F3D;
      --signal-edge:  #383468;
  
      --good:        #34D399;
      --good-soft:   #0D2B22;
      --good-edge:   #155E42;
      --bad:         #F87171;
      --bad-soft:    #2C1516;
      --bad-edge:    #5C2626;
    }
}

:root[data-theme="dark"] {
  --ground:      #0F1220;
  --surface:     #171A2B;
  --sunken:      #1E2338;
  --rule:        #232842;
  --rule-strong: #2F3555;

  --ink:         #E6E8F2;
  --ink-quiet:   #8891A8;
  --ink-faint:   #5B6280;

  --signal:       #818CF8;
  --signal-accent: #22D3EE;
  --signal-soft:  #201F3D;
  --signal-edge:  #383468;

  --good:        #34D399;
  --good-soft:   #0D2B22;
  --good-edge:   #155E42;
  --bad:         #F87171;
  --bad-soft:    #2C1516;
  --bad-edge:    #5C2626;
}

body {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 0.875rem;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

code, .mono { font-family: var(--mono); }

a { color: var(--signal); text-decoration: none; }

a:hover { text-decoration: underline; }

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.shell { min-height: 100vh; }

.rail {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  display: flex;
  flex-direction: column;
  width: 16.25rem;
  background: var(--surface);
  border-right: 1px solid var(--rule);
  transition: transform 220ms ease, width 220ms ease;
}

.rail-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1039;
  background: #0f122080;
  opacity: 0;
  visibility: hidden;
  transition: opacity 220ms ease, visibility 220ms ease;
}

.rail-backdrop.is-visible { opacity: 1; visibility: visible; }

@media (max-width: 991.98px) {
  .rail { transform: translateX(-100%); box-shadow: 0 20px 40px #0f122019; }
  .rail.is-open { transform: translateX(0); }
}

@media (min-width: 992px) {
  .well { margin-left: 16.25rem; transition: margin-left 220ms ease; }
  html[data-rail-collapsed] .rail { width: 5.25rem; }
  html[data-rail-collapsed] .well { margin-left: 5.25rem; }
  html[data-rail-collapsed] .rail__mark-name,
    html[data-rail-collapsed] .rail__mark-role,
    html[data-rail-collapsed] .rail__section-label,
    html[data-rail-collapsed] .rail__item span { display: none; }
  html[data-rail-collapsed] .rail__item { justify-content: center; }
}

.rail__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 4.25rem;
  padding: 1.125rem 1.25rem;
  border-bottom: 1px solid var(--rule);
}

.rail__mark { display: inline-flex; align-items: center; gap: .625rem; color: var(--ink); }

.rail__mark:hover { text-decoration: none; }

.rail__mark-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.125rem;
  height: 2.125rem;
  border-radius: .625rem;
  background: #0F766E;
  color: #fff;
  font-size: 1.0625rem;
  flex-shrink: 0;
}

.rail__mark-name {
  display: block;
  font-size: 1.0625rem;
  font-weight: 800;
  letter-spacing: -.02em;
  color: var(--ink);
}

.rail__mark-role {
  display: block;
  font-size: .6875rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--ink-quiet);
}

.rail__body { display: flex; flex-direction: column; flex: 1; overflow-y: auto; padding: 1.25rem 1rem 1.5rem; }

.rail__section:last-child .rail__list { margin-bottom: 0; }

.rail__section-label {
  display: block;
  font-size: .6875rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-quiet);
  padding: 0 .75rem;
  margin-bottom: .375rem;
}

.rail__list { display: flex; flex-direction: column; gap: .125rem; margin: 0 0 1.25rem; padding: 0; list-style: none; }

.rail__item {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .55rem .75rem;
  border-radius: var(--radius);
  color: var(--ink-quiet);
  font-size: .875rem;
  font-weight: 500;
  transition: background-color 160ms ease, color 160ms ease;
}

.rail__item:hover { background: var(--sunken); color: var(--ink); text-decoration: none; }

.rail__item .bi { font-size: 1.05rem; min-width: 1.25rem; text-align: center; }

.rail__item.is-current {
  position: relative;
  color: var(--signal);
  background: linear-gradient(90deg, #4f46e51a, #22d3ee0f);
}

.rail__item.is-current::before {
  content: "";
  position: absolute;
  left: -1rem;
  top: 20%;
  bottom: 20%;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--brand-gradient);
}

.rail__item[aria-expanded] { cursor: pointer; }

.rail__chevron {
  margin-left: auto;
  font-size: .75rem;
  transition: transform 220ms ease;
}

.rail__item[aria-expanded="true"] .rail__chevron { transform: rotate(180deg); }

.rail__sub {
  margin: .25rem 0 .25rem 1.65rem;
  padding: .125rem 0 .125rem .75rem;
  border-left: 1px solid var(--rule);
  list-style: none;
}

.rail__sublink {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .4rem .625rem;
  border-radius: var(--radius);
  color: var(--ink-quiet);
  font-size: .8125rem;
  transition: background-color 160ms ease, color 160ms ease;
}

.rail__sublink:hover { background: var(--sunken); color: var(--ink); text-decoration: none; }

.rail__sublink::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--rule-strong);
  flex-shrink: 0;
  transition: transform 160ms ease, background-color 160ms ease;
}

.rail__sublink.is-current { color: var(--signal); font-weight: 600; }

.rail__sublink.is-current::before { background: var(--signal); transform: scale(1.4); }

@media (min-width: 992px) {
  html[data-rail-collapsed] .rail__chevron,
    html[data-rail-collapsed] .rail__sub { display: none; }
}

.well { display: flex; flex-direction: column; min-width: 0; }

.well__top {
  position: sticky;
  top: 0;
  z-index: 1030;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 4.25rem;
  padding: .5rem 1rem;
  background-color: var(--surface);
  border-bottom: 1px solid var(--rule);
  backdrop-filter: saturate(180%) blur(6px);
}

@media (max-width: 575.98px) {
  .well__top { padding: .5rem .75rem; }
}

.well__lead { display: flex; align-items: center; gap: .5rem; min-width: 0; }

.well__top-tools { display: flex; align-items: center; gap: .375rem; }

.well__breadcrumb .breadcrumb {
  align-items: center;
  margin-bottom: 0;
  font-size: .8125rem;
  color: var(--ink-quiet);
}

.well__breadcrumb .breadcrumb a { color: var(--ink-quiet); text-decoration: none; }

.well__breadcrumb .breadcrumb a:hover { color: var(--signal); }

.well__breadcrumb .breadcrumb-item.active { color: var(--ink); font-weight: 500; }

.well__title { margin: 0 0 .25rem; font-weight: 700; letter-spacing: -.01em; }

.well__tools { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; }

.well__body { padding: 1.5rem; min-width: 0; }

.well__page-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.well__description { margin: 0; color: var(--ink-quiet); font-size: .875rem; }

.well__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  padding: 1.25rem 1.5rem;
  background-color: var(--surface);
  border-top: 1px solid var(--rule);
}

.well__footer a { text-decoration: none; }

.well__footer a:hover { color: var(--ink); }

.btn-icon {
  --bs-btn-padding-x: .55rem;
  --bs-btn-padding-y: .5rem;
  --bs-btn-color: var(--ink-quiet);
  --bs-btn-hover-color: var(--ink);
  --bs-btn-hover-bg: var(--sunken);
  --bs-btn-active-color: var(--ink);
  --bs-btn-active-bg: var(--sunken);
  --bs-btn-border-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border-radius: var(--radius);
}

.well__theme-icon--moon { display: none; }

.well__user {
  display: inline-flex;
  align-items: center;
  gap: .625rem;
  padding: .3rem .5rem;
}

.well__user:hover { background: var(--sunken); }

.well__user-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.well__user-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.15;
  text-align: left;
}

.well__user-name { font-weight: 600; font-size: .8125rem; }

.well__user-role { font-size: .6875rem; color: var(--ink-quiet); }

.well__user-menu {
  min-width: 240px;
  padding: 0;
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 20px 40px rgba(15, 18, 32, .1);
  
  border: 1px solid var(--rule);
  background: var(--surface);
  color: var(--ink);
}

.well__user-menu-header {
  display: flex;
  align-items: center;
  gap: .625rem;
  padding: .875rem 1rem;
  border-bottom: 1px solid var(--rule);
}

.well__user-menu-header small { font-size: .75rem; }

.well__user-menu .well__user-avatar { width: 40px; height: 40px; }

.well__user-menu .dropdown-item { padding: .55rem 1rem; font-size: .875rem; color: var(--ink); }

.well__user-menu .dropdown-item i { font-size: 1rem; width: 20px; }

.well__user-menu .dropdown-item:hover,
.well__user-menu .dropdown-item:focus { background: var(--sunken); color: var(--ink); text-decoration: none; }

.well__user-menu .dropdown-item.text-danger:hover,
.well__user-menu .dropdown-item.text-danger:focus { color: var(--bad); }

.well__density-icon--compact { display: none; }

.form-control,
.form-select {
  border-radius: var(--radius);
  border-color: var(--rule);
  background-color: var(--surface);
  color: var(--ink);
}

.form-control::placeholder { color: var(--ink-faint); }

.form-control:focus,
.form-select:focus {
  border-color: var(--signal);
  background-color: var(--surface);
  color: var(--ink);
  box-shadow: 0 0 0 3px var(--signal-soft);
}

.orchid-card {
  border: 1px solid var(--rule);
  border-radius: var(--radius-card);
  background: var(--surface);
  box-shadow: 0 1px 2px #0f122010;
}

.stat-card__label { margin: 0 0 .25rem; font-size: .8125rem; color: var(--ink-quiet); }

.stat-card__value { margin: 0; font-size: 1.375rem; font-weight: 700; letter-spacing: -.01em; }

.stat-card__value--none { font-weight: 400; color: var(--ink-faint); }

.stat-card__note { margin: .375rem 0 0; font-size: .75rem; color: var(--ink-quiet); }

.stat-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.625rem;
  height: 2.625rem;
  border-radius: var(--radius);
  font-size: 1.15rem;
  flex-shrink: 0;
  background: var(--sunken);
  color: var(--ink-quiet);
}

.stat-card-link {
  display: block;
  color: inherit;
  text-decoration: none;
  transition: border-color .18s ease;
}

.stat-card-link:hover { border-color: var(--signal); text-decoration: none; }

.stat-card--good .stat-card__icon { background: var(--good-soft); color: var(--good); }

.stat-card--warn .stat-card__icon { background: var(--signal-soft); color: var(--signal); }

.stat-card--bad .stat-card__icon { background: var(--bad-soft); color: var(--bad); }

.stat-card--bad .stat-card__value { color: var(--bad); }

.stat-card__warn-icon { font-size: 1.1rem; margin-right: .25rem; vertical-align: -.05em; }

.orchid-table {
  --bs-table-bg: transparent;
  --bs-table-hover-bg: var(--sunken);
  --bs-table-color: var(--ink);
}

.orchid-table thead th {
  padding: .625rem .75rem;
  border-bottom: 1px solid var(--rule);
  background: transparent;
  color: var(--ink-quiet);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.orchid-table tbody td, .orchid-table tbody th { padding: .875rem .75rem; border-bottom: 1px solid var(--rule); }

.orchid-table tbody tr:last-child td, .orchid-table tbody tr:last-child th { border-bottom: 0; }

.orchid-table tbody th { font-weight: 400; text-align: left; }

.orchid-table tr.is-total td, .orchid-table tr.is-total th { font-weight: 700; background: var(--signal-soft); }

.status-chip {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .2rem .6rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 600;
  line-height: 1.4;
}

.status-chip i { font-size: .6875rem; }

.status-chip--good { background: var(--good-soft); color: var(--good); }

.status-chip--bad { background: var(--bad-soft); color: var(--bad); }

.status-chip--muted { background: var(--sunken); color: var(--ink-quiet); }

.status-chip--warn { background: var(--bs-warning-bg-subtle); color: var(--bs-warning); }

.notice {
  margin-bottom: 1rem;
  padding: .5rem .75rem;
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  background: var(--sunken);
  color: var(--ink-quiet);
  font-size: .8125rem;
}

.notice--bad { border-color: var(--bad-edge); background: var(--bad-soft); color: var(--bad); }

.field__hint { margin: .25rem 0 0; color: var(--ink-quiet); font-size: .75rem; }

.notice--owned { border-color: var(--good-edge); background: var(--good-soft); color: var(--good); }

.shell--gate { min-height: 100vh; }

.gate { display: grid; grid-template-columns: 6fr 4fr; min-height: 100vh; }

@media (max-width: 991.98px) {
  .gate { grid-template-columns: 1fr; }
}

.gate__hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 2.5rem 3rem;
  color: #fff;
  background:
    radial-gradient(circle at 15% 20%, #d946ef59, transparent 45%),
    radial-gradient(circle at 85% 80%, #22d3ee52, transparent 45%),
    linear-gradient(135deg, #4338ca 0%, #6d28d9 40%, #0e7490 100%);
}

:root[data-theme="dark"] .gate__hero {
  background:
    radial-gradient(circle at 15% 20%, #d946ef47, transparent 45%),
    radial-gradient(circle at 85% 80%, #22d3ee47, transparent 45%),
    linear-gradient(135deg, #3730a3 0%, #581c87 40%, #155e75 100%);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .gate__hero {
      background:
        radial-gradient(circle at 15% 20%, #d946ef47, transparent 45%),
        radial-gradient(circle at 85% 80%, #22d3ee47, transparent 45%),
        linear-gradient(135deg, #3730a3 0%, #581c87 40%, #155e75 100%);
    }
}

@media (max-width: 991.98px) {
  .gate__hero { display: none; }
}

.gate__hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .55;
  background-image: radial-gradient(circle, #ffffff2e 1px, transparent 1px);
  background-size: 26px 26px;
  mask-image: radial-gradient(ellipse at center, #000 45%, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 45%, transparent 80%);
  animation: gate-drift 22s linear infinite;
}

.gate__hero-brand { display: inline-flex; align-items: center; gap: .625rem; font-weight: 700; letter-spacing: -.02em; font-size: 1.375rem; }

.gate__hero-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: .75rem;
  background: #ffffff29;
  color: #fff;
  font-size: 1.25rem;
  backdrop-filter: blur(8px);
  border: 1px solid #ffffff38;
}

.gate__hero-body { max-width: 32rem; margin: 2rem 0; }

.gate__hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .35rem .75rem;
  border-radius: 999px;
  background: #ffffff24;
  border: 1px solid #ffffff38;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-bottom: 1.25rem;
}

.gate__hero-title { font-size: clamp(1.9rem, 3vw, 2.75rem); font-weight: 800; line-height: 1.15; letter-spacing: -.02em; margin: 0 0 1rem; }

.gate__hero-lead { font-size: 1.05rem; line-height: 1.6; color: #ffffffd9; margin: 0 0 1.5rem; }

.gate__hero-facts { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }

.gate__hero-facts li {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  font-size: .95rem;
  color: #ffffffeb;
}

.gate__hero-facts .bi {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.625rem;
  height: 1.625rem;
  border-radius: .5rem;
  background: #ffffff2e;
  font-size: .875rem;
}

.gate__panel {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 2rem 1.5rem;
  background: var(--surface);
}

@media (min-width: 576px) {
  .gate__panel { padding: 2.5rem; }
}

@media (min-width: 992px) {
  .gate__panel { padding: 2rem 3rem; }
}

.gate__theme {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 1050;
  width: 2.625rem;
  height: 2.625rem;
  border-radius: 999px;
  border: 1px solid var(--rule);
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 4px 12px #0000001f;
}

.gate__mark {
  display: none;
  align-items: center;
  gap: .625rem;
  margin-bottom: 1.5rem;
  font-weight: 700;
  letter-spacing: -.02em;
  font-size: 1.0625rem;
}

@media (max-width: 991.98px) {
  .gate__mark { display: inline-flex; }
}

.gate__mark-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.125rem;
  height: 2.125rem;
  border-radius: .625rem;
  background: #0F766E;
  color: #fff;
  font-size: 1.0625rem;
  flex-shrink: 0;
}

.gate__mark-text { color: var(--ink); }

.gate__form { max-width: 27.5rem; width: 100%; margin: 0 auto; }

.gate__eyebrow {
  color: var(--signal);
  font-weight: 600;
  font-size: .8rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: .5rem;
}

.gate__title { font-size: clamp(1.6rem, 2.2vw, 2rem); font-weight: 800; letter-spacing: -.02em; margin: 0 0 .5rem; color: var(--ink); }

.gate__subtitle { color: var(--ink-quiet); margin: 0 0 1.75rem; font-size: .95rem; }

.gate__field { margin-bottom: 1.1rem; }

.gate__field .form-label { font-size: .85rem; font-weight: 600; color: var(--ink); margin-bottom: .375rem; }

.gate__field .form-control { padding: .7rem .95rem; font-size: .925rem; }

.gate__field .form-control:focus { box-shadow: 0 0 0 4px var(--signal-soft); }

.gate__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  width: 100%;
  height: 3rem;
  border: 0;
  border-radius: var(--radius);
  color: #fff;
  font-weight: 600;
  font-size: .95rem;
  background: linear-gradient(120deg, #4f46e5 0%, #7c3aed 55%, #06b6d4 100%);
  background-size: 200% 100%;
  background-position: 0 50%;
  box-shadow: 0 12px 24px -12px #4f46e58c;
  transition: background-position 350ms ease;
  cursor: pointer;
}

.gate__submit:hover { background-position: 100% 50%; color: #fff; }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .bookings-hero {
      background: radial-gradient(140% 100% at 0% 0%, #182058 0%, #0a1230 55%, #050914 100%);
    }
}

:root[data-theme="dark"] .bookings-hero {
  background: radial-gradient(140% 100% at 0% 0%, #182058 0%, #0a1230 55%, #050914 100%);
}

@media (max-width: 60em) {
  .well__body { padding: 1rem; }
}