:root {
  --wink-ink: #161412;
  --wink-muted: #5f5851;
  --wink-line: #ddd6cf;
  --wink-paper: #fbf8f3;
  --wink-white: #ffffff;
  --wink-gold: #f5a623;
  --wink-gold-dark: #c77800;
  --wink-green: #2d6b5f;
  --wink-blue: #264d63;
  --wink-shadow: 0 18px 48px rgba(21, 18, 13, 0.12);
  --wink-radius: 8px;
}

* {
  box-sizing: border-box;
}

body {
  color: var(--wink-ink) !important;
  background:
    linear-gradient(180deg, rgba(16, 12, 8, 0.72), rgba(16, 12, 8, 0.2) 280px, rgba(251, 248, 243, 0) 520px),
    url("/home/assets/wink-hero-capsules.png") center top / cover no-repeat fixed,
    var(--wink-paper) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  line-height: 1.5;
}

a {
  color: inherit;
}

.page-wrap {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto !important;
  padding: 24px 0 56px !important;
}

.content {
  max-width: 1120px !important;
}

.site-header,
.page-wrap > .d-flex:first-child,
.content > .d-flex:first-child {
  min-height: 76px;
  margin-bottom: 28px !important;
  padding: 12px 18px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: var(--wink-radius);
  background: rgba(251, 248, 243, 0.94);
  box-shadow: 0 10px 36px rgba(20, 16, 12, 0.08);
  backdrop-filter: blur(12px);
}

.logo,
.site-header img,
.page-wrap > .d-flex:first-child img,
.content > .d-flex:first-child img {
  width: auto;
  max-width: 132px !important;
  height: auto;
  object-fit: contain;
}

.intro {
  max-width: 920px !important;
  margin: 0 0 16px !important;
  color: var(--wink-white);
}

.intro h1,
h1.h4,
h2.h4,
.panel h1,
.panel h2 {
  color: var(--wink-ink);
  font-weight: 900 !important;
  letter-spacing: 0;
}

.intro h1 {
  color: var(--wink-white);
  font-size: clamp(2.2rem, 6vw, 4.6rem) !important;
  line-height: 0.96;
  margin-bottom: 12px !important;
}

.intro p {
  color: rgba(255, 255, 255, 0.86) !important;
  font-size: 1.06rem;
}

.selector-panel,
.panel,
.empty-state,
.room-card {
  border: 1px solid var(--wink-line) !important;
  border-radius: var(--wink-radius) !important;
  background: var(--wink-white) !important;
  box-shadow: var(--wink-shadow) !important;
}

.selector-panel,
.panel {
  padding: clamp(18px, 3vw, 26px) !important;
}

.field label,
.form-label,
label {
  color: #3e3730 !important;
  font-size: 0.82rem;
  font-weight: 800 !important;
}

.form-control,
.form-select,
textarea.form-control,
input.form-control {
  min-height: 46px !important;
  border: 1px solid var(--wink-line) !important;
  border-radius: 6px !important;
  background-color: #fffdfa !important;
  color: var(--wink-ink) !important;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--wink-gold) !important;
  box-shadow: 0 0 0 0.2rem rgba(245, 166, 35, 0.22) !important;
}

.btn {
  min-height: 44px;
  border-radius: var(--wink-radius) !important;
  font-weight: 900 !important;
  line-height: 1;
  transition: transform 160ms ease, background 160ms ease, border-color 160ms ease;
}

.btn:hover {
  transform: translateY(-1px);
}

.btn-primary,
.btn-outline-primary:hover {
  border-color: var(--wink-gold) !important;
  background: var(--wink-gold) !important;
  color: var(--wink-ink) !important;
}

.btn-primary:hover,
.btn-primary:focus {
  border-color: var(--wink-gold-dark) !important;
  background: var(--wink-gold-dark) !important;
  color: var(--wink-white) !important;
}

.btn-outline-secondary,
.btn-outline-primary {
  border-color: var(--wink-line) !important;
  color: var(--wink-ink) !important;
  background: var(--wink-white) !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

.result-bar {
  padding: 18px;
  border-radius: var(--wink-radius);
  background: rgba(251, 248, 243, 0.94);
  box-shadow: 0 10px 36px rgba(20, 16, 12, 0.08);
}

.result-count,
.meta,
.availability,
.room-location,
.muted {
  color: var(--wink-muted) !important;
}

.outlet-title {
  margin: 28px 0 14px !important;
  color: var(--wink-white);
  font-weight: 900 !important;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.25);
}

.room-card {
  overflow: hidden;
}

.room-media {
  background:
    linear-gradient(135deg, rgba(245, 166, 35, 0.2), rgba(45, 107, 95, 0.14)),
    #f1ebe4 !important;
}

.room-body {
  padding: 18px !important;
}

.room-name {
  color: var(--wink-ink);
  font-weight: 900 !important;
}

.meta-cell {
  border-color: #ece5dd !important;
  border-radius: 6px !important;
  background: #fffaf2 !important;
}

.meta-label {
  color: var(--wink-green) !important;
  font-weight: 900 !important;
}

.rate {
  color: var(--wink-green) !important;
  font-weight: 900 !important;
}

.price-row.discount,
.text-success {
  color: var(--wink-green) !important;
}

.alert {
  border-radius: var(--wink-radius) !important;
}

.alert-danger {
  border-color: #f2b8a8 !important;
  background: #fff0ec !important;
  color: #8a2c18 !important;
}

.alert-warning {
  border-color: #f7d891 !important;
  background: #fff8e8 !important;
  color: #755100 !important;
}

.alert-info {
  border-color: #b8d1d9 !important;
  background: #eef7f7 !important;
  color: var(--wink-blue) !important;
}

.passport-sample-image {
  border: 1px solid var(--wink-line);
  border-radius: var(--wink-radius);
  box-shadow: var(--wink-shadow);
}

@media (max-width: 680px) {
  body {
    background-attachment: scroll !important;
  }

  .page-wrap {
    width: min(100% - 24px, 1180px);
    padding-top: 14px !important;
  }

  .site-header,
  .page-wrap > .d-flex:first-child,
  .content > .d-flex:first-child {
    align-items: flex-start !important;
    flex-direction: column;
  }

  .intro h1 {
    font-size: clamp(2rem, 13vw, 3.2rem) !important;
  }
}
