:root {
  color-scheme: light;
  --sidebar-width: 288px;
  --bg: #f5f7f4;
  --surface: #ffffff;
  --surface-2: #eef2ec;
  --text: #17201b;
  --muted: #637067;
  --line: #dce3dd;
  --accent: #071b33;
  --accent-strong: #102f52;
  --gold: #b38a3f;
  --cyotel-navy: #0b1d36;
  --cyotel-cream: #faf7f1;
  --cyotel-gold-light: #d7b56e;
  --cyotel-gold: #c8a15a;
  --cyotel-gold-dark: #a97f38;
  --warn: #b45309;
  --danger: #b91c1c;
  --ok: #15803d;
  --shadow: 0 18px 45px rgba(7, 27, 51, 0.12);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

.is-hidden {
  display: none !important;
}

button,
input,
select {
  font: inherit;
}

button {
  cursor: pointer;
}

.login-screen {
  display: grid;
  place-items: center;
  min-height: 100vh;
  padding: 28px;
  background: #f6f7f2;
}

.login-card {
  width: min(510px, 100%);
  padding: 38px 30px 30px;
  border: 1px solid #e6ddc9;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 18px 35px rgba(7, 27, 51, 0.14);
}

.login-logo {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 28px;
}

.cyotel-login-brand {
  display: grid;
  justify-items: center;
  gap: 8px;
  margin-bottom: 24px;
  padding-bottom: 22px;
  border-bottom: 1px solid #efe6d4;
}

.cyotel-login-brand img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  display: block;
  border-radius: 16px;
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.22));
}

.cyotel-login-brand span,
.workspace-kicker,
.cyotel-powered-badge span,
.topbar-title-group small {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.cyotel-login-brand span {
  color: var(--cyotel-gold-dark);
  font-size: 11px;
  font-weight: 800;
}

.login-logo img {
  width: min(330px, 100%);
  height: auto;
  display: block;
}

.workspace-kicker {
  margin: -8px 0 16px;
  color: var(--cyotel-navy);
  text-align: center;
  font-size: 12px;
  font-weight: 900;
}

.login-card h1 {
  margin: 0;
  text-align: center;
  font-size: 30px;
}

.login-card > p {
  margin: 16px 0 34px;
  color: #29364d;
  text-align: center;
  font-size: 21px;
}

.floating-field {
  position: relative;
  display: block;
  margin-bottom: 20px;
  color: #8b93a1;
  font-size: 14px;
}

.floating-field input {
  width: 100%;
  height: 44px;
  padding: 16px 46px 5px 14px;
  border-color: #dfe3ea;
  border-radius: 9px;
  font-size: 18px;
}

.floating-field span {
  position: absolute;
  top: 5px;
  left: 15px;
  pointer-events: none;
}

.password-field {
  margin-bottom: 10px;
}

.password-toggle {
  position: absolute;
  right: 12px;
  top: 11px;
  width: 26px;
  height: 22px;
  border: 0;
  background: transparent;
  color: #111827;
  font-size: 15px;
  line-height: 1;
}

.login-row {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 12px;
  min-height: 18px;
  margin-bottom: 14px;
}

.login-error {
  color: var(--danger);
  font-size: 13px;
  font-weight: 700;
}

.login-button {
  width: 100%;
  height: 46px;
  border: 0;
  border-radius: 5px;
  background: #4966a1;
  color: #ffffff;
  font-weight: 700;
  box-shadow: 0 4px 8px rgba(15, 23, 42, 0.25);
}

.login-help {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 16px;
  margin: 22px 0 12px;
  padding: 14px;
  border-radius: 8px;
  background: #f8fafc;
  color: #475569;
  font-size: 13px;
}

.login-help strong {
  grid-column: 1 / -1;
  color: #1f2937;
}

.app-shell {
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  min-height: 100vh;
  transition: grid-template-columns 180ms ease;
}

.app-shell.sidebar-collapsed {
  --sidebar-width: 88px;
}

.sidebar {
  display: flex;
  flex-direction: column;
  background: #071b33;
  color: #f8fbf8;
  padding: 22px 16px;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 60;
  scrollbar-gutter: stable;
}

.sidebar-toggle {
  width: 44px;
  min-height: 38px;
  margin: 0 0 12px auto;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  font-size: 18px;
  font-weight: 900;
}

.brand {
  display: grid;
  gap: 10px;
  width: 100%;
  border: 0;
  padding: 0 6px 20px;
  margin-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  background: transparent;
  text-align: left;
}

.brand p,
.topbar h2,
.eyebrow,
.panel h3 {
  margin: 0;
}

.brand img {
  width: 100%;
  max-width: 230px;
  height: auto;
  display: block;
}

.brand p {
  color: #d8c28d;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.8px;
}

.nav {
  display: grid;
  gap: 8px;
}

.nav-item {
  position: relative;
  width: 100%;
  border: 0;
  border-radius: 8px;
  padding: 14px 40px 14px 14px;
  background: transparent;
  color: #dce4f2;
  text-align: left;
  font-weight: 700;
}

.nav-item::before {
  display: none;
}

.nav-item:hover,
.nav-item.active {
  background: rgba(255, 255, 255, 0.13);
  color: #ffffff;
}

.nav-item::after {
  content: "›";
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  color: #9fb1ce;
  font-size: 23px;
}

.sidebar-footer {
  display: grid;
  gap: 10px;
  margin-top: auto;
  padding-top: 16px;
  padding-bottom: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.cyotel-powered-badge {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid rgba(215, 181, 110, 0.34);
  border-radius: 8px;
  background: rgba(250, 247, 241, 0.08);
  color: var(--cyotel-gold-light);
}

.cyotel-powered-badge img {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
}

.cyotel-powered-badge span {
  font-size: 10px;
  font-weight: 900;
}

.app-shell.sidebar-collapsed .sidebar {
  padding: 16px 10px;
}

.app-shell.sidebar-collapsed .sidebar-toggle {
  margin-right: auto;
}

.app-shell.sidebar-collapsed .brand {
  justify-items: center;
  padding: 0 0 14px;
}

.app-shell.sidebar-collapsed .brand img {
  width: 56px;
  max-width: 56px;
}

.app-shell.sidebar-collapsed .brand p,
.app-shell.sidebar-collapsed .nav-label,
.app-shell.sidebar-collapsed .system-date-card,
.app-shell.sidebar-collapsed .user-chip,
.app-shell.sidebar-collapsed .cyotel-powered-badge span,
.app-shell.sidebar-collapsed .sidebar-logout-label {
  display: none;
}

.app-shell.sidebar-collapsed .cyotel-powered-badge {
  justify-content: center;
  padding: 8px 0;
}

.app-shell.sidebar-collapsed .nav {
  width: 100%;
}

.app-shell.sidebar-collapsed .nav-item {
  display: grid;
  place-items: center;
  min-height: 48px;
  padding: 0;
  font-size: 0;
}

.app-shell.sidebar-collapsed .nav-item::before {
  content: attr(data-icon);
  display: grid;
  place-items: center;
  min-width: 34px;
  min-height: 34px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
  font-size: 19px;
  font-weight: 900;
}

.app-shell.sidebar-collapsed .nav-item::after {
  display: none;
}

.app-shell.sidebar-collapsed .sidebar-footer {
  width: 100%;
}

.sidebar-logout-icon {
  display: none;
}

.app-shell.sidebar-collapsed .sidebar-logout {
  display: grid;
  place-items: center;
  padding: 0;
}

.app-shell.sidebar-collapsed .sidebar-logout-icon {
  display: inline;
}

.main {
  min-width: 0;
  display: grid;
  grid-template-rows: 82px 1fr;
  padding: 0;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 30px;
  border-bottom: 1px solid var(--line);
  background: #ffffff;
}

.topbar span {
  display: none;
}

.topbar-title-group {
  display: grid;
  gap: 4px;
}

.topbar-title-group #viewTitle {
  display: inline;
  color: var(--text);
  font-size: 22px;
  font-weight: 900;
}

.topbar-title-group small {
  color: var(--cyotel-gold-dark);
  font-size: 10px;
  font-weight: 900;
}

.eyebrow {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
}

.topbar h2 {
  margin-top: 4px;
  font-size: 30px;
}

.topbar-actions,
.filters,
.inline-form,
.segmented {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.user-chip {
  display: grid;
  gap: 2px;
  min-height: 40px;
  padding: 4px 12px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
}

.user-chip span {
  font-weight: 800;
}

.user-chip small {
  color: #b9c7dc;
}

.system-date-card {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
}

.system-date-card div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.system-date-card span {
  color: #b9c7dc;
  font-size: 12px;
  font-weight: 800;
}

.system-date-card strong {
  color: #ffffff;
  font-size: 13px;
}

.day-status {
  display: inline-flex;
  justify-content: center;
  border-radius: 999px;
  padding: 6px 8px;
  font-weight: 900;
}

.day-status.current {
  background: rgba(34, 197, 94, 0.18);
  color: #bbf7d0;
}

.day-status.late {
  background: rgba(248, 113, 113, 0.2);
  color: #fecaca;
}

.day-status.ahead {
  background: rgba(251, 191, 36, 0.2);
  color: #fde68a;
}

.sidebar-logout {
  min-height: 40px;
  border: 0;
  border-radius: 8px;
  background: #b92c2c;
  color: #ffffff;
  font-weight: 800;
}

input,
select,
textarea {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #ffffff;
  color: var(--text);
}

textarea {
  resize: vertical;
}

.primary-button,
.ghost-button,
.icon-button,
.icon-text-button {
  min-height: 40px;
  border-radius: 8px;
  border: 1px solid transparent;
  padding: 0 14px;
  font-weight: 700;
}

.primary-button {
  background: var(--accent);
  color: #ffffff;
}

.primary-button:hover {
  background: var(--accent-strong);
}

.ghost-button {
  background: var(--surface-2);
  color: var(--text);
  border-color: var(--line);
}

.danger-button {
  color: #b91c1c;
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.icon-button {
  width: 40px;
  padding: 0;
  background: var(--surface-2);
}

.icon-text-button {
  min-height: 32px;
  background: #fff1f2;
  color: var(--danger);
  border-color: #fecdd3;
}

.view {
  display: none;
}

.view.active {
  display: block;
}

.module-home.active {
  display: grid;
}

.module-home {
  min-height: calc(100vh - 82px);
  place-items: center;
  padding: 42px;
  background:
    linear-gradient(90deg, rgba(36, 48, 69, 0.05) 1px, transparent 1px),
    linear-gradient(rgba(36, 48, 69, 0.05) 1px, transparent 1px),
    #f6f8fb;
  background-size: 42px 42px;
}

.legacy-view {
  padding: 28px;
}

.hotel-name-panel {
  width: min(900px, 100%);
  padding: 56px 38px;
  border: 1px solid #dce3ee;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 24px 65px rgba(36, 48, 69, 0.14);
  text-align: center;
}

.hotel-name-panel p {
  margin: 0 0 14px;
  color: #63708a;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.hotel-name-panel h2 {
  margin: 0;
  color: #243045;
  font-size: clamp(42px, 7vw, 86px);
  line-height: 1;
}

.hotel-name-panel span {
  display: block;
  margin-top: 20px;
  color: #64748b;
  font-size: 17px;
}

.logo-home-panel {
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.logo-home-panel img {
  width: min(680px, 86vw);
  height: auto;
  display: block;
}

.home-command-center {
  --home-navy: #07111f;
  --home-navy-2: #0b1728;
  --home-navy-3: #13243d;
  --home-gold: #d7b56e;
  --home-gold-2: #f3d794;
  --home-ink: #f8fafc;
  --home-muted: #aebdd2;
  --home-soft: #8494aa;
  --home-line: rgba(255, 255, 255, 0.1);
  --home-gold-line: rgba(215, 181, 110, 0.24);
  --home-glass: rgba(255, 255, 255, 0.065);
  align-content: start;
  place-items: stretch;
  gap: 16px;
  min-height: calc(100vh - 82px);
  padding: clamp(14px, 1.8vw, 24px);
  overflow-x: hidden;
  background:
    radial-gradient(circle at 16% -8%, rgba(215, 181, 110, 0.21), transparent 30rem),
    radial-gradient(circle at 92% 12%, rgba(59, 130, 246, 0.14), transparent 24rem),
    linear-gradient(135deg, #07111f 0%, #0b1728 46%, #13243d 100%);
  color: var(--home-ink);
}

.home-command-center .eyebrow {
  margin: 0;
  color: var(--home-gold-2);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.main:has(#home.home-command-center.active) {
  background: #07111f;
}

.main:has(#home.home-command-center.active) .topbar {
  border-bottom-color: rgba(215, 181, 110, 0.18);
  background: linear-gradient(135deg, #07111f 0%, #0b1728 58%, #13243d 100%);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.18);
}

.main:has(#home.home-command-center.active) .topbar-title-group #viewTitle {
  color: #ffffff;
}

.main:has(#home.home-command-center.active) .topbar-title-group small {
  color: #f3d794;
  font-size: 9px;
  letter-spacing: 1.1px;
}

.home-hero,
.home-panel,
.home-notice-card,
.home-table-panel,
.home-metric {
  border: 1px solid var(--home-line);
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.22);
}

.home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.58fr) minmax(235px, 0.7fr);
  gap: 16px;
  padding: clamp(18px, 2.2vw, 26px);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.035));
  position: relative;
  overflow: hidden;
}

.home-hero::after {
  content: "";
  position: absolute;
  inset: auto -8% -42% 42%;
  height: 260px;
  background: radial-gradient(circle, rgba(215, 181, 110, 0.2), transparent 70%);
  pointer-events: none;
}

.home-hero-main,
.home-hero-side,
.home-grid,
.home-panel,
.home-table-panel {
  min-width: 0;
}

.home-hero h1 {
  margin: 9px 0 9px;
  max-width: 720px;
  color: #ffffff;
  font-size: clamp(28px, 3.1vw, 42px);
  line-height: 1.02;
  letter-spacing: -0.045em;
}

.home-hero-main > p:not(.eyebrow) {
  max-width: 760px;
  margin: 0;
  color: #c9d4e5;
  font-size: clamp(12px, 1.15vw, 14px);
  line-height: 1.55;
}

.home-hero-tags,
.home-metrics,
.home-ops-grid,
.home-heatmap {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.home-hero-tags {
  margin-top: 16px;
}

.home-tag,
.home-chip,
.home-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 850;
  white-space: nowrap;
}

.home-tag {
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  background: rgba(255, 255, 255, 0.07);
  color: #d9e5f5;
}

.home-tag.gold,
.home-chip.gold {
  border-color: rgba(215, 181, 110, 0.38);
  background: rgba(215, 181, 110, 0.16);
  color: #ffe3a3;
}

.home-hero-side {
  display: grid;
  gap: 9px;
  position: relative;
  z-index: 1;
}

.home-signal,
.home-ops-card,
.home-flow-card {
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  background: rgba(5, 11, 20, 0.36);
}

.home-signal {
  display: grid;
  gap: 5px;
  padding: 12px;
}

.home-signal span,
.home-metric span,
.home-ops-card span {
  color: var(--home-muted);
  font-size: 10.5px;
  font-weight: 850;
}

.home-signal strong {
  color: #ffffff;
  font-size: 17px;
  letter-spacing: -0.03em;
}

.home-signal.good,
.home-metric.good {
  border-color: rgba(141, 240, 176, 0.26);
}

.home-signal.warn,
.home-metric.warn {
  border-color: rgba(255, 207, 122, 0.32);
}

.home-signal.blue,
.home-metric.blue {
  border-color: rgba(156, 193, 255, 0.3);
}

.home-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.home-metric {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 13px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.058);
}

.home-metric.gold {
  border-color: var(--home-gold-line);
}

.home-metric strong {
  color: #ffffff;
  font-size: clamp(20px, 2.15vw, 27px);
  letter-spacing: -0.045em;
}

.home-metric small,
.home-ops-card small,
.home-flow-card small,
.home-notice-card small,
.home-panel-head span {
  color: var(--home-soft);
  font-size: 11.5px;
  line-height: 1.35;
}

.home-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.22fr) minmax(300px, 0.78fr);
  gap: 14px;
}

.home-flow-panel,
.home-table-panel,
.home-notice-card {
  grid-column: 1 / -1;
}

.home-panel,
.home-table-panel,
.home-notice-card {
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.055);
}

.home-panel,
.home-table-panel {
  padding: 15px;
}

.home-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.home-panel-head h2,
.home-panel-head h3 {
  margin: 5px 0 0;
  color: #ffffff;
  letter-spacing: -0.035em;
}

.home-panel-head h2 {
  font-size: 21px;
}

.home-panel-head h3 {
  font-size: 18px;
}

.home-timeline {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.home-flow-card {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 12px;
  min-width: 0;
  padding: 15px;
  position: relative;
}

.home-flow-card b {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 14px;
  background: rgba(215, 181, 110, 0.17);
  color: var(--home-gold-2);
}

.home-flow-card strong,
.home-ops-card strong {
  display: block;
  color: #ffffff;
  font-size: 15px;
  line-height: 1.25;
}

.home-status {
  grid-column: 2;
  justify-self: start;
  min-height: 28px;
  margin-top: 6px;
  padding: 0 10px;
}

.home-status.ok,
.home-chip.ok {
  background: rgba(141, 240, 176, 0.14);
  color: #a9f6c3;
}

.home-status.warn,
.home-chip.warn {
  background: rgba(255, 207, 122, 0.15);
  color: #ffdc97;
}

.home-status.info,
.home-chip.blue {
  background: rgba(156, 193, 255, 0.14);
  color: #bdd4ff;
}

.home-ops-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.home-ops-card {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 15px;
}

.home-heatmap {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.home-day {
  min-height: 82px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 17px;
  background: rgba(255, 255, 255, 0.05);
  color: #d9e5f5;
  display: grid;
  place-items: center;
  text-align: center;
  font-weight: 950;
  line-height: 1.45;
}

.home-day.busy {
  background: rgba(215, 181, 110, 0.12);
  border-color: rgba(215, 181, 110, 0.25);
}

.home-day.full {
  background: rgba(255, 207, 122, 0.18);
  border-color: rgba(255, 207, 122, 0.36);
  color: #ffe8b2;
}

.home-notice-card {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 18px;
  border-color: var(--home-gold-line);
}

.home-notice-card div {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.home-notice-card strong {
  color: #ffe3a3;
}

.home-table-wrap {
  overflow-x: auto;
}

.home-table-panel table {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0 9px;
}

.home-table-panel th {
  padding: 9px 12px;
  border-top: 1px solid rgba(215, 181, 110, 0.18);
  border-bottom: 1px solid rgba(215, 181, 110, 0.18);
  background: rgba(215, 181, 110, 0.08);
  color: #f3d794;
  font-size: 11px;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.home-table-panel th:first-child {
  border-left: 1px solid rgba(215, 181, 110, 0.18);
  border-radius: 12px 0 0 12px;
}

.home-table-panel th:last-child {
  border-right: 1px solid rgba(215, 181, 110, 0.18);
  border-radius: 0 12px 12px 0;
}

.home-table-panel td {
  padding: 13px 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.055);
  color: #eaf1fb;
  font-weight: 750;
}

.home-table-panel td:first-child {
  border-left: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 15px 0 0 15px;
  color: #ffffff;
}

.home-table-panel td:last-child {
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0 15px 15px 0;
}

.home-table-panel tbody tr {
  transition: transform 150ms ease, filter 150ms ease;
}

.home-table-panel tbody tr:hover {
  background: transparent !important;
  transform: translateY(-1px);
}

.home-table-panel tbody tr:hover td {
  background: linear-gradient(135deg, rgba(20, 36, 61, 0.98), rgba(13, 25, 43, 0.98)) !important;
  border-color: rgba(215, 181, 110, 0.18);
  color: #f4f8ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), inset 0 -1px 0 rgba(215, 181, 110, 0.08);
}

.home-table-panel tbody tr:hover td:first-child {
  color: #ffffff !important;
  box-shadow: inset 3px 0 0 rgba(215, 181, 110, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.05), inset 0 -1px 0 rgba(215, 181, 110, 0.08);
}

.home-table-panel tbody tr:hover .home-chip,
.home-table-panel tbody tr:hover .home-status {
  filter: brightness(1.08) saturate(1.05);
}

.home-chip {
  min-height: 27px;
  padding: 0 9px;
}

@media (max-width: 1180px) {
  .home-metrics,
  .home-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-grid,
  .home-hero {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .home-command-center {
    padding: 16px;
  }

  .home-metrics,
  .home-timeline,
  .home-ops-grid,
  .home-heatmap,
  .home-notice-card {
    grid-template-columns: 1fr;
  }

  .home-panel-head {
    display: grid;
  }
}

.setup-workspace {
  padding: 28px;
  background: #f6f8fb;
}

.setup-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 22px;
  margin-bottom: 18px;
}

.setup-header h2 {
  margin: 4px 0 0;
  color: #243045;
  font-size: 34px;
}

.setup-header > span {
  max-width: 620px;
  color: #64748b;
  line-height: 1.5;
}

.setup-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  margin-bottom: 18px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

#frontoffice {
  max-width: 100%;
  overflow-x: hidden;
  padding-bottom: 108px;
}

#frontoffice .setup-header,
#frontoffice .setup-tabs,
#frontoffice .panel,
#frontoffice .table-wrap {
  min-width: 0;
  max-width: 100%;
}

#frontoffice {
  margin-left: -14px;
  margin-right: -14px;
}

#frontoffice > .top-panel,
#frontoffice > .setup-tabs,
#frontoffice > .frontoffice-tab-panel {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

#frontoffice .panel {
  padding-left: 14px;
  padding-right: 14px;
}

#frontoffice > .setup-tabs,
#frontoffice .reservation-tabs {
  flex-wrap: wrap;
  overflow-x: hidden;
}

#foReservations .panel {
  border: 1px solid rgba(227, 221, 210, 0.92);
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(251, 250, 247, 0.98)),
    radial-gradient(circle at top right, rgba(184, 138, 68, 0.12), transparent 32%);
  box-shadow: 0 20px 60px rgba(16, 24, 39, 0.08);
}

#foReservations .panel-header {
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 14px;
  padding: 2px 2px 12px;
  border-bottom: 1px solid rgba(227, 221, 210, 0.72);
}

#foReservations .panel-header h3 {
  margin: 0;
  color: #101827;
  font-size: clamp(24px, 2.1vw, 34px);
  letter-spacing: -0.045em;
}

#foReservations .toolbar {
  gap: 8px;
  justify-content: flex-end;
}

#foReservations .toolbar .primary-button,
#foReservations .toolbar .ghost-button {
  min-height: 36px;
  border-radius: 999px;
  box-shadow: none;
}

#foReservations .reservation-tabs {
  gap: 7px;
  margin-bottom: 12px;
  padding: 7px;
  border: 1px solid rgba(227, 221, 210, 0.86);
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff, #f7f2ea);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

#foReservations .reservation-tabs button {
  min-height: 34px;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: #475467;
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

#foReservations .reservation-tabs button:hover {
  color: #101827;
  background: rgba(255, 255, 255, 0.72);
  border-color: rgba(227, 221, 210, 0.82);
}

#foReservations .reservation-tabs button.active {
  color: #ffffff;
  background: linear-gradient(135deg, #101827, #202b42);
  border-color: rgba(184, 138, 68, 0.35);
  box-shadow: 0 10px 24px rgba(16, 24, 39, 0.16);
}

#foReservations .frontoffice-filters {
  margin-bottom: 14px;
  padding: 10px;
  border: 1px solid rgba(227, 221, 210, 0.76);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.72);
}

#foReservations .frontoffice-filters input {
  min-height: 42px;
  border-radius: 14px;
  border-color: rgba(148, 163, 184, 0.28);
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(16, 24, 39, 0.03);
}

#foReservations .frontoffice-filters input:focus {
  border-color: rgba(184, 138, 68, 0.64);
  box-shadow: 0 0 0 4px rgba(184, 138, 68, 0.12);
}

#foReservations .table-wrap {
  overflow-x: hidden;
  overflow-y: visible;
  border: 1px solid #e3ddd2;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 18px 46px rgba(16, 24, 39, 0.08);
}

#foReservations .premium-fo-summary {
  display: grid;
  grid-template-columns: 1.2fr repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 12px 0 16px;
}

#foReservations .premium-fo-summary[hidden] {
  display: none !important;
}

#foReservations .premium-fo-summary-hero,
#foReservations .premium-fo-summary-card {
  border: 1px solid #e3ddd2;
  border-radius: 18px;
  box-shadow: 0 14px 36px rgba(16, 24, 39, 0.08);
}

#foReservations .premium-fo-summary-hero {
  display: grid;
  gap: 8px;
  min-height: 126px;
  padding: 18px;
  color: #ffffff;
  background: linear-gradient(135deg, #101827, #202b42);
}

#foReservations .premium-fo-summary-hero strong {
  font-size: clamp(24px, 2.4vw, 36px);
  line-height: 1;
  letter-spacing: -0.045em;
}

#foReservations .premium-fo-summary-hero small {
  color: #cbd5e1;
  font-size: 14px;
  line-height: 1.25;
}

#foReservations .premium-fo-summary-card {
  display: grid;
  align-content: start;
  gap: 9px;
  min-height: 126px;
  padding: 18px;
  background: #ffffff;
}

#foReservations .premium-fo-summary-card strong {
  color: #111827;
  font-size: 26px;
  line-height: 1;
  letter-spacing: -0.04em;
}

#foReservations .premium-fo-summary-card small {
  color: #667085;
  font-size: 13px;
  line-height: 1.3;
}

#foReservations .premium-pill.dark {
  color: #e7d7bd;
  background: #172033;
  border-color: rgba(184, 138, 68, 0.36);
}

#foReservations table {
  table-layout: fixed;
  min-width: 0;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
}

#foReservations thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  color: #344054;
  background: linear-gradient(180deg, #fffdf8, #f1e9dd);
  border-bottom: 1px solid #ddd2c2;
}

#foReservations thead th:first-child {
  border-top-left-radius: 18px;
}

#foReservations thead th:last-child {
  border-top-right-radius: 18px;
}

#foReservations tbody tr {
  transition: background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

#foReservations tbody tr:hover {
  background: #fbf7ef;
  box-shadow: inset 3px 0 0 rgba(184, 138, 68, 0.28);
}

#foReservations tbody tr.selected-row {
  background: #f1e3c7;
  box-shadow: inset 5px 0 0 #8f6423, 0 0 0 1px rgba(143, 100, 35, 0.2);
}

#foReservations tbody tr.selected-row td {
  background-color: #f1e3c7 !important;
  color: #111827;
}

#foReservations tbody tr.selected-row td:first-child {
  font-weight: 800;
}

#foReservations tbody td {
  border-bottom: 1px solid #eee8dd;
  background-clip: padding-box;
}

#foReservations tbody tr:nth-child(even):not(.selected-row) td {
  background-color: rgba(251, 250, 247, 0.52);
}

#foReservations tbody tr:last-child td {
  border-bottom: 0;
}

#foReservations table.web-review-table {
  min-width: 0;
  width: 100%;
  table-layout: fixed;
}

#foReservations:has(table.web-review-table) .table-wrap {
  overflow-x: hidden;
}

#foReservations th,
#foReservations td {
  padding: 7px 5px;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  line-height: 1.12;
  font-size: 12px;
  vertical-align: middle;
}

#foReservations th:nth-child(1),
#foReservations td:nth-child(1) { width: 6%; }
#foReservations th:nth-child(2),
#foReservations td:nth-child(2) { width: 8%; }
#foReservations th:nth-child(3),
#foReservations td:nth-child(3) { width: 7%; }
#foReservations th:nth-child(4),
#foReservations td:nth-child(4) { width: 13%; }
#foReservations th:nth-child(5),
#foReservations td:nth-child(5),
#foReservations th:nth-child(6),
#foReservations td:nth-child(6) { width: 12%; }
#foReservations th:nth-child(7),
#foReservations td:nth-child(7) { width: 11%; }
#foReservations th:nth-child(8),
#foReservations td:nth-child(8),
#foReservations th:nth-child(9),
#foReservations td:nth-child(9) { width: 5%; text-align: center; }
#foReservations th:nth-child(10),
#foReservations td:nth-child(10) { width: 10%; }
#foReservations th:nth-child(11),
#foReservations td:nth-child(11) {
  width: 11%;
  min-width: 0;
  white-space: normal;
}

#foReservations .table-sort {
  font-size: 11px;
  line-height: 1.05;
  white-space: normal;
  text-align: inherit;
}

#foReservations .status-pill {
  padding: 4px 6px;
  font-size: 11px;
}

#foReservations .web-review-summary-row td {
  border-bottom-color: rgba(182, 145, 72, 0.18);
}

#foReservations table.web-review-table thead {
  display: none;
}

#foReservations table.web-review-table th,
#foReservations table.web-review-table td {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

.compact-web-review td {
  padding: 6px 8px;
  vertical-align: middle;
  line-height: 1.15;
}

.compact-web-review strong,
.compact-web-review small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.compact-web-review small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
}

.compact-web-review-detail td {
  padding-left: 0;
  padding-right: 0;
}


#foReservations .premium-web-review-summary {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 14px;
  margin: 12px 0 16px;
}

#foReservations .premium-web-review-summary[hidden],
#foReservations .premium-web-review-grid[hidden] {
  display: none !important;
}

#foReservations .premium-web-review-hero,
#foReservations .premium-web-review-info,
#foReservations .premium-web-review-card,
#foReservations .premium-web-review-empty {
  border: 1px solid #e3ddd2;
  border-radius: 18px;
  box-shadow: 0 14px 36px rgba(16, 24, 39, 0.08);
}

#foReservations .premium-web-review-hero {
  display: grid;
  gap: 7px;
  min-height: 134px;
  padding: 18px;
  color: #ffffff;
  background: linear-gradient(135deg, #101827, #202b42);
}

#foReservations .premium-web-review-hero strong {
  font-size: clamp(28px, 3vw, 42px);
  line-height: 0.95;
  letter-spacing: -0.05em;
}

#foReservations .premium-web-review-hero small {
  max-width: 520px;
  color: #cbd5e1;
  font-size: 15px;
  line-height: 1.16;
}

#foReservations .premium-web-review-info {
  display: grid;
  align-content: start;
  gap: 10px;
  min-height: 134px;
  padding: 18px;
  background: #ffffff;
}

#foReservations .premium-web-review-info strong {
  color: #111827;
  font-size: 20px;
  line-height: 1.05;
  letter-spacing: -0.035em;
}

#foReservations .premium-web-review-info small,
#foReservations .premium-web-review-empty small {
  color: #667085;
  font-size: 13px;
  line-height: 1.35;
}

#foReservations .premium-pill {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  border: 1px solid;
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.015em;
}

#foReservations .premium-pill.gold {
  color: #7a5415;
  background: #f4e8d4;
  border-color: rgba(184, 138, 68, 0.45);
}

#foReservations .premium-pill.ok {
  color: #10764b;
  background: #eaf7f1;
  border-color: #cdeadd;
}

#foReservations .premium-pill.web {
  color: #194faa;
  background: #eaf1ff;
  border-color: #cfe0ff;
}

#foReservations .premium-web-review-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

#foReservations .premium-web-review-card,
#foReservations .premium-web-review-empty {
  display: grid;
  gap: 12px;
  padding: 15px;
  background: #ffffff;
}

#foReservations .premium-web-review-card.selected-row {
  border-color: rgba(143, 100, 35, 0.88);
  background: linear-gradient(135deg, #f3e4c7 0%, #fff8ea 100%);
  box-shadow: 0 18px 46px rgba(143, 100, 35, 0.22), inset 5px 0 0 #8f6423;
}

#foReservations .premium-web-review-card-head {
  display: grid;
  gap: 5px;
}

#foReservations .premium-web-review-card-head strong {
  color: #111827;
  font-size: 18px;
  line-height: 1.1;
  letter-spacing: -0.025em;
}

#foReservations .premium-web-review-card-head small {
  color: #667085;
  font-size: 12px;
}

#foReservations .premium-web-review-kv {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

#foReservations .premium-web-review-kv span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #eee8dd;
  border-radius: 12px;
  background: #fbfaf7;
}

#foReservations .premium-web-review-kv small {
  color: #667085;
  font-size: 11px;
}

#foReservations .premium-web-review-kv strong {
  color: #111827;
  font-size: 13px;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

#foReservations .premium-web-review-warning {
  min-height: 46px;
  padding: 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.22;
}

#foReservations .premium-web-review-warning.warn {
  color: #7a5415;
  background: #fff5dd;
  border: 1px solid #f5d99a;
}

#foReservations .premium-web-review-warning.ready {
  color: #10764b;
  background: #eaf7f1;
  border: 1px solid #cdeadd;
}

#foReservations .premium-web-review-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

#foReservations .premium-web-review-actions .primary-button,
#foReservations .premium-web-review-actions .ghost-button {
  min-height: 38px;
  border-radius: 11px;
}

#foReservations .premium-web-review-actions .primary-button {
  color: #151b26;
  border: 0;
  background: linear-gradient(135deg, #b88a44, #d4af6a);
  box-shadow: 0 8px 18px rgba(184, 138, 68, 0.18);
}

#foReservations .premium-web-review-empty {
  grid-column: 1 / -1;
  min-height: 140px;
  place-content: center;
  text-align: center;
}

@media (max-width: 1180px) {
  #foReservations .premium-fo-summary,
  #foReservations .premium-web-review-summary,
  #foReservations .premium-web-review-grid {
    grid-template-columns: 1fr;
  }
}

.direct-review-card {
  width: 100%;
  border: 1px solid rgba(182, 145, 72, 0.36);
  border-radius: 16px;
  background: #fffdf7;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
  padding: 14px;
  gap: 12px;
}

.direct-review-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}

.direct-review-title strong {
  font-size: 18px;
  color: var(--primary-dark);
}

.direct-review-title span {
  color: var(--muted);
  font-size: 12px;
}

.direct-review-detail-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 10px;
  width: 100%;
}

.direct-review-detail-grid span {
  display: grid;
  gap: 3px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 12px;
  background: #ffffff;
  padding: 10px 12px;
}

.direct-review-detail-grid small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.direct-review-detail-grid strong {
  color: var(--text);
  font-size: 14px;
  white-space: normal;
  word-break: break-word;
}

#foReservations table.web-review-table .direct-review-card {
  box-sizing: border-box;
  padding: 8px 10px;
  gap: 6px;
  border-radius: 10px;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
}

#foReservations table.web-review-table .direct-review-detail-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

#foReservations table.web-review-table .direct-review-detail-grid span {
  padding: 6px 8px;
  border-radius: 8px;
}

#foReservations table.web-review-table .direct-review-detail-grid small {
  font-size: 10px;
}

#foReservations table.web-review-table .direct-review-detail-grid strong {
  font-size: 13px;
}

#foReservations table.web-review-table .direct-review-meta,
#foReservations table.web-review-table .direct-review-badges,
#foReservations table.web-review-table .direct-review-warnings,
#foReservations table.web-review-table .direct-review-ready {
  gap: 5px;
  font-size: 12px;
}

#foReservations table.web-review-table .direct-review-title strong {
  font-size: 16px;
}

#foReservations table.web-review-table .direct-review-actions {
  justify-content: flex-start;
}

#foReservations table.web-review-table .direct-review-actions .ghost-button {
  flex: 0 1 130px;
}

.direct-review-actions {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  width: 100%;
}

.direct-review-actions .ghost-button {
  min-width: 96px;
  min-height: 36px;
  font-size: 13px;
}

.direct-review-actions .ghost-button:disabled {
  opacity: 0.52;
  cursor: not-allowed;
}

.inline-action-cell {
  display: grid;
  gap: 5px;
}

.reservation-row-action {
  align-content: center;
  gap: 4px;
  line-height: 1.25;
}

.reservation-row-action > strong {
  font-size: 13px;
  line-height: 1.2;
}

.reservation-row-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 8px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.reservation-row-meta span {
  max-width: 210px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.reservation-row-action .ghost-button {
  justify-self: start;
  min-height: 28px;
  padding: 0 8px;
  line-height: 1;
}

.inline-action-cell > div {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.inline-action-cell .ghost-button {
  min-height: 30px;
  padding: 0 8px;
  font-size: 12px;
}

.inline-action-cell small {
  color: var(--muted);
}

#foReservations .status,
#foReservations .table-sort {
  white-space: nowrap;
}

#foReservations .status {
  padding: 5px 9px;
  font-size: 12px;
}

.setup-tabs button {
  min-height: 38px;
  border: 0;
  border-radius: 7px;
  padding: 0 14px;
  background: transparent;
  color: #475569;
  font-weight: 800;
  white-space: nowrap;
}

.setup-tabs button.active {
  background: #243045;
  color: #ffffff;
}

#setup.setup-command-center {
  --setup-navy: #07111f;
  --setup-navy-2: #0b1728;
  --setup-gold: #d7b56e;
  --setup-gold-2: #f3d794;
  --setup-ink: #f8fafc;
  --setup-muted: #aebdd2;
  --setup-soft: #8494aa;
  --setup-line: rgba(255, 255, 255, 0.105);
  --setup-gold-line: rgba(215, 181, 110, 0.26);
  max-width: 100%;
  overflow-x: hidden;
  padding: 26px 30px 34px;
  color: var(--setup-ink);
  background:
    radial-gradient(circle at 16% 0%, rgba(215, 181, 110, 0.18), transparent 30rem),
    radial-gradient(circle at 94% 8%, rgba(130, 181, 255, 0.13), transparent 24rem),
    linear-gradient(135deg, #07111f 0%, #0b1728 48%, #13243d 100%);
}

#setup.setup-command-center .setup-command-shell,
#setup.setup-command-center .setup-hero-main,
#setup.setup-command-center .setup-hero-side,
#setup.setup-command-center .setup-metric-card,
#setup.setup-command-center .setup-guardrail-grid,
#setup.setup-command-center .panel,
#setup.setup-command-center .table-wrap,
#setup.setup-command-center .setup-tab-panel {
  min-width: 0;
  max-width: 100%;
}

#setup.setup-command-center .setup-command-shell {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(215, 181, 110, 0.24);
  border-radius: 34px;
  padding: 24px;
  background:
    radial-gradient(circle at 12% 0%, rgba(215, 181, 110, 0.18), transparent 32%),
    radial-gradient(circle at 88% 4%, rgba(130, 181, 255, 0.13), transparent 30%),
    linear-gradient(145deg, rgba(9, 23, 41, 0.98), rgba(6, 14, 25, 0.96));
  box-shadow: 0 30px 90px rgba(5, 12, 22, 0.36);
}

#setup.setup-command-center .setup-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.75fr);
  gap: 18px;
  margin-bottom: 16px;
}

#setup.setup-command-center .setup-hero-main,
#setup.setup-command-center .setup-hero-side,
#setup.setup-command-center .setup-metric-card,
#setup.setup-command-center .setup-guardrail-grid,
#setup.setup-command-center .panel {
  border: 1px solid var(--setup-line);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.074), rgba(255, 255, 255, 0.038));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 22px 62px rgba(0, 0, 0, 0.20);
}

#setup.setup-command-center .setup-hero-main {
  position: relative;
  overflow: hidden;
  border-radius: 30px;
  padding: 26px;
}

#setup.setup-command-center .setup-hero-main::after {
  content: "";
  position: absolute;
  top: -96px;
  right: -78px;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(215, 181, 110, 0.24), transparent 68%);
  pointer-events: none;
}

#setup.setup-command-center .eyebrow {
  color: var(--setup-gold-2);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

#setup.setup-command-center .setup-hero-main h2 {
  position: relative;
  margin: 9px 0 12px;
  color: #ffffff;
  font-size: clamp(38px, 4.2vw, 60px);
  line-height: 0.94;
  letter-spacing: -0.06em;
}

#setup.setup-command-center .setup-hero-main p {
  position: relative;
  max-width: 820px;
  margin: 0;
  color: #c9d4e5;
  font-size: 16px;
  line-height: 1.62;
}

#setup.setup-command-center .setup-hero-tags {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

#setup.setup-command-center .setup-hero-tags span,
#setup.setup-command-center .setup-tabs button,
#setup.setup-command-center .reservation-tabs button {
  border-radius: 999px;
  white-space: nowrap;
}

#setup.setup-command-center .setup-hero-tags span {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 0 13px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  background: rgba(255, 255, 255, 0.07);
  color: #d9e5f5;
  font-size: 12px;
  font-weight: 950;
}

#setup.setup-command-center .setup-hero-tags span:first-child {
  border-color: rgba(215, 181, 110, 0.38);
  background: rgba(215, 181, 110, 0.16);
  color: #ffe3a3;
}

#setup.setup-command-center .setup-hero-side {
  display: grid;
  gap: 12px;
  border-radius: 26px;
  padding: 18px;
}

#setup.setup-command-center .setup-hero-side div {
  display: grid;
  gap: 7px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 18px;
  background: rgba(5, 11, 20, 0.32);
  padding: 15px;
}

#setup.setup-command-center .setup-hero-side span,
#setup.setup-command-center .setup-metric-card span,
#setup.setup-command-center .setup-guardrail-grid small,
#setup.setup-command-center .panel-note,
#setup.setup-command-center .setup-header > span,
#setup.setup-command-center .empty-module p,
#setup.setup-command-center .cyotel-about-card p,
#setup.setup-command-center .cyotel-about-card dt {
  color: var(--setup-muted);
}

#setup.setup-command-center .setup-hero-side strong {
  color: #ffffff;
  font-size: 23px;
  letter-spacing: -0.035em;
}

#setup.setup-command-center .setup-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}

#setup.setup-command-center .setup-metric-card {
  display: grid;
  gap: 8px;
  border-radius: 22px;
  padding: 16px;
}

#setup.setup-command-center .setup-metric-card strong {
  color: #ffffff;
  font-size: clamp(22px, 2.5vw, 32px);
  letter-spacing: -0.05em;
}

#setup.setup-command-center .setup-metric-card small {
  color: var(--setup-soft);
  line-height: 1.38;
}

#setup.setup-command-center .setup-guardrail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
  border-color: var(--setup-gold-line);
  border-radius: 24px;
  padding: 14px;
}

#setup.setup-command-center .setup-guardrail-grid div {
  display: grid;
  gap: 7px;
  border: 1px solid rgba(215, 181, 110, 0.16);
  border-radius: 18px;
  background: rgba(215, 181, 110, 0.07);
  padding: 14px;
}

#setup.setup-command-center .setup-guardrail-grid strong {
  color: #ffe3a3;
}

#setup.setup-command-center .setup-header {
  align-items: flex-start;
  margin-bottom: 14px;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.064), rgba(255, 255, 255, 0.034)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.065);
}

#setup.setup-command-center .setup-header h2 {
  margin: 5px 0 0;
  color: #ffffff;
  font-size: clamp(28px, 3vw, 40px);
  letter-spacing: -0.045em;
}

#setup.setup-command-center .setup-tabs,
#setup.setup-command-center .reservation-tabs {
  flex-wrap: wrap;
  gap: 9px;
  overflow-x: hidden;
  margin-bottom: 16px;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.045);
}

#setup.setup-command-center .setup-tabs button,
#setup.setup-command-center .reservation-tabs button {
  min-height: 38px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  background: rgba(255, 255, 255, 0.06);
  color: #cbd5e1;
  padding: 0 14px;
  font-weight: 850;
}

#setup.setup-command-center .setup-tabs button.active,
#setup.setup-command-center .reservation-tabs button.active {
  border-color: transparent;
  background: linear-gradient(135deg, #f3d794, #b88a44);
  color: #091422;
  box-shadow: 0 12px 26px rgba(184, 138, 68, 0.22);
}

#setup.setup-command-center .panel {
  border-radius: 26px;
  padding: 20px;
}

#setup.setup-command-center .panel-header {
  align-items: flex-start;
  margin-bottom: 16px;
  padding: 0 0 12px;
  border: 0 !important;
  border-bottom: 1px solid rgba(215, 181, 110, 0.16) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#setup.setup-command-center .panel-header h3,
#setup.setup-command-center .cyotel-about-card h4,
#setup.setup-command-center .empty-module strong {
  color: #ffffff;
}

#setup.setup-command-center .panel-header h3 {
  font-size: 24px;
  letter-spacing: -0.035em;
}

#setup.setup-command-center .setup-form label,
#setup.setup-command-center .weekday-picker > span {
  color: #c6d3e6;
  font-size: 12px;
  font-weight: 900;
}

#setup.setup-command-center input,
#setup.setup-command-center textarea,
#setup.setup-command-center select {
  min-width: 0;
  border: 1px solid rgba(215, 181, 110, 0.22);
  border-radius: 15px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.045));
  color: #f8fafc;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#setup.setup-command-center input::placeholder,
#setup.setup-command-center textarea::placeholder {
  color: rgba(203, 213, 225, 0.62);
}

#setup.setup-command-center .table-wrap,
#setup.setup-command-center .rate-matrix,
#setup.setup-command-center .weekday-picker,
#setup.setup-command-center .empty-module,
#setup.setup-command-center .cyotel-about-card {
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 20px;
  background: rgba(5, 11, 20, 0.28);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

#setup.setup-command-center .table-wrap {
  overflow-x: auto;
}

#setup.setup-command-center table {
  border-collapse: separate;
  border-spacing: 0 9px;
}

#setup.setup-command-center th {
  padding: 9px 12px;
  border-top: 1px solid rgba(215, 181, 110, 0.18);
  border-bottom: 1px solid rgba(215, 181, 110, 0.18);
  background: rgba(215, 181, 110, 0.08);
  color: #f3d794;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.11em;
}

#setup.setup-command-center th:first-child {
  border-left: 1px solid rgba(215, 181, 110, 0.18);
  border-radius: 12px 0 0 12px;
}

#setup.setup-command-center th:last-child {
  border-right: 1px solid rgba(215, 181, 110, 0.18);
  border-radius: 0 12px 12px 0;
}

#setup.setup-command-center td {
  padding: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.055);
  color: #eaf1fb;
  font-weight: 750;
}

#setup.setup-command-center td:first-child {
  border-left: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 15px 0 0 15px;
}

#setup.setup-command-center td:last-child {
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0 15px 15px 0;
}

#setup.setup-command-center .primary-button {
  border: 0;
  background: linear-gradient(135deg, #f3d794, #b88a44);
  color: #091422;
  box-shadow: 0 14px 28px rgba(184, 138, 68, 0.24);
}

#setup.setup-command-center .ghost-button {
  border-color: rgba(215, 181, 110, 0.28);
  background: rgba(215, 181, 110, 0.08);
  color: #ffe3a3;
}

#setup.setup-command-center .cards-grid > *,
#setup.setup-command-center #boardCards > * {
  border-color: rgba(255, 255, 255, 0.10);
  background: rgba(255, 255, 255, 0.055);
  color: #eaf1fb;
}

.main:has(#setup.setup-command-center.active) .topbar {
  border-color: rgba(215, 181, 110, 0.20);
  background: linear-gradient(135deg, rgba(7, 17, 31, 0.96), rgba(15, 29, 51, 0.94));
  color: #f8fafc;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.20);
}

.main:has(#setup.setup-command-center.active) .topbar .muted {
  color: #f3d794;
}

.main:has(#setup.setup-command-center.active) .topbar h1,
.main:has(#setup.setup-command-center.active) .topbar h2,
.main:has(#setup.setup-command-center.active) .topbar h3,
.main:has(#setup.setup-command-center.active) .topbar strong,
.main:has(#setup.setup-command-center.active) .topbar b {
  color: #f8fafc;
}

.main:has(#setup.setup-command-center.active) .topbar p,
.main:has(#setup.setup-command-center.active) .topbar span {
  color: #aebdd2;
}

@media (max-width: 1180px) {
  #setup.setup-command-center .setup-hero-grid,
  #setup.setup-command-center .setup-metric-grid,
  #setup.setup-command-center .setup-guardrail-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 760px) {
  #setup.setup-command-center {
    padding: 16px;
  }

  #setup.setup-command-center .setup-command-shell {
    padding: 16px;
    border-radius: 24px;
  }

  #setup.setup-command-center .setup-hero-grid,
  #setup.setup-command-center .setup-metric-grid,
  #setup.setup-command-center .setup-guardrail-grid,
  #setup.setup-command-center .split-panel {
    grid-template-columns: 1fr;
  }
}

.accounting-control-panel,
.report-filter-panel {
  margin-bottom: 16px;
}

.accounting-controls,
.report-controls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 12px;
  align-items: end;
}

.exchange-rate-note {
  margin: 12px 18px 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.report-controls {
  grid-template-columns: 180px 180px auto;
}

.log-filter-panel {
  display: grid;
  grid-template-columns: 170px 170px minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
  align-items: end;
  padding: 0 18px 18px;
}

#logs {
  max-width: 100%;
  overflow-x: hidden;
  color: #f5f8ff;
}

#logs .logs-command-shell,
#logs .logs-hero-main,
#logs .logs-hero-side,
#logs .logs-metric-card,
#logs .logs-table-panel,
#logs .logs-insight-panel,
#logs .log-filter-panel,
#logs .table-wrap {
  min-width: 0;
  max-width: 100%;
}

#logs .logs-command-shell {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(215, 181, 110, 0.24);
  border-radius: 28px;
  padding: 18px;
  background:
    radial-gradient(circle at 13% 0%, rgba(215, 181, 110, 0.18), transparent 32%),
    radial-gradient(circle at 86% 2%, rgba(130, 181, 255, 0.14), transparent 30%),
    linear-gradient(145deg, rgba(9, 23, 41, 0.98), rgba(6, 14, 25, 0.96));
  box-shadow: 0 30px 90px rgba(5, 12, 22, 0.36);
}

#logs .logs-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 0.34fr);
  gap: 14px;
  margin-bottom: 14px;
}

#logs .logs-hero-main,
#logs .logs-hero-side,
#logs .logs-metric-card,
#logs .logs-table-panel,
#logs .logs-insight-panel {
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.062), rgba(255, 255, 255, 0.034));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

#logs .logs-hero-main {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  padding: 18px;
}

#logs .logs-hero-main::after {
  content: "";
  position: absolute;
  top: -84px;
  right: -72px;
  width: 270px;
  height: 270px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(245, 210, 138, 0.18), transparent 66%);
  pointer-events: none;
}

#logs .logs-eyebrow {
  margin: 0 0 8px;
  color: #f5d28a;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

#logs h3,
#logs h4 {
  color: #ffffff;
}

#logs .logs-hero-main h3 {
  position: relative;
  z-index: 1;
  margin: 0;
  font-size: clamp(22px, 2.1vw, 29px);
  line-height: 1.08;
  letter-spacing: -0.035em;
}

#logs .logs-hero-main p:not(.logs-eyebrow) {
  position: relative;
  z-index: 1;
  max-width: 720px;
  margin: 9px 0 0;
  color: #c9d6ea;
  font-size: 13px;
  line-height: 1.42;
}

#logs .logs-hero-side {
  border-radius: 22px;
  padding: 14px;
  display: grid;
  gap: 10px;
}

#logs .logs-signal-card {
  padding: 12px;
  border-radius: 15px;
  background: rgba(5, 12, 22, 0.54);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

#logs .logs-signal-card span,
#logs .logs-signal-card small,
#logs .logs-panel-head span,
#logs .logs-metric-card span,
#logs .logs-insight-list p {
  color: #9daec7;
}

#logs .logs-signal-card span,
#logs .logs-metric-card small {
  display: block;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#logs .logs-signal-card strong {
  display: block;
  color: #72e0ad;
  font-size: 20px;
  letter-spacing: -0.03em;
}

#logs .logs-signal-card.warn strong {
  color: #ffbf73;
}

#logs .logs-filter-deck {
  position: relative;
  z-index: 1;
  grid-template-columns: repeat(4, minmax(118px, 1fr));
  gap: 8px;
  align-items: end;
  margin-top: 14px;
  padding: 10px;
  border: 1px solid rgba(245, 210, 138, 0.13);
  border-radius: 18px;
  background: rgba(5, 12, 22, 0.28);
}

#logs .logs-filter-deck > *,
#logs .logs-filter-deck input,
#logs .logs-filter-deck select {
  min-width: 0;
  width: 100%;
}

#logs .logs-filter-deck label {
  color: #b6c6dd;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#logs .logs-filter-deck input,
#logs .logs-filter-deck select {
  min-height: 36px;
  margin-top: 5px;
  border-color: rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  background: rgba(5, 12, 22, 0.68);
  color: #f5f8ff;
  font-size: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#logs .logs-clear-button {
  grid-column: 1 / -1;
  justify-self: start;
  width: auto;
  max-width: 100%;
  min-height: 36px;
  padding: 0 16px;
  border: 0;
  border-radius: 12px;
  background: linear-gradient(135deg, #f1d492, #b88a3e);
  color: #142033;
  font-size: 12px;
  font-weight: 950;
  box-shadow: 0 12px 26px rgba(215, 181, 110, 0.16);
}

#logs .logs-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

#logs .logs-metric-card {
  min-height: 102px;
  border-radius: 19px;
  padding: 14px;
}

#logs .logs-metric-card small {
  color: #9daec7;
}

#logs .logs-metric-card strong {
  display: block;
  margin-bottom: 7px;
  color: #ffffff;
  font-size: 21px;
  letter-spacing: -0.035em;
}

#logs .logs-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
}

#logs .logs-table-panel,
#logs .logs-insight-panel {
  border-radius: 26px;
  padding: 18px;
}


#logs .logs-table-panel {
  grid-column: 1 / -1;
}

#logs .logs-export-button {
  min-height: 38px;
  white-space: nowrap;
}

#logs .logs-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 14px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(245, 210, 138, 0.14);
  background: linear-gradient(135deg, rgba(10, 23, 40, 0.95), rgba(6, 14, 25, 0.92));
}

#logs .logs-panel-head.compact {
  display: block;
}

#logs .logs-panel-head h4 {
  margin: 0 0 4px;
  font-size: 19px;
  letter-spacing: -0.02em;
}

#logs .logs-panel-head span {
  font-size: 12px;
}

#logs .logs-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

#logs .logs-chip-row span {
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(215, 181, 110, 0.26);
  background: rgba(215, 181, 110, 0.08);
  color: #f5d28a;
  font-size: 12px;
  font-weight: 900;
}

#logs .logs-export-button {
  min-height: 32px;
  padding: 0 14px;
  border: 1px solid rgba(215, 181, 110, 0.36);
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(241, 212, 146, 0.20), rgba(184, 138, 62, 0.16));
  color: #f8dfaa;
  font-size: 12px;
  font-weight: 950;
  white-space: nowrap;
}

#logs .logs-export-button:hover {
  background: linear-gradient(135deg, #f1d492, #b88a3e);
  color: #142033;
}

#logs .log-table-wrap {
  max-height: 620px;
  overflow: auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  scrollbar-color: rgba(215, 181, 110, 0.42) rgba(6, 14, 25, 0.9);
}

#logs .log-table {
  border-collapse: separate;
  border-spacing: 0 8px;
}

#logs .log-table th {
  padding: 0 12px 4px;
  color: #b6c6dd;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#logs .log-table td {
  padding: 13px 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.065);
  border-bottom: 1px solid rgba(255, 255, 255, 0.065);
  background: rgba(8, 18, 32, 0.90);
  color: #dce6f6;
  font-size: 13px;
  vertical-align: top;
}

#logs .log-table td:first-child {
  border-left: 1px solid rgba(255, 255, 255, 0.065);
  border-radius: 14px 0 0 14px;
  color: #ffffff;
  font-weight: 900;
  white-space: nowrap;
}

#logs .log-table td:last-child {
  border-right: 1px solid rgba(255, 255, 255, 0.065);
  border-radius: 0 14px 14px 0;
}

#logs .logs-insight-list {
  display: grid;
  gap: 12px;
}

#logs .logs-insight-list article {
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 18px;
  background: rgba(6, 14, 25, 0.58);
}

#logs .logs-insight-list strong {
  display: block;
  margin-bottom: 6px;
  color: #ffffff;
}

#logs .logs-insight-list p {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
}

@media (max-width: 1320px) {
  #logs .logs-hero-grid,
  #logs .logs-content-grid {
    grid-template-columns: 1fr;
  }

  #logs .logs-filter-deck {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #logs .logs-clear-button {
    width: 100%;
  }
}

@media (max-width: 1180px) {
  #logs .logs-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  #logs .logs-command-shell {
    padding: 16px;
    border-radius: 24px;
  }

  #logs .logs-filter-deck,
  #logs .logs-metric-grid {
    grid-template-columns: 1fr;
  }

  #logs .logs-clear-button {
    width: 100%;
  }
}

.availability-controls {
  display: grid;
  grid-template-columns: 190px 190px auto;
  gap: 12px;
  align-items: end;
  padding: 0 18px 18px;
}

.availability-total-row {
  background: #f1f5f9;
  font-weight: 900;
}

.setup-tab-panel,
.frontoffice-tab-panel,
.accounting-tab-panel,
.reservation-card-panel {
  display: none;
}

.setup-tab-panel.active,
.frontoffice-tab-panel.active,
.accounting-tab-panel.active,
.reservation-card-panel.active {
  display: block;
}

.reservation-tabs,
.reservation-subtabs {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 6px 0;
  background: #ffffff;
}

.compact-tabs {
  padding-top: 0;
}

.reservation-tabs button,
.reservation-subtabs button {
  min-height: 28px;
  border: 0;
  border-radius: 7px;
  padding: 0 12px;
  background: #eef2f7;
  color: #475569;
  font-weight: 800;
  white-space: nowrap;
}

.reservation-tabs button.active,
.reservation-subtabs button.active {
  background: var(--accent);
  color: #ffffff;
}

.toolbar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.danger-action {
  color: #991b1b;
}

.frontoffice-filters {
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
}

.frontoffice-filters input {
  width: min(520px, 100%);
}

.selected-row {
  background: #e7f6f4;
}

#foPlan .panel {
  border: 1px solid rgba(227, 221, 210, 0.92);
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(251, 250, 247, 0.98)),
    radial-gradient(circle at top right, rgba(184, 138, 68, 0.12), transparent 34%);
  box-shadow: 0 20px 60px rgba(16, 24, 39, 0.08);
}

#foPlan .panel-header {
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 14px;
  padding: 2px 2px 12px;
  border-bottom: 1px solid rgba(227, 221, 210, 0.72);
}

#foPlan .panel-header h3 {
  margin: 0;
  color: #101827;
  font-size: clamp(24px, 2.1vw, 34px);
  letter-spacing: -0.045em;
}

#foPlan .toolbar {
  gap: 8px;
}

#foPlan .toolbar .ghost-button {
  min-height: 36px;
  border-radius: 999px;
  box-shadow: none;
}

.room-plan-controls {
  display: grid;
  grid-template-columns: 180px 100px minmax(180px, 1fr) 220px;
  gap: 12px;
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid rgba(227, 221, 210, 0.82);
  border-radius: 20px;
  background: linear-gradient(180deg, #ffffff, #f7f2ea);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.room-plan-controls label {
  color: #667085;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.room-plan-controls input,
.room-plan-controls select {
  min-height: 40px;
  border-radius: 14px;
  border-color: rgba(148, 163, 184, 0.28);
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(16, 24, 39, 0.03);
}

.room-plan-controls input:focus,
.room-plan-controls select:focus {
  border-color: rgba(184, 138, 68, 0.64);
  box-shadow: 0 0 0 4px rgba(184, 138, 68, 0.12);
}

.room-plan-wrap {
  overflow: auto;
  border: 1px solid #e3ddd2;
  border-radius: 22px;
  background: linear-gradient(180deg, #ffffff, #f8f5ef);
  box-shadow: 0 18px 46px rgba(16, 24, 39, 0.08);
}

.room-plan-grid {
  min-width: 980px;
  overflow: hidden;
  border-radius: 22px;
}

.room-plan-header,
.room-plan-row {
  display: grid;
  grid-template-columns: 210px minmax(720px, 1fr);
}

.room-plan-corner,
.room-plan-room {
  position: sticky;
  left: 0;
  z-index: 4;
  display: grid;
  align-content: center;
  gap: 4px;
  border-right: 1px solid rgba(227, 221, 210, 0.92);
  background: linear-gradient(180deg, #fffdf8, #f8f3ea);
  box-shadow: 8px 0 18px rgba(16, 24, 39, 0.04);
}

.room-plan-corner {
  min-height: 208px;
  padding: 18px;
  color: #ffffff;
  background: linear-gradient(135deg, #101827, #202b42);
}

.room-plan-room {
  min-height: 54px;
  padding: 8px 14px;
  border-top: 1px solid rgba(227, 221, 210, 0.92);
}

.room-plan-room strong {
  color: #101827;
  font-size: 16px;
  letter-spacing: -0.025em;
}

.room-plan-corner strong {
  color: #ffffff;
  font-size: 18px;
  letter-spacing: -0.03em;
}

.room-plan-corner span,
.room-plan-room span {
  color: #64748b;
  font-size: 13px;
  font-weight: 800;
}

.room-plan-corner span {
  color: #cbd5e1;
}

.room-plan-days {
  position: relative;
  display: grid;
  grid-template-rows: 38px 118px 52px;
  border-bottom: 1px solid rgba(227, 221, 210, 0.92);
  background: #ffffff;
}

.room-plan-month {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  color: #344054;
  font-weight: 900;
  background: linear-gradient(180deg, #fffdf8, #f4eee3);
  border-bottom: 1px solid rgba(227, 221, 210, 0.72);
  letter-spacing: -0.02em;
}

.occupancy-cell {
  grid-row: 2;
  display: grid;
  place-items: end center;
  padding: 6px;
}

.occupancy-bar {
  position: relative;
  display: grid;
  align-items: start;
  justify-items: center;
  width: 46px;
  height: 98px;
  overflow: hidden;
  border: 1px solid rgba(184, 138, 68, 0.34);
  border-radius: 14px;
  background: linear-gradient(180deg, #fff8df, #f7e7b7);
  color: #243045;
  font-weight: 900;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 10px 22px rgba(16,24,39,.08);
}

.available-count {
  position: relative;
  z-index: 2;
  padding-top: 8px;
}

.sold-count {
  position: absolute;
  right: 0;
  bottom: 3px;
  left: 0;
  z-index: 3;
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
  text-align: center;
  text-shadow: 0 1px 2px rgba(15, 23, 42, 0.65);
}

.sold-fill {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  min-height: 18px;
  background: #5b8cff;
}

.plan-day {
  grid-row: 3;
  display: grid;
  place-items: center;
  align-content: center;
  min-height: 52px;
  border-top: 1px solid rgba(227, 221, 210, 0.86);
  color: #667085;
  background: #ffffff;
  font-weight: 800;
}

.plan-day.weekend {
  background: #f5eee5;
  color: #9f3a2f;
}

.plan-day strong {
  color: inherit;
  font-size: 18px;
}

.plan-day span {
  font-size: 12px;
}

.room-plan-timeline {
  position: relative;
  display: grid;
  min-height: 54px;
  background: #ffffff;
}

.room-plan-row:nth-child(even) .room-plan-timeline {
  background: rgba(251, 250, 247, 0.62);
}

.plan-cell {
  grid-row: 1;
  min-height: 54px;
  border-top: 1px solid rgba(203, 213, 225, 0.82);
}

.plan-cell-left {
  border-right: 1px solid rgba(215, 221, 231, 0.92);
}

.plan-cell-right {
  border-right: 2px solid rgba(184, 194, 211, 0.92);
}

.plan-cell:hover {
  background: rgba(184, 138, 68, 0.08);
}

body.theme-dark #frontoffice.setup-workspace #foPlan .panel,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .panel {
  background:
    radial-gradient(circle at 92% 0%, rgba(215, 181, 110, 0.10), transparent 28%),
    linear-gradient(145deg, rgba(9, 21, 39, 0.99), rgba(4, 12, 24, 1)) !important;
  border-color: rgba(215, 181, 110, 0.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 22px 58px rgba(0,0,0,.26) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .panel-header,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .panel-header {
  background: linear-gradient(180deg, rgba(8, 19, 36, 0.76), rgba(8, 19, 36, 0)) !important;
  border-bottom-color: rgba(215, 181, 110, 0.18) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .panel-header h3,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .panel-header h3 {
  color: #f8fbff !important;
  text-shadow: 0 8px 26px rgba(0,0,0,.30) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .toolbar .ghost-button,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .toolbar .ghost-button {
  background: linear-gradient(145deg, rgba(18, 32, 54, 0.96), rgba(8, 17, 32, 0.96)) !important;
  color: #fff7dc !important;
  border-color: rgba(215, 181, 110, 0.22) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 22px rgba(0,0,0,.18) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-controls,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-controls {
  background: linear-gradient(145deg, rgba(12, 25, 43, 0.95), rgba(6, 15, 29, 0.96)) !important;
  border-color: rgba(215, 181, 110, 0.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 14px 30px rgba(0,0,0,.22) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-controls label,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-controls label {
  color: rgba(218, 230, 247, 0.76) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-controls input,
body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-controls select,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-controls input,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-controls select {
  background: rgba(7, 16, 31, 0.96) !important;
  color: #f8fbff !important;
  -webkit-text-fill-color: #f8fbff !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 8px 18px rgba(0,0,0,.18) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-wrap,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-wrap {
  background: linear-gradient(180deg, rgba(8, 19, 36, 0.98), rgba(5, 13, 26, 0.98)) !important;
  border-color: rgba(215, 181, 110, 0.16) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.24) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-days,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-days {
  background: rgba(8, 19, 36, 0.96) !important;
  border-bottom-color: rgba(255,255,255,.08) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-month,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-month {
  background: linear-gradient(180deg, rgba(12, 25, 43, 0.96), rgba(7, 16, 31, 0.96)) !important;
  color: #f8fbff !important;
  border-bottom-color: rgba(215, 181, 110, 0.16) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-room,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-room {
  background: linear-gradient(180deg, rgba(10, 22, 39, 0.98), rgba(6, 15, 29, 0.98)) !important;
  border-top-color: rgba(255,255,255,.08) !important;
  border-right-color: rgba(215, 181, 110, 0.16) !important;
  box-shadow: 8px 0 18px rgba(0,0,0,.16) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-room strong,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-room strong {
  color: #f8fbff !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-room span,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-room span {
  color: rgba(218, 230, 247, 0.68) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .plan-day,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .plan-day {
  background: rgba(9, 21, 39, 0.94) !important;
  color: rgba(218, 230, 247, 0.72) !important;
  border-top-color: rgba(255,255,255,.08) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .plan-day.weekend,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .plan-day.weekend {
  background: rgba(52, 18, 28, 0.54) !important;
  color: #ffb4b4 !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-timeline,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-timeline {
  background: rgba(7, 16, 31, 0.96) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .room-plan-row:nth-child(even) .room-plan-timeline,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .room-plan-row:nth-child(even) .room-plan-timeline {
  background: rgba(10, 22, 39, 0.96) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .plan-cell,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .plan-cell {
  border-top-color: rgba(255,255,255,.075) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .plan-cell-left,
body.theme-dark #frontoffice.setup-workspace #foPlan .plan-cell-right,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .plan-cell-left,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .plan-cell-right {
  border-right-color: rgba(255,255,255,.075) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .plan-cell:hover,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .plan-cell:hover {
  background: rgba(215, 181, 110, 0.10) !important;
}

body.theme-dark #frontoffice.setup-workspace #foPlan .occupancy-bar,
body:not(.theme-light) #frontoffice.setup-workspace #foPlan .occupancy-bar {
  background: linear-gradient(180deg, rgba(255, 226, 153, 0.96), rgba(194, 143, 58, 0.74)) !important;
  color: #0b1728 !important;
  border-color: rgba(215, 181, 110, 0.40) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.38), 0 10px 22px rgba(0,0,0,.22) !important;
}

.plan-booking {
  position: relative;
  z-index: 2;
  grid-row: 1;
  align-self: center;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  min-height: 30px;
  margin: 0 6px;
  border: 1px solid rgba(16, 24, 39, 0.08);
  border-radius: 999px;
  padding: 0 10px;
  background: linear-gradient(135deg, #f87171, #fca5a5);
  color: #111827;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.16);
  cursor: grab;
}

.plan-room-block {
  position: relative;
  z-index: 1;
  grid-row: 1;
  align-self: stretch;
  display: grid;
  place-items: center;
  margin: 4px 2px;
  border-radius: 6px;
  background: #111827;
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
}

.plan-booking.balanced {
  background: #2dd4bf;
}

.plan-booking.credit {
  background: #a7f3d0;
}

.plan-booking.debt {
  background: #fca5a5;
}

.plan-booking.locked {
  cursor: not-allowed;
  opacity: 0.72;
  filter: saturate(0.7);
}

.plan-booking span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plan-booking small {
  border-radius: 999px;
  padding: 3px 8px;
  background: rgba(255, 255, 255, 0.78);
  color: #111827;
  font-weight: 900;
}

.plan-tooltip {
  position: absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  z-index: 20;
  display: none;
  width: 280px;
  transform: translateX(-50%);
  border-radius: 8px;
  padding: 14px;
  background: rgba(36, 48, 69, 0.94);
  color: #ffffff;
  text-align: left;
  box-shadow: var(--shadow);
  pointer-events: none;
}

.plan-booking:hover .plan-tooltip {
  display: grid;
  gap: 6px;
}

.plan-booking:active .plan-tooltip,
.plan-booking.is-dragging .plan-tooltip {
  display: none;
}

.plan-tooltip span {
  white-space: normal;
  color: #e5e7eb;
}

.room-plan-empty {
  padding: 24px;
  color: #64748b;
  font-weight: 800;
}

.rack-room-card {
  display: grid;
  gap: 10px;
  min-height: 170px;
  border: 1px solid var(--line);
  border-left: 5px solid #94a3b8;
  border-radius: 8px;
  padding: 14px;
  background: #ffffff;
}

.rack-room-card.clean {
  border-left-color: var(--ok);
}

.rack-room-card.dirty {
  border-left-color: var(--warn);
}

.rack-room-card.occupied-clean {
  border-left-color: #0f766e;
  background: #f0fdfa;
}

.rack-room-card.occupied-dirty {
  border-left-color: #c2410c;
  background: #fff7ed;
}

.rack-room-card.maintenance {
  border-left-color: #111827;
}

.rack-room-card.closed {
  border-left-color: #000000;
  background: #f1f5f9;
}

.rack-room-card strong {
  color: #243045;
  font-size: 24px;
}

.rack-room-card span,
.rack-room-card p,
.rack-room-card small {
  margin: 0;
  color: #64748b;
}

.reservation-dialog {
  width: min(1260px, calc(100vw - 14px));
}

.reservation-card-form {
  max-height: none;
  overflow: visible;
  padding: 10px 14px 10px;
}

.reservation-card-form .modal-header {
  margin-bottom: 6px;
}

.reservation-card-form .modal-header h3 {
  margin: 0;
  line-height: 1.1;
}

.reservation-card-form .modal-header span {
  display: block;
  margin-top: 4px;
  color: #64748b;
  font-weight: 800;
}

.reservation-card-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px 10px;
  margin: 6px 0;
}

.reservation-card-form label {
  gap: 3px;
  font-size: 11px;
}

.reservation-card-form input,
.reservation-card-form select,
.reservation-card-form .room-picker-button {
  min-height: 30px;
  padding: 0 8px;
  border-radius: 8px;
  font-size: 12px;
}

.reservation-card-form input[type="date"],
.reservation-card-form input[type="time"] {
  min-height: 30px;
}

.reservation-card-form .modal-actions {
  position: static;
  z-index: auto;
  margin: 6px 0 0;
  padding: 4px 0 0;
  background: transparent;
}

.reservation-card-form .modal-actions button {
  min-height: 32px;
}

.reservation-card-grid input[readonly] {
  background: #f1f5f9;
  color: #243045;
  font-weight: 900;
}

.reservation-record-meta {
  display: grid;
  gap: 4px;
  margin: 6px 0 8px;
  padding: 7px 10px;
  border: 1px solid #e5e7eb;
  border-radius: 9px;
  background: #f8fafc;
  color: #475569;
}

.reservation-record-meta strong {
  color: #0b1d36;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.reservation-record-meta div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
}

.reservation-record-meta span {
  font-size: 12px;
  line-height: 1.35;
}

.reservation-record-meta.is-hidden {
  display: none;
}

.room-picker-button {
  width: 100%;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  color: #17201b;
  text-align: left;
  padding: 0 12px;
  font-weight: 900;
}

.lock-room-line {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 7px;
  color: #64748b;
  font-weight: 800;
}

.lock-room-line input {
  width: 20px;
  height: 20px;
}

.room-picker-dialog {
  width: min(900px, calc(100vw - 28px));
}

.room-picker-filters {
  margin-bottom: 16px;
}

.room-picker-notice {
  margin: 0 0 14px;
  padding: 10px 12px;
  border: 1px solid #fde68a;
  border-radius: 10px;
  background: #fffbeb;
  color: #92400e;
  font-weight: 900;
}

.room-picker-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 12px;
  max-height: 55vh;
  overflow: auto;
}

.room-picker-card {
  display: grid;
  gap: 7px;
  min-height: 112px;
  border: 1px solid var(--line);
  border-left: 5px solid #94a3b8;
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
  text-align: left;
}

.room-picker-card strong {
  font-size: 24px;
  color: #071b33;
}

.room-picker-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.room-picker-card-head em {
  padding: 4px 7px;
  border-radius: 999px;
  background: #e2e8f0;
  color: #334155;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}

.room-picker-card span {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.room-picker-card span b {
  padding: 3px 6px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 11px;
}

.room-picker-card small {
  color: #475569;
  font-weight: 800;
}

.room-picker-warning {
  color: #b45309 !important;
}

.room-picker-card.available {
  border-left-color: var(--ok);
}

.room-picker-card.dirty {
  border-left-color: var(--warn);
}

.room-picker-card.reserved,
.room-picker-card.conflict {
  border-left-color: #2563eb;
  background: #eff6ff;
}

.room-picker-card.blocked,
.room-picker-card.inactive {
  border-left-color: #64748b;
  background: #f8fafc;
}

.room-picker-card.type-mismatch {
  box-shadow: inset 0 0 0 2px #f59e0b;
}

.frontoffice-daily-bar {
  position: fixed;
  left: calc(var(--sidebar-width) + max(0px, (100vw - var(--sidebar-width) - 1500px) / 2));
  right: max(0px, (100vw - var(--sidebar-width) - 1500px) / 2);
  bottom: 0;
  z-index: 30;
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  gap: 6px;
  justify-content: center;
  width: auto;
  max-width: 1500px;
  margin: 0;
  padding: 10px 18px 14px;
  border-top: 1px solid #dfd191;
  background: #fff8dc;
  overflow-x: hidden;
  box-shadow: 0 -12px 30px rgba(7, 27, 51, 0.1);
}

.frontoffice-daily-bar article {
  min-width: 0;
  min-height: 42px;
  border: 1px solid #dfd191;
  border-radius: 6px;
  background: #fffef4;
  padding: 6px 8px;
}

.frontoffice-daily-bar span {
  display: block;
  color: #64748b;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.frontoffice-daily-bar strong {
  color: #071b33;
  font-size: 18px;
  line-height: 1.1;
}

@media (max-width: 1380px) {
  .frontoffice-daily-bar {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  .frontoffice-daily-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #frontoffice {
    padding-bottom: 170px;
  }
}

.reservation-card-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  margin-top: 6px;
}

.guest-lines {
  display: grid;
  gap: 5px;
}

.guest-line {
  display: grid;
  grid-template-columns: 30px 92px 1fr;
  gap: 6px;
  align-items: center;
}

.guest-line strong {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: #243045;
  color: #ffffff;
}

.guest-line span {
  color: #64748b;
  font-weight: 800;
}

.guest-line-button {
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 14px;
  background: #ffffff;
  color: #334155;
  text-align: left;
  font-weight: 700;
}

.guest-line-button:hover {
  border-color: var(--accent);
  color: var(--accent-strong);
}

#guestProfileDialog {
  width: min(760px, calc(100vw - 28px));
}

.pricing-summary {
  display: grid;
  gap: 6px;
  margin-bottom: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.pricing-summary strong {
  color: #243045;
  font-size: 20px;
}

.pricing-summary span {
  color: #64748b;
}

.folio-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 14px;
  margin-bottom: 12px;
  align-items: end;
}

.folio-ledger {
  display: grid;
  gap: 12px;
}

.folio-ledger tfoot th {
  background: #f8fafc;
  color: #243045;
}

.folio-fx-note {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.folio-balance {
  border-radius: 8px;
  padding: 14px;
  font-size: 18px;
  font-weight: 900;
}

.folio-balance.balanced {
  background: #dcfce7;
  color: var(--ok);
}

.folio-balance.open {
  background: #fef3c7;
  color: var(--warn);
}

.eod-panel {
  margin-bottom: 16px;
}

.eod-topline {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

.eod-topline > div {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.eod-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.eod-check-grid,
.eod-process-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 18px;
}

.eod-check,
.eod-step {
  display: grid;
  gap: 6px;
  border: 1px solid var(--line);
  border-left: 5px solid #94a3b8;
  border-radius: 8px;
  padding: 14px;
  background: #ffffff;
}

.eod-check {
  width: 100%;
  min-height: auto;
  text-align: left;
  cursor: pointer;
}

.eod-check:disabled {
  cursor: default;
  opacity: 1;
}

.eod-check strong,
.eod-step span {
  color: #243045;
}

.eod-check span,
.eod-check small {
  color: #64748b;
}

.eod-check.ok,
.eod-step.done {
  border-left-color: var(--ok);
}

.eod-check.warning {
  border-left-color: var(--warn);
}

.eod-check.blocker {
  border-left-color: var(--danger);
}

.eod-detail-panel {
  margin: 0 18px 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  overflow: hidden;
}

.eod-step {
  grid-template-columns: 36px 1fr;
  align-items: center;
}

#endofday .setup-header {
  border: 1px solid rgba(148, 116, 68, 0.18);
  border-radius: 24px;
  padding: 22px;
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 248, 225, 0.74), transparent 32%),
    linear-gradient(135deg, #fffdf8, #f8fafc);
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.08);
}

#endofday .setup-header h2 {
  color: #142033;
  letter-spacing: -0.04em;
}

#endofday .eod-panel {
  margin-bottom: 18px;
  border: 1px solid rgba(148, 116, 68, 0.2);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(255, 248, 236, 0.82)),
    radial-gradient(circle at top right, rgba(184, 134, 47, 0.12), transparent 34%);
  box-shadow: 0 22px 54px rgba(15, 23, 42, 0.09);
}

#endofday .eod-topline {
  align-items: flex-start;
  border-bottom: 1px solid rgba(148, 116, 68, 0.18);
}

#endofday .eod-topline strong {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 999px;
  padding: 9px 12px;
  color: #142033;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
}

#endofday .eod-panel > p {
  max-width: 760px;
  color: #475569;
  font-weight: 700;
  line-height: 1.55;
}

#endofday .eod-actions .primary-button {
  border-radius: 999px;
  background: linear-gradient(135deg, #162237, #30415f 58%, #b8862f);
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.18);
}

#endofday .eod-actions .ghost-button {
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
}

#endofday .panel-header {
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(148, 116, 68, 0.16);
}

#endofday .panel-header h3 {
  color: #142033;
  letter-spacing: -0.025em;
}

#endofday #eodStatusSummary {
  border-radius: 999px;
  padding: 7px 11px;
  color: #725419;
  background: #fff3c4;
  font-weight: 820;
}

#endofday .eod-check-grid,
#endofday .eod-process-grid {
  gap: 14px;
  padding: 18px 0 0;
}

#endofday .eod-check,
#endofday .eod-step {
  border: 1px solid rgba(148, 163, 184, 0.26);
  border-left-width: 5px;
  border-radius: 18px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.07);
}

#endofday .eod-check strong,
#endofday .eod-step span {
  color: #142033;
  font-weight: 860;
}

#endofday .eod-check span,
#endofday .eod-check small {
  color: #64748b;
  font-weight: 720;
}

#endofday .eod-check.ok,
#endofday .eod-step.done {
  background: linear-gradient(145deg, #ffffff, #f0fdf4);
}

#endofday .eod-check.warning {
  background: linear-gradient(145deg, #ffffff, #fff7ed);
}

#endofday .eod-check.blocker {
  background: linear-gradient(145deg, #ffffff, #fef2f2);
}

#endofday .eod-detail-panel {
  border-color: rgba(148, 163, 184, 0.24);
  border-radius: 18px;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08);
}

#endofday .metrics {
  gap: 14px;
}

#endofday .metric {
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08);
}

.eod-step strong {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  background: #e2e8f0;
  color: #243045;
}

.rate-matrix {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.rate-matrix > strong {
  color: #243045;
}

.rate-matrix-row {
  display: grid;
  grid-template-columns: minmax(140px, 0.5fr) repeat(2, minmax(160px, 1fr));
  gap: 12px;
  align-items: end;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.rate-matrix-row > span {
  color: #243045;
  font-weight: 900;
}

.weekday-picker {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.weekday-picker > span {
  width: 100%;
  color: #243045;
  font-weight: 900;
}

.weekday-picker label {
  display: inline-flex;
  grid-gap: 6px;
  gap: 6px;
  align-items: center;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #ffffff;
  color: #475569;
}

.weekday-picker input {
  min-height: auto;
}

.setup-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  padding: 18px;
}

.setup-form.compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  border-right: 1px solid var(--line);
}

.setup-form.compact-row {
  grid-template-columns: 120px 220px 1fr auto;
  align-items: end;
}

.wide-field {
  grid-column: span 2;
}

.setup-form .primary-button {
  align-self: end;
}

.split-panel {
  display: grid;
  grid-template-columns: minmax(320px, 0.42fr) 1fr;
}

.panel-note {
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
}

.empty-module {
  padding: 28px;
}

.empty-module strong {
  display: block;
  margin-bottom: 8px;
  font-size: 20px;
}

.empty-module p {
  margin: 0;
  color: #64748b;
}

.cyotel-about-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.42fr);
  gap: 20px;
  margin: 0 28px 28px;
  padding: 22px;
  border: 1px solid rgba(200, 161, 90, 0.35);
  border-radius: 8px;
  background: linear-gradient(135deg, var(--cyotel-cream), #ffffff);
}

.cyotel-about-card h4 {
  margin: 4px 0 8px;
  color: var(--cyotel-navy);
  font-family: "Cormorant Garamond", Baskerville, Georgia, serif;
  font-size: 30px;
  line-height: 1;
}

.cyotel-about-card p {
  margin: 0;
  color: #52606f;
  max-width: 620px;
}

.cyotel-about-card dl {
  display: grid;
  gap: 10px;
  margin: 0;
}

.cyotel-about-card dl div {
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(11, 29, 54, 0.06);
}

.cyotel-about-card dt {
  color: var(--cyotel-gold-dark);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.cyotel-about-card dd {
  margin: 4px 0 0;
  color: var(--cyotel-navy);
  font-weight: 900;
}

.metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.metric,
.panel,
.card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.metric {
  padding: 18px;
}

.metric span,
.metric small {
  color: var(--muted);
}

.metric strong {
  display: block;
  margin: 8px 0 5px;
  font-size: 28px;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, 0.65fr);
  gap: 18px;
}

.panel {
  overflow: hidden;
}

.panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 18px;
  border-bottom: 1px solid var(--line);
}

.table-wrap {
  overflow-x: auto;
}

.log-table-wrap {
  overflow-x: hidden;
}

table {
  width: 100%;
  border-collapse: collapse;
}

.log-table {
  table-layout: fixed;
  max-width: 100%;
}

.log-table th,
.log-table td {
  white-space: normal;
  vertical-align: top;
  overflow: hidden;
}

.log-table th:nth-child(1),
.log-table td:nth-child(1) {
  width: 140px;
}

.log-table th:nth-child(2),
.log-table td:nth-child(2) {
  width: 145px;
}

.log-table th:nth-child(3),
.log-table td:nth-child(3) {
  width: 105px;
}

.log-table th:nth-child(4),
.log-table td:nth-child(4) {
  overflow-wrap: anywhere;
  word-break: normal;
  line-height: 1.45;
}

th,
td {
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  white-space: nowrap;
}

th {
  color: var(--muted);
  font-size: 13px;
}

.card-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.card-title-row h4 {
  margin: 0;
}

.card-icon-actions {
  display: flex;
  gap: 6px;
}

.small-icon-button {
  width: 34px;
  height: 34px;
  min-width: 34px;
  font-size: 16px;
  color: var(--accent-strong);
}

.danger-icon-button {
  color: var(--danger);
}

.crm-duplicate-notice {
  margin: 8px 0 10px;
  padding: 8px 10px;
  border: 1px solid #f3d68b;
  border-radius: 8px;
  background: #fff7df;
  color: #7a5511;
  font-size: 12px;
  font-weight: 800;
}

.crm-duplicate-panel {
  display: grid;
  gap: 8px;
  margin: 10px 0 12px;
  padding: 10px;
  border: 1px solid #f3d68b;
  border-radius: 12px;
  background: linear-gradient(135deg, #fff7df, #fffaf0);
  color: #7a5511;
}

.crm-duplicate-header,
.crm-duplicate-candidate {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.crm-duplicate-header strong {
  font-size: 13px;
}

.crm-duplicate-header span,
.crm-duplicate-action-note {
  margin: 0;
  font-size: 11px;
  font-weight: 800;
}

.crm-duplicate-candidate {
  padding: 8px;
  border: 1px solid rgba(122, 85, 17, 0.16);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.72);
}

.crm-duplicate-signals {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  width: 100%;
}

.crm-duplicate-signal,
.crm-duplicate-risk {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  border-radius: 999px;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 900;
}

.crm-duplicate-signal.strong,
.crm-duplicate-risk.strong {
  background: #fee2e2;
  color: #b91c1c;
}

.crm-duplicate-signal.weak,
.crm-duplicate-risk.weak {
  background: #fef3c7;
  color: #92400e;
}

.crm-duplicate-action-note {
  color: #7a5511;
}

.crm-360-contact,
.crm-360-metrics,
.crm-360-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.crm-360-contact span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.crm-360-metrics span {
  display: grid;
  min-width: 120px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.crm-360-metrics strong {
  color: var(--text);
  font-size: 14px;
}

.crm-360-badge,
.crm-360-whatsapp {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  border-radius: 999px;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 900;
}

.crm-360-badge.source {
  background: #dbeafe;
  color: #1d4ed8;
}

.crm-360-badge.preference {
  background: #f1f5f9;
  color: #475569;
}

.crm-360-badge.muted {
  background: #f8fafc;
  color: #64748b;
}

.crm-360-whatsapp {
  margin-top: 10px;
}

.crm-360-whatsapp.ok {
  background: #dcfce7;
  color: #15803d;
}

.crm-360-whatsapp.pending {
  background: #fef3c7;
  color: #92400e;
}

.crm-360-whatsapp.warning {
  background: #fee2e2;
  color: #b91c1c;
}

.crm-workspace {
  display: grid;
  gap: 16px;
}

.crm-top-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.crm-top-nav button {
  min-height: 46px;
  border: 0;
  border-radius: 8px;
  padding: 0 16px;
  background: transparent;
  color: #334155;
  font-weight: 900;
  text-align: center;
}

.crm-top-nav button.active,
.crm-top-nav button:hover {
  background: var(--accent);
  color: #ffffff;
}

.crm-main {
  min-width: 0;
}

.crm-whatsapp-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 18px 0;
}

.crm-whatsapp-filters button {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  background: #ffffff;
  color: #334155;
  font-weight: 800;
}

.crm-whatsapp-filters button.active,
.crm-whatsapp-filters button:hover {
  border-color: var(--accent);
  background: var(--accent);
  color: #ffffff;
}

.crm-message-type,
.crm-whatsapp-summary,
.dry-run-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  border-radius: 999px;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

.crm-message-type.web-request {
  background: #dbeafe;
  color: #1d4ed8;
}

.crm-message-type.web-confirmed {
  background: #dcfce7;
  color: #15803d;
}

.crm-message-type.automation {
  background: #f1f5f9;
  color: #475569;
}

.dry-run-badge {
  margin-left: 6px;
  background: #fef3c7;
  color: #92400e;
}

.crm-whatsapp-summary.pending {
  background: #fef3c7;
  color: #92400e;
}

.crm-whatsapp-summary.sent {
  background: #dcfce7;
  color: #15803d;
}

.crm-whatsapp-summary.failed,
.crm-whatsapp-summary.missing-phone {
  background: #fee2e2;
  color: #b91c1c;
}

.crm-whatsapp-summary.empty {
  background: #f1f5f9;
  color: #64748b;
}

.direct-review-card {
  display: grid;
  gap: 8px;
  min-width: 260px;
}

.direct-review-title,
.direct-review-meta,
.direct-review-badges,
.direct-review-actions,
.direct-review-warnings {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.direct-review-title {
  justify-content: space-between;
}

.direct-review-title span,
.direct-review-meta {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.direct-review-badge,
.direct-review-warnings span,
.direct-review-ready {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  border-radius: 999px;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 900;
}

.direct-review-badge.source,
.direct-review-badge.crm-ok,
.direct-review-badge.wa-ok,
.direct-review-badge.price-ok,
.direct-review-ready {
  background: #dcfce7;
  color: #15803d;
}

.direct-review-badge.wa-pending,
.direct-review-badge.price-warning,
.direct-review-warnings span {
  background: #fef3c7;
  color: #92400e;
}

.direct-review-badge.crm-warning,
.direct-review-badge.wa-warning {
  background: #fee2e2;
  color: #b91c1c;
}

.direct-review-actions button {
  min-height: 28px;
  padding: 0 8px;
}

.crm-settings-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 12px;
  padding: 18px;
  border-bottom: 1px solid var(--line);
}

.crm-settings-grid label,
.crm-template-card {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-weight: 800;
}

.crm-settings-grid button {
  align-self: end;
}

.crm-template-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
  padding: 18px;
}

.crm-template-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #ffffff;
}

.crm-template-card strong {
  color: var(--ink);
}

.crm-template-card span {
  color: var(--muted);
  font-size: 12px;
}

.crm-template-card p {
  color: #475569;
  line-height: 1.45;
}

#templateEditorDialog {
  width: min(920px, calc(100vw - 40px));
  max-height: calc(100vh - 40px);
  overflow: hidden;
}

.template-editor-modal {
  width: 100%;
  max-width: 100%;
  height: min(820px, calc(100vh - 40px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 14px;
  overflow: hidden;
}

.template-editor-modal label {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.template-editor-modal textarea {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  min-height: 0;
  height: 100%;
  overflow: auto;
  resize: vertical;
}

.template-editor-modal .modal-actions {
  justify-content: flex-end;
  flex-wrap: wrap;
}

.table-sort {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.table-sort:hover,
.table-sort.active {
  color: var(--ink);
}

.sort-caret::before {
  content: "▾";
  display: inline-block;
  font-size: 10px;
  line-height: 1;
  opacity: 0.36;
}

.table-sort.active .sort-caret::before {
  opacity: 1;
}

.table-sort[data-sort-direction="asc"] .sort-caret::before {
  content: "▴";
}

.table-sort[data-sort-direction="desc"] .sort-caret::before {
  content: "▾";
}

.room-board,
.cards-grid,
.automation-list,
.bar-chart {
  display: grid;
  gap: 12px;
  padding: 18px;
}

.room-board {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.room-tile {
  border-radius: 8px;
  padding: 14px;
  border: 1px solid var(--line);
  background: var(--surface-2);
}

.room-tile strong {
  display: block;
  font-size: 21px;
}

.status {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  border-radius: 999px;
  padding: 0 9px;
  font-size: 12px;
  font-weight: 700;
}

.status.clean,
.status.active,
.status.sent,
.status.delivered {
  background: #dcfce7;
  color: var(--ok);
}

.status.read {
  background: #dbeafe;
  color: #1d4ed8;
}

.status.dirty,
.status.pending {
  background: #fef3c7;
  color: var(--warn);
}

.status.occupied-clean {
  background: #ccfbf1;
  color: #0f766e;
}

.status.occupied-dirty {
  background: #ffedd5;
  color: #c2410c;
}

.status.maintenance,
.status.passive,
.status.failed {
  background: #fee2e2;
  color: var(--danger);
}

.status.closed {
  background: #111827;
  color: #ffffff;
}

.cards-grid {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.role-definition-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.role-card {
  display: grid;
  gap: 10px;
}

.role-card div {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.role-card p {
  margin: 0;
  color: #475569;
  line-height: 1.45;
}

.role-card small {
  color: #64748b;
  line-height: 1.45;
}

.card {
  padding: 16px;
  box-shadow: none;
}

.card h4 {
  margin: 0 0 8px;
  font-size: 18px;
}

.card p {
  margin: 6px 0;
  color: var(--muted);
}

.card-actions {
  display: flex;
  gap: 8px;
  margin-top: 14px;
  flex-wrap: wrap;
}

.segmented {
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2);
}

.segmented button {
  border: 0;
  border-radius: 6px;
  min-height: 32px;
  padding: 0 10px;
  background: transparent;
}

.segmented button.active {
  background: #ffffff;
  color: var(--accent-strong);
  box-shadow: 0 1px 4px rgba(20, 40, 32, 0.12);
}

.automation-item,
.bar-row {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #ffffff;
}

.automation-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
}

.automation-item p {
  margin: 6px 0 0;
  color: var(--muted);
}

.bar-row {
  display: grid;
  grid-template-columns: 160px 1fr 52px;
  align-items: center;
  gap: 12px;
}

.bar-track {
  height: 12px;
  border-radius: 999px;
  background: var(--surface-2);
  overflow: hidden;
}

.bar-fill {
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}

dialog {
  width: min(720px, calc(100vw - 28px));
  border: 0;
  border-radius: 8px;
  padding: 0;
  box-shadow: var(--shadow);
}

dialog::backdrop {
  background: rgba(10, 20, 17, 0.45);
}

.modal {
  padding: 18px;
}

.modal-header,
.modal-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.modal-header h3 {
  margin: 0;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0;
}

label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

label input,
label select {
  width: 100%;
}


.staff-assistant-panel {
  display: grid;
  gap: 14px;
}

.staff-assistant-panel textarea {
  min-height: 88px;
}

.staff-assistant-result {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: var(--surface-2);
}

.staff-assistant-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.staff-assistant-answer {
  margin-bottom: 12px;
  padding: 12px;
  border-radius: 8px;
  background: #ffffff;
}

.staff-assistant-result pre {
  overflow: auto;
  max-height: 280px;
  padding: 12px;
  border-radius: 8px;
  background: #0f172a;
  color: #e2e8f0;
  white-space: pre-wrap;
}

@media (max-width: 980px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: static;
    height: auto;
  }

  .frontoffice-daily-bar {
    left: 0;
    right: 0;
    width: auto;
  }

  .nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .metrics,
  .dashboard-grid,
  .cyotel-about-card {
    grid-template-columns: 1fr;
  }

  .cyotel-about-card {
    margin-inline: 18px;
  }

  .setup-header,
  .split-panel,
  .crm-workspace {
    grid-template-columns: 1fr;
  }

  .setup-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .setup-form,
  .setup-form.compact,
  .setup-form.compact-row,
  .reservation-card-grid {
    grid-template-columns: 1fr 1fr;
  }

  .setup-form.compact {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
}

@media (max-width: 640px) {
  .main {
    grid-template-rows: 64px 1fr;
  }

  .panel-header,
  .automation-item {
    align-items: stretch;
    flex-direction: column;
  }

  .module-home {
    min-height: calc(100vh - 64px);
    padding: 18px;
  }

  .topbar-actions,
  .filters,
  .inline-form {
    display: grid;
    grid-template-columns: 1fr;
  }

  .form-grid,
  .nav,
  .setup-form,
  .setup-form.compact,
  .setup-form.compact-row,
  .accounting-controls,
  .report-controls,
  .log-filter-panel,
  .availability-controls,
  .room-plan-controls {
    grid-template-columns: 1fr;
  }

  .crm-settings-grid {
    grid-template-columns: 1fr;
  }

  .setup-workspace {
    padding: 18px;
  }

  .wide-field {
    grid-column: auto;
  }

  .reservation-card-grid,
  .folio-grid,
  .eod-check-grid,
  .eod-process-grid,
  .guest-line,
  .rate-matrix-row {
    grid-template-columns: 1fr;
  }

  .bar-row {
    grid-template-columns: 1fr;
  }

  .login-card {
    padding: 30px 18px 22px;
  }

  .login-logo {
    font-size: 36px;
  }

  .login-card > p {
    font-size: 17px;
  }

  .login-help {
    grid-template-columns: 1fr;
  }
}


/* CRM-004 WhatsApp queue operations panel */
.crm-whatsapp-live-notice {
  border-left: 4px solid #f59e0b;
  background: #fffbeb;
}

.crm-whatsapp-ops-summary {
  margin: 16px 0;
}

.crm-whatsapp-ops-card small {
  display: block;
  margin-top: 6px;
  color: #64748b;
  font-weight: 500;
}

.crm-whatsapp-preview-panel {
  margin: 14px 0 18px;
  padding: 16px;
  border: 1px solid #dbe3ef;
  border-radius: 18px;
  background: linear-gradient(135deg, #f8fafc, #eef6ff);
  color: #0f172a;
}

.crm-whatsapp-preview-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 10px;
}

.crm-whatsapp-preview-header span,
.crm-whatsapp-preview-meta,
.crm-whatsapp-preview-panel small {
  color: #64748b;
}

.crm-whatsapp-preview-panel pre {
  white-space: pre-wrap;
  margin: 12px 0;
  padding: 12px;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  font-family: inherit;
  line-height: 1.45;
}

.crm-message-type.arrival-reminder { background: #e0f2fe; color: #075985; }
.crm-message-type.stay-followup { background: #ecfdf5; color: #047857; }
.crm-message-type.post-checkout { background: #f5e8ff; color: #7e22ce; }

.dry-run-badge.live-off,
.approval-warning,
.whatsapp-phone-warning {
  display: inline-flex;
  margin-left: 6px;
  margin-top: 4px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}

.dry-run-badge.live-off { background: #fee2e2; color: #991b1b; }
.approval-warning { background: #fef3c7; color: #92400e; }
.whatsapp-phone-warning { margin-left: 0; background: #fee2e2; color: #991b1b; }
.whatsapp-phone-warning.invalid { background: #ffedd5; color: #9a3412; }
.status.approval { background: #fef3c7; color: #92400e; }


/* Rezervasyon motoru dashboard PMS içine taşındı */
.booking-engine-host {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  height: calc(100vh - 74px);
}

.booking-engine-host-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 18px;
  border: 1px solid var(--border-color);
  border-radius: 18px;
  background: var(--card-bg);
  box-shadow: var(--soft-shadow);
}

.booking-engine-host-header h2,
.booking-engine-host-header p {
  margin: 0;
}

.booking-engine-host-header p:not(.eyebrow) {
  margin-top: 8px;
  color: var(--muted-color);
}

.booking-engine-frame {
  width: 100%;
  flex: 1;
  min-height: 720px;
  border: 1px solid var(--border-color);
  border-radius: 18px;
  background: #eef1ef;
  box-shadow: var(--soft-shadow);
}


/* Rezervasyon Motoru hata düzeltmeleri: view izolasyonu, sol bar arka planı ve iframe oturması */
.app-shell {
  background: linear-gradient(90deg, #071b33 0 var(--sidebar-width), var(--bg) var(--sidebar-width));
  align-items: stretch;
}

.sidebar {
  min-height: 100vh;
}

.view.booking-engine-host {
  display: none;
}

.view.booking-engine-host.active {
  display: flex;
}

.booking-engine-host {
  height: auto;
  min-height: calc(100vh - 82px);
  padding: 18px;
}

.booking-engine-host-header {
  display: none;
}

.booking-engine-frame {
  min-height: calc(100vh - 118px);
  height: calc(100vh - 118px);
  border-radius: 12px;
}

@media (max-width: 900px) {
  .app-shell {
    background: var(--bg);
  }
}

/* Cyotel UI Refresh Phase 1: visual-only premium SaaS layer */
:root {
  --bg: #f7f8fa;
  --surface: #ffffff;
  --surface-2: #f3f6f8;
  --text: #111827;
  --muted: #6b7280;
  --line: #e5e7eb;
  --accent: #0b1d36;
  --accent-strong: #07172b;
  --sidebar-active: #132b4a;
  --gold: #c8a15a;
  --warn: #d97706;
  --danger: #dc2626;
  --ok: #16a34a;
  --info: #2563eb;
  --shadow: 0 14px 34px rgba(17, 24, 39, 0.07);
  --soft-shadow: 0 10px 26px rgba(17, 24, 39, 0.06);
  --border-color: #e5e7eb;
  --card-bg: #ffffff;
}

body {
  background:
    radial-gradient(circle at top right, rgba(200, 161, 90, 0.08), transparent 28rem),
    var(--bg);
  color: var(--text);
  letter-spacing: 0;
}

.login-screen {
  background:
    linear-gradient(135deg, rgba(11, 29, 54, 0.06), rgba(200, 161, 90, 0.08)),
    #f7f8fa;
}

.login-card {
  border-color: rgba(200, 161, 90, 0.28);
  border-radius: 18px;
  box-shadow: 0 24px 70px rgba(7, 23, 43, 0.16);
}

.login-card h1 {
  color: var(--accent);
  font-size: 32px;
  font-weight: 750;
}

.login-card > p {
  color: var(--muted);
  font-size: 15px;
}

.login-button {
  height: 48px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--accent), var(--sidebar-active));
  box-shadow: 0 12px 24px rgba(11, 29, 54, 0.22);
}

.app-shell {
  background: linear-gradient(90deg, var(--accent-strong) 0 var(--sidebar-width), var(--bg) var(--sidebar-width));
}

.sidebar {
  gap: 12px;
  padding: 18px 14px;
  background:
    linear-gradient(180deg, rgba(200, 161, 90, 0.10), transparent 18rem),
    linear-gradient(180deg, var(--accent), var(--accent-strong));
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.08), 18px 0 45px rgba(7, 23, 43, 0.18);
}

.sidebar-toggle {
  border-color: rgba(255, 255, 255, 0.14);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.cyotel-sidebar-brand {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(215, 181, 110, 0.22);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.06);
}

.cyotel-sidebar-brand img {
  width: 32px;
  height: 32px;
}

.cyotel-sidebar-brand strong,
.cyotel-sidebar-brand span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cyotel-sidebar-brand strong {
  color: #ffffff;
  font-size: 14px;
  font-weight: 800;
}

.cyotel-sidebar-brand span {
  margin-top: 2px;
  color: rgba(250, 247, 241, 0.68);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.9px;
  text-transform: uppercase;
}

.brand {
  margin-bottom: 6px;
  padding: 14px 12px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.04);
}

.brand img {
  max-width: 168px;
}

.brand p {
  margin: 0;
  color: rgba(250, 247, 241, 0.76);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.nav {
  gap: 4px;
}

.nav-item {
  min-height: 42px;
  border-radius: 12px;
  padding: 0 12px;
  color: rgba(250, 247, 241, 0.78);
  font-size: 13px;
  font-weight: 700;
}

.nav-item::before {
  width: 28px;
  color: rgba(215, 181, 110, 0.92);
  font-size: 16px;
}

.nav-item:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

.nav-item.active {
  background: var(--sidebar-active);
  color: #ffffff;
  box-shadow: inset 3px 0 0 var(--gold), 0 10px 20px rgba(7, 23, 43, 0.18);
}

.system-date-card,
.user-chip,
.cyotel-powered-badge,
.sidebar-logout {
  border-radius: 14px;
}

.system-date-card,
.user-chip {
  border: 1px solid rgba(255, 255, 255, 0.10);
  background: rgba(255, 255, 255, 0.055);
}

.system-date-card span,
.user-chip small {
  color: rgba(250, 247, 241, 0.58);
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.system-date-card strong,
.user-chip span {
  color: #ffffff;
}

.cyotel-powered-badge {
  border-color: rgba(215, 181, 110, 0.22);
  background: rgba(250, 247, 241, 0.08);
}

.sidebar-logout {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.08);
}

.app-shell.sidebar-collapsed .cyotel-sidebar-brand {
  grid-template-columns: 1fr;
  justify-items: center;
  padding: 10px 8px;
}

.app-shell.sidebar-collapsed .cyotel-sidebar-brand div,
.app-shell.sidebar-collapsed .brand p {
  display: none;
}

.app-shell.sidebar-collapsed .brand {
  padding: 10px 8px;
}

.main {
  min-width: 0;
  padding: 24px;
  background: var(--bg);
}

.topbar {
  min-height: 76px;
  margin: 0 0 20px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: var(--soft-shadow);
  backdrop-filter: blur(10px);
}

.topbar-title-group #viewTitle {
  color: var(--accent);
  font-size: 26px;
  font-weight: 780;
  letter-spacing: 0;
}

.topbar-title-group small {
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 1.2px;
}

.setup-header,
.booking-engine-host-header {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface);
  box-shadow: var(--soft-shadow);
}

.setup-header h2,
.panel-header h3,
.booking-engine-host-header h2 {
  color: var(--accent);
  font-weight: 760;
  letter-spacing: 0;
}

.eyebrow,
.panel-note,
.setup-header span,
.booking-engine-host-header p:not(.eyebrow) {
  color: var(--muted);
}

.metric,
.panel,
.card,
.table-wrap,
.modal,
.pricing-summary,
.crm-top-nav,
.notice-card,
.cyotel-about-card,
.eod-detail-panel,
.room-picker-card,
.rack-room-card {
  border-color: var(--line);
  border-radius: 16px;
  background: var(--surface);
  box-shadow: var(--soft-shadow);
}

.metric {
  padding: 20px;
}

.metric strong {
  color: var(--accent);
  font-size: 28px;
  font-weight: 760;
}

.panel-header {
  padding: 18px 20px;
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.84), rgba(255, 255, 255, 0));
}

input,
select,
textarea {
  min-height: 42px;
  border: 1px solid #d1d5db;
  border-radius: 11px;
  background: #ffffff;
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(17, 24, 39, 0.02);
}

textarea {
  padding-top: 11px;
}

input:focus,
select:focus,
textarea:focus {
  border-color: rgba(37, 99, 235, 0.55);
  outline: 3px solid rgba(37, 99, 235, 0.12);
}

label {
  color: #374151;
  font-size: 12px;
  font-weight: 750;
}

.primary-button,
.ghost-button,
.icon-text-button,
.room-picker-button,
.segmented button,
.reservation-tabs button,
.reservation-subtabs button,
.setup-tabs button,
.crm-top-nav button,
.crm-whatsapp-filters button {
  border-radius: 11px;
  font-size: 13px;
  font-weight: 750;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.primary-button {
  border: 1px solid var(--accent);
  background: linear-gradient(135deg, var(--accent), var(--sidebar-active));
  color: #ffffff;
  box-shadow: 0 12px 22px rgba(11, 29, 54, 0.18);
}

.primary-button:hover {
  background: linear-gradient(135deg, var(--sidebar-active), var(--accent));
  transform: translateY(-1px);
}

.ghost-button,
.room-picker-button,
.icon-text-button {
  border-color: #d1d5db;
  background: #ffffff;
  color: var(--accent);
}

.ghost-button:hover,
.room-picker-button:hover,
.icon-text-button:hover {
  border-color: rgba(11, 29, 54, 0.28);
  background: #f8fafc;
}

.danger-button,
.danger-icon-button {
  color: var(--danger);
}

.reservation-tabs,
.reservation-subtabs,
.setup-tabs,
.segmented {
  border-color: var(--line);
  border-radius: 16px;
  background: #ffffff;
}

.reservation-tabs button.active,
.reservation-subtabs button.active,
.setup-tabs button.active,
.segmented button.active,
.crm-top-nav button.active,
.crm-top-nav button:hover,
.crm-whatsapp-filters button.active,
.crm-whatsapp-filters button:hover {
  background: var(--accent);
  color: #ffffff;
}

.table-wrap {
  border: 1px solid var(--line);
  overflow: auto;
}

table {
  font-size: 13px;
}

th,
td {
  padding: 14px 16px;
  border-bottom-color: #eef2f7;
}

th {
  background: #f8fafc;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.7px;
  text-transform: uppercase;
}

tbody tr:hover {
  background: #f8fafc;
}

.status,
.day-status,
.crm-360-badge,
.crm-360-whatsapp,
.crm-duplicate-signal,
.crm-duplicate-risk,
.rate-status,
.booking-engine-status,
.badge {
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.2px;
}

.plan-room-row,
.room-plan-timeline,
.plan-day,
.plan-cell {
  border-color: #e5e7eb;
}

.plan-day {
  min-height: 58px;
  background: #ffffff;
}

.plan-day.weekend {
  background: #f8fafc;
  color: #991b1b;
}

.plan-cell:hover {
  background: #eff6ff;
}

.plan-booking {
  min-height: 32px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 10px;
  color: #0f172a;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
}

.plan-booking.balanced {
  background: #ccfbf1;
}

.plan-booking.credit {
  background: #dcfce7;
}

.plan-booking.debt {
  background: #fee2e2;
}

.plan-room-block {
  border-radius: 10px;
  background: #1f2937;
}

#foRack .panel {
  border: 1px solid rgba(148, 116, 68, 0.2);
  border-radius: 24px;
  background:
    radial-gradient(circle at 8% 0%, rgba(255, 248, 225, 0.75), transparent 28%),
    linear-gradient(145deg, #fffdf8 0%, #fff8ec 44%, #f8fafc 100%);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.11);
}

#foRack .panel-header {
  align-items: flex-start;
  gap: 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(148, 116, 68, 0.18);
}

#foRack .panel-header h3 {
  position: relative;
  color: #142033;
  font-size: clamp(22px, 2vw, 30px);
  letter-spacing: -0.03em;
}

#foRack .panel-header h3::after {
  content: "Günlük oda durumu ve operasyon kontrolü";
  display: block;
  margin-top: 6px;
  color: #64748b;
  font-size: 12px;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#foRack .segmented {
  align-items: center;
  gap: 7px;
  padding: 7px;
  border: 1px solid rgba(184, 134, 47, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82), 0 16px 34px rgba(15, 23, 42, 0.09);
}

#foRack .segmented button {
  position: relative;
  border: 1px solid rgba(15, 23, 42, 0.07);
  border-radius: 999px;
  color: #334155;
  background: rgba(255, 255, 255, 0.92);
  font-weight: 840;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

#foRack .segmented button::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 7px;
  border-radius: 999px;
  background: rgba(184, 134, 47, 0.88);
  box-shadow: 0 0 0 3px rgba(184, 134, 47, 0.13);
}

#foRack .segmented button[data-rack-status="Temiz"]::before { background: #16a34a; box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.14); }
#foRack .segmented button[data-rack-status="Kirli"]::before { background: #d97706; box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.15); }
#foRack .segmented button[data-rack-status="Dolu/Temiz"]::before { background: #0284c7; box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.14); }
#foRack .segmented button[data-rack-status="Dolu/Kirli"]::before { background: #dc2626; box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15); }
#foRack .segmented button[data-rack-status="Arızalı"]::before { background: #7c3aed; box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.14); }
#foRack .segmented button[data-rack-status="Kapalı"]::before { background: #334155; box-shadow: 0 0 0 3px rgba(51, 65, 85, 0.14); }

#foRack .segmented button.active {
  color: #fffaf0;
  background: linear-gradient(135deg, #162237, #30415f 58%, #b8862f);
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.18);
}

#foRack .segmented button.active::before {
  background: #f4d27a;
  box-shadow: 0 0 0 3px rgba(244, 210, 122, 0.24);
}

#foRack .room-board {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(258px, 1fr));
  gap: 16px;
  padding: 18px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(248, 250, 252, 0.82)),
    repeating-linear-gradient(135deg, rgba(148, 163, 184, 0.08) 0 1px, transparent 1px 12px);
}

#foRack .rack-room-card {
  --rack-color: #94a3b8;
  --rack-strong: #475569;
  --rack-soft: #f1f5f9;
  --rack-glow: rgba(148, 163, 184, 0.16);
  --rack-status-bg: #f8fafc;
  position: relative;
  min-height: 188px;
  gap: 12px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-left-width: 5px;
  border-radius: 20px;
  padding: 18px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

#foRack .rack-room-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 7px;
  background: var(--rack-color);
}

#foRack .rack-room-card::after {
  content: none;
  display: none;
}

#foRack .rack-room-card:hover {
  transform: translateY(-2px);
  border-color: rgba(184, 134, 47, 0.34);
  box-shadow: 0 24px 44px rgba(15, 23, 42, 0.13);
}

#foRack .rack-room-card > div:first-child {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

#foRack .rack-room-card strong {
  color: #142033;
  font-size: 30px;
  font-weight: 840;
  letter-spacing: -0.04em;
}

#foRack .rack-room-card > div:first-child span {
  max-width: 150px;
  color: #64748b;
  font-size: 12px;
  font-weight: 780;
  line-height: 1.35;
  text-align: right;
  text-transform: uppercase;
}

#foRack .rack-room-card > .status {
  width: fit-content;
  min-width: 112px;
  justify-content: center;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 999px;
  padding: 7px 12px;
  font-weight: 860;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

#foRack .rack-room-card p {
  color: #334155;
  font-size: 13px;
  font-weight: 760;
  line-height: 1.45;
}

#foRack .rack-room-card small {
  border-radius: 12px;
  padding: 9px 10px;
  color: #475569;
  background: rgba(248, 250, 252, 0.9);
  font-weight: 760;
}

#foRack .rack-room-card .card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: auto;
  padding-top: 4px;
}

#foRack .rack-room-card .card-actions button {
  min-height: 34px;
  border-radius: 999px;
  padding-inline: 12px;
  font-size: 12px;
  font-weight: 820;
}

#foRack .rack-room-card.clean { --rack-color: #16a34a; --rack-strong: #14532d; --rack-soft: #f0fdf4; --rack-glow: rgba(22, 163, 74, 0.16); --rack-status-bg: #dcfce7; }
#foRack .rack-room-card.dirty { --rack-color: #d97706; --rack-strong: #7c2d12; --rack-soft: #fff7ed; --rack-glow: rgba(217, 119, 6, 0.18); --rack-status-bg: #ffedd5; }
#foRack .rack-room-card.occupied-clean { --rack-color: #0284c7; --rack-strong: #075985; --rack-soft: #ecfeff; --rack-glow: rgba(2, 132, 199, 0.16); --rack-status-bg: #e0f2fe; }
#foRack .rack-room-card.occupied-dirty { --rack-color: #dc2626; --rack-strong: #7f1d1d; --rack-soft: #fff1f2; --rack-glow: rgba(220, 38, 38, 0.18); --rack-status-bg: #fee2e2; }
#foRack .rack-room-card.maintenance { --rack-color: #7c3aed; --rack-strong: #4c1d95; --rack-soft: #f5f3ff; --rack-glow: rgba(124, 58, 237, 0.16); --rack-status-bg: #ede9fe; }
#foRack .rack-room-card.closed { --rack-color: #334155; --rack-strong: #0f172a; --rack-soft: #eef2f7; --rack-glow: rgba(51, 65, 85, 0.16); --rack-status-bg: #e2e8f0; }

#foRack .rack-room-card.clean,
#foRack .rack-room-card.dirty,
#foRack .rack-room-card.occupied-clean,
#foRack .rack-room-card.occupied-dirty,
#foRack .rack-room-card.maintenance,
#foRack .rack-room-card.closed {
  border-left-color: var(--rack-color);
  background:
    radial-gradient(circle at 92% 10%, var(--rack-glow), transparent 32%),
    linear-gradient(145deg, #ffffff 0%, var(--rack-soft) 100%);
}

#foRack .rack-room-card > .status {
  color: var(--rack-strong);
  border-color: var(--rack-glow);
  background: var(--rack-status-bg);
}

#foRack.active ~ .frontoffice-daily-bar,
#foStatus.active ~ .frontoffice-daily-bar,
#foAvailability.active ~ .frontoffice-daily-bar {
  position: static;
  left: auto;
  right: auto;
  bottom: auto;
  z-index: 1;
  margin: 18px 0 0;
  border: 1px solid rgba(223, 209, 145, 0.95);
  border-radius: 18px;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.1);
}

#foAvailability .panel {
  border: 1px solid rgba(148, 116, 68, 0.2);
  border-radius: 24px;
  background:
    radial-gradient(circle at 10% 0%, rgba(255, 248, 225, 0.78), transparent 30%),
    linear-gradient(145deg, #fffdf8 0%, #fff8ec 44%, #f8fafc 100%);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.1);
}

#foAvailability .panel-header {
  align-items: flex-start;
  gap: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(148, 116, 68, 0.18);
}

#foAvailability .panel-header h3 {
  color: #142033;
  font-size: clamp(22px, 2vw, 30px);
  letter-spacing: -0.03em;
}

#foAvailability .panel-header h3::after {
  content: "Tarih bazlı oda tipi stok görünümü";
  display: block;
  margin-top: 6px;
  color: #64748b;
  font-size: 12px;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#foAvailability .availability-controls {
  grid-template-columns: minmax(190px, 1fr) minmax(190px, 1fr) auto;
  align-items: end;
  gap: 14px;
  margin: 16px 0;
  padding: 16px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 14px 30px rgba(15, 23, 42, 0.07);
}

#foAvailability .availability-controls label {
  color: #64748b;
  font-size: 12px;
  font-weight: 860;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#foAvailability .availability-controls input {
  margin-top: 8px;
  border: 1px solid rgba(148, 163, 184, 0.34);
  border-radius: 14px;
  background: #ffffff;
  font-weight: 780;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
}

#foAvailability .availability-controls input:focus {
  border-color: rgba(184, 134, 47, 0.62);
  box-shadow: 0 0 0 4px rgba(184, 134, 47, 0.16);
}

#foAvailability .availability-controls .primary-button {
  min-height: 44px;
  border-radius: 999px;
  background: linear-gradient(135deg, #162237, #30415f 58%, #b8862f);
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.18);
}

#foAvailability .table-wrap {
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08);
}

#foAvailability table {
  border-collapse: separate;
  border-spacing: 0;
}

#foAvailability thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  border-bottom: 1px solid rgba(148, 163, 184, 0.24);
  background: linear-gradient(180deg, #162237, #22324d);
  color: #fff8e7;
  font-size: 12px;
  font-weight: 860;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#foAvailability tbody td {
  border-bottom: 1px solid rgba(226, 232, 240, 0.72);
  color: #334155;
  font-weight: 720;
}

#foAvailability tbody tr:nth-child(even):not(.availability-total-row) {
  background: rgba(248, 250, 252, 0.68);
}

#foAvailability tbody tr:hover:not(.availability-total-row) {
  background: #fff7e6;
}

#foAvailability tbody td:last-child strong {
  display: inline-flex;
  min-width: 42px;
  justify-content: center;
  border-radius: 999px;
  padding: 6px 10px;
  color: #166534;
  background: #dcfce7;
  font-weight: 900;
}

#foAvailability .availability-total-row {
  background: linear-gradient(90deg, #fff3c4, #fffaf0);
  color: #142033;
  font-weight: 900;
}

#foAvailability .availability-total-row td {
  border-top: 1px solid rgba(184, 134, 47, 0.35);
  border-bottom: 1px solid rgba(184, 134, 47, 0.24);
}

body.theme-dark #frontoffice.setup-workspace #foAvailability .panel,
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability .panel {
  background:
    radial-gradient(circle at 10% 0%, rgba(215, 181, 110, 0.08), transparent 24%),
    linear-gradient(145deg, rgba(9, 21, 39, 0.99), rgba(4, 12, 24, 1)) !important;
  border: 1px solid rgba(215, 181, 110, 0.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 22px 58px rgba(0,0,0,.26) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability .panel-header,
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability .panel-header {
  background: linear-gradient(180deg, rgba(8, 19, 36, 0.72), rgba(8, 19, 36, 0)) !important;
  background-image: linear-gradient(180deg, rgba(8, 19, 36, 0.72), rgba(8, 19, 36, 0)) !important;
  border-bottom-color: rgba(215, 181, 110, 0.18) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability .panel-header h3,
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability .panel-header h3 {
  color: #f8fbff !important;
  text-shadow: 0 8px 26px rgba(0,0,0,.28) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability .panel-header h3::after,
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability .panel-header h3::after {
  color: rgba(218, 230, 247, 0.68) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability .availability-controls,
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability .availability-controls {
  background: linear-gradient(145deg, rgba(12, 25, 43, 0.94), rgba(6, 15, 29, 0.96)) !important;
  border: 1px solid rgba(215, 181, 110, 0.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 14px 30px rgba(0,0,0,.22) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability .availability-controls label,
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability .availability-controls label {
  color: rgba(218, 230, 247, 0.76) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability .availability-controls input,
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability .availability-controls input {
  background: rgba(7, 16, 31, 0.96) !important;
  color: #f8fbff !important;
  -webkit-text-fill-color: #f8fbff !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 8px 18px rgba(0,0,0,.18) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability .availability-controls .primary-button,
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability .availability-controls .primary-button {
  background: linear-gradient(135deg, #f3d794, #b88a44) !important;
  color: #091421 !important;
  border-color: transparent !important;
  box-shadow: 0 14px 28px rgba(0,0,0,.22) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability .table-wrap,
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability .table-wrap {
  background: linear-gradient(180deg, rgba(8, 19, 36, 0.96), rgba(5, 13, 26, 0.98)) !important;
  border: 1px solid rgba(215, 181, 110, 0.14) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.22) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability tbody td,
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability tbody td {
  color: #dbe7f7 !important;
  border-bottom-color: rgba(255,255,255,.07) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability tbody tr:nth-child(even):not(.availability-total-row),
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability tbody tr:nth-child(even):not(.availability-total-row) {
  background: rgba(15, 30, 52, 0.62) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability tbody tr:hover:not(.availability-total-row),
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability tbody tr:hover:not(.availability-total-row) {
  background: rgba(215, 181, 110, 0.12) !important;
}

body.theme-dark #frontoffice.setup-workspace #foAvailability .availability-total-row,
body:not(.theme-light) #frontoffice.setup-workspace #foAvailability .availability-total-row {
  background: linear-gradient(90deg, rgba(215,181,110,.18), rgba(12,25,43,.96)) !important;
  color: #fff7dc !important;
}

#foStatus .metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  padding: 18px;
  border: 1px solid rgba(148, 116, 68, 0.2);
  border-radius: 24px;
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 248, 225, 0.78), transparent 30%),
    linear-gradient(145deg, #fffdf8 0%, #fff8ec 46%, #f8fafc 100%);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.1);
}

#foStatus .metric {
  position: relative;
  overflow: hidden;
  min-height: 148px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 20px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08);
}

#foStatus .metric::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, #b8862f, rgba(20, 32, 51, 0.18));
}

#foStatus .metric span {
  color: #64748b;
  font-size: 12px;
  font-weight: 860;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#foStatus .metric strong {
  margin: 12px 0 8px;
  color: #142033;
  font-size: clamp(34px, 4vw, 52px);
  font-weight: 860;
  letter-spacing: -0.06em;
}

#foStatus .metric small {
  display: inline-flex;
  width: fit-content;
  border-radius: 999px;
  padding: 7px 11px;
  color: #725419;
  background: #fff3c4;
  font-weight: 820;
}

body.theme-dark #frontoffice.setup-workspace #foStatus .metrics,
body:not(.theme-light) #frontoffice.setup-workspace #foStatus .metrics {
  background:
    radial-gradient(circle at 10% 0%, rgba(215, 181, 110, 0.12), transparent 30%),
    linear-gradient(145deg, rgba(9, 21, 39, 0.98), rgba(4, 12, 24, 0.99)) !important;
  border-color: rgba(215, 181, 110, 0.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 22px 58px rgba(0,0,0,.25) !important;
}

body.theme-dark #frontoffice.setup-workspace #foStatus .metric,
body:not(.theme-light) #frontoffice.setup-workspace #foStatus .metric {
  background: linear-gradient(145deg, rgba(9, 21, 39, 0.98), rgba(5, 13, 26, 0.98)) !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 18px 34px rgba(0,0,0,.22) !important;
}

body.theme-dark #frontoffice.setup-workspace #foStatus .metric span,
body:not(.theme-light) #frontoffice.setup-workspace #foStatus .metric span {
  color: rgba(218, 230, 247, 0.70) !important;
}

body.theme-dark #frontoffice.setup-workspace #foStatus .metric strong,
body:not(.theme-light) #frontoffice.setup-workspace #foStatus .metric strong {
  color: #fff7dc !important;
}

body.theme-dark #frontoffice.setup-workspace #foStatus .metric small,
body:not(.theme-light) #frontoffice.setup-workspace #foStatus .metric small {
  background: linear-gradient(135deg, #fff1b8, #d5aa55) !important;
  color: #182337 !important;
}

.folio-grid {
  padding: 2px;
}

.folio-ledger .table-wrap {
  box-shadow: none;
}

.folio-balance {
  border-radius: 14px;
  font-size: 16px;
}

.folio-balance.balanced {
  border: 1px solid rgba(22, 163, 74, 0.22);
  background: #f0fdf4;
}

.folio-balance.open {
  border: 1px solid rgba(217, 119, 6, 0.22);
  background: #fffbeb;
}

.eod-check,
.eod-step {
  border-radius: 14px;
  box-shadow: 0 8px 18px rgba(17, 24, 39, 0.04);
}

.eod-check.ok,
.eod-step.done {
  background: #f0fdf4;
}

.eod-check.warning {
  background: #fffbeb;
}

.eod-check.blocker {
  background: #fef2f2;
}

.notice-card,
.crm-duplicate-notice,
.crm-duplicate-panel {
  border-radius: 14px;
}

.log-table td {
  line-height: 1.55;
}

@media (max-width: 900px) {
  .main {
    padding: 16px;
  }

  .topbar {
    min-height: 68px;
    border-radius: 16px;
  }

  .topbar-title-group #viewTitle {
    font-size: 22px;
  }
}

@media (max-width: 980px) {
  .direct-review-detail-grid {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }

  .direct-review-actions {
    justify-content: stretch;
  }

  .direct-review-actions .ghost-button {
    flex: 1 1 120px;
  }
}

@media (max-width: 640px) {
  .direct-review-title {
    align-items: flex-start;
    flex-direction: column;
  }

  .direct-review-detail-grid {
    grid-template-columns: 1fr;
  }
}

/* Gün Sonu Command Center live design — WEB premium approved option */
#endofday {
  background:
    radial-gradient(circle at 10% 0%, rgba(184, 134, 47, 0.24), transparent 32%),
    linear-gradient(135deg, #08111f 0%, #13233b 50%, #22385a 100%);
  border-radius: 30px;
  color: #f8fafc;
  padding: 28px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

#endofday .setup-header {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(280px, 0.82fr);
  gap: 24px;
  align-items: stretch;
  margin-bottom: 24px;
  border: 1px solid rgba(245, 210, 138, 0.26);
  border-radius: 28px;
  padding: 30px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.13),
    0 24px 60px rgba(2, 6, 23, 0.24);
}

#endofday .setup-header .eyebrow {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border: 1px solid rgba(34, 197, 94, 0.35);
  border-radius: 999px;
  padding: 8px 12px;
  color: #bbf7d0;
  background: rgba(22, 163, 74, 0.16);
  letter-spacing: 0.08em;
}

#endofday .setup-header h2 {
  max-width: 720px;
  margin-top: 10px;
  color: #ffffff;
  font-size: clamp(42px, 4.8vw, 64px);
  line-height: 0.96;
  letter-spacing: -0.065em;
}

#endofday .setup-header > span {
  align-self: stretch;
  display: flex;
  align-items: flex-end;
  min-height: 190px;
  border: 1px solid rgba(245, 210, 138, 0.24);
  border-radius: 26px;
  padding: 22px;
  color: #142033;
  background:
    radial-gradient(circle at 100% 0%, rgba(184, 134, 47, 0.2), transparent 38%),
    linear-gradient(145deg, #ffffff, #f8fafc);
  box-shadow: 0 18px 40px rgba(2, 6, 23, 0.18);
  font-size: 16px;
  font-weight: 850;
  line-height: 1.55;
}

#endofday .eod-panel {
  margin-bottom: 22px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 26px;
  color: #f8fafc;
  background: rgba(255, 255, 255, 0.075);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 20px 52px rgba(2, 6, 23, 0.2);
  backdrop-filter: blur(10px);
}

#endofday .eod-panel:first-of-type {
  color: #142033;
  background:
    radial-gradient(circle at 100% 0%, rgba(184, 134, 47, 0.17), transparent 40%),
    linear-gradient(145deg, #f8fafc, #ffffff);
}

#endofday .eod-topline {
  border-bottom: 1px solid rgba(184, 134, 47, 0.18);
}

#endofday .eod-topline > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 12px;
  width: 100%;
}

#endofday .eod-topline strong {
  display: grid;
  gap: 6px;
  border: 1px solid rgba(184, 134, 47, 0.24);
  border-radius: 18px;
  padding: 16px;
  color: #142033;
  background: #fff8ea;
  box-shadow: none;
}

#endofday .eod-panel:first-of-type > p {
  color: #475569;
}

#endofday .eod-actions {
  gap: 12px;
}

#endofday .eod-actions .primary-button {
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, #162237, #314866 60%, #b8862f);
  box-shadow: 0 16px 30px rgba(15, 23, 42, 0.24);
}

#endofday .eod-actions .ghost-button {
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 999px;
  color: #1f2937;
  background: rgba(255, 255, 255, 0.88);
}

#endofday .panel-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

#endofday .panel-header h3 {
  color: #ffffff;
  letter-spacing: -0.035em;
}

#endofday #eodStatusSummary {
  border: 1px solid rgba(245, 210, 138, 0.25);
  color: #fde68a;
  background: rgba(245, 210, 138, 0.14);
}

#endofday .eod-check,
#endofday .eod-step {
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-left-width: 1px;
  border-radius: 18px;
  color: #f8fafc;
  background: rgba(255, 255, 255, 0.085);
  box-shadow: none;
}

#endofday .eod-check {
  grid-template-columns: 20px 1fr auto;
  align-items: center;
}

#endofday .eod-check::before {
  content: "";
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 0 6px rgba(34, 197, 94, 0.12);
}

#endofday .eod-check.warning::before {
  background: #f59e0b;
  box-shadow: 0 0 0 6px rgba(245, 158, 11, 0.13);
}

#endofday .eod-check.blocker::before {
  background: #ef4444;
  box-shadow: 0 0 0 6px rgba(239, 68, 68, 0.14);
}

#endofday .eod-check strong,
#endofday .eod-step span,
#endofday .eod-step strong {
  color: #ffffff;
}

#endofday .eod-check span,
#endofday .eod-check small {
  color: #cbd5e1;
}

#endofday .eod-check.ok,
#endofday .eod-step.done,
#endofday .eod-check.warning,
#endofday .eod-check.blocker {
  background: rgba(255, 255, 255, 0.085);
}

#endofday .eod-step {
  grid-template-columns: 42px 1fr;
  gap: 14px;
}

#endofday .eod-step strong {
  width: 42px;
  height: 42px;
  color: #f5d28a;
  background: rgba(245, 210, 138, 0.18);
}

#endofday .metric {
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 20px;
  color: #f8fafc;
  background: rgba(255, 255, 255, 0.08);
  box-shadow: none;
}

#endofday .metric span,
#endofday .metric small {
  color: #cbd5e1;
}

#endofday .metric strong {
  color: #ffffff;
}

#endofday .eod-detail-panel {
  border-color: rgba(255, 255, 255, 0.16);
  border-radius: 20px;
  background: rgba(15, 23, 42, 0.58);
  box-shadow: 0 20px 45px rgba(2, 6, 23, 0.22);
}

#endofday .eod-detail-panel .table-wrap {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.96);
}

@media (max-width: 980px) {
  #endofday,
  #endofday .setup-header {
    border-radius: 22px;
    padding: 20px;
  }

  #endofday .setup-header {
    grid-template-columns: 1fr;
  }

  #endofday .setup-header > span {
    min-height: auto;
  }

  #endofday .eod-topline > div {
    grid-template-columns: 1fr;
  }
}

/* Gün Sonu Command Center QA refinement: readable control cards */
#endofday .eod-check {
  grid-template-columns: 22px minmax(220px, 0.62fr) minmax(260px, 1fr);
  gap: 14px;
  min-height: 106px;
}

#endofday .eod-check::before {
  align-self: start;
  margin-top: 4px;
}

#endofday .eod-check strong {
  align-self: start;
  max-width: none;
  line-height: 1.12;
}

#endofday .eod-check span {
  align-self: start;
  line-height: 1.25;
}

#endofday .eod-check small {
  grid-column: 2 / -1;
  line-height: 1.2;
}

@media (max-width: 1120px) {
  #endofday .eod-check {
    grid-template-columns: 22px 1fr;
  }

  #endofday .eod-check span,
  #endofday .eod-check small {
    grid-column: 2;
  }
}

/* Gün Sonu Command Center QA refinement 2: two-column readable checks */
#endofday .eod-check {
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 12px 14px;
  align-items: start;
  min-height: 128px;
}

#endofday .eod-check strong,
#endofday .eod-check span,
#endofday .eod-check small {
  grid-column: 2;
  overflow-wrap: anywhere;
}

#endofday .eod-check strong {
  font-size: 16px;
}

#endofday .eod-check span {
  margin-top: -4px;
}

/* Gün Sonu Command Center user correction: palette action panel + visible detail cards */
#endofday .eod-panel:first-of-type {
  color: #f8fafc;
  background:
    radial-gradient(circle at 100% 0%, rgba(245, 210, 138, 0.16), transparent 42%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.115), rgba(255, 255, 255, 0.045));
  border-color: rgba(245, 210, 138, 0.22);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.11),
    0 20px 48px rgba(2, 6, 23, 0.22);
}

#endofday .eod-panel:first-of-type .eod-topline {
  border-bottom-color: rgba(245, 210, 138, 0.18);
}

#endofday .eod-panel:first-of-type .eod-topline strong {
  color: #fff7df;
  background: rgba(245, 210, 138, 0.12);
  border-color: rgba(245, 210, 138, 0.24);
}

#endofday .eod-panel:first-of-type > p {
  color: #cbd5e1;
}

#endofday .eod-actions .ghost-button {
  color: #fff7df;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(245, 210, 138, 0.24);
}

#endofday .eod-detail-panel {
  margin: 18px 0 0;
  padding: 18px;
  border: 1px solid rgba(245, 210, 138, 0.18);
  background:
    radial-gradient(circle at 100% 0%, rgba(184, 134, 47, 0.13), transparent 38%),
    rgba(8, 17, 31, 0.74);
}

#endofday .eod-detail-panel .panel-header {
  margin-bottom: 14px;
}

#endofday .eod-detail-panel .table-wrap {
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

#endofday .eod-detail-panel table,
#endofday .eod-detail-panel tbody {
  display: block;
  width: 100%;
}

#endofday .eod-detail-panel thead {
  display: none;
}

#endofday .eod-detail-row {
  display: grid;
  grid-template-columns: minmax(130px, 0.75fr) minmax(150px, 0.95fr) minmax(80px, 0.45fr) minmax(190px, 1fr) minmax(260px, 1.35fr) auto;
  gap: 10px;
  align-items: stretch;
  margin-bottom: 12px;
  border: 1px solid rgba(245, 210, 138, 0.16);
  border-radius: 18px;
  padding: 12px;
  color: #f8fafc;
  background: rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

#endofday .eod-detail-row td {
  display: grid;
  gap: 5px;
  align-content: start;
  border: 0;
  padding: 8px 10px;
  color: #f8fafc;
  background: rgba(255, 255, 255, 0.055);
  border-radius: 13px;
  font-weight: 760;
  line-height: 1.25;
  white-space: normal;
  min-width: 0;
}

#endofday .eod-detail-row td::before {
  content: attr(data-label);
  color: #f5d28a;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#endofday .eod-detail-row td strong {
  color: #ffffff;
}

#endofday .eod-detail-row td small {
  display: block;
  color: #cbd5e1;
  font-size: 12px;
  line-height: 1.3;
}

#endofday #closeEodDetailButton {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(245, 210, 138, 0.26);
  color: #f8e6b6;
}

#endofday #closeEodDetailButton:hover {
  background: rgba(245, 210, 138, 0.14);
  color: #ffffff;
}

#endofday .eod-detail-status {
  width: fit-content;
  border-radius: 999px;
  padding: 5px 9px;
  color: #bbf7d0;
  background: rgba(22, 163, 74, 0.16);
  border: 1px solid rgba(34, 197, 94, 0.3);
  font-size: 12px;
  font-weight: 900;
}

#endofday .eod-detail-row .ghost-button {
  align-self: center;
  justify-self: start;
  border-radius: 999px;
  color: #0f172a;
  background: linear-gradient(135deg, #fff7df, #f5d28a);
  border-color: rgba(245, 210, 138, 0.52);
  box-shadow: 0 12px 24px rgba(2, 6, 23, 0.24);
}

@media (max-width: 1180px) {
  #endofday .eod-detail-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  #endofday .eod-detail-row {
    grid-template-columns: 1fr;
  }
}

/* Gün Sonu Command Center final QA correction: remove white hero card + no clipped detail action */
#endofday .setup-header > span {
  color: #fff7df;
  background:
    radial-gradient(circle at 100% 0%, rgba(245, 210, 138, 0.18), transparent 38%),
    linear-gradient(145deg, rgba(245, 210, 138, 0.14), rgba(255, 255, 255, 0.055));
  border-color: rgba(245, 210, 138, 0.26);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 18px 40px rgba(2, 6, 23, 0.2);
}

#endofday .eod-detail-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
}

#endofday .eod-detail-row td[data-label="Problem"] {
  grid-column: 1 / -1;
}

#endofday .eod-detail-row td[data-label="İşlem"] {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
}

#endofday .eod-detail-row td[data-label="İşlem"]::before {
  flex: 0 0 auto;
}

#endofday .eod-detail-row .ghost-button {
  max-width: 100%;
  white-space: nowrap;
}

@media (min-width: 1181px) {
  #endofday .eod-detail-row {
    grid-template-columns: minmax(120px, 0.75fr) minmax(150px, 1fr) minmax(80px, 0.45fr) minmax(180px, 1fr);
  }

  #endofday .eod-detail-row td[data-label="Problem"],
  #endofday .eod-detail-row td[data-label="İşlem"] {
    grid-column: auto;
  }

  #endofday .eod-detail-row td[data-label="İşlem"] {
    justify-content: center;
  }
}

/* Gün Sonu Command Center visual polish: calmer headers, action briefing, balanced metrics */
#endofday .setup-header {
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, 0.92fr);
}

#endofday .setup-header h2 {
  font-size: clamp(38px, 4.2vw, 58px);
  letter-spacing: -0.06em;
}

#endofday .eod-panel:first-of-type {
  display: grid;
  gap: 16px;
  padding: 20px;
  overflow: hidden;
}

#endofday .eod-panel:first-of-type .eod-topline {
  padding: 0;
  border-bottom: 0;
}

#endofday .eod-panel:first-of-type .eod-topline strong {
  min-height: 76px;
  justify-content: center;
  background:
    radial-gradient(circle at 100% 0%, rgba(245, 210, 138, 0.18), transparent 38%),
    rgba(255, 255, 255, 0.07);
}

#endofday .eod-panel:first-of-type > p {
  margin: 0;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 18px;
  padding: 17px 18px;
  color: #dbeafe;
  background: rgba(8, 17, 31, 0.32);
  font-weight: 760;
  line-height: 1.55;
}

#endofday .eod-actions {
  justify-content: flex-end;
  margin: 0;
  padding: 0;
}

#endofday .eod-panel > .panel-header {
  margin: 0;
  border-bottom: 1px solid rgba(245, 210, 138, 0.16);
  border-radius: 24px 24px 0 0;
  background:
    radial-gradient(circle at 100% 0%, rgba(245, 210, 138, 0.13), transparent 36%),
    linear-gradient(135deg, rgba(8, 17, 31, 0.72), rgba(30, 47, 75, 0.62));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

#endofday .eod-panel > .panel-header h3 {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

#endofday .eod-panel > .panel-header h3::before {
  content: "";
  width: 9px;
  height: 22px;
  border-radius: 999px;
  background: linear-gradient(180deg, #f5d28a, #b8862f);
  box-shadow: 0 0 18px rgba(245, 210, 138, 0.32);
}

#endofday #eodStatusSummary {
  color: #fff7df;
  background: rgba(245, 210, 138, 0.12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

#endofday .eod-check-grid {
  padding-top: 18px;
}

#endofday .eod-check {
  min-height: 116px;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

#endofday .eod-check:not(:disabled):hover {
  transform: translateY(-2px);
  border-color: rgba(245, 210, 138, 0.28);
  background: rgba(255, 255, 255, 0.11);
}

#endofday #eodMetrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding-top: 18px;
}

#endofday .metric {
  min-height: 116px;
  padding: 18px 20px;
  background:
    radial-gradient(circle at 100% 0%, rgba(245, 210, 138, 0.09), transparent 36%),
    rgba(255, 255, 255, 0.075);
}

#endofday .metric strong {
  margin-top: 6px;
  font-size: clamp(24px, 2vw, 32px);
  letter-spacing: -0.04em;
}

@media (max-width: 980px) {
  #endofday #eodMetrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  #endofday #eodMetrics {
    grid-template-columns: 1fr;
  }

  #endofday .eod-actions {
    justify-content: stretch;
  }

  #endofday .eod-actions button {
    flex: 1 1 100%;
  }
}


/* Accounting / Finans Command Center premium shell */
#accounting {
  --accounting-navy-950: #07111f;
  --accounting-navy-900: #0b1728;
  --accounting-navy-800: #13233b;
  --accounting-navy-700: #22385a;
  --accounting-gold: #f5d28a;
  --accounting-gold-strong: #b8862f;
  --accounting-ink: #f8fafc;
  --accounting-muted: #cbd5e1;
  --accounting-line: rgba(245, 210, 138, 0.18);
  padding: 28px;
  border-radius: 0;
  background:
    radial-gradient(circle at 12% 0%, rgba(184, 134, 47, 0.24), transparent 30%),
    linear-gradient(135deg, #08111f 0%, #13233b 55%, #22385a 100%);
  color: var(--accounting-ink);
}

#accounting .accounting-command-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(280px, 0.58fr);
  gap: 22px;
  align-items: stretch;
  margin-bottom: 22px;
  border: 1px solid rgba(245, 210, 138, 0.24);
  border-radius: 30px;
  padding: 28px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.03));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 22px 56px rgba(2, 6, 23, 0.24);
}

#accounting .accounting-command-hero .eyebrow {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  border: 1px solid rgba(34, 197, 94, 0.36);
  border-radius: 999px;
  padding: 8px 12px;
  color: #bbf7d0;
  background: rgba(22, 163, 74, 0.16);
  letter-spacing: 0.09em;
  font-size: 12px;
  font-weight: 900;
}

#accounting .accounting-command-hero h2 {
  margin: 14px 0 10px;
  color: #ffffff;
  font-size: clamp(42px, 4.2vw, 58px);
  line-height: 0.98;
  letter-spacing: -0.065em;
}

#accounting .accounting-hero-copy {
  margin: 0;
  max-width: 760px;
  color: #dbeafe;
  font-size: 17px;
  line-height: 1.55;
  font-weight: 720;
}

#accounting .accounting-command-status {
  display: grid;
  gap: 14px;
  align-content: end;
  border: 1px solid rgba(245, 210, 138, 0.25);
  border-radius: 26px;
  padding: 22px;
  background:
    radial-gradient(circle at 100% 0%, rgba(245, 210, 138, 0.18), transparent 38%),
    linear-gradient(145deg, rgba(245, 210, 138, 0.13), rgba(255, 255, 255, 0.055));
}

#accounting .accounting-command-status small {
  color: var(--accounting-gold);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.11em;
}

#accounting .accounting-command-status strong {
  color: #fff7df;
  font-size: 30px;
  letter-spacing: -0.04em;
}

#accounting .accounting-command-status span {
  color: var(--accounting-muted);
  font-weight: 720;
  line-height: 1.45;
}

#accounting .accounting-control-panel {
  margin-bottom: 22px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 26px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.075);
  box-shadow: none;
}

#accounting .accounting-controls {
  grid-template-columns: repeat(4, minmax(140px, 1fr)) minmax(120px, 0.72fr);
  gap: 12px;
}

#accounting .accounting-controls label {
  color: #dbeafe;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.03em;
}

#accounting .accounting-controls input,
#accounting .accounting-controls select {
  min-height: 46px;
  border-radius: 15px;
  border: 1px solid rgba(245, 210, 138, 0.18);
  background: rgba(8, 17, 31, 0.42);
  color: #fff7df;
  font-weight: 850;
}

#accounting #saveAccountingSettingsButton {
  align-self: end;
  min-height: 46px;
  border-radius: 15px;
  background: linear-gradient(135deg, #17243a, #314866 58%, #b8862f);
  border-color: rgba(245, 210, 138, 0.34);
  color: #fff7df;
  box-shadow: 0 16px 32px rgba(2, 6, 23, 0.22);
}

#accounting .exchange-rate-note {
  color: #cbd5e1;
  font-weight: 720;
}

#accounting .setup-tabs {
  margin: 22px 0;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 22px;
  background: rgba(8, 17, 31, 0.32);
}

#accounting .setup-tabs button {
  border-radius: 999px;
  padding: 10px 14px;
  color: #cbd5e1;
  background: rgba(255, 255, 255, 0.055);
  font-size: 13px;
  font-weight: 900;
}

#accounting .setup-tabs button.active {
  color: #0f172a;
  background: linear-gradient(135deg, #fff7df, #f5d28a);
}

#accounting .metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

#accounting .metric,
#accounting .panel {
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 24px;
  background:
    radial-gradient(circle at 100% 0%, rgba(245, 210, 138, 0.10), transparent 36%),
    rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

#accounting .metric {
  min-height: 126px;
  padding: 20px;
}

#accounting .metric.risk {
  border-color: rgba(239, 68, 68, 0.24);
  background: radial-gradient(circle at 100% 0%, rgba(239, 68, 68, 0.13), transparent 36%), rgba(255, 255, 255, 0.08);
}

#accounting .metric.warn {
  border-color: rgba(245, 158, 11, 0.24);
  background: radial-gradient(circle at 100% 0%, rgba(245, 158, 11, 0.13), transparent 36%), rgba(255, 255, 255, 0.08);
}

#accounting .metric span {
  color: #cbd5e1;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#accounting .metric strong {
  display: block;
  margin: 10px 0 6px;
  color: #ffffff;
  font-size: 28px;
  letter-spacing: -0.045em;
}

#accounting .metric small {
  color: #93a4b8;
  font-weight: 760;
  line-height: 1.35;
}

#accounting .accounting-command-lower {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 14px;
  margin-top: 14px;
}

#accounting .panel {
  overflow: hidden;
}

#accounting .panel-header {
  padding: 16px 18px;
  border-bottom: 1px solid rgba(245, 210, 138, 0.16);
  background: linear-gradient(135deg, rgba(8, 17, 31, 0.72), rgba(30, 47, 75, 0.62));
}

#accounting .panel-header h3 {
  margin: 0;
  color: #ffffff;
  font-size: 18px;
  letter-spacing: -0.03em;
}

#accounting .status {
  border: 1px solid rgba(245, 210, 138, 0.2);
  border-radius: 999px;
  padding: 7px 10px;
  color: #fff7df;
  background: rgba(245, 210, 138, 0.12);
  font-size: 12px;
  font-weight: 900;
}

#accounting table {
  color: #e2e8f0;
}

#accounting th,
#accounting td {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  white-space: nowrap;
}

#accounting th {
  color: #f5d28a;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#accounting td {
  color: #e2e8f0;
  font-weight: 720;
}

#accounting .accounting-tab-panel > .panel:not(.accounting-risk-panel):not(.accounting-voucher-preview-panel),
#accounting #pendingRefundAccountingPanel {
  margin-top: 14px;
}

@media (max-width: 1180px) {
  #accounting .accounting-command-hero,
  #accounting .accounting-command-lower {
    grid-template-columns: 1fr;
  }

  #accounting .accounting-controls,
  #accounting .metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  #accounting {
    padding: 18px;
  }

  #accounting .accounting-controls,
  #accounting .metrics {
    grid-template-columns: 1fr;
  }

  #accounting .accounting-command-hero h2 {
    font-size: 36px;
  }
}


/* Accounting command center table contrast refinement */
#accounting .table-wrap {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(8, 17, 31, 0.28);
}

#accounting .accounting-risk-panel .table-wrap,
#accounting .accounting-voucher-preview-panel .table-wrap,
#accounting #pendingRefundAccountingPanel .table-wrap {
  max-width: 100%;
  overflow-x: hidden;
  overflow-y: visible;
}

#accounting .accounting-risk-panel .table-wrap.has-horizontal-overflow,
#accounting .accounting-voucher-preview-panel .table-wrap.has-horizontal-overflow,
#accounting #pendingRefundAccountingPanel .table-wrap.has-horizontal-overflow {
  overflow-x: auto;
}

#accounting .accounting-risk-panel table,
#accounting .accounting-voucher-preview-panel table,
#accounting #pendingRefundAccountingPanel table {
  width: 100%;
  min-width: 0;
}

#accounting .accounting-risk-panel table.pms-resizable-table,
#accounting .accounting-voucher-preview-panel table.pms-resizable-table,
#accounting #pendingRefundAccountingPanel table.pms-resizable-table {
  min-width: 100%;
}

#accounting .accounting-risk-panel th,
#accounting .accounting-risk-panel td,
#accounting .accounting-voucher-preview-panel th,
#accounting .accounting-voucher-preview-panel td,
#accounting #pendingRefundAccountingPanel th,
#accounting #pendingRefundAccountingPanel td {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#accounting table,
#accounting thead,
#accounting tbody,
#accounting tr,
#accounting td,
#accounting th {
  background: transparent !important;
}

#accounting tbody tr:nth-child(odd) {
  background: rgba(255, 255, 255, 0.035) !important;
}

#accounting tbody tr:hover {
  background: rgba(245, 210, 138, 0.08) !important;
}

#accounting #pendingRefundAccountingPanel .section-heading {
  padding: 16px 18px;
  border-bottom: 1px solid rgba(245, 210, 138, 0.16);
  background: linear-gradient(135deg, rgba(8, 17, 31, 0.72), rgba(30, 47, 75, 0.62));
}

#accounting #pendingRefundAccountingPanel .section-heading p {
  margin: 0 0 6px;
  color: #f5d28a;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#accounting #pendingRefundAccountingPanel .section-heading h3 {
  margin: 0;
  color: #ffffff;
  font-size: 18px;
  letter-spacing: -0.03em;
}

#accounting #pendingRefundAccountingPanel .section-heading .status {
  align-self: center;
}

#accounting .accounting-risk-panel td,
#accounting .accounting-voucher-preview-panel td,
#accounting #pendingRefundAccountingPanel td {
  color: #e2e8f0;
}

#accounting .accounting-risk-panel th,
#accounting .accounting-voucher-preview-panel th,
#accounting #pendingRefundAccountingPanel th {
  color: #f5d28a;
}


/* Users / Access Command Center premium shell */
#users {
  --users-navy-950: #07111f;
  --users-navy-900: #0b1728;
  --users-navy-800: #13233b;
  --users-navy-700: #22385a;
  --users-gold: #f5d28a;
  --users-gold-strong: #b8862f;
  --users-ink: #f8fafc;
  --users-muted: #cbd5e1;
  --users-line: rgba(245, 210, 138, 0.18);
  padding: 28px;
  background:
    radial-gradient(circle at 12% 0%, rgba(184, 134, 47, 0.24), transparent 30%),
    linear-gradient(135deg, #08111f 0%, #13233b 56%, #22385a 100%);
  color: var(--users-ink);
}

#userInfo .users-command-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.62fr);
  gap: 22px;
  align-items: stretch;
  margin-bottom: 22px;
  border: 1px solid rgba(245, 210, 138, 0.24);
  border-radius: 30px;
  padding: 28px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.03));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 22px 56px rgba(2, 6, 23, 0.24);
}

#userInfo .users-command-hero .eyebrow {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  border: 1px solid rgba(34, 197, 94, 0.36);
  border-radius: 999px;
  padding: 8px 12px;
  color: #bbf7d0;
  background: rgba(22, 163, 74, 0.16);
  letter-spacing: 0.09em;
  font-size: 12px;
  font-weight: 900;
}

#userInfo .users-command-hero h2 {
  margin: 14px 0 10px;
  color: #ffffff;
  font-size: clamp(40px, 3.8vw, 54px);
  line-height: 0.99;
  letter-spacing: -0.062em;
}

#userInfo .users-hero-copy {
  margin: 0;
  max-width: 760px;
  color: #dbeafe;
  font-size: 17px;
  line-height: 1.55;
  font-weight: 720;
}

#userInfo .users-command-status {
  display: grid;
  gap: 14px;
  align-content: end;
  border: 1px solid rgba(245, 210, 138, 0.25);
  border-radius: 26px;
  padding: 22px;
  background:
    radial-gradient(circle at 100% 0%, rgba(245, 210, 138, 0.18), transparent 38%),
    linear-gradient(145deg, rgba(245, 210, 138, 0.13), rgba(255, 255, 255, 0.055));
}

#userInfo .users-command-status small {
  color: var(--users-gold);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.11em;
}

#userInfo .users-command-status strong {
  color: #fff7df;
  font-size: 30px;
  letter-spacing: -0.04em;
}

#userInfo .users-command-status span {
  color: var(--users-muted);
  font-weight: 720;
  line-height: 1.45;
}

#userInfo .users-command-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 22px 0 14px;
}

#users .metric,
#users .panel,
#userInfo .card {
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 24px;
  background:
    radial-gradient(circle at 100% 0%, rgba(245, 210, 138, 0.10), transparent 36%),
    rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

#users .metric {
  min-height: 116px;
  padding: 20px;
}

#users .metric.warn {
  border-color: rgba(245, 158, 11, 0.25);
  background: radial-gradient(circle at 100% 0%, rgba(245, 158, 11, 0.14), transparent 36%), rgba(255, 255, 255, 0.08);
}

#users .metric span {
  color: #cbd5e1;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#users .metric strong {
  display: block;
  margin: 10px 0 6px;
  color: #ffffff;
  font-size: 30px;
  letter-spacing: -0.045em;
}

#users .metric small {
  color: #93a4b8;
  font-weight: 760;
}

#userInfo .users-command-workspace {
  display: grid;
  grid-template-columns: minmax(340px, 0.78fr) minmax(0, 1.22fr);
  gap: 14px;
  align-items: start;
}

#users .panel {
  overflow: hidden;
}

#users .panel-header {
  padding: 16px 18px;
  border-bottom: 1px solid rgba(245, 210, 138, 0.16);
  background: linear-gradient(135deg, rgba(8, 17, 31, 0.72), rgba(30, 47, 75, 0.62));
}

#users .panel-header h3 {
  margin: 0;
  color: #ffffff;
  font-size: 18px;
  letter-spacing: -0.03em;
}

#users .panel-note {
  border: 1px solid rgba(245, 210, 138, 0.2);
  border-radius: 999px;
  padding: 7px 10px;
  color: #fff7df;
  background: rgba(245, 210, 138, 0.12);
  font-size: 12px;
  font-weight: 900;
}

#userInfo .role-definition-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 16px;
}

#userInfo .role-card {
  border-radius: 18px;
  padding: 16px;
  background: rgba(8, 17, 31, 0.28);
}

#userInfo .role-card.admin {
  border-color: rgba(245, 210, 138, 0.32);
  background: radial-gradient(circle at 100% 0%, rgba(245, 210, 138, 0.12), transparent 40%), rgba(8, 17, 31, 0.32);
}

#userInfo .role-card strong {
  color: #ffffff;
}

#userInfo .role-card span,
#userInfo .role-card p,
#userInfo .role-card small {
  color: #cbd5e1;
  font-weight: 700;
}

#userInfo .users-management-panel .split-panel {
  grid-template-columns: minmax(220px, 0.52fr) minmax(0, 1.48fr);
  gap: 0;
}

#users #userManagementForm {
  align-content: start;
  gap: 12px;
  padding: 16px;
  border-right: 1px solid rgba(245, 210, 138, 0.12);
  background: rgba(8, 17, 31, 0.24);
}

#users #userManagementForm label {
  color: #dbeafe;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.03em;
}

#users #userManagementForm input,
#users #userManagementForm select {
  min-height: 44px;
  border-radius: 15px;
  border: 1px solid rgba(245, 210, 138, 0.18);
  background: rgba(8, 17, 31, 0.42);
  color: #fff7df;
  font-weight: 850;
}

#users #userManagementForm .primary-button {
  min-height: 46px;
  border-radius: 15px;
  background: linear-gradient(135deg, #17243a, #314866 58%, #b8862f);
  border-color: rgba(245, 210, 138, 0.34);
  color: #fff7df;
  box-shadow: 0 16px 32px rgba(2, 6, 23, 0.22);
}

#users .table-wrap {
  background: rgba(8, 17, 31, 0.28);
}

#users table {
  table-layout: fixed;
  color: #e2e8f0;
}

#users table,
#users thead,
#users tbody,
#users tr,
#users td,
#users th {
  background: transparent !important;
}

#users tbody tr:nth-child(odd) {
  background: rgba(255, 255, 255, 0.035) !important;
}

#users tbody tr:hover {
  background: rgba(245, 210, 138, 0.08) !important;
}

#users th,
#users td {
  padding: 11px 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#users th {
  color: #f5d28a;
  font-size: 10px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

#users td {
  color: #e2e8f0;
  font-size: 12px;
  font-weight: 720;
}

#users .status.active,
#users .status.clean {
  color: #bbf7d0;
  background: rgba(34, 197, 94, 0.13);
  border: 1px solid rgba(34, 197, 94, 0.24);
}

#users .status.passive,
#users .status.warning {
  color: #fecaca;
  background: rgba(239, 68, 68, 0.12);
  border: 1px solid rgba(239, 68, 68, 0.24);
}

#users td:last-child {
  white-space: normal;
}

#users td:last-child .ghost-button {
  min-height: 30px;
  margin: 2px;
  padding: 6px 8px;
  border-radius: 999px;
  color: #fff7df;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(245, 210, 138, 0.16);
  font-size: 11px;
}

#users td:last-child .ghost-button:disabled {
  opacity: 0.38;
}

@media (max-width: 1180px) {
  #userInfo .users-command-hero,
  #userInfo .users-command-workspace,
  #userInfo .users-management-panel .split-panel {
    grid-template-columns: 1fr;
  }

  #userInfo .users-command-metrics,
  #userInfo .role-definition-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #users #userManagementForm {
    border-right: 0;
    border-bottom: 1px solid rgba(245, 210, 138, 0.12);
  }
}

@media (max-width: 760px) {
  #users {
    padding: 18px;
  }

  #userInfo .users-command-metrics,
  #userInfo .role-definition-grid {
    grid-template-columns: 1fr;
  }

  #userInfo .users-command-hero h2 {
    font-size: 34px;
  }
}


/* Users command center live density correction */
#userInfo .users-command-workspace {
  grid-template-columns: minmax(320px, 0.72fr) minmax(0, 1.28fr);
}

#userInfo .users-role-panel {
  max-height: 720px;
}

#userInfo .users-role-panel .role-definition-grid {
  max-height: 650px;
  overflow-y: auto;
  grid-template-columns: 1fr;
  padding-right: 10px;
}

#userInfo .role-card {
  min-height: auto;
}

#userInfo .role-card > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

#userInfo .role-card strong {
  line-height: 1.15;
}

#userInfo .role-card span {
  border-radius: 999px;
  padding: 5px 8px;
  color: #fff7df;
  background: rgba(245, 210, 138, 0.10);
  font-size: 12px;
  white-space: nowrap;
}

#userInfo .users-management-panel .split-panel {
  display: grid;
  grid-template-columns: 1fr;
}

#users #userManagementForm {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(140px, 0.7fr);
  border-right: 0;
  border-bottom: 1px solid rgba(245, 210, 138, 0.12);
}

#users #userManagementForm button {
  align-self: end;
}

#userInfo .users-management-panel .table-wrap {
  overflow-x: auto;
}

#userInfo .users-management-panel table {
  min-width: 760px;
  table-layout: fixed;
}

#userInfo .users-management-panel th:nth-child(1),
#userInfo .users-management-panel td:nth-child(1) { width: 17%; }
#userInfo .users-management-panel th:nth-child(2),
#userInfo .users-management-panel td:nth-child(2) { width: 13%; }
#userInfo .users-management-panel th:nth-child(3),
#userInfo .users-management-panel td:nth-child(3) { width: 18%; }
#userInfo .users-management-panel th:nth-child(4),
#userInfo .users-management-panel td:nth-child(4) { width: 15%; }
#userInfo .users-management-panel th:nth-child(5),
#userInfo .users-management-panel td:nth-child(5) { width: 10%; }
#userInfo .users-management-panel th:nth-child(6),
#userInfo .users-management-panel td:nth-child(6) { width: 27%; }

#userInfo .users-management-panel td:last-child {
  white-space: nowrap;
  overflow: visible;
}

#userInfo .users-management-panel td:last-child .ghost-button {
  margin: 1px;
  padding: 5px 7px;
  font-size: 10px;
}

@media (max-width: 1280px) {
  #userInfo .users-command-workspace {
    grid-template-columns: 1fr;
  }

  #userInfo .users-role-panel,
  #userInfo .users-role-panel .role-definition-grid {
    max-height: none;
  }

  #userInfo .users-role-panel .role-definition-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Reports Command Center — scoped premium live polish */
#reports.reports-command-center {
  --reports-bg: #07111f;
  --reports-panel: rgba(13, 27, 46, 0.92);
  --reports-panel-soft: rgba(255, 255, 255, 0.045);
  --reports-line: rgba(245, 210, 138, 0.16);
  --reports-line-blue: rgba(130, 181, 255, 0.16);
  --reports-gold: #d7b56e;
  --reports-gold-soft: #f5d28a;
  --reports-blue: #82b5ff;
  --reports-green: #72e0ad;
  --reports-text: #f5f8ff;
  --reports-muted: #9daec7;
  color: var(--reports-text);
}

#reports .reports-command-shell {
  width: 100%;
  padding: 22px;
  border: 1px solid rgba(245, 210, 138, 0.20);
  border-radius: 32px;
  background:
    radial-gradient(circle at 84% 8%, rgba(215, 181, 110, 0.14), transparent 30%),
    radial-gradient(circle at 12% 0%, rgba(130, 181, 255, 0.10), transparent 28%),
    linear-gradient(145deg, #0a1728 0%, #07111f 100%);
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.28);
}

#reports .reports-command-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 16px;
  margin-bottom: 16px;
}

#reports .reports-command-copy,
#reports .reports-command-status,
#reports .reports-insight-panel,
#reports .reports-table-panel,
#reports .report-filter-panel {
  border: 1px solid rgba(255, 255, 255, 0.085);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.060), rgba(255, 255, 255, 0.030));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

#reports .reports-command-copy {
  position: relative;
  overflow: hidden;
  padding: 24px;
  border-radius: 26px;
}

#reports .reports-command-copy::after {
  content: "";
  position: absolute;
  inset: -80px -70px auto auto;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(215, 181, 110, 0.18), transparent 68%);
  pointer-events: none;
}

#reports .reports-command-copy .eyebrow {
  margin: 0 0 8px;
  color: var(--reports-gold-soft);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

#reports .reports-command-copy h2 {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #ffffff;
  font-size: clamp(30px, 4vw, 42px);
  line-height: 1.05;
  letter-spacing: -0.045em;
}

#reports .reports-command-copy p:not(.eyebrow) {
  position: relative;
  z-index: 1;
  max-width: 760px;
  margin: 13px 0 0;
  color: #c9d6ea;
  line-height: 1.55;
}

#reports .reports-command-source {
  position: relative;
  z-index: 1;
  display: inline-flex;
  gap: 10px;
  align-items: center;
  margin-top: 20px;
  padding: 10px 13px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 999px;
  background: rgba(5, 12, 22, 0.58);
}

#reports .reports-command-source span {
  color: var(--reports-muted);
  font-size: 12px;
}

#reports .reports-command-source strong {
  color: #ffffff;
  font-size: 12px;
}

#reports .reports-command-status {
  display: grid;
  gap: 12px;
  padding: 18px;
  border-radius: 26px;
}

#reports .reports-command-status div {
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  background: rgba(5, 12, 22, 0.50);
}

#reports .reports-command-status span,
#reports .reports-insight-panel .panel-header span,
#reports .reports-table-panel .panel-header span {
  display: block;
  color: var(--reports-muted);
  font-size: 12px;
}

#reports .reports-command-status strong {
  display: block;
  margin-top: 8px;
  color: var(--reports-green);
  font-size: 20px;
  letter-spacing: -0.03em;
}

#reports .report-filter-panel {
  padding: 16px;
  border-radius: 22px;
  margin-bottom: 16px;
}

#reports .report-controls {
  grid-template-columns: 190px 190px minmax(150px, 0.35fr);
  align-items: end;
}

#reports .report-controls label {
  color: #c9d6ea;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#reports .report-controls input {
  min-height: 42px;
  border-color: rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  background: rgba(5, 12, 22, 0.70);
  color: #ffffff;
}

#reports .report-controls .primary-button {
  min-height: 42px;
  border-radius: 14px;
  background: linear-gradient(135deg, #f1d492 0%, #b88a3e 100%);
  color: #142033;
  font-weight: 900;
  box-shadow: 0 16px 34px rgba(215, 181, 110, 0.18);
}

#reports .reports-command-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}

#reports .reports-command-metrics .metric-card {
  min-height: 118px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.085);
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.060), rgba(255, 255, 255, 0.030));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

#reports .reports-command-metrics .metric-card span {
  color: var(--reports-muted);
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#reports .reports-command-metrics .metric-card strong {
  color: #ffffff;
  font-size: 28px;
  letter-spacing: -0.04em;
}

#reports .reports-command-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 16px;
  align-items: start;
}

#reports .reports-command-stack {
  display: grid;
  gap: 16px;
  min-width: 0;
}

#reports .reports-table-panel,
#reports .reports-insight-panel {
  border-radius: 24px;
  padding: 18px;
}

#reports .reports-table-panel .panel-header,
#reports .reports-insight-panel .panel-header {
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 14px;
}

#reports .reports-table-panel .panel-header h3,
#reports .reports-insight-panel .panel-header h3 {
  color: #ffffff;
  font-size: 19px;
  letter-spacing: -0.02em;
}

#reports .reports-table-panel .table-wrap {
  overflow-x: hidden;
  overflow-y: visible;
  max-width: 100%;
}

#reports .reports-table-panel .table-wrap.has-horizontal-overflow {
  overflow-x: auto;
}

#reports .reports-table-panel table {
  width: 100%;
  min-width: 0;
  border-collapse: separate;
  border-spacing: 0 8px;
}

#reports .reports-sales-panel table {
  min-width: 0;
}

#reports .reports-table-panel th {
  padding: 0 12px 4px;
  color: #8fa2bd;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#reports .reports-table-panel td {
  padding: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.065);
  border-bottom: 1px solid rgba(255, 255, 255, 0.065);
  background: rgba(6, 14, 25, 0.68);
  color: #d8e2f2;
  font-size: 12px;
}

#reports .reports-table-panel td:first-child {
  border-left: 1px solid rgba(255, 255, 255, 0.065);
  border-radius: 14px 0 0 14px;
  color: #ffffff;
  font-weight: 800;
}

#reports .reports-table-panel td:last-child {
  border-right: 1px solid rgba(255, 255, 255, 0.065);
  border-radius: 0 14px 14px 0;
}

#reports .reports-insight-panel {
  position: sticky;
  top: 18px;
}

#reports .reports-insight-panel article {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 18px;
  background: rgba(6, 14, 25, 0.58);
}

#reports .reports-insight-panel article strong {
  display: block;
  margin-bottom: 6px;
  color: #ffffff;
}

#reports .reports-insight-panel article p {
  margin: 0;
  color: var(--reports-muted);
  font-size: 12px;
  line-height: 1.45;
}

#reports .reports-safety-note {
  border-color: rgba(245, 210, 138, 0.20) !important;
  background: rgba(215, 181, 110, 0.08) !important;
}

@media (max-width: 1280px) {
  #reports .reports-command-hero,
  #reports .reports-command-grid {
    grid-template-columns: 1fr;
  }

  #reports .reports-insight-panel {
    position: static;
  }
}
/* Reports Command Center visual QA correction — dark table headers */
#reports .reports-table-panel .panel-header,
#reports .reports-insight-panel .panel-header {
  padding: 14px 16px;
  border: 1px solid rgba(245, 210, 138, 0.14);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(10, 23, 40, 0.95), rgba(6, 14, 25, 0.92));
  box-shadow: none;
}

#reports .reports-table-panel .panel-header h3,
#reports .reports-insight-panel .panel-header h3 {
  color: #ffffff !important;
  text-shadow: none;
}

#reports .reports-table-panel .panel-header span,
#reports .reports-insight-panel .panel-header span {
  color: #aebdd2 !important;
}

#reports .reports-table-panel table thead th {
  background: rgba(10, 23, 40, 0.96) !important;
  color: #b6c6dd !important;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

#reports .reports-table-panel table thead th:first-child {
  border-left: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 12px 0 0 12px;
}

#reports .reports-table-panel table thead th:last-child {
  border-right: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 0 12px 12px 0;
}

#reports .reports-table-panel tbody td {
  background: rgba(8, 18, 32, 0.90) !important;
  color: #dce6f6 !important;
}

#reports .reports-table-panel tbody td:first-child {
  color: #ffffff !important;
}

#reports .reports-command-metrics .metric-card strong {
  font-size: clamp(22px, 2.2vw, 28px);
  line-height: 1.05;
  word-break: keep-all;
}
/* Reports Command Center visual QA correction — table surface + metric density */
#reports .reports-command-metrics .metric-card {
  position: relative;
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 8px;
  overflow: hidden;
}

#reports .reports-command-metrics .metric-card span,
#reports .reports-command-metrics .metric-card strong {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  max-width: 100%;
}

#reports .reports-command-metrics .metric-card strong {
  white-space: nowrap;
}

#reports .reports-table-panel .table-wrap {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#reports .reports-table-panel table {
  background: transparent !important;
}

#reports .reports-table-panel table thead,
#reports .reports-table-panel table tbody,
#reports .reports-table-panel table tr {
  background: transparent !important;
}

#reports .reports-table-panel table th,
#reports .reports-table-panel table td {
  box-shadow: none !important;
}

/* Reports tables: Excel-like resize surface + smart horizontal scrollbar */
#reports.reports-command-center .reports-table-panel .table-wrap {
  overflow-x: hidden !important;
  overflow-y: visible !important;
  max-inline-size: 100% !important;
}

#reports.reports-command-center .reports-table-panel .table-wrap.has-horizontal-overflow {
  overflow-x: auto !important;
}

#reports.reports-command-center .reports-table-panel table,
#reports.reports-command-center .reports-table-panel table.pms-resizable-table {
  inline-size: 100% !important;
  width: 100% !important;
  min-inline-size: 0 !important;
  min-width: 0 !important;
  max-inline-size: 100% !important;
}

#reports.reports-command-center .reports-sales-panel table,
#reports.reports-command-center .reports-sales-panel table.pms-resizable-table {
  min-inline-size: 0 !important;
  min-width: 0 !important;
}

#reports.reports-command-center .reports-table-panel th,
#reports.reports-command-center .reports-table-panel td,
#reports.reports-command-center .reports-table-panel th > *:not(.pms-column-resizer),
#reports.reports-command-center .reports-table-panel td > * {
  min-inline-size: 0 !important;
  max-inline-size: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

#reports.reports-command-center .reports-table-panel .pms-column-resizer {
  top: 4px;
  bottom: 4px;
}

/* CRM Guest Intelligence Command Center — scoped visual layer */
#guests {
  max-width: 100%;
  overflow-x: hidden;
  color: #f5f8ff;
}

#guests .crm-command-center,
#guests .crm-command-shell,
#guests .crm-command-hero,
#guests .crm-command-copy,
#guests .crm-command-status,
#guests .crm-command-metrics,
#guests .crm-main,
#guests .crm-tab-panel,
#guests .table-wrap,
#guests .cards-grid {
  min-width: 0;
  max-width: 100%;
}

#guests .crm-command-shell {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(215, 181, 110, 0.24);
  border-radius: 28px;
  padding: 18px;
  background:
    radial-gradient(circle at 13% 0%, rgba(215, 181, 110, 0.18), transparent 32%),
    radial-gradient(circle at 86% 2%, rgba(130, 181, 255, 0.14), transparent 30%),
    linear-gradient(145deg, rgba(9, 23, 41, 0.98), rgba(6, 14, 25, 0.96));
  box-shadow: 0 30px 90px rgba(5, 12, 22, 0.36);
}

#guests .crm-command-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 0.34fr);
  gap: 14px;
  margin-bottom: 14px;
}

#guests .crm-command-copy,
#guests .crm-command-status,
#guests .crm-command-metrics article,
#guests .crm-tab-panel,
#guests .crm-guest-intelligence-grid article {
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.062), rgba(255, 255, 255, 0.034));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

#guests .crm-command-copy {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  padding: 18px;
}

#guests .crm-command-copy::after {
  content: "";
  position: absolute;
  top: -84px;
  right: -72px;
  width: 270px;
  height: 270px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(245, 210, 138, 0.18), transparent 66%);
  pointer-events: none;
}

#guests .eyebrow {
  position: relative;
  z-index: 1;
  margin: 0 0 8px;
  color: #f5d28a;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

#guests .crm-command-copy h2,
#guests .crm-tab-panel h3 {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #ffffff;
  letter-spacing: -0.045em;
}

#guests .crm-command-copy h2 {
  font-size: clamp(22px, 2.1vw, 29px);
  line-height: 1.08;
}

#guests .crm-command-copy p:not(.eyebrow) {
  position: relative;
  z-index: 1;
  max-width: 720px;
  margin: 9px 0 0;
  color: #c9d6ea;
  font-size: 13px;
  line-height: 1.42;
}

#guests .crm-command-source {
  position: relative;
  z-index: 1;
  display: inline-grid;
  gap: 4px;
  margin-top: 14px;
  padding: 10px 12px;
  border: 1px solid rgba(245, 210, 138, 0.18);
  border-radius: 16px;
  background: rgba(5, 12, 22, 0.58);
}

#guests .crm-command-source span,
#guests .crm-command-status span,
#guests .crm-command-metrics small,
#guests .crm-guest-intelligence-grid small {
  display: block;
  color: #9daec7;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#guests .crm-command-source strong {
  color: #f5d28a;
}

#guests .crm-command-status {
  border-radius: 22px;
  padding: 14px;
  display: grid;
  gap: 10px;
}

#guests .crm-command-status div {
  padding: 12px;
  border-radius: 15px;
  background: rgba(5, 12, 22, 0.54);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

#guests .crm-command-status strong {
  display: block;
  margin-top: 6px;
  color: #72e0ad;
  font-size: 20px;
  letter-spacing: -0.03em;
}

#guests .crm-command-status div:nth-child(2) strong {
  color: #ffbf73;
}

#guests .crm-command-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

#guests .crm-command-metrics article {
  min-height: 102px;
  border-radius: 19px;
  padding: 14px;
}

#guests .crm-command-metrics strong,
#guests .crm-guest-intelligence-grid strong {
  display: block;
  margin: 7px 0 6px;
  color: #ffffff;
  font-size: 21px;
  letter-spacing: -0.035em;
}

#guests .crm-command-metrics span,
#guests .crm-guest-intelligence-grid span,
#guests .crm-tab-panel .panel-note {
  color: #9daec7;
}

#guests .crm-top-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 18px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  background: rgba(5, 12, 22, 0.50);
}

#guests .crm-top-nav button {
  min-height: 34px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 12px;
  padding: 0 12px;
  background: rgba(255, 255, 255, 0.04);
  color: #c9d6ea;
  font-size: 12px;
  font-weight: 900;
}

#guests .crm-top-nav button.active {
  border-color: rgba(215, 181, 110, 0.34);
  background: linear-gradient(135deg, rgba(215, 181, 110, 0.18), rgba(130, 181, 255, 0.08));
  color: #ffffff;
}

#guests .crm-tab-panel {
  border-radius: 26px;
  padding: 18px;
  color: #f5f8ff;
}

#guests .crm-tab-panel.is-hidden {
  display: none;
}

#guests .crm-tab-panel .panel-header {
  gap: 16px;
  margin-bottom: 14px;
  padding: 14px 16px;
  border: 1px solid rgba(245, 210, 138, 0.14);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(10, 23, 40, 0.95), rgba(6, 14, 25, 0.92));
}

#guests .crm-tab-panel .panel-header h3 {
  color: #ffffff !important;
  font-size: 18px;
  letter-spacing: -0.025em;
}

#guests #guestSearch {
  min-width: min(320px, 100%);
  min-height: 42px;
  border-color: rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  background: rgba(5, 12, 22, 0.68);
  color: #f5f8ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#guests #guestSearch::placeholder {
  color: #9daec7;
}

#guests .crm-guest-intelligence-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

#guests .crm-guest-intelligence-grid article {
  border-radius: 20px;
  padding: 16px;
}

#guests .crm-guest-intelligence-grid strong {
  font-size: 18px;
}

#guests #crmMetrics.metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

#guests #crmMetrics .metric-card,
#guests #crmMetrics article,
#guests #crmMetrics > div {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 82px !important;
  padding: 16px 18px !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 20px !important;
  background: linear-gradient(135deg, rgba(6, 14, 25, 0.84), rgba(19, 36, 58, 0.70)) !important;
  color: #f5f8ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

#guests #crmMetrics .metric-card span,
#guests #crmMetrics article span,
#guests #crmMetrics > div span {
  color: #aebdd2 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

#guests #crmMetrics .metric-card strong,
#guests #crmMetrics article strong,
#guests #crmMetrics > div strong {
  color: #ffffff !important;
  font-size: 34px !important;
  font-weight: 950 !important;
  letter-spacing: -0.05em !important;
  line-height: 1 !important;
}

#guests #guestCards.cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 14px;
  align-items: stretch;
}

#guests #guestCards .card,
#guests #guestCards article,
#guests #guestCards > div {
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 22px !important;
  background: rgba(8, 18, 32, 0.90) !important;
  color: #dce6f6 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

#guests #guestCards h3,
#guests #guestCards h4,
#guests #guestCards strong {
  color: #ffffff;
}

#guests #guestCards p,
#guests #guestCards small,
#guests #guestCards span {
  color: #aebdd2;
}


#guests #guestCards .card-title-row h4 {
  margin: 0;
  color: #ffffff;
  font-size: 17px;
  line-height: 1.18;
  letter-spacing: -0.02em;
}

#guests #guestCards .crm-360-contact {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 10px;
  margin-top: 10px;
  color: #c9d6ea;
  font-size: 11px;
  line-height: 1.35;
}

#guests #guestCards .crm-360-contact span {
  color: #c9d6ea !important;
  font-weight: 700;
}

#guests #guestCards .crm-360-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0 10px;
}

#guests #guestCards .crm-360-metrics > span {
  min-height: 50px;
  padding: 9px 10px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 11px;
  background: linear-gradient(135deg, rgba(10, 23, 40, 0.92), rgba(19, 36, 58, 0.76)) !important;
  color: #9fb1ca !important;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.25;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

#guests #guestCards .crm-360-metrics strong {
  display: block;
  margin: 0 0 4px;
  color: #ffffff !important;
  font-size: 14px;
  line-height: 1.08;
  letter-spacing: -0.015em;
}

#guests #guestCards .crm-360-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

#guests #guestCards .crm-360-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.07) !important;
  color: #dce6f6 !important;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.1;
}

#guests #guestCards .crm-360-badge.source {
  border-color: rgba(130, 224, 173, 0.26);
  background: rgba(114, 224, 173, 0.10) !important;
  color: #c8f7da !important;
}

#guests #guestCards .crm-360-badge.preference {
  border-color: rgba(215, 181, 110, 0.30);
  background: rgba(215, 181, 110, 0.10) !important;
  color: #ffe3a3 !important;
}

#guests #guestCards .crm-360-whatsapp {
  margin-top: 12px;
  padding: 9px 10px;
  border: 1px solid rgba(114, 224, 173, 0.24);
  border-radius: 11px;
  background: rgba(114, 224, 173, 0.12);
  color: #d6ffe5;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.25;
}

#guests #guestCards .crm-360-whatsapp.pending,
#guests #guestCards .crm-360-whatsapp.warning {
  border-color: rgba(245, 210, 138, 0.34);
  background: rgba(245, 210, 138, 0.14);
  color: #ffe3a3;
}

#guests .crm-whatsapp-live-notice,
#guests .notice-card {
  border-color: rgba(245, 210, 138, 0.18) !important;
  background: rgba(215, 181, 110, 0.08) !important;
  color: #f5d28a !important;
}

#guests .crm-whatsapp-preview-panel,
#guests .staff-assistant-result {
  border-color: rgba(255, 255, 255, 0.09) !important;
  background: rgba(6, 14, 25, 0.58) !important;
  color: #c9d6ea !important;
}

#guests .table-wrap {
  overflow: auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  scrollbar-color: rgba(215, 181, 110, 0.42) rgba(6, 14, 25, 0.9);
}

#guests table {
  border-collapse: separate;
  border-spacing: 0 8px;
}

#guests table thead th {
  padding: 0 12px 4px;
  background: transparent !important;
  color: #b6c6dd !important;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#guests table tbody td {
  padding: 13px 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.065);
  border-bottom: 1px solid rgba(255, 255, 255, 0.065);
  background: rgba(8, 18, 32, 0.90) !important;
  color: #dce6f6 !important;
}

#guests table tbody td:first-child {
  border-left: 1px solid rgba(255, 255, 255, 0.065);
  border-radius: 14px 0 0 14px;
  color: #ffffff !important;
  font-weight: 900;
}

#guests table tbody td:last-child {
  border-right: 1px solid rgba(255, 255, 255, 0.065);
  border-radius: 0 14px 14px 0;
}

@media (max-width: 1320px) {
  #guests .crm-command-hero {
    grid-template-columns: 1fr;
  }

  #guests .crm-command-metrics,
  #guests #crmMetrics.metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 920px) {
  #guests .crm-command-shell {
    padding: 16px;
    border-radius: 24px;
  }

  #guests .crm-command-metrics,
  #guests .crm-guest-intelligence-grid,
  #guests #crmMetrics.metrics {
    grid-template-columns: 1fr;
  }

  #guests .crm-tab-panel .panel-header {
    display: grid;
  }

  #guests #guestSearch {
    width: 100%;
  }
}

/* Rezervasyon Motoru — eski alan üzerinde sade premium tema; yeni kart/komuta alanı eklemez */
.view.booking-engine-host.active {
  display: flex;
}

#bookingEngine.booking-engine-host {
  gap: 14px;
  min-height: calc(100vh - 82px);
  padding: 18px;
  background:
    radial-gradient(circle at 14% -12%, rgba(200, 161, 90, 0.13), transparent 26rem),
    linear-gradient(180deg, #f7f8fa 0%, #eef2f6 100%);
}

#bookingEngine .booking-engine-host-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border: 1px solid rgba(200, 161, 90, 0.24);
  border-radius: 20px;
  background: linear-gradient(135deg, #ffffff 0%, #fbfaf7 58%, #f3f6f8 100%);
  box-shadow: 0 16px 42px rgba(7, 23, 43, 0.08);
}

#bookingEngine .booking-engine-host-header .eyebrow {
  color: #b88a44;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

#bookingEngine .booking-engine-host-header h2 {
  margin-top: 4px;
  color: #0b1d36;
  font-size: clamp(24px, 2.3vw, 34px);
  line-height: 1.05;
  letter-spacing: -0.04em;
}

#bookingEngine .booking-engine-host-header p:not(.eyebrow) {
  max-width: 820px;
  color: #667085;
  line-height: 1.5;
}

#bookingEngine .booking-engine-host-header .ghost-button {
  border-color: rgba(11, 29, 54, 0.16);
  background: #ffffff;
  color: #0b1d36;
  box-shadow: 0 10px 24px rgba(7, 23, 43, 0.08);
  white-space: nowrap;
}

#bookingEngine .booking-engine-frame {
  min-height: 720px;
  height: max(720px, calc(100vh - 220px));
  border: 1px solid rgba(11, 29, 54, 0.12);
  border-radius: 20px;
  background: #eef1ef;
  box-shadow: 0 18px 50px rgba(7, 23, 43, 0.10);
}

@media (max-width: 900px) {
  #bookingEngine .booking-engine-host-header {
    display: grid;
  }

  #bookingEngine .booking-engine-frame {
    min-height: 680px;
    height: 680px;
  }
}

/* Rezervasyon Motoru — başlıksız tam sayfa iframe yerleşimi */
.main:has(#bookingEngine.active) {
  padding: 0;
  background: #06111f;
}

.main:has(#bookingEngine.active) .topbar {
  display: none;
}

#bookingEngine.booking-engine-host {
  gap: 0;
  height: 100vh;
  min-height: 100vh;
  padding: 0;
  overflow: hidden;
  background: #06111f;
}

#bookingEngine .booking-engine-host-header {
  display: none !important;
}

#bookingEngine .booking-engine-frame {
  display: block;
  width: 100%;
  height: 100vh;
  min-height: 100vh;
  border: 0;
  border-radius: 0;
  background: #eef1ef;
  box-shadow: none;
}

@media (max-width: 900px) {
  #bookingEngine.booking-engine-host,
  #bookingEngine .booking-engine-frame {
    height: 100vh;
    min-height: 100vh;
  }
}


/* Housekeeping Command Center - scoped premium live theme */
#housekeeping.housekeeping-command-center {
  --hk-bg: #07111f;
  --hk-surface: rgba(12, 24, 42, 0.92);
  --hk-surface-soft: rgba(18, 34, 57, 0.78);
  --hk-line: rgba(218, 178, 92, 0.22);
  --hk-gold: #d9b66f;
  --hk-muted: #9fb0c4;
  --hk-text: #f7efe0;
  --hk-blue: #7fb3ff;
  background:
    radial-gradient(circle at 18% 12%, rgba(217, 182, 111, 0.16), transparent 34%),
    radial-gradient(circle at 82% 18%, rgba(89, 143, 255, 0.14), transparent 32%),
    linear-gradient(145deg, #06101d 0%, #0a1729 48%, #111925 100%);
  color: var(--hk-text);
  min-height: calc(100vh - 110px);
  padding: 16px;
  border-radius: 24px;
  overflow: hidden;
}

#housekeeping .panel {
  background: linear-gradient(145deg, rgba(12, 24, 42, 0.94), rgba(9, 18, 32, 0.9));
  border: 1px solid var(--hk-line);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34);
  color: var(--hk-text);
}

#housekeeping .hk-hero {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: stretch;
  padding: 18px;
  margin-bottom: 14px;
  position: relative;
  overflow: hidden;
}

#housekeeping .hk-hero::after {
  content: "";
  position: absolute;
  inset: auto -80px -110px auto;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  background: rgba(217, 182, 111, 0.12);
  filter: blur(6px);
}

#housekeeping .hk-hero-copy h2 {
  margin: 5px 0 8px;
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.08;
  letter-spacing: -0.035em;
  max-width: 760px;
}

#housekeeping .hk-hero-copy p,
#housekeeping .hk-room-meta,
#housekeeping .hk-priority-item p,
#housekeeping .hk-metric small,
#housekeeping .hk-floor-card small {
  color: var(--hk-muted);
  font-size: 12px;
  line-height: 1.35;
}

#housekeeping .eyebrow {
  color: var(--hk-gold);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 10px;
  font-weight: 850;
}

#housekeeping .hk-hero-pulse {
  min-width: 178px;
  border: 1px solid rgba(217, 182, 111, 0.34);
  border-radius: 18px;
  padding: 15px;
  background: linear-gradient(160deg, rgba(217, 182, 111, 0.16), rgba(255, 255, 255, 0.04));
  display: grid;
  align-content: center;
  gap: 4px;
  z-index: 1;
}

#housekeeping .hk-hero-pulse strong {
  font-size: 34px;
  line-height: 0.98;
}

#housekeeping .hk-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

#housekeeping .hk-metric,
#housekeeping .hk-floor-card,
#housekeeping .hk-priority-item,
#housekeeping .hk-room-card {
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: rgba(255, 255, 255, 0.055);
  border-radius: 18px;
  color: var(--hk-text);
}

#housekeeping .hk-metric {
  padding: 13px;
  display: grid;
  gap: 6px;
  min-height: 94px;
}

#housekeeping .hk-metric span {
  color: #dce6f2;
  font-size: 12px;
  font-weight: 800;
}

#housekeeping .hk-metric strong {
  font-size: 26px;
  line-height: 1;
}

#housekeeping .hk-ready { border-color: rgba(70, 211, 154, 0.32); }
#housekeeping .hk-dirty { border-color: rgba(245, 158, 11, 0.36); }
#housekeeping .hk-occupied { border-color: rgba(127, 179, 255, 0.34); }
#housekeeping .hk-blocked { border-color: rgba(248, 113, 113, 0.35); }

#housekeeping .hk-layout {
  display: grid;
  grid-template-columns: minmax(230px, 300px) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

#housekeeping .panel-header.compact,
#housekeeping .hk-worklist-header {
  align-items: flex-start;
  gap: 12px;
}

#housekeeping .panel-header h3 {
  color: var(--hk-text);
  font-size: 18px;
  line-height: 1.15;
  letter-spacing: -0.025em;
}

#housekeeping .hk-filter-bar {
  max-width: 100%;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 4px;
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 4px;
  border-radius: 999px;
}

#housekeeping .hk-filter-bar button {
  min-height: 30px;
  padding: 0 10px;
  color: #d6e3f2;
  border-radius: 999px;
  font-size: 11px;
  white-space: nowrap;
}

#housekeeping .hk-filter-bar button.active {
  background: linear-gradient(135deg, rgba(217, 182, 111, 0.95), rgba(244, 214, 144, 0.9));
  color: #101827;
  box-shadow: 0 10px 24px rgba(217, 182, 111, 0.22);
}

#housekeeping .hk-priority-list {
  display: grid;
  gap: 8px;
}

#housekeeping .hk-priority-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px;
}

#housekeeping .hk-priority-item p,
#housekeeping .hk-priority-item strong {
  margin: 0;
}

#housekeeping .hk-floor-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  gap: 8px;
  margin: 10px 0 14px;
}

#housekeeping .hk-floor-card {
  padding: 10px;
  display: grid;
  gap: 4px;
}

#housekeeping .hk-floor-card strong {
  font-size: 20px;
}

#housekeeping .hk-room-grid {
  grid-template-columns: repeat(auto-fit, minmax(238px, 1fr));
  gap: 10px;
}

#housekeeping .hk-room-card {
  padding: 13px;
  box-shadow: none;
}

#housekeeping .hk-room-topline {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
}

#housekeeping .hk-room-topline h4 {
  margin: 3px 0 0;
  font-size: 22px;
  color: var(--hk-text);
}

#housekeeping .hk-task-note {
  min-height: 34px;
  color: #d8e3ee;
  font-size: 12px;
  line-height: 1.35;
}

#housekeeping .hk-task-note p {
  margin: 0 0 8px;
  color: #d8e3ee;
}

#housekeeping .hk-room-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 10px;
}

#housekeeping .hk-room-actions .ghost-button,
#housekeeping .hk-room-card .ghost-button {
  background: rgba(255, 255, 255, 0.07);
  color: #f5ead4;
  border: 1px solid rgba(217, 182, 111, 0.24);
  min-height: 32px;
  font-size: 11px;
}

#housekeeping .status {
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.08);
}

#housekeeping .empty-state {
  color: var(--hk-muted);
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.045);
}

@media (max-width: 1180px) {
  #housekeeping .hk-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #housekeeping .hk-layout { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  #housekeeping.housekeeping-command-center { padding: 14px; border-radius: 18px; }
  #housekeeping .hk-hero { flex-direction: column; padding: 20px; }
  #housekeeping .hk-metrics { grid-template-columns: 1fr; }
  #housekeeping .hk-filter-bar { border-radius: 18px; justify-content: flex-start; }
  #housekeeping .hk-room-actions { grid-template-columns: 1fr; }
}


/* Compact typography pass: endofday + accounting + users (2026-06-07) */
#endofday {
  padding: 18px;
}

#endofday .setup-header {
  grid-template-columns: minmax(0, 1.04fr) minmax(260px, 0.78fr);
  gap: 16px;
  padding: 18px;
  border-radius: 22px;
}

#endofday .setup-header .eyebrow,
#accounting .accounting-command-hero .eyebrow,
#userInfo .users-command-hero .eyebrow {
  font-size: 10px;
  letter-spacing: 0.11em;
  padding: 6px 10px;
}

#endofday .setup-header h2 {
  font-size: clamp(27px, 3vw, 38px);
  line-height: 1.04;
  letter-spacing: -0.045em;
}

#endofday .setup-header > span,
#endofday .eod-panel:first-of-type > p {
  font-size: 12.5px;
  line-height: 1.42;
  padding: 13px 14px;
}

#endofday .eod-panel:first-of-type {
  gap: 12px;
  padding: 15px;
}

#endofday .eod-panel:first-of-type .eod-topline strong {
  min-height: 52px;
  padding: 7px 10px;
  font-size: 12px;
}

#endofday .eod-actions button {
  min-height: 34px;
  padding: 0 12px;
  font-size: 12px;
}

#endofday .eod-panel > .panel-header {
  padding: 12px 14px;
  border-radius: 18px 18px 0 0;
}

#endofday .eod-panel > .panel-header h3 {
  font-size: 18px;
  line-height: 1.15;
}

#endofday .eod-panel > .panel-header h3::before {
  width: 7px;
  height: 17px;
}

#endofday #eodStatusSummary {
  padding: 5px 9px;
  font-size: 11px;
}

#endofday .eod-check-grid,
#endofday #eodMetrics {
  gap: 10px;
  padding-top: 12px;
}

#endofday .eod-check {
  min-height: 88px;
  padding: 12px;
  border-radius: 15px;
  gap: 4px;
}

#endofday .eod-check strong,
#endofday .eod-step span {
  font-size: 13px;
  line-height: 1.22;
}

#endofday .eod-check span,
#endofday .eod-check small {
  font-size: 11.5px;
  line-height: 1.3;
}

#endofday .metric {
  min-height: 88px;
  padding: 13px 14px;
  border-radius: 16px;
}

#endofday .metric span,
#endofday .metric small {
  font-size: 11.5px;
  line-height: 1.3;
}

#endofday .metric strong {
  margin-top: 4px;
  font-size: clamp(20px, 1.65vw, 25px);
}

#accounting,
#users {
  padding: 18px;
}

#accounting .accounting-command-hero,
#userInfo .users-command-hero {
  grid-template-columns: minmax(0, 1.1fr) minmax(235px, 0.52fr);
  gap: 16px;
  margin-bottom: 16px;
  padding: 18px;
  border-radius: 22px;
}

#accounting .accounting-command-hero h2,
#userInfo .users-command-hero h2 {
  margin: 9px 0 8px;
  font-size: clamp(27px, 3vw, 38px);
  line-height: 1.04;
  letter-spacing: -0.045em;
}

#accounting .accounting-hero-copy,
#userInfo .users-hero-copy {
  max-width: 720px;
  font-size: 12.5px;
  line-height: 1.45;
  font-weight: 680;
}

#accounting .accounting-command-status,
#userInfo .users-command-status {
  gap: 8px;
  padding: 14px;
  border-radius: 18px;
}

#accounting .accounting-command-status small,
#userInfo .users-command-status small {
  font-size: 10px;
  letter-spacing: 0.09em;
}

#accounting .accounting-command-status strong,
#userInfo .users-command-status strong {
  font-size: 20px;
  line-height: 1.08;
}

#accounting .accounting-command-status span,
#userInfo .users-command-status span {
  font-size: 11.5px;
  line-height: 1.32;
}

#accounting .accounting-control-panel {
  margin-bottom: 14px;
  padding: 14px;
  border-radius: 20px;
}

#accounting .accounting-controls {
  gap: 9px;
}

#accounting .accounting-controls label,
#users #userManagementForm label {
  font-size: 10.5px;
  letter-spacing: 0.025em;
}

#accounting .accounting-controls input,
#accounting .accounting-controls select,
#users #userManagementForm input,
#users #userManagementForm select {
  min-height: 36px;
  border-radius: 12px;
  font-size: 12px;
}

#accounting #saveAccountingSettingsButton,
#users #userManagementForm .primary-button {
  min-height: 36px;
  border-radius: 12px;
  font-size: 12px;
}

#accounting .setup-tabs {
  margin: 14px 0;
  padding: 6px;
  border-radius: 16px;
  gap: 5px;
}

#accounting .setup-tabs button {
  min-height: 30px;
  padding: 0 10px;
  font-size: 11px;
}

#accounting .metrics,
#userInfo .users-command-metrics {
  gap: 10px;
  margin: 14px 0 10px;
}

#accounting .metric,
#users .metric {
  min-height: 88px;
  padding: 13px;
  border-radius: 17px;
}

#accounting .metric span,
#users .metric span {
  font-size: 10.5px;
  letter-spacing: 0.06em;
}

#accounting .metric strong,
#users .metric strong {
  margin: 6px 0 4px;
  font-size: 22px;
  letter-spacing: -0.035em;
}

#accounting .metric small,
#users .metric small {
  font-size: 11px;
  line-height: 1.28;
}

#accounting .accounting-command-lower,
#userInfo .users-command-workspace {
  gap: 10px;
  margin-top: 10px;
}

#accounting .panel,
#users .panel,
#userInfo .card {
  border-radius: 18px;
}

#accounting .panel-header,
#users .panel-header {
  padding: 12px 14px;
}

#accounting .panel-header h3,
#users .panel-header h3 {
  font-size: 16px;
  line-height: 1.15;
}

#accounting .panel-note,
#users .panel-note {
  padding: 5px 8px;
  font-size: 10.5px;
}

#accounting th,
#accounting td,
#users th,
#users td {
  padding: 8px 9px;
}

#accounting th,
#users th {
  font-size: 9.5px;
  letter-spacing: 0.055em;
}

#accounting td,
#users td {
  font-size: 11.5px;
}

#userInfo .role-definition-grid {
  gap: 9px;
  padding: 12px;
}

#userInfo .role-card {
  padding: 12px;
  border-radius: 15px;
}

#userInfo .role-card strong {
  font-size: 13px;
}

#userInfo .role-card span,
#userInfo .role-card p,
#userInfo .role-card small {
  font-size: 11px;
  line-height: 1.3;
}

#userInfo .role-card span {
  padding: 4px 7px;
  font-size: 10.5px;
}

#users #userManagementForm {
  gap: 9px;
  padding: 12px;
}

#userInfo .users-management-panel table {
  min-width: 700px;
}

#userInfo .users-management-panel td:last-child .ghost-button {
  min-height: 26px;
  padding: 4px 6px;
  font-size: 9.5px;
}

@media (max-width: 1180px) {
  #endofday .setup-header,
  #accounting .accounting-command-hero,
  #userInfo .users-command-hero {
    grid-template-columns: 1fr;
  }
}


/* Compact typography refinement: endofday hero height */
#endofday .setup-header {
  align-items: center;
  min-height: 0;
}

#endofday .setup-header > div {
  align-self: center;
}

#endofday .setup-header > span {
  align-self: center;
  min-height: 0;
  max-width: 100%;
}

#endofday .setup-header h2 {
  margin: 8px 0 0;
}


/* CRM WhatsApp queue preview UX + no-horizontal-scroll card rows */
#guests #crmPanelQueue .crm-whatsapp-preview-panel {
  position: relative;
  margin: 12px 0 14px;
  padding: 15px;
  border: 1px solid rgba(245, 210, 138, 0.22) !important;
  border-radius: 20px;
  background:
    radial-gradient(circle at 98% 0%, rgba(245, 210, 138, 0.12), transparent 34%),
    linear-gradient(145deg, rgba(7, 17, 31, 0.96), rgba(14, 28, 48, 0.92)) !important;
  color: #eaf2ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 16px 38px rgba(2, 6, 23, 0.28);
}

#guests #crmPanelQueue .crm-whatsapp-preview-panel.is-collapsed {
  padding: 10px 13px;
  border-style: dashed !important;
  background: rgba(7, 17, 31, 0.62) !important;
  box-shadow: none;
}

#guests #crmPanelQueue .crm-whatsapp-preview-empty {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#guests #crmPanelQueue .crm-whatsapp-preview-empty strong {
  color: #fff7df;
  font-size: 13px;
  white-space: nowrap;
}

#guests #crmPanelQueue .crm-whatsapp-preview-empty p {
  margin: 0;
  color: #9fb1ca;
  font-size: 12px;
  line-height: 1.35;
  text-align: right;
}

#guests #crmPanelQueue .crm-whatsapp-preview-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 10px;
}

#guests #crmPanelQueue .crm-whatsapp-preview-header > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

#guests #crmPanelQueue .crm-whatsapp-preview-header strong {
  color: #ffffff;
  font-size: 16px;
  line-height: 1.15;
}

#guests #crmPanelQueue .crm-whatsapp-preview-header span,
#guests #crmPanelQueue .crm-whatsapp-preview-meta,
#guests #crmPanelQueue .crm-whatsapp-preview-panel small {
  color: #aebed4 !important;
}

#guests #crmPanelQueue .crm-whatsapp-preview-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

#guests #crmPanelQueue .crm-preview-close {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 1px solid rgba(245, 210, 138, 0.25);
  border-radius: 999px;
  color: #fff7df;
  background: rgba(255, 255, 255, 0.07);
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}

#guests #crmPanelQueue .crm-preview-close:hover {
  color: #07111f;
  background: linear-gradient(135deg, #fff7df, #f5d28a);
}

#guests #crmPanelQueue .crm-whatsapp-preview-panel pre {
  max-height: 270px;
  overflow: auto;
  margin: 10px 0;
  padding: 13px 14px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(4, 11, 22, 0.98), rgba(13, 27, 46, 0.94)) !important;
  color: #f8fbff !important;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: inherit;
  font-size: 12.5px;
  line-height: 1.5;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#guests #crmPanelQueue .crm-whatsapp-queue-wrap {
  overflow-x: hidden !important;
  overflow-y: visible;
  padding: 0;
}

#guests #crmPanelQueue .crm-whatsapp-queue-table {
  display: block;
  width: 100%;
  min-width: 0 !important;
  border-collapse: separate;
  border-spacing: 0;
}

#guests #crmPanelQueue .crm-whatsapp-queue-table thead {
  display: none;
}

#guests #crmPanelQueue .crm-whatsapp-queue-table tbody {
  display: grid;
  gap: 8px;
  width: 100%;
}

#guests #crmPanelQueue .crm-whatsapp-row {
  display: grid;
  grid-template-columns: minmax(82px, 0.55fr) minmax(210px, 1.85fr) minmax(115px, 0.82fr) minmax(115px, 0.86fr) minmax(82px, 0.58fr) minmax(130px, 0.94fr) minmax(95px, 0.7fr) minmax(140px, 0.95fr);
  gap: 0;
  align-items: stretch;
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-left: 3px solid rgba(245, 210, 138, 0.42);
  border-radius: 15px;
  background: rgba(6, 14, 25, 0.82);
  overflow: hidden;
}

#guests #crmPanelQueue .crm-whatsapp-row td {
  display: grid;
  align-content: center;
  gap: 3px;
  min-width: 0;
  padding: 9px 8px !important;
  border: 0 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.055) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #dce6f6 !important;
  font-size: 11.5px;
  line-height: 1.25;
  overflow: hidden;
}

#guests #crmPanelQueue .crm-whatsapp-row td:last-child {
  border-right: 0 !important;
}

#guests #crmPanelQueue .crm-whatsapp-row td::before {
  content: attr(data-label);
  color: #7f91aa;
  font-size: 8.8px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#guests #crmPanelQueue .crm-whatsapp-row td strong {
  color: #ffffff;
  font-size: 12px;
  line-height: 1.2;
}

#guests #crmPanelQueue .crm-whatsapp-row td small {
  display: block;
  margin: 0;
  color: #97a9c1 !important;
  font-size: 10.5px;
  line-height: 1.25;
}

#guests #crmPanelQueue .crm-whatsapp-actions-cell {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: center;
  gap: 5px !important;
}

#guests #crmPanelQueue .crm-whatsapp-actions-cell::before {
  grid-column: 1 / -1;
}

#guests #crmPanelQueue .crm-whatsapp-actions-cell .ghost-button,
#guests #crmPanelQueue .crm-whatsapp-actions-cell button {
  min-height: 26px;
  padding: 4px 7px;
  border-radius: 999px;
  font-size: 10px;
  white-space: nowrap;
}

#guests #crmPanelQueue .crm-message-type,
#guests #crmPanelQueue .dry-run-badge,
#guests #crmPanelQueue .approval-warning,
#guests #crmPanelQueue .status {
  width: max-content;
  max-width: 100%;
  min-height: 21px;
  padding: 4px 7px;
  font-size: 9.8px;
  line-height: 1;
}

@media (max-width: 1380px) {
  #guests #crmPanelQueue .crm-whatsapp-row {
    grid-template-columns: minmax(86px, 0.62fr) minmax(220px, 1.8fr) minmax(130px, 1fr) minmax(120px, 0.9fr) minmax(125px, 0.95fr) minmax(145px, 1fr);
  }

  #guests #crmPanelQueue .crm-whatsapp-row td[data-label="Telefon"],
  #guests #crmPanelQueue .crm-whatsapp-row td[data-label="Rez. ID"] {
    display: none;
  }
}

@media (max-width: 980px) {
  #guests #crmPanelQueue .crm-whatsapp-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #guests #crmPanelQueue .crm-whatsapp-row td[data-label="Mesaj"],
  #guests #crmPanelQueue .crm-whatsapp-actions-cell {
    grid-column: 1 / -1;
  }

  #guests #crmPanelQueue .crm-whatsapp-preview-empty,
  #guests #crmPanelQueue .crm-whatsapp-preview-header {
    align-items: stretch;
    flex-direction: column;
  }

  #guests #crmPanelQueue .crm-whatsapp-preview-empty p {
    text-align: left;
  }
}


/* CRM WhatsApp queue status date stack */
#guests #crmPanelQueue .crm-whatsapp-row td[data-label="Durum"] {
  overflow: visible;
}

#guests #crmPanelQueue .crm-whatsapp-status-stack {
  display: inline-grid !important;
  grid-template-rows: auto auto;
  align-items: center;
  justify-items: start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 34px;
  padding: 5px 8px !important;
  white-space: normal !important;
  text-align: left;
  line-height: 1.12;
}

#guests #crmPanelQueue .crm-whatsapp-status-stack strong {
  display: block;
  max-width: 100%;
  color: inherit !important;
  font-size: 10.5px !important;
  font-weight: 900;
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#guests #crmPanelQueue .crm-whatsapp-status-stack small {
  display: block;
  max-width: 100%;
  margin-top: 2px;
  color: inherit !important;
  opacity: 0.88;
  font-size: 9.4px !important;
  font-weight: 800;
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


/* CRM Staff Assistant dark readable panels */
#guests #crmPanelAssistant .staff-assistant-panel textarea,
#guests #crmPanelAssistant #staffAssistantQuestion {
  width: 100%;
  min-height: 78px;
  border: 1px solid rgba(245, 210, 138, 0.24) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 98% 0%, rgba(245, 210, 138, 0.10), transparent 32%),
    linear-gradient(145deg, rgba(7, 17, 31, 0.97), rgba(13, 27, 46, 0.94)) !important;
  color: #f8fbff !important;
  caret-color: #f5d28a;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 12px 26px rgba(2, 6, 23, 0.18) !important;
  font-size: 13px;
  line-height: 1.45;
}

#guests #crmPanelAssistant .staff-assistant-panel textarea::placeholder,
#guests #crmPanelAssistant #staffAssistantQuestion::placeholder {
  color: rgba(174, 190, 212, 0.72) !important;
}

#guests #crmPanelAssistant .staff-assistant-panel textarea:focus,
#guests #crmPanelAssistant #staffAssistantQuestion:focus {
  border-color: rgba(245, 210, 138, 0.58) !important;
  outline: 3px solid rgba(245, 210, 138, 0.13) !important;
}

#guests #crmPanelAssistant .staff-assistant-result {
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 20px;
  background:
    radial-gradient(circle at 100% 0%, rgba(245, 210, 138, 0.08), transparent 34%),
    rgba(6, 14, 25, 0.72) !important;
  color: #dce8f8 !important;
}

#guests #crmPanelAssistant .staff-assistant-answer {
  margin: 10px 0 12px;
  padding: 12px 14px;
  border: 1px solid rgba(245, 210, 138, 0.20);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(245, 210, 138, 0.13), rgba(12, 26, 46, 0.88)) !important;
  color: #f7fbff !important;
  font-size: 13px;
  line-height: 1.45;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

#guests #crmPanelAssistant .staff-assistant-answer strong {
  color: #fff1bd !important;
  font-weight: 900;
}

#guests #crmPanelAssistant .staff-assistant-readable {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  background: rgba(8, 18, 32, 0.58);
  color: #dce8f8;
}

#guests #crmPanelAssistant .staff-assistant-readable h4,
#guests #crmPanelAssistant .staff-assistant-readable h5,
#guests #crmPanelAssistant details > summary {
  color: #ffffff;
}

#guests #crmPanelAssistant .staff-assistant-readable p,
#guests #crmPanelAssistant .staff-assistant-readable li,
#guests #crmPanelAssistant details {
  color: #c9d6ea;
}

#guests #crmPanelAssistant .staff-assistant-result pre,
#guests #crmPanelAssistant details pre {
  max-height: 260px;
  overflow: auto;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 15px;
  background: linear-gradient(145deg, rgba(4, 11, 22, 0.98), rgba(13, 27, 46, 0.95)) !important;
  color: #f8fbff !important;
  font-size: 12px;
  line-height: 1.42;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#guests #crmPanelAssistant .staff-assistant-summary .metric-card {
  background: rgba(8, 18, 32, 0.76) !important;
  border-color: rgba(255, 255, 255, 0.075) !important;
  color: #dce8f8 !important;
}

#guests #crmPanelAssistant .staff-assistant-summary .metric-card span {
  color: #9fb1ca !important;
}

#guests #crmPanelAssistant .staff-assistant-summary .metric-card strong {
  color: #ffffff !important;
}


/* Frontoffice reservations flow QA polish */
#frontoffice .frontoffice-daily-bar {
  position: static;
  left: auto;
  right: auto;
  bottom: auto;
  width: 100%;
  max-width: 100%;
  margin: 14px 0 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(184, 138, 68, 0.24);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(255, 248, 234, 0.94), rgba(251, 250, 247, 0.96));
  box-shadow: 0 14px 34px rgba(16, 24, 39, 0.08);
  z-index: auto;
}

#frontoffice .frontoffice-daily-bar article {
  min-height: 46px;
  border-radius: 12px;
  padding: 7px 9px;
}

#frontoffice .frontoffice-daily-bar span {
  font-size: 10px;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#frontoffice .frontoffice-daily-bar strong {
  font-size: 16px;
  line-height: 1.05;
}

#foReservations th:nth-child(11),
#foReservations td:nth-child(11) {
  width: 13%;
  min-width: 92px;
  overflow: visible;
}

#foReservations td:nth-child(11) small {
  display: block;
  margin-top: 3px;
  color: #667085;
  font-size: 10px;
  line-height: 1.15;
  white-space: normal;
  overflow-wrap: anywhere;
}

#foReservations td:nth-child(10) {
  width: 9%;
}

#foReservations th,
#foReservations td {
  overflow: visible;
}

@media (max-width: 1180px) {
  #frontoffice .frontoffice-daily-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}


/* Reservation card premium QA polish */
.reservation-dialog {
  width: min(1240px, calc(100vw - 36px));
  max-height: calc(100vh - 36px);
  padding: 0;
  border: 1px solid rgba(184, 138, 68, 0.22);
  border-radius: 22px;
  background:
    radial-gradient(circle at 8% 0%, rgba(184, 138, 68, 0.14), transparent 32%),
    linear-gradient(135deg, #fffdf8 0%, #f7f2e9 54%, #eef2f7 100%);
  box-shadow: 0 32px 90px rgba(6, 19, 34, 0.36);
  overflow: hidden;
}

.reservation-dialog::backdrop {
  background: rgba(5, 16, 31, 0.58);
  backdrop-filter: blur(6px);
}

.reservation-card-form {
  display: grid;
  gap: 8px;
  padding: 14px 16px 14px;
  background: transparent;
  color: #101827;
}

.reservation-card-form .modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: -2px -2px 8px;
  padding: 12px 14px;
  border: 1px solid rgba(184, 138, 68, 0.22);
  border-radius: 18px;
  background: linear-gradient(135deg, #101827, #202b42);
  box-shadow: 0 16px 36px rgba(16, 24, 39, 0.18);
}

.reservation-card-form .modal-header h3 {
  color: #ffffff;
  letter-spacing: -0.035em;
}

.reservation-card-form .modal-header span {
  color: #e7d7bd;
  font-weight: 800;
}

.reservation-card-form .modal-header .icon-button {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.34);
  background: rgba(255, 255, 255, 0.08);
}

.reservation-card-form .modal-header .icon-button:hover {
  color: #101827;
  background: linear-gradient(135deg, #f3d794, #b88a44);
}

.reservation-card-form > .grid.two,
.reservation-card-form > .grid.three,
.reservation-card-form > .grid.four {
  gap: 8px 10px;
}

.reservation-card-form label {
  color: #344054;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.reservation-card-form input,
.reservation-card-form select,
.reservation-card-form textarea,
.reservation-card-form .room-picker-button {
  min-height: 31px;
  border: 1px solid rgba(148, 163, 184, 0.34);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(255,255,255,0.94), rgba(248,250,252,0.92));
  color: #101827;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.88), 0 8px 18px rgba(16, 24, 39, 0.04);
}

.reservation-card-form input:focus,
.reservation-card-form select:focus,
.reservation-card-form textarea:focus,
.reservation-card-form .room-picker-button:focus {
  border-color: rgba(184, 138, 68, 0.70);
  box-shadow: 0 0 0 4px rgba(184, 138, 68, 0.13), inset 0 1px 0 rgba(255,255,255,0.88);
  outline: none;
}

.reservation-card-form input[readonly],
.reservation-card-form input:disabled,
.reservation-card-form select:disabled {
  color: #344054;
  background: linear-gradient(180deg, rgba(241,245,249,0.96), rgba(226,232,240,0.90));
}

.reservation-card-form .record-info,
.reservation-card-form .reservation-meta,
.reservation-card-form [id*="Record"],
.reservation-card-form [class*="record"] {
  border: 1px solid rgba(184, 138, 68, 0.22);
  border-radius: 14px;
  background: rgba(255, 248, 234, 0.56);
}

.reservation-card-form .reservation-tabs,
.reservation-card-form .reservation-subtabs {
  gap: 6px;
  padding: 6px;
  border: 1px solid rgba(227, 221, 210, 0.82);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.54);
}

.reservation-card-form .reservation-tabs button,
.reservation-card-form .reservation-subtabs button {
  min-height: 30px;
  border-radius: 10px;
  color: #475467;
  background: rgba(226, 232, 240, 0.72);
}

.reservation-card-form .reservation-tabs button.active,
.reservation-card-form .reservation-subtabs button.active {
  color: #ffffff;
  background: linear-gradient(135deg, #101827, #202b42);
  box-shadow: 0 8px 18px rgba(16, 24, 39, 0.16);
}

.reservation-card-form .reservation-tab-panel.active {
  padding: 8px;
  border: 1px solid rgba(227, 221, 210, 0.82);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.52);
}

.reservation-card-form .modal-actions {
  align-items: center;
  margin-top: 2px;
  padding-top: 8px;
  border-top: 1px solid rgba(227, 221, 210, 0.82);
}

.reservation-card-form .modal-actions .primary-button {
  min-width: 74px;
}


/* Reservation card compact fit patch */
.reservation-dialog {
  width: min(1240px, calc(100vw - 28px));
  max-height: calc(100vh - 18px);
}

.reservation-card-form {
  gap: 5px;
  padding: 10px 14px 10px;
}

.reservation-card-form .modal-header {
  margin: -1px -1px 5px;
  padding: 8px 12px;
  border-radius: 16px;
}

.reservation-card-form .modal-header h3 {
  font-size: 18px;
  line-height: 1.05;
}

.reservation-card-form .modal-header span {
  margin-top: 2px;
  font-size: 14px;
}

.reservation-card-form .modal-header .icon-button {
  width: 36px;
  height: 36px;
}

.reservation-card-form > .grid.two,
.reservation-card-form > .grid.three,
.reservation-card-form > .grid.four {
  gap: 5px 10px;
}

.reservation-card-form label {
  gap: 2px;
  font-size: 10px;
  line-height: 1.05;
}

.reservation-card-form input,
.reservation-card-form select,
.reservation-card-form textarea,
.reservation-card-form .room-picker-button {
  min-height: 28px;
  padding: 0 8px;
  font-size: 12px;
  border-radius: 9px;
}

.reservation-card-form input[type="date"],
.reservation-card-form input[type="time"] {
  min-height: 28px;
}

.reservation-card-form .reservation-tabs,
.reservation-card-form .reservation-subtabs {
  margin: 4px 0;
  padding: 4px;
  border-radius: 12px;
}

.reservation-card-form .reservation-tabs button,
.reservation-card-form .reservation-subtabs button {
  min-height: 28px;
  padding: 5px 10px;
  font-size: 12px;
}

.reservation-card-form .reservation-tab-panel.active {
  padding: 5px 8px;
}

.reservation-card-form .guest-row,
.reservation-card-form [class*="guest-row"],
.reservation-card-form .reservation-guest-row {
  min-height: 28px;
}

.reservation-card-form .guest-row input,
.reservation-card-form [class*="guest-row"] input,
.reservation-card-form .reservation-guest-row input {
  min-height: 28px;
}

.reservation-card-form .modal-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  margin: 0 -2px -2px;
  padding: 6px 0 0;
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.68), rgba(255, 253, 248, 0.96));
  backdrop-filter: blur(8px);
}

.reservation-card-form .modal-actions button {
  min-height: 30px;
}

/* Reservation card internal full-window tab redesign */
.reservation-dialog {
  width: min(1280px, calc(100vw - 16px));
  max-height: calc(100vh - 12px);
}

.reservation-card-form {
  min-height: min(640px, calc(100vh - 18px));
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  align-content: stretch;
}

.reservation-card-main-tabs {
  margin: 4px 0 8px;
}

.reservation-card-main-tabs button {
  flex: 0 0 auto;
  min-width: 108px;
}

.reservation-card-form .reservation-card-panel {
  margin-top: 0;
  padding: 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.56);
}

.reservation-card-form .reservation-card-panel[hidden] {
  display: none !important;
}

.reservation-card-form .reservation-card-panel.active {
  display: block;
}

.reservation-card-form .reservation-main-panel.active {
  display: grid;
  grid-template-rows: auto minmax(54px, 1fr);
  align-content: stretch;
  gap: 12px;
}

.reservation-card-form .reservation-main-panel .reservation-card-grid {
  margin: 0;
  gap: 9px 10px;
  align-content: start;
}

.reservation-card-form .reservation-main-panel .reservation-card-grid input,
.reservation-card-form .reservation-main-panel .reservation-card-grid select,
.reservation-card-form .reservation-main-panel .reservation-card-grid .room-picker-button {
  min-height: 34px;
}

.reservation-card-form .reservation-record-meta {
  align-self: end;
  margin: 0;
  min-height: 50px;
  padding: 10px 12px;
}

.reservation-card-form .modal-actions {
  align-self: end;
  margin-top: 10px;
}


/* Logs audit table header premium QA polish */
#logs .log-table-wrap table,
#logs .log-table {
  border-collapse: separate;
  border-spacing: 0 8px;
  background: transparent;
}

#logs .log-table thead,
#logs .log-table thead tr,
#logs .log-table thead th {
  background: transparent !important;
}

#logs .log-table thead tr {
  box-shadow: none;
}

#logs .log-table thead th {
  padding: 8px 12px;
  border: 0;
  color: #b8c7df;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#logs .log-table tbody tr {
  background: #07111f;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
}

#logs .log-table tbody td {
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

#logs .log-table tbody td:first-child {
  border-left: 1px solid rgba(255, 255, 255, 0.04);
  border-radius: 10px 0 0 10px;
}

#logs .log-table tbody td:last-child {
  border-right: 1px solid rgba(255, 255, 255, 0.04);
  border-radius: 0 10px 10px 0;
}


/* Accounting Invoice Readiness live read-only tab */
#accounting .accounting-invoice-readiness-panel {
  background:
    radial-gradient(circle at 8% 0%, rgba(245, 210, 138, 0.13), transparent 34%),
    linear-gradient(180deg, rgba(12, 23, 41, 0.96), rgba(7, 17, 31, 0.98));
  border-color: rgba(245, 210, 138, 0.18);
}

#accounting .accounting-invoice-metrics {
  grid-template-columns: repeat(5, minmax(140px, 1fr));
  margin: 16px 0 18px;
}

#accounting .accounting-invoice-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
  gap: 16px;
  align-items: start;
}

#accounting .accounting-invoice-queue-panel,
#accounting .accounting-invoice-gate-panel {
  background: linear-gradient(180deg, rgba(15, 28, 49, 0.94), rgba(9, 17, 31, 0.96));
  border-color: rgba(255, 255, 255, 0.11);
}

#accounting .accounting-invoice-queue-panel .table-wrap {
  max-height: 520px;
  overflow: auto;
}

#accounting .invoice-type-pill,
#accounting .invoice-status {
  display: inline-flex;
  align-items: center;
  width: max-content;
  max-width: 100%;
  border-radius: 999px;
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

#accounting .invoice-type-pill {
  color: #e9d5ff;
  background: rgba(196, 167, 255, 0.13);
  border: 1px solid rgba(196, 167, 255, 0.24);
}

#accounting .invoice-status.ready {
  color: #bbf7d0;
  background: rgba(34, 197, 94, 0.13);
  border: 1px solid rgba(34, 197, 94, 0.26);
}

#accounting .invoice-status.missing,
#accounting .invoice-status.refund {
  color: #fde68a;
  background: rgba(245, 158, 11, 0.13);
  border: 1px solid rgba(245, 158, 11, 0.26);
}

#accounting .invoice-status.mismatch {
  color: #fecdd3;
  background: rgba(244, 63, 94, 0.13);
  border: 1px solid rgba(244, 63, 94, 0.28);
}

#accounting .invoice-action {
  color: var(--accounting-gold);
}

#accounting .invoice-gate-steps {
  display: grid;
  gap: 11px;
}

#accounting .invoice-gate-steps > div {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 11px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.045);
}

#accounting .invoice-gate-steps strong {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: var(--accounting-gold);
  background: rgba(245, 210, 138, 0.13);
}

#accounting .invoice-gate-steps b,
#accounting .invoice-gate-steps small {
  display: block;
}

#accounting .invoice-gate-steps small {
  margin-top: 4px;
  color: var(--accounting-muted);
  line-height: 1.45;
}

#accounting .invoice-guard-note {
  margin: 14px 0 0;
  border: 1px solid rgba(34, 197, 94, 0.24);
  border-radius: 18px;
  padding: 13px;
  color: #bbf7d0;
  background: rgba(34, 197, 94, 0.07);
  line-height: 1.5;
  font-weight: 720;
}

@media (max-width: 1400px) {
  #accounting .accounting-invoice-workspace {
    grid-template-columns: 1fr;
  }

  #accounting .invoice-gate-steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  #accounting .accounting-invoice-metrics {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }

  #accounting .invoice-gate-steps {
    grid-template-columns: 1fr;
  }
}


/* Accounting Cash-Bank Reconciliation live tab */
#accounting .accounting-cash-bank-panel { display: grid; gap: 18px; }
#accounting .accounting-cash-bank-metrics { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
#accounting .cash-bank-workspace { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr); gap: 18px; align-items: start; }
#accounting .cash-bank-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
#accounting .cash-bank-form label { color: #c9d6ea; font-weight: 800; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; display: grid; gap: 7px; }
#accounting .cash-bank-form textarea { grid-column: 1 / -1; min-height: 88px; resize: vertical; }
#accounting .cash-bank-form button { grid-column: 1 / -1; justify-self: start; }
#accounting .cash-bank-gates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
#accounting .cash-bank-gate { display: grid; grid-template-columns: 36px 1fr; gap: 10px; align-items: start; padding: 12px; border-radius: 16px; background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.10); }
#accounting .cash-bank-gate > strong { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 12px; color: #f5d28a; background: rgba(245,210,138,.12); }
#accounting .cash-bank-gate.ok { border-color: rgba(34,197,94,.26); }
#accounting .cash-bank-gate.warn { border-color: rgba(245,158,11,.32); background: rgba(245,158,11,.06); }
#accounting .cash-bank-gate span { display: grid; gap: 4px; }
#accounting .cash-bank-gate small { color: #93a4bc; line-height: 1.35; }
#accounting .cash-bank-form input,
#accounting .cash-bank-form textarea,
#accounting .cash-bank-doc-input,
#accounting .cash-bank-note-input {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(219, 178, 93, .22);
  background: rgba(8, 16, 29, .74);
  color: #f8fafc;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
#accounting .cash-bank-form input::placeholder,
#accounting .cash-bank-form textarea::placeholder,
#accounting .cash-bank-doc-input::placeholder,
#accounting .cash-bank-note-input::placeholder { color: #8290a5; }
#accounting .cash-bank-doc-input, #accounting .cash-bank-note-input { min-width: 150px; }
#accounting .cash-bank-save-row { justify-content: flex-end; margin-top: 12px; }
#accounting .warn-text { color: #fbbf24; font-weight: 900; }
#accounting .risk-text { color: #fb7185; font-weight: 900; }
#accounting .refund-text { color: #38bdf8; font-weight: 900; }
@media (max-width: 1320px) { #accounting .cash-bank-workspace { grid-template-columns: 1fr; } }
@media (max-width: 820px) { #accounting .cash-bank-form, #accounting .cash-bank-gates { grid-template-columns: 1fr; } }


/* Accounting Current Account Tracking live tab */
#accounting .accounting-current-account-panel { display: grid; gap: 16px; }
#accounting #currentAccountMetrics { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
#accounting .current-account-workspace { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr); gap: 16px; align-items: start; }
#accounting .current-account-filterbar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 2px 0 14px; align-items: start; }
#accounting .current-account-filter-group { min-width: 0; display: grid; gap: 7px; padding: 9px; border: 1px solid rgba(148, 163, 184, .14); border-radius: 16px; background: rgba(15, 23, 42, .40); box-shadow: inset 0 1px 0 rgba(255,255,255,.035); }
#accounting .current-account-filter-group header { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #93c5fd; font-size: 9px; font-weight: 950; letter-spacing: .14em; text-transform: uppercase; }
#accounting .current-account-filter-group header span { min-width: 0; overflow-wrap: anywhere; }
#accounting .current-account-filter-group header small { flex: 0 0 auto; max-width: 58%; padding: 3px 7px; border: 1px solid rgba(125, 211, 252, .18); border-radius: 999px; background: rgba(2, 6, 23, .34); color: #cbd5e1; font-size: 9px; font-weight: 950; letter-spacing: .02em; text-transform: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#accounting .current-account-filter-group > div { display: flex; flex-wrap: wrap; gap: 7px; min-width: 0; }
#accounting .current-account-filter-group.priority-group header { color: #fde68a; }
#accounting .current-account-filter-group.priority-group header small { border-color: rgba(251, 191, 36, .20); color: #fde68a; }
#accounting .current-account-filter-group.action-group header { color: #e9d5ff; }
#accounting .current-account-filter-group.action-group header small { border-color: rgba(216, 180, 254, .20); color: #e9d5ff; }
#accounting .current-account-filter-group.followup-group header small { border-color: rgba(125, 211, 252, .22); color: #bae6fd; }
@media (max-width: 1280px) { #accounting .current-account-filterbar { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { #accounting .current-account-filterbar { grid-template-columns: 1fr; } }
#accounting .current-account-filter { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 8px 11px; border: 1px solid rgba(148, 163, 184, .20); border-radius: 999px; background: rgba(15, 23, 42, .78); color: #cbd5e1; font-size: 12px; font-weight: 900; letter-spacing: .01em; cursor: pointer; transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease; }
#accounting .current-account-filter strong { min-width: 22px; padding: 3px 7px; border-radius: 999px; background: rgba(148, 163, 184, .14); color: #f8e6b6; text-align: center; font-size: 11px; }
#accounting .current-account-filter em { font-style: normal; padding: 2px 6px; border-radius: 999px; background: rgba(148, 163, 184, .10); color: #94a3b8; font-size: 9px; font-weight: 950; letter-spacing: .06em; text-transform: uppercase; }
#accounting .current-account-filter.zero-count:not(.active) { border-style: dashed; border-color: rgba(148, 163, 184, .15); background: rgba(15, 23, 42, .34); color: #94a3b8; box-shadow: inset 0 1px 0 rgba(255,255,255,.025); }
#accounting .current-account-filter.zero-count:not(.active) strong { background: rgba(100, 116, 139, .10); color: #94a3b8; }
#accounting .current-account-filter.zero-count:not(.active):hover { transform: translateY(-1px); border-style: solid; border-color: rgba(125, 211, 252, .34); background: rgba(30, 41, 59, .72); color: #e2e8f0; }
#accounting .current-account-filter.zero-count:not(.active):hover em { background: rgba(125, 211, 252, .12); color: #bae6fd; }
#accounting .current-account-filter:hover { transform: translateY(-1px); border-color: rgba(245, 210, 138, .42); background: rgba(30, 41, 59, .94); color: #ffffff; }
#accounting .current-account-filter.active { border-color: rgba(245, 210, 138, .62); background: linear-gradient(135deg, rgba(245, 210, 138, .22), rgba(15, 23, 42, .88)); color: #ffffff; box-shadow: 0 12px 24px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .08); }
#accounting .current-account-filter.active strong { background: rgba(245, 210, 138, .24); color: #f5d28a; }
#accounting .current-account-buckets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
#accounting .current-account-buckets > div,
#accounting .current-account-bridges > div,
#accounting .current-account-risk,
#accounting .current-account-gates > div { border: 1px solid rgba(148,163,184,.18); background: rgba(15,23,42,.72); border-radius: 18px; padding: 14px; box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
#accounting button.current-account-risk { width: 100%; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: transform .16s ease, border-color .16s ease, background .16s ease; }
#accounting button.current-account-risk:hover { transform: translateY(-1px); border-color: rgba(251, 191, 36, .36); background: rgba(30,41,59,.82); }
#accounting button.current-account-risk:focus-visible { outline: 2px solid rgba(251, 191, 36, .55); outline-offset: 2px; }
#accounting .current-account-buckets span { display: block; color: #9fb0c8; font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
#accounting .current-account-buckets strong { display: block; color: #f5d28a; font-size: 22px; margin: 6px 0; }
#accounting .current-account-buckets small,
#accounting .current-account-bridges small,
#accounting .current-account-gates small,
#accounting .current-account-risk small { display: block; color: #9fb0c8; line-height: 1.35; margin-top: 4px; }
#accounting .current-account-risk em { display: inline-block; margin-top: 7px; color: #fde68a; font-size: 10px; font-style: normal; font-weight: 950; letter-spacing: .02em; }
#accounting .current-account-gates { display: grid; gap: 10px; }
#accounting .current-account-gates > div { display: grid; grid-template-columns: 34px minmax(0, 1fr) 74px; gap: 10px; align-items: center; }
#accounting .current-account-gates > div > strong { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 999px; background: rgba(245,210,138,.12); color: #f5d28a; }
#accounting .current-account-gates b { color: #f8e6b6; }
#accounting .current-account-gates em { color: #fbbf24; font-style: normal; font-weight: 900; text-align: right; }
#accounting .current-account-risk-list { display: grid; gap: 10px; }
#accounting .current-account-risk { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; }
#accounting .current-account-risk b { color: #f8e6b6; font-size: 16px; }
#accounting .current-account-risk.risk b { color: #fb7185; }
#accounting .current-account-risk.warn b { color: #fbbf24; }
#accounting .current-account-bridges { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
#accounting .current-account-bridges strong { color: #f8e6b6; }
#accounting .current-account-type.company { border-color: rgba(147,197,253,.28); color: #bfdbfe; }
#accounting .current-account-type.agency { border-color: rgba(251,191,36,.3); color: #fde68a; }
#accounting .current-account-type.guest { border-color: rgba(216,180,254,.28); color: #e9d5ff; }
#accounting #accountingCurrentAccounts .table-wrap { overflow-x: hidden; max-width: 100%; }
#accounting #accountingCurrentAccounts table { min-width: 0; width: 100%; table-layout: fixed; }
#accounting #accountingCurrentAccounts th,
#accounting #accountingCurrentAccounts td { padding: 10px 8px; font-size: 12px; overflow-wrap: anywhere; }
#accounting #accountingCurrentAccounts th:first-child,
#accounting #accountingCurrentAccounts td:first-child { width: 20%; }
#accounting #accountingCurrentAccounts th:nth-child(2),
#accounting #accountingCurrentAccounts td:nth-child(2) { width: 9%; }
#accounting #accountingCurrentAccounts th:nth-child(9),
#accounting #accountingCurrentAccounts td:nth-child(9) { width: 9%; }
#accounting #accountingCurrentAccounts th:nth-child(10),
#accounting #accountingCurrentAccounts td:nth-child(10) { width: 13%; }
#accounting #accountingCurrentAccounts .current-account-res-cell { min-width: 0; }
#accounting #accountingCurrentAccounts .current-account-name,
#accounting #accountingCurrentAccounts .current-account-res-meta { display: block; max-width: 100%; white-space: normal; overflow-wrap: anywhere; word-break: normal; line-height: 1.25; }
#accounting #accountingCurrentAccounts .current-account-name { color: #f8fafc; font-size: 12px; }
#accounting #accountingCurrentAccounts .current-account-res-meta { margin-top: 4px; font-size: 11px; }
#accounting #accountingCurrentAccounts .invoice-action { white-space: normal; overflow-wrap: anywhere; line-height: 1.25; }
#accounting #accountingCurrentAccounts .current-account-detail-button { min-height: 30px; padding: 7px 10px; border-color: rgba(245, 210, 138, .26); background: rgba(15, 23, 42, .78); color: #f8e6b6; font-size: 12px; font-weight: 900; white-space: nowrap; }
#accounting #accountingCurrentAccounts .current-account-queue-panel table th,
#accounting #accountingCurrentAccounts .current-account-queue-panel table td { padding-left: 10px; padding-right: 10px; vertical-align: middle; }
#accounting #accountingCurrentAccounts .current-account-queue-panel table th:nth-child(5),
#accounting #accountingCurrentAccounts .current-account-queue-panel table td:nth-child(5) { min-width: 112px; padding-right: 18px; }
#accounting #accountingCurrentAccounts .current-account-queue-panel table th:nth-child(5) { font-size: 10px; letter-spacing: .02em; }
#accounting #accountingCurrentAccounts .current-account-queue-panel table th:nth-child(6),
#accounting #accountingCurrentAccounts .current-account-queue-panel table td:nth-child(6) { min-width: 96px; padding-left: 18px; border-left: 1px solid rgba(148, 163, 184, .22); white-space: normal; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingCurrentAccounts .current-account-queue-panel table th:nth-child(11),
#accounting #accountingCurrentAccounts .current-account-queue-panel table td:nth-child(11) { width: 124px; text-align: right; }
#accounting #accountingCurrentAccounts .current-account-detail-button:hover { border-color: rgba(245, 210, 138, .52); background: rgba(245, 210, 138, .14); color: #ffffff; }
@media (max-width: 1100px) {
  #accounting .current-account-workspace,
  #accounting .current-account-bridges { grid-template-columns: 1fr; }
  #accounting .current-account-buckets { grid-template-columns: 1fr; }
}

#accounting #accountingCurrentAccounts .current-account-actions { display: inline-flex; gap: 6px; justify-content: flex-end; align-items: center; }
#accounting #accountingCurrentAccounts .current-account-note-button { min-height: 30px; padding: 7px 10px; border-color: rgba(56, 189, 248, .24); background: rgba(8, 47, 73, .52); color: #bae6fd; font-size: 12px; font-weight: 900; white-space: nowrap; }
#accounting #accountingCurrentAccounts .current-account-note-button:hover { border-color: rgba(125, 211, 252, .52); background: rgba(14, 165, 233, .16); color: #ffffff; }
#accounting #accountingCurrentAccounts .current-account-last-note { display: block; margin-top: 6px; color: #bae6fd; font-size: 11px; line-height: 1.25; }
.current-account-followup-modal { max-width: 760px; background: linear-gradient(145deg, rgba(7, 12, 24, .98), rgba(15, 23, 42, .96)); border: 1px solid rgba(245, 210, 138, .22); color: #f8fafc; }
.current-account-followup-modal .ghost-button { background: rgba(15, 23, 42, .78); border-color: rgba(148, 163, 184, .24); color: #e2e8f0; }
.current-account-followup-modal .ghost-button:hover { background: rgba(30, 41, 59, .92); color: #ffffff; }
.current-account-followup-modal label { color: #cbd5e1; }
.current-account-followup-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.current-account-followup-summary div { border: 1px solid rgba(245, 210, 138, .16); border-radius: 14px; background: rgba(15, 23, 42, .72); padding: 10px; }
.current-account-followup-summary span { display: block; color: #94a3b8; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.current-account-followup-summary strong { display: block; margin-top: 5px; color: #f8fafc; font-size: 13px; }
.current-account-followup-fields textarea,
.current-account-followup-fields input,
.current-account-followup-fields select { background: rgba(15, 23, 42, .86); border-color: rgba(148, 163, 184, .24); color: #f8fafc; }
.current-account-followup-history { display: grid; gap: 8px; margin-top: 12px; }
.current-account-followup-note { border: 1px solid rgba(148, 163, 184, .16); border-radius: 12px; background: rgba(15, 23, 42, .58); padding: 10px; }
.current-account-followup-note strong { color: #f8e6b6; }
.current-account-followup-note small { display: block; margin-top: 3px; color: #94a3b8; }
.current-account-followup-note p { margin: 6px 0 0; color: #dbeafe; }

#accounting #accountingCurrentAccounts .current-account-res-cell .current-account-last-note { display: block; max-width: 100%; overflow-wrap: anywhere; word-break: break-word; white-space: normal; }
#accounting #accountingCurrentAccounts .current-account-queue-panel th,
#accounting #accountingCurrentAccounts .current-account-queue-panel td { overflow-wrap: anywhere; }
#accounting #accountingCurrentAccounts .invoice-status,
#accounting #accountingCurrentAccounts .status { white-space: normal; line-height: 1.2; }

.current-account-followup-timeline { position: relative; display: grid; gap: 10px; padding-left: 14px; }
.current-account-followup-timeline::before { content: ""; position: absolute; left: 5px; top: 8px; bottom: 8px; width: 1px; background: linear-gradient(180deg, rgba(245, 210, 138, .48), rgba(56, 189, 248, .24)); }
.current-account-followup-note { position: relative; display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 8px; border: 1px solid rgba(148, 163, 184, .16); border-radius: 14px; background: rgba(15, 23, 42, .58); padding: 10px 12px 10px 4px; }
.current-account-followup-note.latest { border-color: rgba(245, 210, 138, .34); background: linear-gradient(135deg, rgba(245, 158, 11, .12), rgba(15, 23, 42, .72)); }
.current-account-followup-dot { width: 10px; height: 10px; margin: 8px auto 0; border-radius: 999px; background: #f8e6b6; box-shadow: 0 0 0 4px rgba(245, 210, 138, .12); }
.current-account-followup-note-body { min-width: 0; }
.current-account-followup-note header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.current-account-followup-note header strong { color: #f8e6b6; }
.current-account-followup-meta { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 5px; color: #94a3b8; font-size: 11px; }
.current-account-followup-status { border: 1px solid rgba(148, 163, 184, .22); border-radius: 999px; padding: 3px 8px; font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: .06em; white-space: nowrap; }
.current-account-followup-status.open { color: #fde68a; background: rgba(245, 158, 11, .12); border-color: rgba(245, 158, 11, .32); }
.current-account-followup-status.waiting { color: #bae6fd; background: rgba(14, 165, 233, .12); border-color: rgba(56, 189, 248, .32); }
.current-account-followup-status.closed { color: #bbf7d0; background: rgba(34, 197, 94, .12); border-color: rgba(34, 197, 94, .32); }
.current-account-followup-history { max-height: 340px; overflow: auto; padding-right: 4px; }

#accounting #currentAccountMetrics .metric.followup { border-color: rgba(56, 189, 248, .22); background: linear-gradient(145deg, rgba(8, 47, 73, .34), rgba(15, 23, 42, .86)); }
#accounting #currentAccountMetrics .metric.followup strong { color: #bae6fd; }
#accounting #currentAccountMetrics .metric.followup.warn strong { color: #f8e6b6; }
#accounting #currentAccountMetrics .metric.followup.clean strong { color: #bbf7d0; }
#accounting #currentAccountMetrics .metric[data-current-account-metric="Son 7 Gün Not"] strong { color: #c4b5fd; }

#accounting .current-account-filter.followup-filter { border-color: rgba(56, 189, 248, .24); background: rgba(8, 47, 73, .42); color: #bae6fd; }
#accounting .current-account-filter.followup-filter strong { background: rgba(14, 165, 233, .16); color: #bae6fd; }
#accounting .current-account-filter.followup-filter:hover,
#accounting .current-account-filter.followup-filter.active { border-color: rgba(125, 211, 252, .58); background: linear-gradient(135deg, rgba(14, 165, 233, .22), rgba(15, 23, 42, .88)); color: #ffffff; }
#accounting .current-account-filter.followup-filter.active strong { background: rgba(14, 165, 233, .24); color: #e0f2fe; }

#accounting .current-account-filter.priority-filter { border-color: rgba(251, 191, 36, .28); background: rgba(120, 53, 15, .22); color: #fde68a; }
#accounting .current-account-filter.priority-filter strong { background: rgba(251, 191, 36, .16); color: #fde68a; }
#accounting .current-account-filter.priority-filter:hover,
#accounting .current-account-filter.priority-filter.active { border-color: rgba(251, 191, 36, .62); background: linear-gradient(135deg, rgba(180, 83, 9, .24), rgba(15, 23, 42, .88)); color: #ffffff; }
#accounting .current-account-filter.priority-filter.active strong { background: rgba(251, 191, 36, .24); color: #fff7d6; }

#accounting #accountingCurrentAccounts .current-account-filter-insight { display: grid; grid-template-columns: minmax(180px, .75fr) minmax(0, 2.8fr); gap: 10px; margin: 10px 0 12px; padding: 10px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 16px; background: linear-gradient(135deg, rgba(15, 23, 42, .74), rgba(30, 41, 59, .58)); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
#accounting #accountingCurrentAccounts .current-account-filter-insight-title { min-width: 0; display: grid; align-content: center; gap: 4px; padding: 8px 10px; border-radius: 12px; background: rgba(2, 6, 23, .30); border: 1px solid rgba(125, 211, 252, .14); }
#accounting #accountingCurrentAccounts .current-account-filter-insight-title span,
#accounting #accountingCurrentAccounts .current-account-filter-insight-grid span { color: #93c5fd; font-size: 9px; font-weight: 950; letter-spacing: .12em; text-transform: uppercase; }
#accounting #accountingCurrentAccounts .current-account-filter-insight-title strong { color: #f8fafc; font-size: 14px; line-height: 1.2; }
#accounting #accountingCurrentAccounts .current-account-filter-clear { justify-self: start; min-height: 28px; padding: 6px 10px; border: 1px solid rgba(245, 210, 138, .34); border-radius: 999px; background: rgba(245, 210, 138, .10); color: #fde68a; font-size: 10px; font-weight: 950; letter-spacing: .02em; cursor: pointer; }
#accounting #accountingCurrentAccounts .current-account-filter-clear:hover { border-color: rgba(245, 210, 138, .62); background: rgba(245, 210, 138, .18); color: #fff7d6; transform: translateY(-1px); }
#accounting #accountingCurrentAccounts .current-account-filter-insight-title small,
#accounting #accountingCurrentAccounts .current-account-filter-insight-grid small { color: #cbd5e1; font-size: 10px; line-height: 1.25; overflow-wrap: anywhere; }
#accounting #accountingCurrentAccounts .current-account-filter-insight-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
#accounting #accountingCurrentAccounts .current-account-filter-insight-grid div { min-width: 0; display: grid; gap: 4px; padding: 8px 9px; border: 1px solid rgba(148, 163, 184, .16); border-radius: 12px; background: rgba(15, 23, 42, .54); }
#accounting #accountingCurrentAccounts .current-account-filter-insight-grid strong { color: #fde68a; font-size: 12px; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; font-variant-numeric: tabular-nums; }
#accounting #accountingCurrentAccounts .current-account-active-view-chip { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px; max-width: 100%; margin: 0 0 10px; padding: 7px 10px; border: 1px solid rgba(125, 211, 252, .22); border-radius: 999px; background: rgba(2, 6, 23, .32); color: #cbd5e1; box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
#accounting #accountingCurrentAccounts .current-account-active-view-chip span { color: #93c5fd; font-size: 9px; font-weight: 950; letter-spacing: .14em; text-transform: uppercase; }
#accounting #accountingCurrentAccounts .current-account-active-view-chip strong { color: #f8fafc; font-size: 12px; line-height: 1.15; overflow-wrap: anywhere; }
#accounting #accountingCurrentAccounts .current-account-active-view-chip small { color: #fde68a; font-size: 10px; font-weight: 900; }
#accounting #accountingCurrentAccounts .current-account-empty-row td { padding: 14px !important; text-align: left; }
#accounting #accountingCurrentAccounts .current-account-empty-filter { display: grid; gap: 8px; max-width: 620px; margin: 0 auto; padding: 16px; border: 1px solid rgba(125, 211, 252, .22); border-radius: 18px; background: linear-gradient(135deg, rgba(15, 23, 42, .94), rgba(8, 47, 73, .58)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); color: #cbd5e1; }
#accounting #accountingCurrentAccounts .current-account-empty-filter span { color: #93c5fd; font-size: 10px; font-weight: 950; letter-spacing: .14em; text-transform: uppercase; }
#accounting #accountingCurrentAccounts .current-account-empty-filter strong { color: #f8fafc; font-size: 15px; line-height: 1.2; overflow-wrap: anywhere; }
#accounting #accountingCurrentAccounts .current-account-empty-filter small { color: #e0f2fe; font-size: 12px; font-weight: 850; line-height: 1.35; overflow-wrap: anywhere; }
#accounting #accountingCurrentAccounts .current-account-empty-filter p { margin: 0; color: #fde68a; font-size: 11px; font-weight: 800; line-height: 1.35; }
#accounting #accountingCurrentAccounts .current-account-empty-filter .ghost-button { justify-self: start; min-height: 30px; padding: 7px 11px; border-color: rgba(125, 211, 252, .34) !important; background: rgba(2, 6, 23, .64) !important; color: #e0f2fe !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
#accounting #accountingCurrentAccounts .current-account-empty-filter .ghost-button:hover { border-color: rgba(125, 211, 252, .58); background: rgba(14, 165, 233, .18); color: #ffffff; }
@media (max-width: 1180px) { #accounting #accountingCurrentAccounts .current-account-filter-insight { grid-template-columns: 1fr; } #accounting #accountingCurrentAccounts .current-account-filter-insight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { #accounting #accountingCurrentAccounts .current-account-filter-insight-grid { grid-template-columns: 1fr; } }

#accounting #accountingCurrentAccounts tr.current-account-eod-highlight td { background: rgba(245, 210, 138, .10); box-shadow: inset 0 1px 0 rgba(245, 210, 138, .20), inset 0 -1px 0 rgba(245, 210, 138, .14); }
#accounting #accountingCurrentAccounts tr.current-account-eod-highlight td:first-child { border-left: 3px solid rgba(245, 210, 138, .72); }
#endofday [data-open-current-account-from-eod] small { display: block; margin-top: 2px; color: #bae6fd; font-size: 10px; font-weight: 900; line-height: 1.1; }

#accounting #accountingCurrentAccounts .current-account-queue-header { align-items: center; gap: 12px; }
#accounting #accountingCurrentAccounts .current-account-export-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
#accounting #accountingCurrentAccounts #exportCurrentAccountCsvButton { border-color: rgba(125, 211, 252, .35); color: #dff6ff; background: rgba(14, 116, 144, .18); font-weight: 900; }
#accounting #accountingCurrentAccounts #exportCurrentAccountCsvButton:hover { background: rgba(14, 116, 144, .30); color: #ffffff; }

#accounting #accountingCurrentAccounts #printCurrentAccountButton { border-color: rgba(251, 191, 36, .36); color: #fff7d6; background: rgba(180, 83, 9, .16); font-weight: 900; }
#accounting #accountingCurrentAccounts #printCurrentAccountButton:hover { background: rgba(180, 83, 9, .28); color: #ffffff; }

#accounting #accountingCurrentAccounts .current-account-priority-panel { border-color: rgba(251, 191, 36, .18); background: linear-gradient(135deg, rgba(15, 23, 42, .94), rgba(30, 41, 59, .88)); }
#accounting #accountingCurrentAccounts .current-account-priority-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
#accounting #accountingCurrentAccounts .current-account-priority-card { min-width: 0; border: 1px solid rgba(148, 163, 184, .20); border-radius: 16px; padding: 12px; background: rgba(15, 23, 42, .62); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
#accounting #accountingCurrentAccounts .current-account-priority-card span { display: block; color: #93c5fd; font-size: 10px; text-transform: uppercase; letter-spacing: .12em; font-weight: 900; }
#accounting #accountingCurrentAccounts .current-account-priority-card strong { display: block; margin-top: 6px; color: #f8fafc; font-size: 13px; line-height: 1.25; overflow-wrap: anywhere; }
#accounting #accountingCurrentAccounts .current-account-priority-card b { display: block; margin-top: 6px; color: #fde68a; font-size: 15px; font-variant-numeric: tabular-nums; }
#accounting #accountingCurrentAccounts .current-account-priority-card small { display: block; margin-top: 6px; color: #cbd5e1; font-size: 11px; line-height: 1.35; overflow-wrap: anywhere; }
#accounting #accountingCurrentAccounts .current-account-priority-card.clean b { color: #86efac; }
#accounting #accountingCurrentAccounts .current-account-priority-card.risk { border-color: rgba(251, 191, 36, .35); background: rgba(120, 53, 15, .22); }
#accounting #accountingCurrentAccounts .current-account-priority-card.refund { border-color: rgba(251, 113, 133, .34); background: rgba(127, 29, 29, .20); }

#accounting #accountingCurrentAccounts .current-account-priority-card { text-align: left; cursor: pointer; color: inherit; font-family: inherit; }
#accounting #accountingCurrentAccounts .current-account-priority-card:hover,
#accounting #accountingCurrentAccounts .current-account-priority-card:focus-visible,
#accounting #accountingCurrentAccounts .current-account-priority-card.active { border-color: rgba(251, 191, 36, .64); transform: translateY(-1px); box-shadow: 0 14px 30px rgba(15, 23, 42, .28), inset 0 1px 0 rgba(255,255,255,.07); outline: none; }
#accounting #accountingCurrentAccounts .current-account-priority-card em { display: inline-flex; margin-top: 8px; color: #fde68a; font-size: 10px; font-style: normal; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; }
#accounting #accountingCurrentAccounts .current-account-priority-card.active em { color: #fff7d6; }
@media (max-width: 1180px) { #accounting #accountingCurrentAccounts .current-account-priority-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

#accounting #accountingCurrentAccounts .current-account-queue-panel table th,
#accounting #accountingCurrentAccounts .current-account-queue-panel table td { padding-left: 6px; padding-right: 6px; }
#accounting #accountingCurrentAccounts .current-account-queue-panel table th:nth-child(4),
#accounting #accountingCurrentAccounts .current-account-queue-panel table th:nth-child(5) { font-size: 9px; line-height: 1.1; }
#accounting #accountingCurrentAccounts .current-account-queue-panel table td:nth-child(3),
#accounting #accountingCurrentAccounts .current-account-queue-panel table td:nth-child(4),
#accounting #accountingCurrentAccounts .current-account-queue-panel table td:nth-child(5) { font-size: 10px; line-height: 1.15; letter-spacing: -.03em; }
#accounting #accountingCurrentAccounts .current-account-queue-panel table td:nth-child(3) strong,
#accounting #accountingCurrentAccounts .current-account-queue-panel table td:nth-child(4) strong,
#accounting #accountingCurrentAccounts .current-account-queue-panel table td:nth-child(5) strong { font-size: 10px; letter-spacing: -.04em; }
#accounting #accountingCurrentAccounts .current-account-queue-panel table td:nth-child(3) .muted { font-size: 9px; }
#accounting #accountingCurrentAccounts .current-account-row-priority { min-width: 0; width: 100%; padding: 4px 5px; }
#accounting #accountingCurrentAccounts .current-account-row-priority strong { font-size: 10px; }
#accounting #accountingCurrentAccounts .current-account-row-priority small { font-size: 8px; line-height: 1.1; }

#accounting #accountingCurrentAccounts .current-account-next-action { display: grid; gap: 5px; min-width: 0; max-width: 100%; overflow: hidden; }
#accounting #accountingCurrentAccounts .current-account-quick-action { display: grid; gap: 1px; width: 100%; min-width: 0; max-width: 100%; padding: 4px 6px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 10px; background: rgba(15, 23, 42, .58); line-height: 1.08; box-sizing: border-box; }
#accounting #accountingCurrentAccounts .current-account-quick-action strong { color: #e2e8f0; font-size: 9px; font-weight: 950; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingCurrentAccounts .current-account-quick-action small { color: #94a3b8; font-size: 8px; font-weight: 800; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingCurrentAccounts .current-account-quick-action.quick-risk { border-color: rgba(251, 191, 36, .38); background: rgba(120, 53, 15, .24); }
#accounting #accountingCurrentAccounts .current-account-quick-action.quick-risk strong { color: #fde68a; }
#accounting #accountingCurrentAccounts .current-account-quick-action.quick-warn { border-color: rgba(56, 189, 248, .30); background: rgba(8, 47, 73, .28); }
#accounting #accountingCurrentAccounts .current-account-quick-action.quick-warn strong { color: #bae6fd; }
#accounting #accountingCurrentAccounts .current-account-quick-action.quick-folio { border-color: rgba(168, 85, 247, .34); background: rgba(59, 7, 100, .24); }
#accounting #accountingCurrentAccounts .current-account-quick-action.quick-folio strong { color: #e9d5ff; }
#accounting #accountingCurrentAccounts .current-account-quick-action.quick-refund { border-color: rgba(251, 113, 133, .34); background: rgba(127, 29, 29, .20); }
#accounting #accountingCurrentAccounts .current-account-quick-action.quick-refund strong { color: #fecdd3; }
#accounting #accountingCurrentAccounts .current-account-quick-action.quick-clean { border-color: rgba(34, 197, 94, .24); background: rgba(20, 83, 45, .18); }
#accounting #accountingCurrentAccounts .current-account-quick-action.quick-clean strong { color: #bbf7d0; }
#accounting #accountingCurrentAccounts .current-account-next-action > * { min-width: 0; max-width: 100%; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingCurrentAccounts .current-account-next-action .invoice-action { display: block; max-width: 100%; white-space: normal; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingCurrentAccounts .current-account-view-reason { display: grid; gap: 1px; width: 100%; min-width: 0; max-width: 100%; padding: 4px 6px; border: 1px dashed rgba(125, 211, 252, .30); border-radius: 10px; background: rgba(8, 47, 73, .20); line-height: 1.08; box-sizing: border-box; }
#accounting #accountingCurrentAccounts .current-account-view-reason em { color: #93c5fd; font-size: 7px; font-style: normal; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingCurrentAccounts .current-account-view-reason small { color: #e0f2fe; font-size: 8px; font-weight: 850; overflow-wrap: anywhere; word-break: break-word; }

#accounting #accountingCurrentAccounts .current-account-filter.action-filter { border-color: rgba(168, 85, 247, .30); background: rgba(59, 7, 100, .22); color: #e9d5ff; }
#accounting #accountingCurrentAccounts .current-account-filter.action-filter.active { border-color: rgba(216, 180, 254, .70); background: linear-gradient(135deg, rgba(88, 28, 135, .60), rgba(30, 41, 59, .74)); color: #faf5ff; }
#accounting #accountingCurrentAccounts .current-account-filter.risk-filter { border-color: rgba(251, 191, 36, .30); background: rgba(120, 53, 15, .18); color: #fde68a; }
#accounting #accountingCurrentAccounts .current-account-filter.risk-filter.active { border-color: rgba(252, 211, 77, .70); background: linear-gradient(135deg, rgba(120, 53, 15, .58), rgba(30, 41, 59, .76)); color: #fffbeb; }
#accounting #accountingCurrentAccounts .current-account-filter.risk-filter strong { background: rgba(251, 191, 36, .12); color: #fde68a; }
#accounting #accountingCurrentAccounts .current-account-filter.zero-count:not(.active) { border-style: dashed; border-color: rgba(148, 163, 184, .16); background: rgba(15, 23, 42, .34); color: #94a3b8; box-shadow: inset 0 1px 0 rgba(255,255,255,.025); }
#accounting #accountingCurrentAccounts .current-account-filter.zero-count:not(.active) strong { background: rgba(100, 116, 139, .10); color: #94a3b8; }
#accounting #accountingCurrentAccounts .current-account-filter.zero-count:not(.active) em { background: rgba(148, 163, 184, .10); color: #94a3b8; }
#accounting #accountingCurrentAccounts .current-account-filter.zero-count:not(.active):hover { transform: translateY(-1px); border-style: solid; border-color: rgba(125, 211, 252, .34); background: rgba(30, 41, 59, .72); color: #e2e8f0; }
#accounting #accountingCurrentAccounts .current-account-filter.zero-count:not(.active):hover em { background: rgba(125, 211, 252, .12); color: #bae6fd; }

#accounting #accountingCurrentAccounts .current-account-row-priority { display: inline-grid; gap: 2px; min-width: 74px; max-width: 100%; border: 1px solid rgba(148, 163, 184, .22); border-radius: 12px; padding: 5px 7px; background: rgba(15, 23, 42, .72); line-height: 1.1; }
#accounting #accountingCurrentAccounts .current-account-row-priority strong { color: #e2e8f0; font-size: 11px; font-weight: 950; }
#accounting #accountingCurrentAccounts .current-account-row-priority small { color: #94a3b8; font-size: 9px; font-weight: 800; overflow-wrap: anywhere; }
#accounting #accountingCurrentAccounts .current-account-row-priority.priority-high { border-color: rgba(251, 191, 36, .42); background: rgba(120, 53, 15, .30); }
#accounting #accountingCurrentAccounts .current-account-row-priority.priority-high strong { color: #fde68a; }
#accounting #accountingCurrentAccounts .current-account-row-priority.priority-medium { border-color: rgba(56, 189, 248, .34); background: rgba(8, 47, 73, .36); }
#accounting #accountingCurrentAccounts .current-account-row-priority.priority-medium strong { color: #bae6fd; }
#accounting #accountingCurrentAccounts .current-account-row-priority.priority-low { border-color: rgba(34, 197, 94, .28); background: rgba(20, 83, 45, .20); }
#accounting #accountingCurrentAccounts .current-account-row-priority.priority-low strong { color: #bbf7d0; }
#accounting #accountingCurrentAccounts .current-account-priority-stack { display: grid; gap: 5px; min-width: 0; }
#accounting #accountingCurrentAccounts .current-account-row-priority { min-width: 0; width: 100%; padding: 4px 5px; }
#accounting #accountingCurrentAccounts .current-account-row-priority strong { font-size: 10px; }
#accounting #accountingCurrentAccounts .current-account-row-priority small { font-size: 8px; line-height: 1.1; }
#accounting #accountingCurrentAccounts .current-account-risk-badges { display: flex; flex-wrap: wrap; gap: 3px; min-width: 0; max-width: 100%; }
#accounting #accountingCurrentAccounts .current-account-risk-badges em { max-width: 100%; padding: 2px 5px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 999px; background: rgba(15, 23, 42, .62); color: #cbd5e1; font-size: 7px; font-style: normal; font-weight: 950; line-height: 1.1; letter-spacing: .01em; overflow-wrap: anywhere; }
#accounting #accountingCurrentAccounts .current-account-risk-badges .risk-refund { border-color: rgba(251, 113, 133, .34); color: #fecdd3; background: rgba(127, 29, 29, .20); }
#accounting #accountingCurrentAccounts .current-account-risk-badges .risk-due,
#accounting #accountingCurrentAccounts .current-account-risk-badges .risk-balance { border-color: rgba(251, 191, 36, .34); color: #fde68a; background: rgba(120, 53, 15, .24); }
#accounting #accountingCurrentAccounts .current-account-risk-badges .risk-follow,
#accounting #accountingCurrentAccounts .current-account-risk-badges .risk-missing { border-color: rgba(56, 189, 248, .30); color: #bae6fd; background: rgba(8, 47, 73, .24); }
#accounting #accountingCurrentAccounts .current-account-risk-badges .risk-invoice,
#accounting #accountingCurrentAccounts .current-account-risk-badges .risk-folio { border-color: rgba(168, 85, 247, .30); color: #e9d5ff; background: rgba(59, 7, 100, .22); }
#accounting #accountingCurrentAccounts .current-account-risk-badges .risk-clean { border-color: rgba(34, 197, 94, .22); color: #bbf7d0; background: rgba(20, 83, 45, .16); }


#accounting #accountingPayments .payment-source-panel table th:nth-child(4),
#accounting #accountingPayments .payment-source-panel table td:nth-child(4) { min-width: 190px; }
#accounting #accountingPayments .payment-source-risk { display: grid; gap: 4px; min-width: 0; max-width: 100%; padding: 6px 7px; border: 1px solid rgba(251, 191, 36, .24); border-radius: 12px; background: rgba(120, 53, 15, .16); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
#accounting #accountingPayments .payment-source-risk em { display: inline-block; color: #fde68a; font-size: 9px; font-style: normal; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingPayments .payment-source-risk em:nth-child(2) { color: #e0f2fe; }
#accounting #accountingPayments .payment-source-risk em:nth-child(3) { color: #bbf7d0; }
#accounting #accountingPayments .payment-source-risk small { color: #94a3b8; font-size: 8px; font-weight: 800; line-height: 1.2; overflow-wrap: anywhere; }


#accounting #accountingPayments .payment-date-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 10px; min-width: 0; }
#accounting #accountingPayments .payment-date-summary-card { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 14px; background: linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(30, 41, 59, .62)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#accounting #accountingPayments .payment-date-summary-card span { color: #94a3b8; font-size: 9px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#accounting #accountingPayments .payment-date-summary-card strong { color: #f8fafc; font-size: 14px; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingPayments .payment-date-summary-card small { color: #cbd5e1; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
@media (max-width: 1100px) { #accounting #accountingPayments .payment-date-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { #accounting #accountingPayments .payment-date-summary { grid-template-columns: 1fr; } }


#accounting #accountingOpenFolios .open-folio-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 10px; min-width: 0; }
#accounting #accountingOpenFolios .open-folio-summary-card { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 14px; background: linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(30, 41, 59, .62)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#accounting #accountingOpenFolios .open-folio-summary-card span { color: #94a3b8; font-size: 9px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#accounting #accountingOpenFolios .open-folio-summary-card strong { color: #f8fafc; font-size: 14px; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingOpenFolios .open-folio-summary-card small { color: #cbd5e1; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
#accounting #accountingOpenFolios .open-folio-risk-panel table th:nth-child(6),
#accounting #accountingOpenFolios .open-folio-risk-panel table td:nth-child(6) { min-width: 200px; }
#accounting #accountingOpenFolios .open-folio-risk { display: grid; gap: 4px; min-width: 0; max-width: 100%; padding: 6px 7px; border: 1px solid rgba(125, 211, 252, .24); border-radius: 12px; background: rgba(8, 47, 73, .22); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
#accounting #accountingOpenFolios .open-folio-risk em { display: inline-block; color: #bae6fd; font-size: 9px; font-style: normal; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingOpenFolios .open-folio-risk em:nth-child(2) { color: #fde68a; }
#accounting #accountingOpenFolios .open-folio-risk em:nth-child(3) { color: #bbf7d0; }
#accounting #accountingOpenFolios .open-folio-risk small { color: #94a3b8; font-size: 8px; font-weight: 800; line-height: 1.2; overflow-wrap: anywhere; }
@media (max-width: 1100px) { #accounting #accountingOpenFolios .open-folio-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { #accounting #accountingOpenFolios .open-folio-summary { grid-template-columns: 1fr; } }


#accounting #accountingAdvances .advance-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 10px; min-width: 0; }
#accounting #accountingAdvances .advance-summary-card { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 14px; background: linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(30, 41, 59, .62)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#accounting #accountingAdvances .advance-summary-card span { color: #94a3b8; font-size: 9px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#accounting #accountingAdvances .advance-summary-card strong { color: #f8fafc; font-size: 14px; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingAdvances .advance-summary-card small { color: #cbd5e1; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
#accounting #accountingAdvances .advance-risk-panel table th:nth-child(6),
#accounting #accountingAdvances .advance-risk-panel table td:nth-child(6) { min-width: 210px; }
#accounting #accountingAdvances .advance-source-risk { display: grid; gap: 4px; min-width: 0; max-width: 100%; padding: 6px 7px; border: 1px solid rgba(167, 139, 250, .26); border-radius: 12px; background: rgba(49, 46, 129, .22); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
#accounting #accountingAdvances .advance-source-risk em { display: inline-block; color: #ddd6fe; font-size: 9px; font-style: normal; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingAdvances .advance-source-risk em:nth-child(2) { color: #bfdbfe; }
#accounting #accountingAdvances .advance-source-risk em:nth-child(3) { color: #fde68a; }
#accounting #accountingAdvances .advance-source-risk small { color: #94a3b8; font-size: 8px; font-weight: 800; line-height: 1.2; overflow-wrap: anywhere; }
@media (max-width: 1100px) { #accounting #accountingAdvances .advance-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { #accounting #accountingAdvances .advance-summary { grid-template-columns: 1fr; } }


#accounting #accountingCashier .cashier-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 10px; min-width: 0; }
#accounting #accountingCashier .cashier-summary-card { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 14px; background: linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(30, 41, 59, .62)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#accounting #accountingCashier .cashier-summary-card span { color: #94a3b8; font-size: 9px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#accounting #accountingCashier .cashier-summary-card strong { color: #f8fafc; font-size: 14px; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingCashier .cashier-summary-card small { color: #cbd5e1; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
#accounting #accountingCashier .cashier-risk-panel table th:nth-child(7),
#accounting #accountingCashier .cashier-risk-panel table td:nth-child(7) { min-width: 200px; }
#accounting #accountingCashier .cashier-channel-risk { display: grid; gap: 4px; min-width: 0; max-width: 100%; padding: 6px 7px; border: 1px solid rgba(52, 211, 153, .24); border-radius: 12px; background: rgba(6, 78, 59, .22); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
#accounting #accountingCashier .cashier-channel-risk em { display: inline-block; color: #bbf7d0; font-size: 9px; font-style: normal; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingCashier .cashier-channel-risk em:nth-child(2) { color: #bae6fd; }
#accounting #accountingCashier .cashier-channel-risk em:nth-child(3) { color: #fde68a; }
#accounting #accountingCashier .cashier-channel-risk small { color: #94a3b8; font-size: 8px; font-weight: 800; line-height: 1.2; overflow-wrap: anywhere; }
@media (max-width: 1100px) { #accounting #accountingCashier .cashier-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { #accounting #accountingCashier .cashier-summary { grid-template-columns: 1fr; } }

#accounting #accountingVoucher .voucher-source-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 10px; min-width: 0; }
#accounting #accountingVoucher .voucher-source-card { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 14px; background: linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(30, 41, 59, .62)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#accounting #accountingVoucher .voucher-source-card span { color: #94a3b8; font-size: 9px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#accounting #accountingVoucher .voucher-source-card strong { color: #f8fafc; font-size: 14px; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingVoucher .voucher-source-card small { color: #cbd5e1; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
#accounting #accountingVoucher .voucher-source-panel table th:nth-child(5),
#accounting #accountingVoucher .voucher-source-panel table td:nth-child(5) { min-width: 210px; }
#accounting #accountingVoucher .voucher-source-control { display: grid; gap: 4px; min-width: 0; max-width: 100%; padding: 6px 7px; border: 1px solid rgba(96, 165, 250, .24); border-radius: 12px; background: rgba(30, 64, 175, .20); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
#accounting #accountingVoucher .voucher-source-control em { display: inline-block; color: #bfdbfe; font-size: 9px; font-style: normal; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingVoucher .voucher-source-control em:nth-child(2) { color: #bbf7d0; }
#accounting #accountingVoucher .voucher-source-control em:nth-child(3) { color: #fde68a; }
#accounting #accountingVoucher .voucher-source-control small { color: #94a3b8; font-size: 8px; font-weight: 800; line-height: 1.2; overflow-wrap: anywhere; }
@media (max-width: 1100px) { #accounting #accountingVoucher .voucher-source-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { #accounting #accountingVoucher .voucher-source-summary { grid-template-columns: 1fr; } }

#accounting #accountingTcmb .tcmb-source-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 10px; min-width: 0; }
#accounting #accountingTcmb .tcmb-source-card { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 14px; background: linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(30, 41, 59, .62)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#accounting #accountingTcmb .tcmb-source-card span { color: #94a3b8; font-size: 9px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#accounting #accountingTcmb .tcmb-source-card strong { color: #f8fafc; font-size: 14px; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingTcmb .tcmb-source-card small { color: #cbd5e1; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
@media (max-width: 1100px) { #accounting #accountingTcmb .tcmb-source-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { #accounting #accountingTcmb .tcmb-source-summary { grid-template-columns: 1fr; } }

#accounting #accountingTcmb #refreshTcmbRatesButton { background: rgba(15, 23, 42, .72); color: #e0f2fe; border-color: rgba(96, 165, 250, .32); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#accounting #accountingTcmb #refreshTcmbRatesButton:hover { background: rgba(30, 64, 175, .34); color: #f8fafc; }

#accounting #accountingAccounts .account-plan-context-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 10px; min-width: 0; }
#accounting #accountingAccounts .account-plan-context-card { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 14px; background: linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(30, 41, 59, .62)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#accounting #accountingAccounts .account-plan-context-card span { color: #94a3b8; font-size: 9px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#accounting #accountingAccounts .account-plan-context-card strong { color: #f8fafc; font-size: 14px; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingAccounts .account-plan-context-card small { color: #cbd5e1; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
@media (max-width: 1100px) { #accounting #accountingAccounts .account-plan-context-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { #accounting #accountingAccounts .account-plan-context-summary { grid-template-columns: 1fr; } }

#accounting #accountingCodes .transaction-code-context-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 10px; min-width: 0; }
#accounting #accountingCodes .transaction-code-context-card { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 14px; background: linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(30, 41, 59, .62)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#accounting #accountingCodes .transaction-code-context-card span { color: #94a3b8; font-size: 9px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#accounting #accountingCodes .transaction-code-context-card strong { color: #f8fafc; font-size: 14px; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingCodes .transaction-code-context-card small { color: #cbd5e1; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
@media (max-width: 1100px) { #accounting #accountingCodes .transaction-code-context-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { #accounting #accountingCodes .transaction-code-context-summary { grid-template-columns: 1fr; } }

#accounting #accountingRevenue .revenue-context-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 10px; min-width: 0; }
#accounting #accountingRevenue .revenue-context-card { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 14px; background: linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(30, 41, 59, .62)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#accounting #accountingRevenue .revenue-context-card span { color: #94a3b8; font-size: 9px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#accounting #accountingRevenue .revenue-context-card strong { color: #f8fafc; font-size: 14px; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#accounting #accountingRevenue .revenue-context-card small { color: #cbd5e1; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
@media (max-width: 1100px) { #accounting #accountingRevenue .revenue-context-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { #accounting #accountingRevenue .revenue-context-summary { grid-template-columns: 1fr; } }

#setup.setup-command-center #boards .board-context-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 10px; min-width: 0; }
#setup.setup-command-center #boards .board-context-card { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 14px; background: linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(30, 41, 59, .62)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#setup.setup-command-center #boards .board-context-card span { color: #94a3b8; font-size: 9px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#setup.setup-command-center #boards .board-context-card strong { color: #f8fafc; font-size: 14px; font-weight: 950; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
#setup.setup-command-center #boards .board-context-card small { color: #cbd5e1; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
@media (max-width: 1100px) { #setup.setup-command-center #boards .board-context-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { #setup.setup-command-center #boards .board-context-summary { grid-template-columns: 1fr; } }

/* Gün Sonu read-only operasyon aksiyon listesi */
#endofday .eod-action-panel .panel-header span { color: #cbd5e1; font-size: 11px; font-weight: 850; }
#endofday .eod-action-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; padding: 0 18px 18px; min-width: 0; }
#endofday .eod-action-card { display: grid; grid-template-rows: 1fr auto; gap: 10px; min-width: 0; min-height: 154px; padding: 12px; border: 1px solid rgba(148, 163, 184, .2); border-radius: 18px; background: linear-gradient(145deg, rgba(15, 23, 42, .95), rgba(30, 41, 59, .7)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
#endofday .eod-action-card span { display: inline-flex; width: max-content; max-width: 100%; padding: 4px 7px; border-radius: 999px; color: #fde68a; background: rgba(146, 107, 43, .18); font-size: 9px; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#endofday .eod-action-card strong { display: block; margin-top: 8px; color: #f8fafc; font-size: 18px; font-weight: 950; line-height: 1.08; overflow-wrap: anywhere; }
#endofday .eod-action-card small { display: block; margin-top: 5px; color: #cbd5e1; font-size: 10px; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
#endofday .eod-action-card .ghost-button { width: 100%; justify-content: center; min-height: 34px; padding: 7px 8px; border-color: rgba(212, 175, 55, .35); color: #fef3c7; background: rgba(212, 175, 55, .08); font-size: 10px; font-weight: 950; white-space: normal; }
#endofday .eod-action-card.blocker { border-color: rgba(248, 113, 113, .38); background: linear-gradient(145deg, rgba(69, 10, 10, .75), rgba(15, 23, 42, .92)); }
#endofday .eod-action-card.warning { border-color: rgba(251, 191, 36, .38); background: linear-gradient(145deg, rgba(69, 46, 10, .68), rgba(15, 23, 42, .92)); }
#endofday .eod-action-card.ok { border-color: rgba(34, 197, 94, .26); }
#endofday .eod-action-card.safe { border-color: rgba(56, 189, 248, .3); }
@media (max-width: 1280px) { #endofday .eod-action-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 820px) { #endofday .eod-action-list { grid-template-columns: 1fr; } }

#endofday .eod-action-card em { display: block; margin-top: 8px; padding: 7px 8px; border-radius: 12px; color: #fef3c7; background: rgba(212, 175, 55, .1); border: 1px solid rgba(212, 175, 55, .18); font-size: 10px; font-style: normal; font-weight: 950; line-height: 1.3; overflow-wrap: anywhere; }
#endofday .eod-action-card[data-eod-action-priority="10"] span { background: rgba(248, 113, 113, .14); color: #fecaca; }
#endofday .eod-action-card[data-eod-action-key="dispatch"] em { color: #bae6fd; background: rgba(56, 189, 248, .1); border-color: rgba(56, 189, 248, .18); }

/* Ön Büro read-only operasyon rozetleri */
#frontoffice .fo-operation-badges { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 7px; max-width: 280px; min-width: 0; }
#frontoffice .fo-operation-badge { display: inline-flex; align-items: center; max-width: 128px; padding: 4px 7px; border-radius: 999px; border: 1px solid rgba(148, 163, 184, .22); color: #cbd5e1; background: rgba(15, 23, 42, .62); font-size: 10px; font-weight: 950; line-height: 1.12; letter-spacing: .01em; white-space: normal; overflow-wrap: anywhere; }
#frontoffice .fo-operation-badge.ok { color: #bbf7d0; border-color: rgba(34, 197, 94, .26); background: rgba(22, 101, 52, .16); }
#frontoffice .fo-operation-badge.warn { color: #fde68a; border-color: rgba(251, 191, 36, .28); background: rgba(146, 64, 14, .18); }
#frontoffice .fo-operation-badge.web { color: #bfdbfe; border-color: rgba(59, 130, 246, .28); background: rgba(30, 64, 175, .18); }
#frontoffice .fo-operation-badge.safe { color: #bae6fd; border-color: rgba(56, 189, 248, .28); background: rgba(12, 74, 110, .18); }
#frontoffice .fo-operation-badge.muted { color: #cbd5e1; border-color: rgba(148, 163, 184, .18); background: rgba(51, 65, 85, .18); }
#frontoffice .web-review-status-cell .fo-operation-badges { max-width: 100%; }


/* Kullanıcı Bilgileri: kişi bazlı yetki ağacı */
.user-permission-builder {
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 22px;
  padding: 16px;
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.92), rgba(30, 41, 59, 0.78));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 18px 48px rgba(15, 23, 42, 0.18);
}

.permission-builder-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.permission-builder-head strong {
  display: block;
  color: #f8fafc;
  font-size: 15px;
}

.permission-builder-head span,
.permission-builder-head small {
  color: #cbd5e1;
  font-size: 12px;
}

.permission-builder-head small {
  border: 1px solid rgba(245, 158, 11, 0.35);
  border-radius: 999px;
  padding: 6px 10px;
  color: #fde68a;
  background: rgba(245, 158, 11, 0.10);
  white-space: nowrap;
}

.permission-tree {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
  max-height: none;
  overflow: visible;
  padding-right: 0;
}

.user-permission-modal {
  max-height: min(860px, calc(100vh - 32px));
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-gutter: stable;
}

.user-permission-modal .permission-builder {
  overflow: visible;
}

.user-permission-modal .modal-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  margin: 14px -18px -18px;
  padding: 14px 18px 18px;
  background: linear-gradient(180deg, rgba(246, 247, 249, 0.82), rgba(246, 247, 249, 0.98));
  backdrop-filter: blur(12px);
}

.permission-group {
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 18px;
  background: rgba(2, 6, 23, 0.42);
  padding: 12px;
}

.permission-node {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}

.permission-node input {
  width: 17px;
  height: 17px;
  accent-color: #d97706;
  flex: 0 0 auto;
}

.permission-node.parent {
  align-items: flex-start;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
}

.permission-node.parent strong {
  color: #fff7ed;
  font-size: 14px;
}

.permission-node.parent small {
  display: block;
  color: #94a3b8;
  margin-top: 2px;
  font-size: 11px;
}

.permission-children {
  display: grid;
  gap: 7px;
  padding-top: 10px;
}

.permission-node.child {
  min-height: 30px;
  padding: 6px 8px;
  border-radius: 10px;
  color: #e2e8f0;
  background: rgba(15, 23, 42, 0.48);
  font-size: 12px;
}

.permission-node.child:hover {
  background: rgba(217, 119, 6, 0.14);
}

.permission-count {
  display: block;
  color: #64748b;
  font-size: 11px;
  margin-top: 4px;
}

#userInfo .users-command-hero {
  margin-top: 8px;
}

#userInfo .users-command-section .form-grid {
  align-items: start;
}


/* User access matrix modal */
.access-matrix-summary {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 22px;
  border: 1px solid rgba(212, 175, 55, 0.28);
  border-radius: 24px;
  background:
    linear-gradient(135deg, rgba(212, 175, 55, 0.12), transparent 34%),
    linear-gradient(145deg, rgba(15, 25, 42, 0.96), rgba(7, 13, 28, 0.98));
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255,255,255,.06);
  cursor: pointer;
}

.access-matrix-summary:hover {
  border-color: rgba(244, 214, 128, 0.5);
  transform: translateY(-1px);
}

.access-matrix-summary.is-locked {
  opacity: .78;
  cursor: not-allowed;
}

.access-matrix-summary small:first-child,
.access-matrix-modal-head small {
  display: block;
  color: #d6b96a;
  letter-spacing: .16em;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.access-matrix-summary strong {
  display: block;
  font-size: 22px;
  color: #fff8df;
  margin-bottom: 6px;
}

.access-matrix-summary span {
  color: rgba(232, 239, 252, .72);
  line-height: 1.5;
}

.access-matrix-chips {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 32px;
  margin: 0;
  color: rgba(232, 239, 252, .72);
}

.access-matrix-chips span,
.access-matrix-chips em,
.access-matrix-count {
  display: inline-flex;
  align-items: center;
  width: max-content;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(212, 175, 55, .24);
  background: rgba(212, 175, 55, .09);
  color: #f4d680;
  font-style: normal;
  font-weight: 800;
}

.access-matrix-count {
  position: absolute;
  right: 22px;
  bottom: 18px;
  color: #102033;
  background: linear-gradient(135deg, #f4d680, #bf8f2c);
}

.modal-open {
  overflow: hidden;
}

.access-matrix-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 28px;
  background: rgba(2, 7, 17, .72);
  backdrop-filter: blur(16px);
}

.access-matrix-modal.is-hidden {
  display: none;
}

.access-matrix-dialog {
  width: min(1180px, calc(100vw - 48px));
  max-height: min(860px, calc(100vh - 48px));
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  overflow: hidden;
  border-radius: 30px;
  border: 1px solid rgba(226, 194, 107, .32);
  background:
    radial-gradient(circle at 10% 0%, rgba(212, 175, 55, .14), transparent 32%),
    linear-gradient(145deg, #101a2d, #050b19 72%);
  box-shadow: 0 36px 120px rgba(0, 0, 0, .58);
}

.access-matrix-modal-head,
.access-matrix-toolbar,
.access-matrix-footer {
  padding: 22px 26px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.access-matrix-modal-head {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: flex-start;
}

.access-matrix-modal-head h2 {
  margin: 0 0 8px;
  color: #fff7df;
  font-size: clamp(24px, 3vw, 34px);
}

.access-matrix-modal-head p {
  margin: 0;
  max-width: 760px;
  color: rgba(232, 239, 252, .72);
}

.modal-close {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  color: #fff;
  font-size: 28px;
  cursor: pointer;
}

.access-matrix-toolbar,
.access-matrix-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.access-matrix-toolbar span {
  display: block;
  color: rgba(232, 239, 252, .58);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .12em;
}

.access-matrix-toolbar strong {
  color: #f4d680;
  font-size: 18px;
}

.access-matrix-actions,
.access-matrix-footer {
  border-bottom: 0;
}

.access-matrix-actions {
  display: flex;
  gap: 10px;
}

.access-matrix-grid {
  overflow: auto;
  padding: 24px 26px 28px;
  display: grid;
  grid-template-columns: repeat(3, minmax(240px, 1fr));
  gap: 16px;
  max-height: none;
}

.access-matrix-grid .permission-group {
  border-radius: 22px;
  border: 1px solid rgba(255, 255, 255, .1);
  background: rgba(5, 12, 27, .72);
  padding: 16px;
  min-height: 160px;
}

.access-matrix-grid .permission-node.parent {
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  align-items: center;
  gap: 10px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.permission-module-mark {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(244,214,128,.18), rgba(191,143,44,.12));
  color: #f4d680;
  font-size: 11px;
  font-weight: 900;
}

.access-matrix-grid .permission-children {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.access-matrix-grid .permission-node.child {
  min-height: 40px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.05);
}

.access-matrix-grid input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: #d6b96a;
}

@media (max-width: 1100px) {
  .access-matrix-grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
}

@media (max-width: 760px) {
  .access-matrix-summary { grid-template-columns: 1fr; }
  .access-matrix-count { position: static; }
  .access-matrix-grid { grid-template-columns: 1fr; }
  .access-matrix-toolbar,
  .access-matrix-footer { align-items: stretch; flex-direction: column; }
}


.access-matrix-summary .secondary-button,
.access-matrix-toolbar .ghost-button,
.access-matrix-footer .ghost-button,
.access-matrix-footer .primary-button {
  min-height: 42px;
  border-radius: 14px;
  padding: 0 18px;
  font-weight: 900;
  letter-spacing: .01em;
  box-shadow: none;
}

.access-matrix-summary .secondary-button {
  justify-self: end;
  border: 1px solid rgba(244, 214, 128, .45);
  background: linear-gradient(135deg, rgba(244,214,128,.18), rgba(191,143,44,.28));
  color: #fff7dc;
}

.access-matrix-summary .secondary-button:hover,
.access-matrix-toolbar .ghost-button:hover,
.access-matrix-footer .ghost-button:hover {
  border-color: rgba(244, 214, 128, .7);
  background: rgba(244, 214, 128, .14);
  color: #fff7dc;
}

.access-matrix-toolbar .ghost-button,
.access-matrix-footer .ghost-button {
  border: 1px solid rgba(255, 255, 255, .14);
  background: rgba(255, 255, 255, .06);
  color: rgba(244, 248, 255, .94);
}

.access-matrix-footer .primary-button {
  border: 1px solid rgba(244, 214, 128, .45);
  background: linear-gradient(135deg, #0e3158, #123f72);
  color: #fff;
}


/* Access matrix modal stability fixes: prevent overlap and global permission-style bleed */
.access-matrix-dialog {
  height: min(900px, calc(100vh - 40px));
  max-height: calc(100vh - 40px);
}

.access-matrix-grid {
  display: block;
  columns: 3 300px;
  column-gap: 18px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 22px 26px 30px;
  align-content: start;
}

.access-matrix-grid .permission-group {
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
  break-inside: avoid;
  page-break-inside: avoid;
  margin: 0 0 18px;
  min-height: unset;
  height: auto;
  overflow: visible;
}

.access-matrix-grid .permission-node,
.access-matrix-grid .permission-node.parent,
.access-matrix-grid .permission-node.child {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  transform: none;
  margin: 0;
  overflow: visible;
}

.access-matrix-grid .permission-node.parent {
  display: grid;
  grid-template-columns: 22px 38px minmax(0, 1fr) max-content;
  align-items: center;
  gap: 12px;
  min-height: 56px;
  padding: 0 0 14px;
}

.access-matrix-grid .permission-node.parent strong,
.access-matrix-grid .permission-node.child span {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.35;
}

.access-matrix-grid .permission-node.parent small {
  justify-self: end;
  text-align: right;
  white-space: nowrap;
  margin: 0;
}

.access-matrix-grid .permission-children {
  display: grid;
  grid-template-columns: 1fr;
  gap: 9px;
  margin-top: 14px;
  overflow: visible;
}

.access-matrix-grid .permission-node.child {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 11px 12px;
}

.access-matrix-grid input[type="checkbox"] {
  flex: 0 0 auto;
  margin: 0;
  position: static;
  z-index: 1;
}

@media (max-width: 1180px) {
  .access-matrix-grid { columns: 2 300px; }
}

@media (max-width: 760px) {
  .access-matrix-grid { columns: 1 auto; }
}


/* Access matrix final grid: no horizontal masonry, no card overlap */
.access-matrix-grid {
  display: grid !important;
  columns: auto !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-flow: row;
  align-items: start;
  gap: 18px;
  overflow-y: auto;
  overflow-x: hidden;
}

.access-matrix-grid .permission-group {
  display: block !important;
  width: auto;
  min-width: 0;
  margin: 0;
  align-self: start;
  break-inside: auto;
  page-break-inside: auto;
}

.access-matrix-grid .permission-children {
  max-height: none;
}

@media (max-width: 1180px) {
  .access-matrix-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .access-matrix-grid { grid-template-columns: 1fr; }
}


/* Access matrix operational order: compact main modules continue below Gün Sonu */
.access-matrix-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(280px, .92fr);
  grid-auto-flow: row;
  align-items: start;
}

.access-matrix-module-setup { grid-column: 1; grid-row: 1 / span 4; }
.access-matrix-module-frontoffice { grid-column: 2; grid-row: 1 / span 3; }
.access-matrix-module-endofday { grid-column: 3; grid-row: 1; }
.access-matrix-module-reports { grid-column: 3; grid-row: 2; }
.access-matrix-module-logs { grid-column: 3; grid-row: 3; }
.access-matrix-module-housekeeping { grid-column: 3; grid-row: 4; }
.access-matrix-module-bookingEngine { grid-column: 3; grid-row: 5; }
.access-matrix-module-accounting { grid-column: 1; grid-row: 5; }
.access-matrix-module-guests { grid-column: 2; grid-row: 4; }

.access-matrix-grid .compact-main-module {
  min-height: 0;
  padding: 13px 15px;
  background:
    linear-gradient(135deg, rgba(244, 214, 128, .075), rgba(15, 23, 42, .78)),
    rgba(5, 12, 27, .74);
}

.access-matrix-grid .compact-main-module .permission-node.parent {
  min-height: 46px;
  padding: 0;
  border-bottom: 0;
  grid-template-columns: 22px 36px minmax(0, 1fr) max-content;
}

.access-matrix-grid .compact-main-module .permission-module-mark {
  width: 32px;
  height: 32px;
  border-radius: 11px;
}

.access-matrix-grid .compact-main-module strong {
  font-size: 14px;
}

.access-matrix-grid .compact-main-module small {
  color: #d9c27a;
  font-size: 11px;
}

@media (max-width: 1180px) {
  .access-matrix-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .access-matrix-grid .access-matrix-module {
    grid-column: auto;
    grid-row: auto;
  }
}

@media (max-width: 760px) {
  .access-matrix-grid {
    grid-template-columns: 1fr;
  }
}


/* Access matrix compact right rail: show main headings under Gün Sonu without visual heaviness */
.access-matrix-dialog {
  max-height: calc(100vh - 24px);
}

.access-matrix-modal-head {
  padding: 18px 26px 16px;
}

.access-matrix-toolbar {
  padding: 16px 26px;
}

.access-matrix-footer {
  padding: 14px 26px;
}

.access-matrix-grid {
  gap: 14px;
  padding: 18px 26px 22px;
}

.access-matrix-grid .compact-main-module {
  padding: 9px 12px;
  border-radius: 18px;
}

.access-matrix-grid .compact-main-module .permission-node.parent {
  min-height: 34px;
  grid-template-columns: 20px 30px minmax(0, 1fr) max-content;
  gap: 9px;
}

.access-matrix-grid .compact-main-module .permission-module-mark {
  width: 28px;
  height: 28px;
  border-radius: 10px;
  font-size: 10px;
}

.access-matrix-grid .compact-main-module strong {
  font-size: 13px;
}

.access-matrix-grid .compact-main-module small {
  font-size: 10px;
}


/* Access matrix independent columns: right rail is a real vertical module stack */
.access-matrix-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr) minmax(280px, .9fr) !important;
  align-items: start;
  gap: 16px;
}

.access-matrix-column {
  display: grid;
  align-content: start;
  gap: 14px;
  min-width: 0;
}

.access-matrix-grid .access-matrix-module,
.access-matrix-grid .access-matrix-module-setup,
.access-matrix-grid .access-matrix-module-frontoffice,
.access-matrix-grid .access-matrix-module-endofday,
.access-matrix-grid .access-matrix-module-reports,
.access-matrix-grid .access-matrix-module-logs,
.access-matrix-grid .access-matrix-module-housekeeping,
.access-matrix-grid .access-matrix-module-bookingEngine,
.access-matrix-grid .access-matrix-module-accounting,
.access-matrix-grid .access-matrix-module-guests {
  grid-column: auto !important;
  grid-row: auto !important;
  margin: 0;
}

.access-matrix-column-3 {
  gap: 10px;
}

@media (max-width: 1180px) {
  .access-matrix-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .access-matrix-column-3 { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .access-matrix-grid {
    grid-template-columns: 1fr !important;
  }
  .access-matrix-column-3 { grid-column: auto; }
}


/* Access matrix ultra-compact right rail: keep all standalone modules visible under Gün Sonu */
.access-matrix-column-3 {
  gap: 6px;
}

.access-matrix-grid .compact-main-module {
  padding: 6px 10px;
  border-radius: 15px;
}

.access-matrix-grid .compact-main-module .permission-node.parent {
  min-height: 28px;
  grid-template-columns: 18px 26px minmax(0, 1fr) max-content;
  gap: 8px;
}

.access-matrix-grid .compact-main-module .permission-module-mark {
  width: 24px;
  height: 24px;
  border-radius: 8px;
  font-size: 9px;
}

.access-matrix-grid .compact-main-module input[type="checkbox"] {
  width: 16px;
  height: 16px;
}

.access-matrix-grid .compact-main-module strong {
  font-size: 12px;
}

.access-matrix-grid .compact-main-module small {
  font-size: 9px;
}


/* Setup dark hover cleanup: user, room type, room and pricing surfaces */
#setup.setup-command-center .setup-stat-card,
#setup.setup-command-center .setup-kpi-card,
#setup.setup-command-center .metric-card,
#setup.setup-command-center .summary-card,
#setup.setup-command-center .user-stat-card {
  background: linear-gradient(145deg, rgba(20, 33, 54, 0.96), rgba(9, 18, 34, 0.98)) !important;
  border: 1px solid rgba(215, 181, 110, 0.18) !important;
  color: #eef4ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 18px 42px rgba(0,0,0,.24) !important;
}

#setup.setup-command-center .setup-stat-card *,
#setup.setup-command-center .setup-kpi-card *,
#setup.setup-command-center .metric-card *,
#setup.setup-command-center .summary-card *,
#setup.setup-command-center .user-stat-card * {
  color: inherit;
}

#setup.setup-command-center .setup-stat-card strong,
#setup.setup-command-center .setup-kpi-card strong,
#setup.setup-command-center .metric-card strong,
#setup.setup-command-center .summary-card strong,
#setup.setup-command-center .user-stat-card strong {
  color: #fff7dc !important;
}

#setup.setup-command-center .table-wrap,
#setup.setup-command-center table,
#setup.setup-command-center tbody,
#setup.setup-command-center tr,
#setup.setup-command-center td {
  color-scheme: dark;
}

#setup.setup-command-center tbody tr,
#setup.setup-command-center tbody tr:nth-child(odd),
#setup.setup-command-center tbody tr:nth-child(even) {
  background: transparent !important;
}

#setup.setup-command-center tbody tr td {
  background: linear-gradient(135deg, rgba(25, 38, 60, 0.98), rgba(13, 24, 42, 0.98)) !important;
  color: #eef4ff !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

#setup.setup-command-center tbody tr td:first-child {
  border-left: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 16px 0 0 16px;
}

#setup.setup-command-center tbody tr td:last-child {
  border-right: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 0 16px 16px 0;
}

#setup.setup-command-center tbody tr:hover,
#setup.setup-command-center tbody tr:hover td,
#setup.setup-command-center tbody tr:focus-within td,
#setup.setup-command-center tbody tr.selected-row td {
  background: linear-gradient(135deg, rgba(34, 51, 78, 0.99), rgba(18, 31, 52, 0.99)) !important;
  color: #ffffff !important;
  border-color: rgba(215, 181, 110, 0.32) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), inset 3px 0 0 rgba(215,181,110,.36) !important;
}

#setup.setup-command-center tbody tr:hover button,
#setup.setup-command-center tbody tr:hover .secondary-button,
#setup.setup-command-center tbody tr:hover .ghost-button {
  background: rgba(215, 181, 110, 0.12) !important;
  color: #ffe6a6 !important;
  border-color: rgba(215, 181, 110, 0.34) !important;
}

#setup.setup-command-center .rate-matrix,
#setup.setup-command-center .rate-matrix-row,
#setup.setup-command-center .rate-matrix > div,
#setup.setup-command-center [data-rate-matrix] > div,
#setup.setup-command-center .price-matrix-row,
#setup.setup-command-center .pricing-matrix-row {
  background: linear-gradient(145deg, rgba(18, 31, 51, 0.98), rgba(8, 17, 32, 0.98)) !important;
  border-color: rgba(215, 181, 110, 0.18) !important;
  color: #eef4ff !important;
}

#setup.setup-command-center .rate-matrix input,
#setup.setup-command-center .price-matrix input,
#setup.setup-command-center .pricing-matrix input {
  background: rgba(6, 14, 27, 0.92) !important;
  color: #f8fbff !important;
  border-color: rgba(215, 181, 110, 0.24) !important;
}

#setup.setup-command-center .weekday-picker label,
#setup.setup-command-center .weekday-picker .chip,
#setup.setup-command-center .period-card,
#setup.setup-command-center .rate-period-card,
#setup.setup-command-center .saved-rate-card,
#setup.setup-command-center .active-period-card {
  background: rgba(20, 33, 54, 0.96) !important;
  color: #eef4ff !important;
  border: 1px solid rgba(215, 181, 110, 0.18) !important;
}

#setup.setup-command-center .weekday-picker label:hover,
#setup.setup-command-center .period-card:hover,
#setup.setup-command-center .rate-period-card:hover,
#setup.setup-command-center .saved-rate-card:hover,
#setup.setup-command-center .active-period-card:hover,
#setup.setup-command-center .rate-list tr:hover td {
  background: linear-gradient(135deg, rgba(34, 51, 78, 0.99), rgba(18, 31, 52, 0.99)) !important;
  color: #ffffff !important;
  border-color: rgba(215, 181, 110, 0.34) !important;
}

#setup.setup-command-center .rate-matrix + button,
#setup.setup-command-center #ratePlanForm button[type="submit"],
#setup.setup-command-center [data-action="save-rate-matrix"] {
  justify-self: end;
  margin-left: auto !important;
  margin-right: clamp(24px, 12vw, 220px) !important;
  min-width: min(320px, 100%);
}


/* Setup final white-panel sweep: real metric cards and rate rows */
#setup.setup-command-center .metric,
#setup.setup-command-center .metrics .metric,
#setup.setup-command-center .users-command-metrics .metric {
  background: linear-gradient(145deg, rgba(20, 33, 54, 0.98), rgba(9, 18, 34, 0.99)) !important;
  border: 1px solid rgba(215, 181, 110, 0.18) !important;
  color: #eef4ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 18px 42px rgba(0,0,0,.24) !important;
}

#setup.setup-command-center .metric:hover,
#setup.setup-command-center .metrics .metric:hover,
#setup.setup-command-center .users-command-metrics .metric:hover {
  background: linear-gradient(145deg, rgba(29, 45, 70, 0.99), rgba(13, 24, 42, 0.99)) !important;
  border-color: rgba(215, 181, 110, 0.34) !important;
}

#setup.setup-command-center .metric span,
#setup.setup-command-center .metric p,
#setup.setup-command-center .metric small {
  color: rgba(232, 239, 252, 0.78) !important;
}

#setup.setup-command-center .metric strong,
#setup.setup-command-center .metric b {
  color: #fff7dc !important;
}

#setup.setup-command-center .rate-matrix-row,
#setup.setup-command-center .rate-matrix-row:hover,
#setup.setup-command-center .rate-matrix-row > label,
#setup.setup-command-center .rate-matrix-row > div {
  background: linear-gradient(145deg, rgba(18, 31, 51, 0.98), rgba(8, 17, 32, 0.98)) !important;
  color: #eef4ff !important;
}

#setup.setup-command-center .rate-matrix-row:hover {
  border-color: rgba(215, 181, 110, 0.32) !important;
  box-shadow: inset 3px 0 0 rgba(215,181,110,.34) !important;
}


/* Setup pricing matrix readability after dark hover cleanup */
#setup.setup-command-center .rate-matrix h4,
#setup.setup-command-center .rate-matrix strong,
#setup.setup-command-center .rate-matrix-row > strong,
#setup.setup-command-center .rate-matrix-row > b,
#setup.setup-command-center .rate-matrix-row > span:first-child {
  color: #f8fbff !important;
  opacity: 1 !important;
}

#setup.setup-command-center .rate-matrix label,
#setup.setup-command-center .rate-matrix-row label {
  color: #d9e5f6 !important;
  opacity: 1 !important;
}


/* Visual continuation pass: Frontoffice legacy white surfaces + command topbar dark shell */
.view.active ~ .topbar,
.topbar {
  background: linear-gradient(135deg, rgba(7, 17, 31, 0.94), rgba(13, 26, 46, 0.92)) !important;
  border: 1px solid rgba(215, 181, 110, 0.12) !important;
  color: #f8fbff !important;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.26), inset 0 1px 0 rgba(255,255,255,.06) !important;
  backdrop-filter: blur(16px);
}

.topbar *,
.topbar h1,
.topbar span,
.topbar p {
  color: inherit !important;
}

#frontoffice.setup-workspace,
#frontoffice.view.setup-workspace.active {
  background:
    radial-gradient(circle at 12% 0%, rgba(215, 181, 110, 0.16), transparent 30%),
    linear-gradient(145deg, #081321 0%, #0c182b 48%, #081120 100%) !important;
  color: #f8fbff !important;
  border: 1px solid rgba(215, 181, 110, 0.1) !important;
  border-radius: 28px;
  padding: 18px;
  box-shadow: 0 26px 70px rgba(0,0,0,.22) !important;
}

#frontoffice.setup-workspace .setup-header,
#frontoffice.setup-workspace .setup-tabs,
#frontoffice.setup-workspace .filters,
#frontoffice.setup-workspace .frontoffice-filters,
#frontoffice.setup-workspace .panel,
#frontoffice.setup-workspace .table-wrap {
  background: linear-gradient(145deg, rgba(16, 29, 49, 0.96), rgba(7, 16, 31, 0.96)) !important;
  border: 1px solid rgba(215, 181, 110, 0.14) !important;
  color: #eef4ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 18px 44px rgba(0,0,0,.22) !important;
}

#frontoffice.setup-workspace .setup-header {
  border-radius: 24px;
  padding: 18px 20px;
}

#frontoffice.setup-workspace .setup-header h2,
#frontoffice.setup-workspace .setup-header h3,
#frontoffice.setup-workspace .setup-header p,
#frontoffice.setup-workspace .panel-header h3,
#frontoffice.setup-workspace .panel-header p {
  color: #f8fbff !important;
}

#frontoffice.setup-workspace .setup-header small,
#frontoffice.setup-workspace .setup-header span,
#frontoffice.setup-workspace .panel-header span {
  color: rgba(226, 236, 250, 0.78) !important;
}

#frontoffice.setup-workspace .setup-tabs {
  border-radius: 22px;
  padding: 8px;
  gap: 8px;
}

#frontoffice.setup-workspace .setup-tabs button,
#frontoffice.setup-workspace .reservation-tabs button {
  background: rgba(9, 20, 36, 0.74) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  color: #dbe7f7 !important;
  border-radius: 14px !important;
}

#frontoffice.setup-workspace .setup-tabs button:hover,
#frontoffice.setup-workspace .reservation-tabs button:hover {
  background: rgba(215, 181, 110, 0.13) !important;
  border-color: rgba(215, 181, 110, 0.28) !important;
  color: #fff7dc !important;
}

#frontoffice.setup-workspace .setup-tabs button.active,
#frontoffice.setup-workspace .reservation-tabs button.active {
  background: linear-gradient(135deg, #f3d794, #b88a44) !important;
  color: #091421 !important;
  border-color: transparent !important;
}

#frontoffice.setup-workspace input,
#frontoffice.setup-workspace select,
#frontoffice.setup-workspace textarea,
#frontoffice.setup-workspace .filters input,
#frontoffice.setup-workspace .filters select {
  background: rgba(5, 13, 25, 0.92) !important;
  border: 1px solid rgba(215, 181, 110, 0.18) !important;
  color: #f8fbff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}

#frontoffice.setup-workspace input::placeholder,
#frontoffice.setup-workspace textarea::placeholder {
  color: rgba(217, 229, 246, 0.58) !important;
}

#frontoffice.setup-workspace .ghost-button,
#frontoffice.setup-workspace .secondary-button,
#frontoffice.setup-workspace .primary-button {
  background: rgba(12, 25, 43, 0.9) !important;
  border: 1px solid rgba(215, 181, 110, 0.2) !important;
  color: #ffe6a6 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 12px 28px rgba(0,0,0,.18) !important;
}

#frontoffice.setup-workspace .primary-button,
#frontoffice.setup-workspace button[type="submit"] {
  background: linear-gradient(135deg, #f3d794, #b88a44) !important;
  color: #091421 !important;
  border-color: transparent !important;
}

#frontoffice.setup-workspace .ghost-button:hover,
#frontoffice.setup-workspace .secondary-button:hover,
#frontoffice.setup-workspace .primary-button:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}

#frontoffice.setup-workspace .danger-action,
#frontoffice.setup-workspace .ghost-button.danger-action {
  background: rgba(127, 29, 29, 0.22) !important;
  border-color: rgba(248, 113, 113, 0.28) !important;
  color: #fecaca !important;
}

#frontoffice.setup-workspace table {
  border-collapse: separate;
  border-spacing: 0 8px;
  color: #eef4ff !important;
  min-width: 100%;
}

#frontoffice.setup-workspace thead th {
  background: rgba(7, 17, 31, 0.9) !important;
  color: #d7b56e !important;
  border-top: 1px solid rgba(215,181,110,.16) !important;
  border-bottom: 1px solid rgba(215,181,110,.16) !important;
  white-space: nowrap;
}

#frontoffice.setup-workspace tbody tr,
#frontoffice.setup-workspace tbody tr:nth-child(odd),
#frontoffice.setup-workspace tbody tr:nth-child(even) {
  background: transparent !important;
}

#frontoffice.setup-workspace tbody td {
  background: linear-gradient(135deg, rgba(24, 38, 61, 0.98), rgba(12, 23, 40, 0.98)) !important;
  color: #eef4ff !important;
  border-top: 1px solid rgba(255,255,255,.055) !important;
  border-bottom: 1px solid rgba(255,255,255,.055) !important;
}

#frontoffice.setup-workspace tbody td:first-child {
  border-radius: 14px 0 0 14px;
  border-left: 1px solid rgba(255,255,255,.055) !important;
}

#frontoffice.setup-workspace tbody td:last-child {
  border-radius: 0 14px 14px 0;
  border-right: 1px solid rgba(255,255,255,.055) !important;
}

#frontoffice.setup-workspace tbody tr:hover td,
#frontoffice.setup-workspace tbody tr:focus-within td {
  background: linear-gradient(135deg, rgba(34, 51, 78, 0.99), rgba(18, 31, 52, 0.99)) !important;
  color: #ffffff !important;
  border-color: rgba(215,181,110,.28) !important;
}

#frontoffice.setup-workspace .status,
#frontoffice.setup-workspace .badge,
#frontoffice.setup-workspace .chip {
  background: rgba(215, 181, 110, 0.13) !important;
  color: #ffe6a6 !important;
  border: 1px solid rgba(215, 181, 110, 0.24) !important;
}

#frontoffice.setup-workspace .table-wrap {
  overflow-x: auto;
  border-radius: 22px;
}

#frontoffice.setup-workspace .table-wrap::-webkit-scrollbar,
#frontoffice.setup-workspace .setup-tabs::-webkit-scrollbar {
  height: 8px;
}

#frontoffice.setup-workspace .table-wrap::-webkit-scrollbar-thumb,
#frontoffice.setup-workspace .setup-tabs::-webkit-scrollbar-thumb {
  background: rgba(215, 181, 110, 0.36);
  border-radius: 999px;
}


/* Visual continuation pass 2: reports root shell and hero overflow guards */
#reports.reports-command-center,
#reports.view.reports-command-center.active,
#reports.view.setup-workspace.reports-command-center.active {
  background:
    radial-gradient(circle at 12% 0%, rgba(215, 181, 110, 0.14), transparent 30%),
    linear-gradient(145deg, #081321 0%, #0c182b 48%, #081120 100%) !important;
  color: #f8fbff !important;
  border-radius: 28px;
  border: 1px solid rgba(215, 181, 110, 0.1) !important;
}

.home-hero,
#setup .setup-hero-main,
#reports .reports-command-copy,
#logs .logs-hero-main,
#guests .crm-command-copy,
#housekeeping .hk-hero,
#housekeeping .hk-hero.panel {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

#reports .reports-command-copy *,
#logs .logs-hero-main *,
#guests .crm-command-copy *,
#housekeeping .hk-hero * {
  min-width: 0 !important;
  max-width: 100% !important;
}


/* Visual continuation pass 3: strict hero inline-size containment */
.home-hero,
#setup .setup-hero-main,
#reports .reports-command-copy,
#logs .logs-hero-main,
#guests .crm-command-copy,
#housekeeping .hk-hero,
#housekeeping .hk-hero.panel {
  inline-size: 100% !important;
  width: 100% !important;
  max-inline-size: 100% !important;
  box-sizing: border-box !important;
  overflow-x: clip !important;
  overflow-wrap: anywhere !important;
}

.home-hero > *,
#setup .setup-hero-main > *,
#reports .reports-command-copy > *,
#logs .logs-hero-main > *,
#guests .crm-command-copy > *,
#housekeeping .hk-hero > * {
  max-inline-size: 100% !important;
  box-sizing: border-box !important;
  overflow-wrap: anywhere !important;
}


/* Visual continuation pass 4: frontoffice filter chips and bottom KPI cards */
#frontoffice.setup-workspace #foReservations .reservation-tabs,
#frontoffice.setup-workspace .reservation-tabs,
#frontoffice.setup-workspace .segmented {
  background: linear-gradient(145deg, rgba(13, 26, 46, 0.96), rgba(6, 15, 29, 0.96)) !important;
  border: 1px solid rgba(215, 181, 110, 0.16) !important;
  color: #eef4ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 14px 30px rgba(0,0,0,.18) !important;
}

#frontoffice.setup-workspace #foReservations .reservation-tabs button,
#frontoffice.setup-workspace .reservation-tabs button,
#frontoffice.setup-workspace .segmented button {
  background: rgba(12, 25, 43, 0.88) !important;
  color: #dbe7f7 !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: none !important;
}

#frontoffice.setup-workspace #foReservations .reservation-tabs button:hover,
#frontoffice.setup-workspace .reservation-tabs button:hover,
#frontoffice.setup-workspace .segmented button:hover {
  background: rgba(215, 181, 110, 0.15) !important;
  color: #fff7dc !important;
  border-color: rgba(215, 181, 110, 0.30) !important;
}

#frontoffice.setup-workspace #foReservations .reservation-tabs button.active,
#frontoffice.setup-workspace .reservation-tabs button.active,
#frontoffice.setup-workspace .segmented button.active {
  background: linear-gradient(135deg, #f3d794, #b88a44) !important;
  color: #091421 !important;
  border-color: transparent !important;
}

#frontoffice.setup-workspace #foRack .segmented {
  background: rgba(255, 255, 255, 0.9) !important;
  border: 1px solid rgba(184, 134, 47, 0.22) !important;
  color: #243045 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 14px 30px rgba(15,23,42,.08) !important;
}

#frontoffice.setup-workspace #foRack .segmented button {
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  box-shadow: 0 8px 18px rgba(15,23,42,.06) !important;
}

#frontoffice.setup-workspace #foRack .segmented button.active {
  background: linear-gradient(135deg, #f3d794, #b88a44) !important;
  color: #091421 !important;
  border-color: transparent !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .panel,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .panel {
  background:
    radial-gradient(circle at 10% 0%, rgba(215, 181, 110, 0.08), transparent 24%),
    linear-gradient(145deg, rgba(9, 21, 39, 0.99), rgba(4, 12, 24, 1)) !important;
  border: 1px solid rgba(215, 181, 110, 0.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 22px 58px rgba(0,0,0,.26) !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .panel-header,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .panel-header {
  border-bottom-color: rgba(215, 181, 110, 0.18) !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .panel-header h3,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .panel-header h3 {
  color: #f8fbff !important;
  text-shadow: 0 8px 26px rgba(0,0,0,.28) !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .panel-header h3::after,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .panel-header h3::after {
  color: rgba(218, 230, 247, 0.68) !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .segmented,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .segmented {
  background: linear-gradient(145deg, rgba(12, 25, 43, 0.94), rgba(6, 15, 29, 0.96)) !important;
  border: 1px solid rgba(215, 181, 110, 0.18) !important;
  color: #eef4ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 14px 30px rgba(0,0,0,.22) !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .segmented button,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .segmented button {
  background: rgba(12, 25, 43, 0.88) !important;
  color: #dbe7f7 !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: none !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .segmented button.active,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .segmented button.active {
  background: linear-gradient(135deg, #f3d794, #b88a44) !important;
  color: #091421 !important;
  border-color: transparent !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .room-board,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .room-board {
  background:
    linear-gradient(180deg, rgba(8, 19, 36, 0.96), rgba(5, 13, 26, 0.98)),
    repeating-linear-gradient(135deg, rgba(215,181,110,.055) 0 1px, transparent 1px 12px) !important;
  border: 1px solid rgba(215, 181, 110, 0.14) !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .rack-room-card,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .rack-room-card {
  background:
    radial-gradient(circle at 92% 10%, var(--rack-glow), transparent 30%),
    linear-gradient(145deg, rgba(20, 33, 54, 0.98), rgba(9, 18, 34, 0.99)) !important;
  border-color: rgba(215, 181, 110, 0.18) !important;
  border-left-color: var(--rack-color) !important;
  color: #eef4ff !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .rack-room-card::before,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .rack-room-card::before {
  background: var(--rack-color) !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .rack-room-card strong,
body.theme-dark #frontoffice.setup-workspace #foRack .rack-room-card span,
body.theme-dark #frontoffice.setup-workspace #foRack .rack-room-card p,
body.theme-dark #frontoffice.setup-workspace #foRack .rack-room-card small,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .rack-room-card strong,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .rack-room-card span,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .rack-room-card p,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .rack-room-card small {
  color: #dbe7f7 !important;
  -webkit-text-fill-color: #dbe7f7 !important;
}

body.theme-dark #frontoffice.setup-workspace #foRack .rack-room-card > .status,
body:not(.theme-light) #frontoffice.setup-workspace #foRack .rack-room-card > .status {
  background: rgba(12, 25, 43, 0.84) !important;
  color: #fff7dc !important;
  -webkit-text-fill-color: #fff7dc !important;
  border-color: var(--rack-glow) !important;
}

#frontoffice.setup-workspace .panel > article,
#frontoffice.setup-workspace .panel > div > article,
#frontoffice.setup-workspace .frontoffice-tab-panel.active article:not(.rack-room-card):not(.card):not(.role-card) {
  background: linear-gradient(145deg, rgba(20, 33, 54, 0.98), rgba(9, 18, 34, 0.99)) !important;
  border: 1px solid rgba(215, 181, 110, 0.18) !important;
  color: #eef4ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 30px rgba(0,0,0,.18) !important;
}

#frontoffice.setup-workspace .frontoffice-tab-panel.active article:not(.rack-room-card):not(.card):not(.role-card) span {
  color: rgba(218, 230, 247, 0.78) !important;
}

#frontoffice.setup-workspace .frontoffice-tab-panel.active article:not(.rack-room-card):not(.card):not(.role-card) strong {
  color: #fff7dc !important;
}


/* Visual continuation pass 5: frontoffice daily bar dark KPI cards */
#frontoffice.setup-workspace #frontofficeDailyBar,
#frontoffice #frontofficeDailyBar.frontoffice-daily-bar {
  background: linear-gradient(145deg, rgba(13, 26, 46, 0.96), rgba(6, 15, 29, 0.96)) !important;
  border: 1px solid rgba(215, 181, 110, 0.16) !important;
  color: #eef4ff !important;
  border-radius: 20px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 16px 36px rgba(0,0,0,.22) !important;
}

#frontoffice.setup-workspace #frontofficeDailyBar article,
#frontoffice #frontofficeDailyBar.frontoffice-daily-bar article {
  background: linear-gradient(145deg, rgba(20, 33, 54, 0.98), rgba(9, 18, 34, 0.99)) !important;
  border: 1px solid rgba(215, 181, 110, 0.22) !important;
  color: #eef4ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 24px rgba(0,0,0,.18) !important;
}

#frontoffice.setup-workspace #frontofficeDailyBar article span,
#frontoffice #frontofficeDailyBar.frontoffice-daily-bar article span {
  color: rgba(218, 230, 247, 0.78) !important;
}

#frontoffice.setup-workspace #frontofficeDailyBar article strong,
#frontoffice #frontofficeDailyBar.frontoffice-daily-bar article strong {
  color: #fff7dc !important;
}


/* Visual continuation pass 6: frontoffice reservation table no-overflow containment */
#frontoffice.setup-workspace #foReservations .table-wrap {
  overflow-x: hidden !important;
  max-inline-size: 100% !important;
}

#frontoffice.setup-workspace #foReservations table {
  width: 100% !important;
  max-inline-size: 100% !important;
  table-layout: fixed !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable tr,
#frontoffice.setup-workspace #frontofficeReservationTable td,
#frontoffice.setup-workspace #foReservations thead th {
  min-width: 0 !important;
  max-inline-size: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable td {
  padding-inline: 7px !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .inline-action-cell,
#frontoffice.setup-workspace #frontofficeReservationTable .reservation-row-action {
  inline-size: 100% !important;
  max-inline-size: 100% !important;
  min-inline-size: 0 !important;
  gap: 4px !important;
  overflow-x: hidden !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .status,
#frontoffice.setup-workspace #frontofficeReservationTable .badge,
#frontoffice.setup-workspace #frontofficeReservationTable .pill,
#frontoffice.setup-workspace #frontofficeReservationTable .reservation-row-action > * {
  max-inline-size: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}


/* Web Onay polish: remove off-theme white header glow and white summary pills */
#frontoffice.setup-workspace #foReservations > .panel,
#frontoffice.setup-workspace #foReservations .panel {
  background: linear-gradient(145deg, rgba(9, 20, 36, 0.98), rgba(4, 12, 25, 0.99)) !important;
  border-color: rgba(215, 181, 110, 0.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 24px 60px rgba(0,0,0,.30) !important;
}

#frontoffice.setup-workspace #foReservations .panel-header {
  align-items: center !important;
  padding: 14px 18px !important;
  margin: 0 0 14px !important;
  border: 1px solid rgba(215, 181, 110, 0.16) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(215,181,110,.15), transparent 34%),
    linear-gradient(135deg, rgba(12, 25, 43, 0.98), rgba(5, 14, 28, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 16px 36px rgba(0,0,0,.22) !important;
}

#frontoffice.setup-workspace #foReservations .panel-header h3 {
  color: #f8fbff !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.32) !important;
  letter-spacing: -0.04em !important;
}

#frontoffice.setup-workspace #foReservations .panel-header .toolbar {
  align-items: center !important;
}

#frontoffice.setup-workspace #foReservations .premium-fo-summary-hero,
#frontoffice.setup-workspace #foReservations .premium-fo-summary-card {
  background: linear-gradient(145deg, rgba(14, 28, 49, 0.98), rgba(7, 17, 33, 0.99)) !important;
  border-color: rgba(215, 181, 110, 0.18) !important;
  color: #eef4ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 18px 40px rgba(0,0,0,.22) !important;
}

#frontoffice.setup-workspace #foReservations .premium-fo-summary-hero strong,
#frontoffice.setup-workspace #foReservations .premium-fo-summary-card strong {
  color: #fff7dc !important;
}

#frontoffice.setup-workspace #foReservations .premium-fo-summary-hero small,
#frontoffice.setup-workspace #foReservations .premium-fo-summary-card small {
  color: rgba(218, 230, 247, 0.76) !important;
}

#frontoffice.setup-workspace #foReservations .premium-pill,
#frontoffice.setup-workspace #foReservations .premium-pill.dark,
#frontoffice.setup-workspace #foReservations .premium-fo-summary-card .premium-pill,
#frontoffice.setup-workspace #foReservations .premium-fo-summary-hero .premium-pill,
#frontoffice.setup-workspace #foReservations .premium-web-review-card .premium-pill {
  background: rgba(215, 181, 110, 0.14) !important;
  border: 1px solid rgba(215, 181, 110, 0.30) !important;
  color: #ffe6a6 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}

#frontoffice.setup-workspace #foReservations .premium-pill.light,
#frontoffice.setup-workspace #foReservations .premium-pill.safe,
#frontoffice.setup-workspace #foReservations .premium-pill.warning {
  background: rgba(215, 181, 110, 0.14) !important;
  border-color: rgba(215, 181, 110, 0.30) !important;
  color: #ffe6a6 !important;
}

#frontoffice.setup-workspace #foReservations .premium-web-review-empty,
#frontoffice.setup-workspace #foReservations .premium-web-review-list {
  background: linear-gradient(145deg, rgba(14, 28, 49, 0.96), rgba(7, 17, 33, 0.98)) !important;
  border-color: rgba(215, 181, 110, 0.16) !important;
  color: #eef4ff !important;
}

/* Web Onay polish v2: make Rezervasyonlar title bar match premium panel language */
#frontoffice.setup-workspace #foReservations .panel-header,
body.premium-pms #frontoffice #foReservations .panel-header {
  background:
    linear-gradient(135deg, rgba(13, 28, 49, .98), rgba(5, 15, 30, .99)) !important;
  border: 1px solid rgba(215, 181, 110, .2) !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255,255,255,.05) !important;
  padding: 16px 20px !important;
  align-items: center !important;
}

#frontoffice.setup-workspace #foReservations .panel-header::before,
body.premium-pms #frontoffice #foReservations .panel-header::before {
  content: "REZERVASYONLAR";
  display: block;
  position: absolute;
  left: 20px;
  top: 9px;
  font-size: 10px;
  letter-spacing: .16em;
  font-weight: 900;
  color: rgba(215, 181, 110, .9);
  pointer-events: none;
}

#frontoffice.setup-workspace #foReservations .panel-header h3,
body.premium-pms #frontoffice #foReservations .panel-header h3 {
  margin-top: 14px !important;
  color: #f7fbff !important;
  font-size: clamp(26px, 2.3vw, 34px) !important;
  line-height: 1 !important;
  letter-spacing: -.045em !important;
  text-shadow: none !important;
}

#frontoffice.setup-workspace #foReservations .panel-header .button-row,
body.premium-pms #frontoffice #foReservations .panel-header .button-row {
  margin-left: auto !important;
  gap: 10px !important;
}

#frontoffice.setup-workspace #foReservations .premium-pill,
body.premium-pms #frontoffice #foReservations .premium-pill {
  background: linear-gradient(135deg, rgba(215,181,110,.2), rgba(15,31,53,.95)) !important;
  color: #ffe9ad !important;
  border: 1px solid rgba(215,181,110,.35) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}

/* Reservation table status compacting: keep Durum operational, move meta badges into Rez. ID cell */
#frontoffice.setup-workspace #frontofficeReservationTable tr,
body.premium-pms #frontoffice #frontofficeReservationTable tr {
  block-size: auto !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable td,
body.premium-pms #frontoffice #frontofficeReservationTable td {
  padding-block: 13px !important;
  vertical-align: middle !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable td:nth-child(10),
body.premium-pms #frontoffice #frontofficeReservationTable td:nth-child(10) {
  inline-size: 104px !important;
  max-inline-size: 112px !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable td:nth-child(11),
body.premium-pms #frontoffice #frontofficeReservationTable td:nth-child(11) {
  inline-size: 168px !important;
  max-inline-size: 178px !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .reservation-status-compact,
body.premium-pms #frontoffice #frontofficeReservationTable .reservation-status-compact {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 5px !important;
  min-inline-size: 0 !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .reservation-primary-status,
body.premium-pms #frontoffice #frontofficeReservationTable .reservation-primary-status {
  max-inline-size: 92px !important;
  padding: 7px 10px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  line-height: 1.05 !important;
  font-weight: 900 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  text-align: center !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .reservation-secondary-status,
body.premium-pms #frontoffice #frontofficeReservationTable .reservation-secondary-status {
  max-inline-size: 96px !important;
  padding: 5px 8px !important;
  font-size: 9.5px !important;
  line-height: 1 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .compact-reservation-action,
body.premium-pms #frontoffice #frontofficeReservationTable .compact-reservation-action {
  display: grid !important;
  grid-template-columns: minmax(74px, auto) 1fr !important;
  align-items: center !important;
  gap: 5px 9px !important;
  min-inline-size: 0 !important;
  max-inline-size: 100% !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .compact-reservation-action > strong,
body.premium-pms #frontoffice #frontofficeReservationTable .compact-reservation-action > strong {
  grid-column: 1 !important;
  font-size: 13px !important;
  line-height: 1.05 !important;
  letter-spacing: .02em !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .compact-reservation-action .reservation-row-meta,
body.premium-pms #frontoffice #frontofficeReservationTable .compact-reservation-action .reservation-row-meta {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 3px 7px !important;
  color: rgba(203, 214, 231, .68) !important;
  font-size: 9.5px !important;
  line-height: 1.1 !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .compact-reservation-action .fo-operation-badges,
body.premium-pms #frontoffice #frontofficeReservationTable .compact-reservation-action .fo-operation-badges {
  grid-column: 1 / -1 !important;
  display: flex !important;
  flex-flow: row wrap !important;
  align-items: center !important;
  gap: 4px !important;
  margin-top: 0 !important;
  max-inline-size: 100% !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .compact-reservation-action .fo-operation-badge,
body.premium-pms #frontoffice #frontofficeReservationTable .compact-reservation-action .fo-operation-badge {
  padding: 4px 6px !important;
  border-radius: 999px !important;
  font-size: 8.6px !important;
  line-height: 1 !important;
  font-weight: 850 !important;
  max-inline-size: 74px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  box-shadow: none !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable td:nth-child(10) .fo-operation-badges,
body.premium-pms #frontoffice #frontofficeReservationTable td:nth-child(10) .fo-operation-badges {
  display: none !important;
}

/* Reservation table status compacting v2: no operational badge pile in normal list */
#frontoffice.setup-workspace #frontofficeReservationTable .compact-reservation-action .fo-operation-badges,
body.premium-pms #frontoffice #frontofficeReservationTable .compact-reservation-action .fo-operation-badges {
  display: none !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .compact-reservation-action,
body.premium-pms #frontoffice #frontofficeReservationTable .compact-reservation-action {
  grid-template-columns: 1fr !important;
  align-content: center !important;
  min-block-size: 54px !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable .compact-reservation-action .reservation-row-meta,
body.premium-pms #frontoffice #frontofficeReservationTable .compact-reservation-action .reservation-row-meta {
  display: block !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-inline-size: 100% !important;
}

/* Frontoffice fixed daily bar: single-row always-visible operations strip */
#frontoffice .frontoffice-daily-bar,
body.premium-pms #frontoffice .frontoffice-daily-bar,
.frontoffice-daily-bar {
  position: fixed !important;
  left: calc(var(--sidebar-width) + 12px) !important;
  right: 12px !important;
  bottom: 10px !important;
  z-index: 1200 !important;
  display: grid !important;
  grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
  grid-auto-flow: column !important;
  grid-auto-rows: 1fr !important;
  gap: 6px !important;
  inline-size: auto !important;
  max-inline-size: none !important;
  min-inline-size: 0 !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(215, 181, 110, .18) !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, rgba(6, 17, 32, .98), rgba(3, 10, 22, .99)) !important;
  box-shadow: 0 -20px 50px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255,255,255,.05) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

#frontoffice .frontoffice-daily-bar article,
body.premium-pms #frontoffice .frontoffice-daily-bar article,
.frontoffice-daily-bar article {
  min-inline-size: 0 !important;
  min-block-size: 42px !important;
  block-size: 42px !important;
  display: grid !important;
  align-content: center !important;
  gap: 1px !important;
  padding: 5px 8px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(215, 181, 110, .18) !important;
  background: linear-gradient(135deg, rgba(12, 25, 43, .96), rgba(7, 17, 32, .98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
  overflow: hidden !important;
}

#frontoffice .frontoffice-daily-bar span,
body.premium-pms #frontoffice .frontoffice-daily-bar span,
.frontoffice-daily-bar span {
  display: block !important;
  max-inline-size: 100% !important;
  color: rgba(203, 214, 231, .78) !important;
  font-size: clamp(8px, .68vw, 10px) !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  letter-spacing: -.02em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#frontoffice .frontoffice-daily-bar strong,
body.premium-pms #frontoffice .frontoffice-daily-bar strong,
.frontoffice-daily-bar strong {
  display: block !important;
  color: #f8fbff !important;
  font-size: clamp(14px, 1.1vw, 18px) !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#frontoffice.active,
body.premium-pms #frontoffice.active {
  padding-bottom: 78px !important;
}

#foRack.active ~ .frontoffice-daily-bar {
  position: fixed !important;
  left: calc(var(--sidebar-width) + 12px) !important;
  right: 12px !important;
  bottom: 10px !important;
}

#foAvailability.active ~ .frontoffice-daily-bar,
#foPlan.active ~ .frontoffice-daily-bar,
#foStatus.active ~ .frontoffice-daily-bar {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: auto !important;
  margin: 16px 0 0 !important;
  z-index: 1 !important;
}

@media (max-width: 1180px) {
  #frontoffice .frontoffice-daily-bar,
  body.premium-pms #frontoffice .frontoffice-daily-bar,
  .frontoffice-daily-bar {
    left: 8px !important;
    right: 8px !important;
    grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
    gap: 4px !important;
    padding: 6px !important;
  }

  #frontoffice .frontoffice-daily-bar article,
  body.premium-pms #frontoffice .frontoffice-daily-bar article,
  .frontoffice-daily-bar article {
    padding-inline: 4px !important;
  }
}

/* PMS-wide Excel-like manual column resizing */
table.pms-resizable-table {
  table-layout: fixed !important;
}

table.pms-resizable-table th,
table.pms-resizable-table td {
  min-width: 0 !important;
  max-width: none !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

table.pms-resizable-table td > *,
table.pms-resizable-table th > *:not(.pms-column-resizer) {
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* When a resized column becomes wider, the inner operational pills/badges must use that room instead of wrapping a final letter. */
table.pms-resizable-table td .status,
table.pms-resizable-table td .status-pill,
table.pms-resizable-table td .reservation-primary-status,
table.pms-resizable-table td .reservation-secondary-status,
table.pms-resizable-table td .premium-pill,
table.pms-resizable-table td .fo-operation-badge,
table.pms-resizable-table td .direct-review-badge,
table.pms-resizable-table td .home-status,
table.pms-resizable-table td .crm-360-badge,
table.pms-resizable-table td .crm-360-whatsapp,
table.pms-resizable-table td .badge,
table.pms-resizable-table td button,
table.pms-resizable-table td a {
  max-width: 100% !important;
  min-width: 0 !important;
  width: auto !important;
  inline-size: auto !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  line-height: 1.12 !important;
}

table.pms-resizable-table td .reservation-status-compact {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 4px !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

table.pms-resizable-table td .reservation-status-compact .status {
  flex: 0 1 auto !important;
}

.pms-resizable-header {
  position: sticky !important;
  user-select: none;
}

.pms-column-resizer {
  position: absolute;
  top: 6px;
  right: -3px;
  bottom: 6px;
  width: 8px;
  z-index: 7;
  cursor: col-resize;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(244, 209, 133, .18), rgba(244, 209, 133, .04));
  opacity: .42;
  transition: opacity .16s ease, background .16s ease, box-shadow .16s ease;
}

.pms-column-resizer::after {
  content: "";
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 3px;
  width: 2px;
  border-radius: 99px;
  background: rgba(244, 209, 133, .62);
}

.pms-resizable-header:hover .pms-column-resizer,
.pms-column-resizer:hover,
table.is-resizing-columns .pms-column-resizer {
  opacity: 1;
  background: rgba(244, 209, 133, .14);
  box-shadow: 0 0 0 1px rgba(244, 209, 133, .26);
}

body.pms-column-resizing,
body.pms-column-resizing * {
  cursor: col-resize !important;
  user-select: none !important;
}


#foReservations table.pms-resizable-table th:nth-child(11),
#foReservations table.pms-resizable-table td:nth-child(11) {
  white-space: nowrap !important;
}

/* Frontoffice status pill resize fix: override older ID-based compact table wrapping rules. */
#foReservations table.pms-resizable-table td .reservation-status-compact,
#foReservations table.pms-resizable-table td .reservation-primary-status,
#foReservations table.pms-resizable-table td .reservation-secondary-status,
#foReservations table.pms-resizable-table td .status,
#foReservations table.pms-resizable-table td .status-pill {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
  text-overflow: ellipsis !important;
  overflow: hidden !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

#foReservations table.pms-resizable-table td .reservation-status-compact {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: 4px !important;
}

#foReservations table.pms-resizable-table td .reservation-status-compact .status {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  inline-size: auto !important;
  line-height: 1 !important;
}

/* Highest-specificity override for old premium Ön Büro wrapping rules on resized reservation status pills. */
#frontoffice.setup-workspace #foReservations table.pms-resizable-table #frontofficeReservationTable .reservation-status-compact,
#frontoffice.setup-workspace #foReservations table.pms-resizable-table #frontofficeReservationTable .reservation-primary-status,
#frontoffice.setup-workspace #foReservations table.pms-resizable-table #frontofficeReservationTable .reservation-secondary-status,
body.premium-pms #frontoffice #foReservations table.pms-resizable-table #frontofficeReservationTable .reservation-primary-status,
body.premium-pms #frontoffice #foReservations table.pms-resizable-table #frontofficeReservationTable .reservation-secondary-status {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
  text-overflow: ellipsis !important;
  overflow: hidden !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

#frontoffice.setup-workspace #foReservations table.pms-resizable-table #frontofficeReservationTable .reservation-status-compact,
body.premium-pms #frontoffice #foReservations table.pms-resizable-table #frontofficeReservationTable .reservation-status-compact {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

#frontoffice.setup-workspace #foReservations table.pms-resizable-table #frontofficeReservationTable .reservation-status-compact .status,
body.premium-pms #frontoffice #foReservations table.pms-resizable-table #frontofficeReservationTable .reservation-status-compact .status {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

/* CyotelOS Global Light Premium Theme — user selectable, dark mode remains default */
html[data-theme="light"] {
  color-scheme: light;
}

body.theme-light {
  --bg: #f6f1e8;
  --surface: #ffffff;
  --surface-2: #f7efe3;
  --text: #14233a;
  --muted: #667184;
  --line: rgba(18, 38, 64, 0.13);
  --accent: #071b33;
  --accent-strong: #163a61;
  --gold: #b98b3b;
  --cyotel-navy: #071b33;
  --cyotel-cream: #fff7e8;
  --cyotel-gold-light: #e2c88d;
  --cyotel-gold: #b98b3b;
  --cyotel-gold-dark: #8f6624;
  --shadow: 0 24px 70px rgba(19, 34, 55, 0.14);
  background:
    radial-gradient(circle at 18% 8%, rgba(234, 215, 173, 0.58), transparent 34%),
    radial-gradient(circle at 90% 8%, rgba(105, 142, 190, 0.15), transparent 30%),
    linear-gradient(145deg, #f8f1e5 0%, #f6f8fb 48%, #efe5d5 100%);
  color: var(--text);
}

body.theme-light .login-screen {
  background:
    radial-gradient(circle at 22% 12%, rgba(234, 215, 173, 0.58), transparent 34%),
    linear-gradient(145deg, #f7efe3, #f6f8fb 58%, #efe5d5);
}

body.theme-light .login-card,
body.theme-light .panel,
body.theme-light .metric,
body.theme-light .empty-module,
body.theme-light .modal-card,
body.theme-light dialog,
body.theme-light .setup-header,
body.theme-light .table-wrap,
body.theme-light .form-grid,
body.theme-light .guest-card,
body.theme-light .reservation-detail,
body.theme-light .reservation-summary,
body.theme-light .setup-command-shell,
body.theme-light .home-command-center,
body.theme-light .reports-command-shell,
body.theme-light .logs-command-shell,
body.theme-light .crm-command-shell,
body.theme-light .accounting-command-shell,
body.theme-light .hk-hero,
body.theme-light .housekeeping-command-center .panel,
body.theme-light .booking-engine-host-header {
  background: rgba(255, 255, 255, 0.82) !important;
  border-color: rgba(18, 38, 64, 0.12) !important;
  color: #14233a !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 18px 48px rgba(19,34,55,.10) !important;
}

body.theme-light .app-shell {
  background: transparent;
}

body.theme-light .main,
body.theme-light .main:has(.view.active),
body.theme-light .main:has(#home.home-command-center.active),
body.theme-light .main:has(#setup.setup-command-center.active),
body.theme-light .main:has(#reports.reports-command-center.active),
body.theme-light .main:has(#logs.active),
body.theme-light .main:has(#accounting.active),
body.theme-light .main:has(#guests.active),
body.theme-light .main:has(#housekeeping.active) {
  background:
    radial-gradient(circle at 22% 0%, rgba(234, 215, 173, 0.42), transparent 30%),
    linear-gradient(145deg, #f8f1e5 0%, #f6f8fb 52%, #efe5d5 100%) !important;
  color: #14233a !important;
}

body.theme-light .sidebar {
  background:
    radial-gradient(circle at 0% 0%, rgba(226, 200, 141, 0.34), transparent 34%),
    linear-gradient(180deg, var(--cyotel-cream) 0%, #fffdf8 44%, #f1e6d2 100%) !important;
  color: var(--cyotel-navy) !important;
  border-right: 1px solid rgba(18, 38, 64, 0.12);
  box-shadow: 14px 0 42px rgba(19, 34, 55, 0.13);
  scrollbar-color: rgba(143, 102, 36, 0.56) rgba(255, 255, 255, 0.58);
}

body.theme-light .sidebar::-webkit-scrollbar {
  width: 10px;
}

body.theme-light .sidebar::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.58);
  border-radius: 999px;
}

body.theme-light .sidebar::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(185, 139, 59, 0.72), rgba(7, 27, 51, 0.38));
  border: 2px solid rgba(255, 250, 241, 0.82);
  border-radius: 999px;
}

body.theme-light .sidebar-toggle {
  border-color: rgba(18, 38, 64, 0.14) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  color: var(--cyotel-navy) !important;
  box-shadow: 0 12px 26px rgba(19, 34, 55, 0.12);
}

body.theme-light .cyotel-sidebar-brand,
body.theme-light .brand,
body.theme-light .system-date-card,
body.theme-light .user-chip,
body.theme-light .cyotel-powered-badge {
  border-color: rgba(18, 38, 64, 0.12) !important;
  background: rgba(255, 255, 255, 0.70) !important;
  color: var(--cyotel-navy) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82), 0 14px 32px rgba(19, 34, 55, 0.08);
}

body.theme-light .brand {
  padding: 18px 14px;
  border-bottom: 1px solid rgba(18, 38, 64, 0.10) !important;
  border-radius: 16px;
}

body.theme-light .brand img {
  filter: brightness(0) saturate(100%) invert(11%) sepia(36%) saturate(1324%) hue-rotate(174deg) brightness(92%) contrast(95%);
  opacity: 0.96;
}

body.theme-light .brand p,
body.theme-light .cyotel-sidebar-brand span,
body.theme-light .user-chip small,
body.theme-light .system-date-card span,
body.theme-light .cyotel-powered-badge span {
  color: #8f6624 !important;
}

body.theme-light .cyotel-sidebar-brand strong,
body.theme-light .system-date-card strong,
body.theme-light .user-chip span {
  color: var(--cyotel-navy) !important;
}

body.theme-light .nav-item {
  color: #475569 !important;
  background: transparent !important;
}

body.theme-light .nav-item::after {
  color: #8f6624 !important;
}

body.theme-light .nav-item:hover,
body.theme-light .nav-item.active {
  background: linear-gradient(90deg, rgba(185, 139, 59, 0.18), rgba(255, 255, 255, 0.72)) !important;
  color: var(--cyotel-navy) !important;
  box-shadow: inset 4px 0 0 var(--cyotel-gold), 0 10px 24px rgba(19, 34, 55, 0.08);
}

body.theme-light .sidebar-logout {
  background: #9f2f2f !important;
  box-shadow: 0 12px 26px rgba(159, 47, 47, 0.18);
}

body.theme-light #setup.setup-command-center .cyotel-about-card {
  border: 1px solid rgba(185, 139, 59, 0.24) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(226, 200, 141, 0.30), transparent 34%),
    linear-gradient(135deg, rgba(255, 250, 241, 0.98), rgba(255, 255, 255, 0.94) 52%, rgba(246, 239, 226, 0.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 18px 42px rgba(19, 34, 55, 0.10) !important;
}

body.theme-light #setup.setup-command-center .cyotel-about-card h4,
body.theme-light #setup.setup-command-center .cyotel-about-card dd {
  color: var(--cyotel-navy) !important;
  -webkit-text-fill-color: var(--cyotel-navy);
}

body.theme-light #setup.setup-command-center .cyotel-about-card p {
  color: #52606f !important;
  -webkit-text-fill-color: #52606f;
}

body.theme-light #setup.setup-command-center .cyotel-about-card .eyebrow,
body.theme-light #setup.setup-command-center .cyotel-about-card dt {
  color: var(--cyotel-gold-dark) !important;
  -webkit-text-fill-color: var(--cyotel-gold-dark);
}

body.theme-light #setup.setup-command-center .cyotel-about-card dl div {
  border: 1px solid rgba(18, 38, 64, 0.08);
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86), 0 10px 22px rgba(19, 34, 55, 0.06);
}

body.theme-light .topbar,
body.theme-light .main:has(.view.active) .topbar,
body.theme-light .main:has(#home.home-command-center.active) .topbar,
body.theme-light .main:has(#reports.reports-command-center.active) .topbar,
body.theme-light .main:has(#logs.active) .topbar,
body.theme-light .main:has(#accounting.active) .topbar,
body.theme-light .main:has(#guests.active) .topbar,
body.theme-light .main:has(#housekeeping.active) .topbar {
  border-bottom-color: rgba(18, 38, 64, 0.12) !important;
  background: rgba(255, 255, 255, 0.74) !important;
  color: #14233a !important;
  backdrop-filter: blur(18px);
}

body.theme-light .topbar-title-group #viewTitle,
body.theme-light .main:has(.view.active) .topbar-title-group #viewTitle,
body.theme-light .main:has(#home.home-command-center.active) .topbar-title-group #viewTitle {
  color: #14233a !important;
}

body.theme-light .topbar-title-group small,
body.theme-light .eyebrow,
body.theme-light .panel-note,
body.theme-light .setup-flow-header .eyebrow {
  color: #9a702a !important;
}

body.theme-light h1,
body.theme-light h2,
body.theme-light h3,
body.theme-light h4,
body.theme-light .panel-header h3,
body.theme-light .setup-header h2,
body.theme-light .home-hero-main h2,
body.theme-light .reports-command-hero h2,
body.theme-light .logs-hero h2,
body.theme-light .crm-command-hero h2,
body.theme-light .accounting-command-hero h2,
body.theme-light .hk-hero h2,
body.theme-light .metric strong,
body.theme-light .metric-card strong,
body.theme-light .home-metric strong,
body.theme-light .home-signal strong,
body.theme-light .home-panel-head h3,
body.theme-light .home-ops-card strong,
body.theme-light .setup-metric-card strong,
body.theme-light .reports-kpi-card strong,
body.theme-light .logs-kpi-card strong,
body.theme-light .accounting-kpi-card strong,
body.theme-light .crm-command-shell strong,
body.theme-light .hk-stat strong {
  color: #10213a !important;
}

body.theme-light p,
body.theme-light small,
body.theme-light .muted,
body.theme-light .panel-header span,
body.theme-light .setup-header p,
body.theme-light .home-hero-main p,
body.theme-light .reports-command-hero p,
body.theme-light .logs-hero p,
body.theme-light .crm-command-hero p,
body.theme-light .accounting-command-hero p,
body.theme-light .hk-hero p,
body.theme-light .home-ops-card small,
body.theme-light .home-notice-card p,
body.theme-light .setup-metric-card small,
body.theme-light .reports-kpi-card small,
body.theme-light .logs-kpi-card small,
body.theme-light .accounting-kpi-card small {
  color: #667184 !important;
}

body.theme-light .home-hero,
body.theme-light .home-panel,
body.theme-light .home-side-panel,
body.theme-light .home-metric,
body.theme-light .home-signal,
body.theme-light .home-ops-card,
body.theme-light .home-notice-card,
body.theme-light .setup-hero-main,
body.theme-light .setup-hero-side,
body.theme-light .setup-metric-card,
body.theme-light .setup-guardrail-grid > div,
body.theme-light .setup-flow-panel,
body.theme-light .reports-command-hero,
body.theme-light .reports-kpi-card,
body.theme-light .reports-table-panel,
body.theme-light .reports-insight-panel,
body.theme-light .logs-hero-grid,
body.theme-light .logs-kpi-card,
body.theme-light .logs-table-panel,
body.theme-light .crm-command-hero,
body.theme-light .crm-panel,
body.theme-light .crm-ops-card,
body.theme-light .accounting-kpi-card,
body.theme-light .accounting-risk-panel,
body.theme-light .accounting-voucher-preview-panel,
body.theme-light .hk-stat,
body.theme-light .hk-room-card,
body.theme-light .hk-task-card {
  background: linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,250,242,.72)) !important;
  border-color: rgba(18, 38, 64, 0.12) !important;
  color: #14233a !important;
  box-shadow: 0 16px 42px rgba(19,34,55,.09) !important;
}

body.theme-light #setup.setup-command-center .setup-hero-side div {
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,248,235,.84)) !important;
  background-image: linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,248,235,.84)) !important;
  border-color: rgba(185, 139, 59, 0.18) !important;
  color: #14233a !important;
  box-shadow: 0 12px 28px rgba(19,34,55,.08) !important;
}

body.theme-light #setup.setup-command-center .setup-hero-side div span {
  color: #526174 !important;
  -webkit-text-fill-color: #526174 !important;
}

body.theme-light #setup.setup-command-center .setup-hero-side div strong {
  color: #10213a !important;
  -webkit-text-fill-color: #10213a !important;
}

body.theme-light .panel-header,
body.theme-light .reports-table-panel .panel-header,
body.theme-light .logs-panel-header,
body.theme-light .crm-panel-header,
body.theme-light .accounting-panel-header,
body.theme-light .home-panel-head,
body.theme-light .setup-flow-header {
  background: linear-gradient(135deg, #fff8eb, rgba(255,255,255,.94)) !important;
  border-color: rgba(185, 139, 59, 0.20) !important;
  color: #10213a !important;
}

body.theme-light input,
body.theme-light select,
body.theme-light textarea,
body.theme-light .input-like,
body.theme-light .search-input {
  background: #ffffff !important;
  border-color: rgba(18, 38, 64, 0.18) !important;
  color: #14233a !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88) !important;
}

body.theme-light input::placeholder,
body.theme-light textarea::placeholder {
  color: #8a94a5 !important;
}

body.theme-light .primary-button,
body.theme-light .login-button,
body.theme-light .ghost-button.primary,
body.theme-light button.primary,
body.theme-light .reservation-action.primary {
  background: linear-gradient(135deg, #071b33, #18436c) !important;
  color: #ffffff !important;
  border-color: rgba(7, 27, 51, 0.22) !important;
  box-shadow: 0 12px 24px rgba(7,27,51,.18) !important;
}

body.theme-light .ghost-button,
body.theme-light .secondary-button,
body.theme-light .filter-chip,
body.theme-light .reservation-tabs button,
body.theme-light .setup-tabs button,
body.theme-light [data-accounting-tab],
body.theme-light [data-crm-tab],
body.theme-light [data-housekeeping-filter],
body.theme-light [data-log-filter],
body.theme-light [data-report-filter] {
  background: rgba(255,255,255,.76) !important;
  color: #24344d !important;
  border-color: rgba(18, 38, 64, 0.14) !important;
}

body.theme-light .ghost-button:hover,
body.theme-light .secondary-button:hover,
body.theme-light .filter-chip:hover,
body.theme-light .reservation-tabs button:hover,
body.theme-light .setup-tabs button:hover {
  background: #fff7e8 !important;
  color: #10213a !important;
  border-color: rgba(185,139,59,.28) !important;
}

body.theme-light .setup-tabs button.active,
body.theme-light .reservation-tabs button.active,
body.theme-light [data-accounting-tab].active,
body.theme-light [data-crm-tab].active,
body.theme-light [data-housekeeping-filter].active,
body.theme-light .filter-chip.active,
body.theme-light .nav-pills button.active {
  background: linear-gradient(135deg, #071b33, #18436c) !important;
  color: #ffffff !important;
  border-color: rgba(185,139,59,.34) !important;
}

body.theme-light table {
  color: #24344d !important;
}

body.theme-light thead th,
body.theme-light table th,
body.theme-light .home-table-panel thead th,
body.theme-light .reports-table-panel th,
body.theme-light .logs-table-panel th,
body.theme-light #accounting th,
body.theme-light #frontoffice th,
body.theme-light #setup th,
body.theme-light #guests th {
  background: rgba(255, 248, 235, 0.92) !important;
  border-color: rgba(185,139,59,.18) !important;
  color: #7a8494 !important;
}

body.theme-light tbody td,
body.theme-light table td,
body.theme-light .home-table-panel tbody td,
body.theme-light .reports-table-panel td,
body.theme-light .logs-table-panel td,
body.theme-light #accounting td,
body.theme-light #frontoffice td,
body.theme-light #setup td,
body.theme-light #guests td {
  background: #ffffff !important;
  border-color: rgba(18, 38, 64, 0.10) !important;
  color: #24344d !important;
}

body.theme-light tbody tr:hover td,
body.theme-light .home-table-panel tbody tr:hover td,
body.theme-light .reports-table-panel tbody tr:hover td,
body.theme-light .logs-table-panel tbody tr:hover td,
body.theme-light #accounting tbody tr:hover td,
body.theme-light #frontoffice tbody tr:hover td,
body.theme-light #setup tbody tr:hover td,
body.theme-light #guests tbody tr:hover td {
  background: #fff7e8 !important;
  color: #10213a !important;
}

body.theme-light .status,
body.theme-light .badge,
body.theme-light .pill,
body.theme-light .home-chip,
body.theme-light .setup-hero-tags span,
body.theme-light .source-pill,
body.theme-light .dry-run-badge,
body.theme-light .reservation-status-pill {
  background: #fff7e8 !important;
  border-color: rgba(185,139,59,.25) !important;
  color: #73521d !important;
}

body.theme-light .status.success,
body.theme-light .status.ok,
body.theme-light .badge.success,
body.theme-light .pill.success,
body.theme-light .home-chip.ok {
  background: #eaf7ef !important;
  color: #11734b !important;
  border-color: rgba(17,115,75,.18) !important;
}

body.theme-light .status.danger,
body.theme-light .status.error,
body.theme-light .badge.danger,
body.theme-light .pill.danger {
  background: #fff1f0 !important;
  color: #b42318 !important;
  border-color: rgba(180,35,24,.18) !important;
}

body.theme-light .status.warn,
body.theme-light .badge.warn,
body.theme-light .pill.warn,
body.theme-light .home-chip.warn {
  background: #fff4db !important;
  color: #996300 !important;
  border-color: rgba(185,139,59,.24) !important;
}

body.theme-light .theme-preference-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .9fr) 220px;
  gap: 14px;
  align-items: stretch;
  margin: 0 0 16px;
  padding: 16px;
  border: 1px solid rgba(185,139,59,.22);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(255,248,235,.96), rgba(255,255,255,.88));
  box-shadow: 0 16px 42px rgba(19,34,55,.09);
}

body.theme-dark .theme-preference-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .9fr) 220px;
  gap: 14px;
  align-items: stretch;
  margin: 0 0 16px;
  padding: 16px;
  border: 1px solid rgba(215,181,110,.20);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(13,25,43,.96), rgba(18,32,53,.82));
  box-shadow: 0 16px 42px rgba(0,0,0,.18);
}

.theme-preference-copy h4 {
  margin: 4px 0 6px;
  font-size: 20px;
  letter-spacing: -.03em;
}

.theme-preference-copy p:last-child,
.theme-preference-current small {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.theme-preference-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.theme-preference-actions button {
  display: grid;
  gap: 5px;
  align-content: center;
  min-height: 84px;
  border: 1px solid rgba(18,38,64,.14);
  border-radius: 18px;
  padding: 12px;
  background: rgba(255,255,255,.70);
  color: #24344d;
  text-align: left;
}

.theme-preference-actions button span {
  font-size: 14px;
  font-weight: 950;
}

.theme-preference-actions button small {
  color: inherit;
  opacity: .74;
  font-size: 11px;
  line-height: 1.35;
}

.theme-preference-actions button.active {
  background: linear-gradient(135deg, #071b33, #18436c) !important;
  color: #ffffff !important;
  border-color: rgba(185,139,59,.42) !important;
  box-shadow: 0 12px 28px rgba(7,27,51,.22);
}

.theme-preference-current {
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 14px;
  border: 1px solid rgba(185,139,59,.20);
  border-radius: 18px;
  background: rgba(255,255,255,.62);
}

body.theme-dark .theme-preference-current,
body.theme-dark .theme-preference-actions button {
  background: rgba(255,255,255,.07);
  color: #f4f8ff;
  border-color: rgba(215,181,110,.18);
}

.theme-preference-current span {
  color: #9a702a;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.theme-preference-current strong {
  color: #10213a;
  font-size: 18px;
}

body.theme-dark .theme-preference-current strong {
  color: #ffffff;
}

body.theme-light .pms-column-resizer {
  background: linear-gradient(180deg, transparent, rgba(185,139,59,.58), transparent) !important;
}

body.theme-light .room-card,
body.theme-light .room-rack-card,
body.theme-light .availability-card,
body.theme-light .day-card,
body.theme-light .reservation-card,
body.theme-light .web-review-card,
body.theme-light .crm-template-card,
body.theme-light .whatsapp-preview-card,
body.theme-light .cash-bank-card,
body.theme-light .current-account-card,
body.theme-light .invoice-readiness-card,
body.theme-light .log-card {
  background: rgba(255,255,255,.86) !important;
  border-color: rgba(18,38,64,.12) !important;
  color: #14233a !important;
  box-shadow: 0 14px 34px rgba(19,34,55,.08) !important;
}

body.theme-light .booking-engine-frame,
body.theme-light iframe {
  background: #ffffff !important;
}

/* Light mode hardening: override older high-specificity dark premium table/card rules. */
body.theme-light .view .panel,
body.theme-light .view section.panel,
body.theme-light #frontoffice .panel,
body.theme-light #setup .metric,
body.theme-light #setup .panel,
body.theme-light #guests .panel,
body.theme-light #housekeeping .card,
body.theme-light #reports .panel,
body.theme-light #logs .panel,
body.theme-light #accounting .panel {
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,250,242,.76)) !important;
  border-color: rgba(18, 38, 64, 0.12) !important;
  color: #14233a !important;
  box-shadow: 0 16px 42px rgba(19,34,55,.09) !important;
}

body.theme-light .view .panel *,
body.theme-light #frontoffice .panel *,
body.theme-light #setup .metric *,
body.theme-light #guests .panel *,
body.theme-light #housekeeping .card *,
body.theme-light #reports .panel *,
body.theme-light #logs .panel *,
body.theme-light #accounting .panel * {
  color: inherit;
}

body.theme-light .view table.pms-resizable-table thead,
body.theme-light .view table.pms-resizable-table thead tr,
body.theme-light .view table.pms-resizable-table thead th,
body.theme-light .view table.pms-resizable-table th.pms-resizable-header,
body.theme-light #reports.reports-command-center .reports-table-panel table.pms-resizable-table thead,
body.theme-light #reports.reports-command-center .reports-table-panel table.pms-resizable-table thead tr,
body.theme-light #reports.reports-command-center .reports-table-panel table.pms-resizable-table thead th,
body.theme-light #logs table.pms-resizable-table thead,
body.theme-light #logs table.pms-resizable-table thead tr,
body.theme-light #logs table.pms-resizable-table thead th,
body.theme-light #frontoffice table.pms-resizable-table thead,
body.theme-light #frontoffice table.pms-resizable-table thead tr,
body.theme-light #frontoffice table.pms-resizable-table thead th,
body.theme-light #setup table.pms-resizable-table thead,
body.theme-light #setup table.pms-resizable-table thead tr,
body.theme-light #setup table.pms-resizable-table thead th,
body.theme-light #guests table.pms-resizable-table thead,
body.theme-light #guests table.pms-resizable-table thead tr,
body.theme-light #guests table.pms-resizable-table thead th,
body.theme-light #accounting table.pms-resizable-table thead,
body.theme-light #accounting table.pms-resizable-table thead tr,
body.theme-light #accounting table.pms-resizable-table thead th {
  background: linear-gradient(180deg, #fffaf0 0%, #f3eadb 100%) !important;
  background-color: #f6eddf !important;
  color: #14233a !important;
  border-color: rgba(185,139,59,.18) !important;
  box-shadow: inset 0 -1px 0 rgba(185,139,59,.12) !important;
}

body.theme-light table.pms-resizable-table thead th > *:not(.pms-column-resizer),
body.theme-light table.pms-resizable-table thead th .table-sort,
body.theme-light table.pms-resizable-table thead th .sort-caret,
body.theme-light table.pms-resizable-table thead th .sort-caret::before {
  background: transparent !important;
  background-color: transparent !important;
  color: inherit !important;
  box-shadow: none !important;
}

body.theme-light table.pms-resizable-table thead th .table-sort {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

body.theme-light table.pms-resizable-table thead th .pms-column-resizer {
  background: linear-gradient(180deg, rgba(185,139,59,0), rgba(185,139,59,.22), rgba(185,139,59,0)) !important;
  box-shadow: none !important;
}

body.theme-light table.pms-resizable-table thead th .pms-column-resizer::after {
  background: rgba(185,139,59,.46) !important;
}

body.theme-light .view table.pms-resizable-table tbody td,
body.theme-light #reports.reports-command-center .reports-table-panel table.pms-resizable-table tbody td,
body.theme-light #logs table.pms-resizable-table tbody td,
body.theme-light #frontoffice table.pms-resizable-table tbody td,
body.theme-light #setup table.pms-resizable-table tbody td,
body.theme-light #guests table.pms-resizable-table tbody td,
body.theme-light #accounting table.pms-resizable-table tbody td {
  background: #ffffff !important;
  color: #24344d !important;
  border-color: rgba(18, 38, 64, 0.10) !important;
}

body.theme-light .view table.pms-resizable-table tbody tr:hover td,
body.theme-light #reports.reports-command-center .reports-table-panel table.pms-resizable-table tbody tr:hover td,
body.theme-light #logs table.pms-resizable-table tbody tr:hover td,
body.theme-light #frontoffice table.pms-resizable-table tbody tr:hover td,
body.theme-light #setup table.pms-resizable-table tbody tr:hover td,
body.theme-light #guests table.pms-resizable-table tbody tr:hover td,
body.theme-light #accounting table.pms-resizable-table tbody tr:hover td {
  background: #fff7e8 !important;
  color: #10213a !important;
}

body.theme-light .view .panel h1,
body.theme-light .view .panel h2,
body.theme-light .view .panel h3,
body.theme-light .view .panel h4,
body.theme-light .view .panel strong,
body.theme-light #setup .metric strong,
body.theme-light #housekeeping .card strong {
  color: #10213a !important;
}

body.theme-light .view .panel p,
body.theme-light .view .panel small,
body.theme-light .view .panel span,
body.theme-light #setup .metric span,
body.theme-light #housekeeping .card small {
  color: #667184 !important;
}

body.theme-light .frontoffice-daily-bar,
body.theme-light #frontoffice .frontoffice-daily-bar,
body.theme-light #frontoffice .frontoffice-daily-bar article {
  background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(255,248,235,.82)) !important;
  border-color: rgba(185,139,59,.20) !important;
  color: #14233a !important;
  box-shadow: 0 -16px 42px rgba(19,34,55,.12) !important;
}

body.theme-light .frontoffice-daily-bar span,
body.theme-light .frontoffice-daily-bar strong {
  color: #14233a !important;
}

body.theme-light #frontoffice .table-wrap,
body.theme-light #frontoffice .table-wrap *,
body.theme-light #setup .metric,
body.theme-light #setup .metric *,
body.theme-light #setup .role-card,
body.theme-light #setup .role-card *,
body.theme-light #guests .card,
body.theme-light #guests .card *,
body.theme-light #guests .guest-card,
body.theme-light #guests .guest-card * {
  color: #14233a !important;
}

body.theme-light #setup .metric,
body.theme-light #setup .role-card,
body.theme-light #guests .card,
body.theme-light #guests .guest-card {
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,250,242,.78)) !important;
  border-color: rgba(18,38,64,.12) !important;
  box-shadow: 0 14px 34px rgba(19,34,55,.08) !important;
}

body.theme-light #setup .metric small,
body.theme-light #setup .metric span,
body.theme-light #setup .role-card small,
body.theme-light #setup .role-card span,
body.theme-light #guests .card small,
body.theme-light #guests .card span,
body.theme-light #guests .guest-card small,
body.theme-light #guests .guest-card span {
  color: #667184 !important;
}

body.theme-light #setup .metric strong,
body.theme-light #setup .role-card strong,
body.theme-light #guests .card strong,
body.theme-light #guests .guest-card strong {
  color: #10213a !important;
}

@media (max-width: 1180px) {
  .theme-preference-card,
  body.theme-light .theme-preference-card,
  body.theme-dark .theme-preference-card {
    grid-template-columns: 1fr;
  }
}

/* CyotelOS Light Mode final hardening — must stay at EOF */
body.theme-light #setup article.metric,
body.theme-light #setup article.card,
body.theme-light #setup .role-card,
body.theme-light #setup table td,
body.theme-light #guests article.card,
body.theme-light #guests .card,
body.theme-light #guests .guest-card {
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,250,242,.80)) !important;
  border-color: rgba(18,38,64,.12) !important;
  color: #14233a !important;
  box-shadow: 0 14px 34px rgba(19,34,55,.08) !important;
}

body.theme-light #setup article.metric *,
body.theme-light #setup article.card *,
body.theme-light #setup .role-card *,
body.theme-light #setup table td *,
body.theme-light #guests article.card *,
body.theme-light #guests .card *,
body.theme-light #guests .guest-card * {
  color: inherit !important;
}

body.theme-light #setup article.metric strong,
body.theme-light #setup article.card strong,
body.theme-light #setup .role-card strong,
body.theme-light #guests article.card strong,
body.theme-light #guests .card strong,
body.theme-light #guests .guest-card strong {
  color: #10213a !important;
}

body.theme-light #setup article.metric span,
body.theme-light #setup article.metric small,
body.theme-light #setup article.card span,
body.theme-light #setup article.card small,
body.theme-light #setup .role-card span,
body.theme-light #setup .role-card small,
body.theme-light #guests article.card span,
body.theme-light #guests article.card small,
body.theme-light #guests .card span,
body.theme-light #guests .card small,
body.theme-light #guests .guest-card span,
body.theme-light #guests .guest-card small {
  color: #667184 !important;
}

/* CyotelOS Light Mode specificity lock — overrides legacy dark !important cards */
html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center article.metric,
html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center article.card,
html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center .role-card,
html[data-theme="light"] body.theme-light #guests#guests.view article.card,
html[data-theme="light"] body.theme-light #guests#guests.view .card,
html[data-theme="light"] body.theme-light #guests#guests.view .guest-card {
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,250,242,.82)) !important;
  border-color: rgba(18,38,64,.12) !important;
  color: #14233a !important;
  box-shadow: 0 14px 34px rgba(19,34,55,.08) !important;
}

html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center article.metric *,
html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center article.card *,
html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center .role-card *,
html[data-theme="light"] body.theme-light #guests#guests.view article.card *,
html[data-theme="light"] body.theme-light #guests#guests.view .card *,
html[data-theme="light"] body.theme-light #guests#guests.view .guest-card * {
  color: inherit !important;
}

html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center article.metric strong,
html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center article.card strong,
html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center .role-card strong,
html[data-theme="light"] body.theme-light #guests#guests.view article.card strong,
html[data-theme="light"] body.theme-light #guests#guests.view .card strong,
html[data-theme="light"] body.theme-light #guests#guests.view .guest-card strong {
  color: #10213a !important;
}

html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center article.metric span,
html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center article.metric small,
html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center article.card span,
html[data-theme="light"] body.theme-light #setup#setup.setup-workspace.setup-command-center article.card small,
html[data-theme="light"] body.theme-light #guests#guests.view article.card span,
html[data-theme="light"] body.theme-light #guests#guests.view article.card small,
html[data-theme="light"] body.theme-light #guests#guests.view .card span,
html[data-theme="light"] body.theme-light #guests#guests.view .card small {
  color: #667184 !important;
}

/* CyotelOS Light Mode CRM table lock */
html[data-theme="light"] body.theme-light #guests#guests.view table,
html[data-theme="light"] body.theme-light #guests#guests.view table thead th,
html[data-theme="light"] body.theme-light #guests#guests.view table tbody td,
html[data-theme="light"] body.theme-light #guests#guests.view table td {
  color: #24344d !important;
  border-color: rgba(18,38,64,.10) !important;
}

html[data-theme="light"] body.theme-light #guests#guests.view table thead th {
  background: rgba(255,248,235,.96) !important;
  color: #7a8494 !important;
}

html[data-theme="light"] body.theme-light #guests#guests.view table tbody td,
html[data-theme="light"] body.theme-light #guests#guests.view table td {
  background: #ffffff !important;
  color: #24344d !important;
}

html[data-theme="light"] body.theme-light #guests#guests.view table tbody tr:hover td {
  background: #fff7e8 !important;
  color: #10213a !important;
}

/* CyotelOS Light Mode contrast unification — fixes dark/washed legacy command-center residues */
body.theme-light {
  --light-bg-warm: #f6f0e6;
  --light-surface: #fffaf2;
  --light-surface-strong: #ffffff;
  --light-surface-muted: #f2eee6;
  --light-navy: #071b33;
  --light-ink: #132238;
  --light-text: #24344d;
  --light-muted: #657185;
  --light-soft-muted: #7a8494;
  --light-line: rgba(18, 38, 64, 0.14);
  --light-gold: #b88a35;
  --light-gold-soft: rgba(184, 138, 53, 0.13);
  --light-shadow: 0 16px 38px rgba(19, 34, 55, 0.10);
}

body.theme-light .main,
body.theme-light .view,
body.theme-light .setup-workspace,
body.theme-light #frontoffice,
body.theme-light #endofday,
body.theme-light #accounting,
body.theme-light #reports,
body.theme-light #logs,
body.theme-light #guests,
body.theme-light #housekeeping,
body.theme-light #bookingEngine {
  background:
    radial-gradient(circle at 18% 0%, rgba(232, 212, 173, 0.34), transparent 32%),
    linear-gradient(145deg, #f8f1e5 0%, #f6f8fb 54%, #efe5d5 100%) !important;
  color: var(--light-text) !important;
}

body.theme-light .topbar,
body.theme-light .setup-header,
body.theme-light .booking-engine-host-header,
body.theme-light .frontoffice-tab-panel,
body.theme-light .accounting-tab-panel,
body.theme-light .reports-command-shell,
body.theme-light .logs-command-shell,
body.theme-light .crm-command-shell,
body.theme-light .housekeeping-command-shell,
body.theme-light .endofday-command-shell,
body.theme-light .accounting-command-shell,
body.theme-light .panel,
body.theme-light .module-panel,
body.theme-light .content-card,
body.theme-light .table-wrap,
body.theme-light .modal-content,
body.theme-light .reservation-card,
body.theme-light .room-board,
body.theme-light .premium-web-review-card,
body.theme-light .premium-web-review-summary,
body.theme-light .premium-fo-summary,
body.theme-light .accounting-command-lower > *,
body.theme-light .accounting-risk-panel,
body.theme-light .accounting-voucher-preview-panel,
body.theme-light .accounting-invoice-readiness-panel,
body.theme-light .accounting-cash-bank-panel,
body.theme-light .accounting-current-account-panel,
body.theme-light .account-plan-context-panel,
body.theme-light .transaction-code-context-panel,
body.theme-light .revenue-context-panel,
body.theme-light .payment-source-panel,
body.theme-light .open-folio-risk-panel,
body.theme-light .advance-risk-panel,
body.theme-light .cashier-risk-panel,
body.theme-light .voucher-source-panel,
body.theme-light .crm-panel,
body.theme-light .guest-profile-panel,
body.theme-light .crm-queue-panel,
body.theme-light .assistant-panel,
body.theme-light .housekeeping-board,
body.theme-light .housekeeping-worklist,
body.theme-light .housekeeping-floor-panel,
body.theme-light .endofday-panel,
body.theme-light .endofday-run-panel,
body.theme-light .endofday-summary-panel,
body.theme-light .logs-table-panel,
body.theme-light .reports-table-panel {
  background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(255,250,242,0.88)) !important;
  border-color: var(--light-line) !important;
  color: var(--light-text) !important;
  box-shadow: var(--light-shadow) !important;
}

body.theme-light .setup-header,
body.theme-light .accounting-command-hero,
body.theme-light .reports-command-hero,
body.theme-light .logs-command-hero,
body.theme-light .crm-command-hero,
body.theme-light .housekeeping-command-hero,
body.theme-light .endofday-command-hero {
  background:
    radial-gradient(circle at 100% 0%, rgba(184,138,53,0.16), transparent 38%),
    linear-gradient(135deg, rgba(255,255,255,0.98), rgba(247,242,232,0.94)) !important;
  border: 1px solid var(--light-line) !important;
  color: var(--light-text) !important;
}

body.theme-light h1,
body.theme-light h2,
body.theme-light h3,
body.theme-light h4,
body.theme-light .setup-header h2,
body.theme-light .panel-header h3,
body.theme-light .metric strong,
body.theme-light .metric-card strong,
body.theme-light .kpi-card strong,
body.theme-light .home-metric strong,
body.theme-light .frontoffice-daily-bar strong,
body.theme-light .room-card strong,
body.theme-light .housekeeping-room-card strong {
  color: var(--light-ink) !important;
  text-shadow: none !important;
}

body.theme-light p,
body.theme-light small,
body.theme-light span,
body.theme-light label,
body.theme-light .muted,
body.theme-light .lead,
body.theme-light .setup-header p,
body.theme-light .setup-header small,
body.theme-light .panel-header span,
body.theme-light .metric span,
body.theme-light .metric small,
body.theme-light .metric-card span,
body.theme-light .metric-card small,
body.theme-light .kpi-card span,
body.theme-light .kpi-card small,
body.theme-light .empty-state,
body.theme-light .helper-text {
  color: var(--light-muted) !important;
}

body.theme-light .eyebrow,
body.theme-light .section-kicker,
body.theme-light .panel-kicker,
body.theme-light .command-kicker {
  color: #8a641f !important;
  letter-spacing: .08em;
}

body.theme-light .setup-tabs,
body.theme-light .reservation-tabs,
body.theme-light .compact-tabs,
body.theme-light .tab-strip,
body.theme-light .accounting-controls,
body.theme-light .filters,
body.theme-light .filter-bar,
body.theme-light .search-panel,
body.theme-light .logs-filter-panel,
body.theme-light .reports-filter-panel,
body.theme-light .crm-tab-strip,
body.theme-light .housekeeping-filter-strip {
  background: rgba(255,255,255,0.72) !important;
  border: 1px solid var(--light-line) !important;
  box-shadow: 0 10px 24px rgba(19,34,55,.07) !important;
}

body.theme-light .setup-tabs button,
body.theme-light .reservation-tabs button,
body.theme-light .compact-tabs button,
body.theme-light .tab-strip button,
body.theme-light [role="tab"],
body.theme-light .filter-chip,
body.theme-light .chip,
body.theme-light .pill,
body.theme-light .status,
body.theme-light .badge,
body.theme-light .home-chip,
body.theme-light .home-tag {
  background: #ffffff !important;
  border: 1px solid rgba(18,38,64,.14) !important;
  color: #263750 !important;
  box-shadow: 0 7px 16px rgba(19,34,55,.06) !important;
}

body.theme-light .setup-tabs button.active,
body.theme-light .reservation-tabs button.active,
body.theme-light .compact-tabs button.active,
body.theme-light .tab-strip button.active,
body.theme-light [role="tab"][aria-selected="true"],
body.theme-light .filter-chip.active,
body.theme-light .chip.active,
body.theme-light .pill.active,
body.theme-light .status.clean,
body.theme-light .status.current,
body.theme-light .status.ok,
body.theme-light .badge.clean {
  background: linear-gradient(135deg, #071b33, #173d64) !important;
  border-color: rgba(7,27,51,.22) !important;
  color: #ffffff !important;
}

body.theme-light .status.warning,
body.theme-light .status.warn,
body.theme-light .badge.warning,
body.theme-light .pill.warning {
  background: #fff4dc !important;
  border-color: rgba(184,138,53,.28) !important;
  color: #77531c !important;
}

body.theme-light .status.danger,
body.theme-light .status.late,
body.theme-light .badge.danger,
body.theme-light .pill.danger {
  background: #fff0f0 !important;
  border-color: rgba(204,58,58,.28) !important;
  color: #9b2424 !important;
}

body.theme-light #foRack .rack-room-card.clean,
body.theme-light #foRack .rack-room-card.dirty,
body.theme-light #foRack .rack-room-card.occupied-clean,
body.theme-light #foRack .rack-room-card.occupied-dirty,
body.theme-light #foRack .rack-room-card.maintenance,
body.theme-light #foRack .rack-room-card.closed {
  border-left-color: var(--rack-color) !important;
  background:
    radial-gradient(circle at 92% 10%, var(--rack-glow), transparent 32%),
    linear-gradient(145deg, #ffffff 0%, var(--rack-soft) 100%) !important;
}

body.theme-light #foRack .rack-room-card::before {
  background: var(--rack-color) !important;
}

body.theme-light #foRack .rack-room-card::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.theme-light #foRack .rack-room-card > .status {
  color: var(--rack-strong) !important;
  border-color: var(--rack-glow) !important;
  background: var(--rack-status-bg) !important;
}

body.theme-light .metric,
body.theme-light .metric-card,
body.theme-light .kpi-card,
body.theme-light .summary-card,
body.theme-light .action-card,
body.theme-light .report-card,
body.theme-light .log-card,
body.theme-light .crm-quality-card,
body.theme-light .crm-signal-card,
body.theme-light .housekeeping-stat-card,
body.theme-light .frontoffice-stat-card,
body.theme-light .frontoffice-daily-bar > *,
body.theme-light .eod-action-card,
body.theme-light .eod-metric-card,
body.theme-light .accounting-command-status,
body.theme-light .reports-command-status,
body.theme-light .logs-command-status,
body.theme-light .crm-command-status,
body.theme-light .housekeeping-command-status,
body.theme-light .users-command-status {
  background: linear-gradient(180deg, #ffffff, #f7f2ea) !important;
  border: 1px solid var(--light-line) !important;
  color: var(--light-text) !important;
  box-shadow: 0 12px 28px rgba(19,34,55,.09) !important;
}

body.theme-light .reports-command-status,
body.theme-light .logs-command-status,
body.theme-light .crm-command-status,
body.theme-light .housekeeping-command-status,
body.theme-light .accounting-command-status,
body.theme-light .users-command-status,
body.theme-light .side-status-card,
body.theme-light .insight-card,
body.theme-light .guardrail-card,
body.theme-light .security-note,
body.theme-light .notice-card,
body.theme-light .queue-preview-panel {
  background: linear-gradient(180deg, #ffffff, #f2eee6) !important;
  border-color: var(--light-line) !important;
  color: var(--light-text) !important;
}

body.theme-light input,
body.theme-light select,
body.theme-light textarea,
body.theme-light .search-input {
  background: #ffffff !important;
  color: var(--light-ink) !important;
  border: 1px solid rgba(18,38,64,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85) !important;
}

body.theme-light input::placeholder,
body.theme-light textarea::placeholder {
  color: #7b8798 !important;
  opacity: 1 !important;
}

body.theme-light table,
body.theme-light .data-table,
body.theme-light .reservation-table {
  color: var(--light-text) !important;
  background: transparent !important;
}

body.theme-light th,
body.theme-light thead th,
body.theme-light .table-wrap th {
  background: #fff5e6 !important;
  color: #5e6878 !important;
  border-color: rgba(184,138,53,.18) !important;
}

body.theme-light td,
body.theme-light tbody td,
body.theme-light .table-wrap td {
  background: #ffffff !important;
  color: #263750 !important;
  border-color: rgba(18,38,64,.10) !important;
}

body.theme-light tbody tr:hover td,
body.theme-light .table-wrap tr:hover td {
  background: #fff8ec !important;
  color: var(--light-ink) !important;
}

body.theme-light .primary-button,
body.theme-light .action-button.primary,
body.theme-light button.primary,
body.theme-light .save-button,
body.theme-light .button-primary {
  background: linear-gradient(135deg, #071b33, #18436c) !important;
  color: #ffffff !important;
  border-color: rgba(7,27,51,.24) !important;
}

body.theme-light .ghost-button,
body.theme-light .secondary-button,
body.theme-light .action-button,
body.theme-light button:not(.nav-item):not(.sidebar-toggle):not(.active) {
  color: #263750;
}

body.theme-light .home-command-center,
body.theme-light .home-hero,
body.theme-light .home-panel,
body.theme-light .home-table-panel,
body.theme-light .home-notice-card,
body.theme-light .home-flow-card,
body.theme-light .home-ops-card,
body.theme-light .home-signal {
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,250,242,.88)) !important;
  border-color: var(--light-line) !important;
  color: var(--light-text) !important;
}

body.theme-light .main:has(#home.home-command-center.active) {
  background:
    radial-gradient(circle at 18% 0%, rgba(232, 212, 173, 0.34), transparent 32%),
    linear-gradient(145deg, #f8f1e5 0%, #f6f8fb 54%, #efe5d5 100%) !important;
}

body.theme-light .main:has(#home.home-command-center.active) .topbar-title-group #viewTitle,
body.theme-light .main:has(#home.home-command-center.active) .topbar-title-group small,
body.theme-light .home-table-panel td,
body.theme-light .home-flow-card strong,
body.theme-light .home-ops-card strong {
  color: var(--light-ink) !important;
}

body.theme-light .frontoffice-daily-bar {
  background: rgba(255,255,255,.92) !important;
  border: 1px solid var(--light-line) !important;
  box-shadow: 0 -10px 30px rgba(19,34,55,.10) !important;
}

body.theme-light #frontoffice .setup-header,
body.theme-light #frontoffice .setup-tabs,
body.theme-light #frontoffice .reservation-tabs,
body.theme-light #frontoffice .table-wrap,
body.theme-light #frontoffice .frontoffice-daily-bar > * {
  background: linear-gradient(180deg, #ffffff, #f7f2ea) !important;
  color: var(--light-text) !important;
}

body.theme-light #endofday .eod-action-card,
body.theme-light #endofday .metric,
body.theme-light #endofday .panel,
body.theme-light #accounting .metric,
body.theme-light #reports .metric,
body.theme-light #logs .metric,
body.theme-light #guests .metric,
body.theme-light #housekeeping .metric {
  background: linear-gradient(180deg, #ffffff, #f7f2ea) !important;
  color: var(--light-text) !important;
  border-color: var(--light-line) !important;
}

body.theme-light #reports .reports-command-status strong,
body.theme-light #logs .logs-command-status strong,
body.theme-light #guests .crm-command-status strong,
body.theme-light #housekeeping .housekeeping-command-status strong,
body.theme-light #accounting .accounting-command-status strong {
  color: var(--light-ink) !important;
}

body.theme-light #reports .reports-command-status span,
body.theme-light #logs .logs-command-status span,
body.theme-light #guests .crm-command-status span,
body.theme-light #housekeeping .housekeeping-command-status span,
body.theme-light #accounting .accounting-command-status span {
  color: var(--light-muted) !important;
}

/* CyotelOS Light Mode final module-specific residue cleanup */
body.theme-light #frontoffice .setup-header h2,
body.theme-light #frontoffice .setup-header span,
body.theme-light #frontoffice .setup-header p,
body.theme-light #frontoffice .setup-header small {
  color: var(--light-ink) !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice .setup-tabs button:not(.active),
body.theme-light #frontoffice .reservation-tabs button:not(.active),
body.theme-light #accounting .setup-tabs button:not(.active),
body.theme-light #guests .crm-tabs button:not(.active),
body.theme-light #guests .crm-tab-strip button:not(.active) {
  background: #ffffff !important;
  color: #263750 !important;
  border: 1px solid rgba(18,38,64,.14) !important;
  box-shadow: 0 7px 16px rgba(19,34,55,.06) !important;
}

body.theme-light #endofday .eod-panel p,
body.theme-light #endofday .eod-topline,
body.theme-light #endofday .eod-summary,
body.theme-light #endofday .eod-warning,
body.theme-light #endofday .eod-detail-row,
body.theme-light #endofday .eod-action-card,
body.theme-light #endofday .eod-action-card > *,
body.theme-light #endofday .eod-check-card,
body.theme-light #endofday .eod-check-card > * {
  background: rgba(255,255,255,.82) !important;
  color: var(--light-text) !important;
  border-color: var(--light-line) !important;
}

body.theme-light #reports .reports-command-source,
body.theme-light #reports .reports-command-status > div,
body.theme-light #reports .reports-signal-card,
body.theme-light #reports .report-insight-card,
body.theme-light #logs .log-filter-panel,
body.theme-light #logs .logs-filter-deck,
body.theme-light #logs .logs-signal-card,
body.theme-light #logs .logs-hero-side > div,
body.theme-light #logs .log-insight-card,
body.theme-light #guests .crm-command-source,
body.theme-light #guests .crm-command-status > div,
body.theme-light #guests .crm-signal-card,
body.theme-light #guests .crm-quality-card,
body.theme-light #guests .crm-command-status div,
body.theme-light #housekeeping .hk-metrics > *,
body.theme-light #housekeeping .hk-hero-pulse,
body.theme-light #housekeeping .hk-status-card,
body.theme-light #housekeeping .hk-floor-summary,
body.theme-light #housekeeping .hk-work-card {
  background: linear-gradient(180deg, #ffffff, #f7f2ea) !important;
  border: 1px solid rgba(18,38,64,.14) !important;
  color: var(--light-text) !important;
  box-shadow: 0 10px 24px rgba(19,34,55,.08) !important;
}

body.theme-light #reports .reports-command-source *,
body.theme-light #reports .reports-command-status > div *,
body.theme-light #logs .logs-signal-card *,
body.theme-light #logs .logs-hero-side > div *,
body.theme-light #guests .crm-command-source *,
body.theme-light #guests .crm-command-status > div *,
body.theme-light #housekeeping .hk-metrics > * *,
body.theme-light #housekeeping .hk-hero-pulse *,
body.theme-light #housekeeping .hk-status-card * {
  color: var(--light-text) !important;
  text-shadow: none !important;
}

body.theme-light #reports .reports-command-source small,
body.theme-light #reports .reports-command-status small,
body.theme-light #logs .logs-signal-card small,
body.theme-light #logs .logs-hero-side small,
body.theme-light #guests .crm-command-source small,
body.theme-light #guests .crm-command-status small,
body.theme-light #housekeeping .hk-metrics small,
body.theme-light #housekeeping .hk-hero-pulse small {
  color: var(--light-muted) !important;
}

body.theme-light #reports .reports-command-status strong,
body.theme-light #logs .logs-signal-card strong,
body.theme-light #guests .crm-command-status strong,
body.theme-light #housekeeping .hk-metrics strong,
body.theme-light #housekeeping .hk-hero-pulse strong {
  color: var(--light-ink) !important;
}

body.theme-light #logs .log-filter-panel input,
body.theme-light #logs .log-filter-panel select,
body.theme-light #logs .logs-filter-deck input,
body.theme-light #logs .logs-filter-deck select {
  background: #ffffff !important;
  color: var(--light-ink) !important;
  border-color: rgba(18,38,64,.18) !important;
}

/* CyotelOS Light Mode deep cleanup v8 — remove leftover dark gradients/overlays in dynamic modules */
body.theme-light .home-heatmap,
body.theme-light .home-heatmap *,
body.theme-light .heatmap-cell,
body.theme-light .heat-cell,
body.theme-light .occupancy-heatmap,
body.theme-light .occupancy-heatmap *,
body.theme-light #setup.setup-command-center .setup-metric-card,
body.theme-light #setup.setup-command-center .setup-hero-side,
body.theme-light #setup.setup-command-center .setup-guardrail-grid > *,
body.theme-light #setup.setup-command-center .users-command-status,
body.theme-light #setup.setup-command-center .access-matrix-summary,
body.theme-light #setup.setup-command-center .rate-matrix,
body.theme-light #setup.setup-command-center .rate-matrix-row,
body.theme-light #setup.setup-command-center .weekday-picker,
body.theme-light #setup.setup-command-center .weekday-picker label,
body.theme-light #setup.setup-command-center .boarding-summary-card,
body.theme-light #setup.setup-command-center .setup-context-card,
body.theme-light #setup.setup-command-center .setup-summary-card,
body.theme-light #setup.setup-command-center .room-type-summary-card,
body.theme-light #setup.setup-command-center .pension-summary-card,
body.theme-light #setup.setup-command-center .price-summary-card,
body.theme-light #frontoffice,
body.theme-light #frontoffice .frontoffice-tab-panel,
body.theme-light #frontoffice .panel,
body.theme-light #frontoffice .reservation-tabs,
body.theme-light #frontoffice .table-wrap,
body.theme-light #accounting .metric,
body.theme-light #accounting .metrics > *,
body.theme-light #accounting .refund-liability-panel,
body.theme-light #accounting .accounting-refund-panel,
body.theme-light #accounting .revenue-context-summary,
body.theme-light #accounting .payment-date-summary,
body.theme-light #accounting .open-folio-summary,
body.theme-light #accounting .advance-summary,
body.theme-light #accounting .cashier-summary,
body.theme-light #accounting .voucher-source-summary,
body.theme-light #accounting .accounting-invoice-metrics > *,
body.theme-light #accounting .accounting-cash-bank-metrics > *,
body.theme-light #accounting .accounting-current-account-metrics > *,
body.theme-light #reports .reports-signal-card,
body.theme-light #reports .report-insight-card,
body.theme-light #reports .reports-command-source,
body.theme-light #reports .reports-command-status > div,
body.theme-light #reports .reports-hero-side > div,
body.theme-light #reports .report-table-shell,
body.theme-light #reports .reports-table-panel,
body.theme-light #logs .logs-signal-card,
body.theme-light #logs .logs-metric-card,
body.theme-light #logs .logs-hero-side > div,
body.theme-light #logs .log-filter-panel,
body.theme-light #logs .logs-filter-deck,
body.theme-light #logs .logs-table-shell,
body.theme-light #guests .crm-metric-card,
body.theme-light #guests .crm-metrics > *,
body.theme-light #guests #crmMetrics > *,
body.theme-light #guests .guest-stat,
body.theme-light #guests .guest-card .guest-card-stat,
body.theme-light #guests .guest-card [class*="stat"],
body.theme-light #guests .guest-card [class*="metric"],
body.theme-light #guests .crm-command-source,
body.theme-light #guests .crm-command-status > div,
body.theme-light #guests .crm-signal-card,
body.theme-light #guests .crm-quality-card {
  background: linear-gradient(180deg, #ffffff 0%, #f8f2e8 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #f8f2e8 100%) !important;
  border-color: rgba(18, 38, 64, 0.14) !important;
  color: #17263d !important;
  box-shadow: 0 10px 24px rgba(19,34,55,.08) !important;
  text-shadow: none !important;
}

body.theme-light .home-heatmap::before,
body.theme-light .home-heatmap::after,
body.theme-light #setup.setup-command-center .setup-metric-card::before,
body.theme-light #setup.setup-command-center .setup-metric-card::after,
body.theme-light #setup.setup-command-center .rate-matrix::before,
body.theme-light #setup.setup-command-center .rate-matrix::after,
body.theme-light #accounting .metric::before,
body.theme-light #accounting .metric::after,
body.theme-light #reports .reports-signal-card::before,
body.theme-light #reports .report-insight-card::before,
body.theme-light #logs .logs-signal-card::before,
body.theme-light #logs .log-filter-panel::before,
body.theme-light #guests .crm-metric-card::before,
body.theme-light #guests .guest-card .guest-card-stat::before,
body.theme-light #guests .guest-card [class*="stat"]::before,
body.theme-light #guests .guest-card [class*="metric"]::before {
  opacity: 0 !important;
  background: none !important;
  background-image: none !important;
}

body.theme-light .home-heatmap span,
body.theme-light .home-heatmap strong,
body.theme-light .home-heatmap small,
body.theme-light #setup.setup-command-center .setup-metric-card *,
body.theme-light #setup.setup-command-center .setup-hero-side *,
body.theme-light #setup.setup-command-center .setup-guardrail-grid > * *,
body.theme-light #setup.setup-command-center .rate-matrix *,
body.theme-light #setup.setup-command-center .rate-matrix-row *,
body.theme-light #setup.setup-command-center .weekday-picker *,
body.theme-light #frontoffice .panel *,
body.theme-light #frontoffice .reservation-tabs *,
body.theme-light #accounting .metric *,
body.theme-light #accounting .metrics > * *,
body.theme-light #accounting .refund-liability-panel *,
body.theme-light #accounting .revenue-context-summary *,
body.theme-light #accounting .cashier-summary *,
body.theme-light #reports .reports-signal-card *,
body.theme-light #reports .report-insight-card *,
body.theme-light #reports .reports-command-source *,
body.theme-light #reports .reports-command-status > div *,
body.theme-light #logs .logs-signal-card *,
body.theme-light #logs .logs-metric-card *,
body.theme-light #logs .log-filter-panel *,
body.theme-light #guests .crm-metric-card *,
body.theme-light #guests .crm-metrics > * *,
body.theme-light #guests #crmMetrics > * *,
body.theme-light #guests .guest-stat *,
body.theme-light #guests .guest-card .guest-card-stat *,
body.theme-light #guests .guest-card [class*="stat"] *,
body.theme-light #guests .guest-card [class*="metric"] * {
  color: #17263d !important;
  text-shadow: none !important;
}

body.theme-light #setup.setup-command-center .setup-metric-card span,
body.theme-light #setup.setup-command-center .setup-metric-card small,
body.theme-light #setup.setup-command-center .rate-matrix label,
body.theme-light #setup.setup-command-center .weekday-picker span,
body.theme-light #accounting .metric span,
body.theme-light #accounting .metric small,
body.theme-light #reports .reports-signal-card span,
body.theme-light #reports .reports-signal-card small,
body.theme-light #logs .logs-signal-card span,
body.theme-light #logs .logs-signal-card small,
body.theme-light #guests .crm-metric-card span,
body.theme-light #guests .crm-metric-card small,
body.theme-light #guests .guest-card [class*="stat"] span,
body.theme-light #guests .guest-card [class*="metric"] span {
  color: #657185 !important;
}

body.theme-light #setup.setup-command-center .setup-metric-card strong,
body.theme-light #setup.setup-command-center .rate-matrix strong,
body.theme-light #accounting .metric strong,
body.theme-light #reports .reports-signal-card strong,
body.theme-light #logs .logs-signal-card strong,
body.theme-light #guests .crm-metric-card strong,
body.theme-light #guests .guest-card [class*="stat"] strong,
body.theme-light #guests .guest-card [class*="metric"] strong {
  color: #071b33 !important;
}

body.theme-light #frontoffice .frontoffice-tab-panel.active,
body.theme-light #frontoffice .panel,
body.theme-light #frontoffice .reservation-tabs,
body.theme-light #frontoffice .reservation-tabs button:not(.active),
body.theme-light #frontoffice .table-wrap {
  background: linear-gradient(180deg, #ffffff 0%, #fbf4e8 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fbf4e8 100%) !important;
  color: #17263d !important;
}

body.theme-light #frontoffice .reservation-tabs button.active,
body.theme-light #frontoffice .setup-tabs button.active,
body.theme-light #accounting .setup-tabs button.active,
body.theme-light #reports .setup-tabs button.active,
body.theme-light #logs .setup-tabs button.active,
body.theme-light #guests .setup-tabs button.active {
  background: linear-gradient(135deg, #071b33, #173d64) !important;
  background-image: linear-gradient(135deg, #071b33, #173d64) !important;
  color: #ffffff !important;
}

body.theme-light #frontoffice .action-button,
body.theme-light #frontoffice .ghost-button,
body.theme-light #frontoffice button:not(.active),
body.theme-light #reports .ghost-button,
body.theme-light #logs .ghost-button,
body.theme-light #guests .ghost-button {
  background: #ffffff !important;
  background-image: none !important;
  color: #17263d !important;
  border-color: rgba(18,38,64,.16) !important;
}

body.theme-light #frontoffice .primary-button,
body.theme-light #frontoffice .action-button.primary,
body.theme-light #frontoffice button.primary,
body.theme-light #reports .primary-button,
body.theme-light #logs .primary-button,
body.theme-light #guests .primary-button {
  background: linear-gradient(135deg, #071b33, #173d64) !important;
  background-image: linear-gradient(135deg, #071b33, #173d64) !important;
  color: #ffffff !important;
}

body.theme-light #reports .report-insight-card:first-child,
body.theme-light #reports .reports-signal-card:first-child,
body.theme-light #logs .logs-signal-card:first-child {
  background: linear-gradient(180deg, #fffaf2 0%, #f5ead7 100%) !important;
  background-image: linear-gradient(180deg, #fffaf2 0%, #f5ead7 100%) !important;
}

/* CyotelOS Light Mode deep cleanup v8.1 — stubborn Ön Büro panel/tab override */
body.theme-light #frontoffice.setup-workspace .panel,
body.theme-light #frontoffice.view .panel,
body.theme-light #frontoffice .frontoffice-tab-panel.active > .panel,
body.theme-light #frontoffice .frontoffice-tab-panel.active section.panel,
body.theme-light #frontoffice.setup-workspace .reservation-tabs,
body.theme-light #frontoffice.view .reservation-tabs,
body.theme-light #frontoffice .frontoffice-tab-panel.active .reservation-tabs {
  background: linear-gradient(180deg, #ffffff 0%, #fbf4e8 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fbf4e8 100%) !important;
  background-color: #ffffff !important;
  color: #17263d !important;
  border-color: rgba(18,38,64,.14) !important;
  box-shadow: 0 10px 24px rgba(19,34,55,.08) !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace .reservation-tabs *,
body.theme-light #frontoffice.view .reservation-tabs *,
body.theme-light #frontoffice.setup-workspace .panel *,
body.theme-light #frontoffice.view .panel * {
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace .reservation-tabs button:not(.active),
body.theme-light #frontoffice.view .reservation-tabs button:not(.active) {
  background: #ffffff !important;
  background-image: none !important;
  color: #17263d !important;
  border-color: rgba(18,38,64,.16) !important;
}

body.theme-light #frontoffice.setup-workspace .reservation-tabs button.active,
body.theme-light #frontoffice.view .reservation-tabs button.active {
  background: linear-gradient(135deg, #071b33, #173d64) !important;
  background-image: linear-gradient(135deg, #071b33, #173d64) !important;
  color: #ffffff !important;
}

/* CyotelOS Light Mode deep cleanup v9.1 — exact Ön Büro reservation panel override */
body.theme-light #frontoffice.setup-workspace #foReservations > .panel,
body.theme-light #frontoffice.setup-workspace #foReservations .panel,
body.theme-light #frontoffice.setup-workspace #foReservations .reservation-tabs,
body.theme-light #frontoffice.setup-workspace #foReservations .panel-header,
body.theme-light #frontoffice.setup-workspace #foReservations .toolbar,
body.theme-light body.premium-pms #frontoffice #foReservations > .panel,
body.theme-light body.premium-pms #frontoffice #foReservations .panel,
body.theme-light body.premium-pms #frontoffice #foReservations .reservation-tabs,
body.theme-light body.premium-pms #frontoffice #foReservations .panel-header {
  background: linear-gradient(180deg, #ffffff 0%, #fbf4e8 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fbf4e8 100%) !important;
  background-color: #ffffff !important;
  color: #17263d !important;
  border-color: rgba(18,38,64,.14) !important;
  box-shadow: 0 10px 24px rgba(19,34,55,.08) !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .panel-header *,
body.theme-light #frontoffice.setup-workspace #foReservations .reservation-tabs *,
body.theme-light #frontoffice.setup-workspace #foReservations .panel * {
  color: #17263d !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .reservation-tabs button:not(.active),
body.theme-light #frontoffice.setup-workspace #foReservations .toolbar .ghost-button {
  background: #ffffff !important;
  background-image: none !important;
  color: #17263d !important;
  border-color: rgba(18,38,64,.16) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .reservation-tabs button.active,
body.theme-light #frontoffice.setup-workspace #foReservations .toolbar .primary-button {
  background: linear-gradient(135deg, #071b33, #173d64) !important;
  background-image: linear-gradient(135deg, #071b33, #173d64) !important;
  color: #ffffff !important;
}


/* CyotelOS Light Mode contrast final v11 — screenshot residue cleanup */
body.theme-light {
  --cyo-light-ink: #101828;
  --cyo-light-text: #1f2937;
  --cyo-light-muted: #475467;
  --cyo-light-soft: #667085;
  --cyo-light-surface: #fffdf8;
  --cyo-light-panel: #ffffff;
  --cyo-light-warm: #fff7ea;
  --cyo-light-line: rgba(17, 24, 39, 0.12);
}

/* Kurulum: pansiyon özetleri ve fiyat matrisi eski lacivert inputları */
body.theme-light #setup.setup-command-center .board-context-card,
body.theme-light #setup.setup-command-center .setup-metric-card,
body.theme-light #setup.setup-command-center .rate-matrix-row label,
body.theme-light #setup.setup-command-center .rate-matrix-row input,
body.theme-light #setup.setup-command-center .weekday-picker,
body.theme-light #setup.setup-command-center .table-wrap,
body.theme-light #setup.setup-command-center .rate-matrix {
  background: linear-gradient(180deg, #ffffff 0%, #fffaf1 100%) !important;
  background-image: none !important;
  color: var(--cyo-light-ink) !important;
  border-color: var(--cyo-light-line) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08) !important;
}

body.theme-light #setup.setup-command-center .board-context-card span,
body.theme-light #setup.setup-command-center .board-context-card small,
body.theme-light #setup.setup-command-center .setup-metric-card span,
body.theme-light #setup.setup-command-center .setup-metric-card small,
body.theme-light #setup.setup-command-center .rate-matrix-row label,
body.theme-light #setup.setup-command-center .rate-matrix-row label span {
  color: var(--cyo-light-muted) !important;
  opacity: 1 !important;
}

body.theme-light #setup.setup-command-center .board-context-card strong,
body.theme-light #setup.setup-command-center .setup-metric-card strong,
body.theme-light #setup.setup-command-center .rate-matrix-row > span,
body.theme-light #setup.setup-command-center .rate-matrix > strong {
  color: var(--cyo-light-ink) !important;
  opacity: 1 !important;
}

body.theme-light #setup.setup-command-center .rate-matrix-row input,
body.theme-light #setup.setup-command-center input[type="number"] {
  background: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  border: 1px solid rgba(17, 24, 39, 0.18) !important;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

body.theme-light #setup.setup-command-center .rate-matrix-row input::placeholder,
body.theme-light #setup.setup-command-center input[type="number"]::placeholder {
  color: #667085 !important;
  opacity: 1 !important;
}

/* Ön Büro: arama bandı ve günlük özet alt bar Light Mode içinde okunur */
body.theme-light #frontoffice.setup-workspace #foReservations .reservation-search,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-search-bar,
body.theme-light #frontoffice.setup-workspace #foReservations .frontoffice-search,
body.theme-light #frontoffice.setup-workspace .frontoffice-daily-bar,
body.theme-light #frontoffice.setup-workspace .frontoffice-daily-bar article {
  background: linear-gradient(180deg, #ffffff 0%, #fff8eb 100%) !important;
  background-image: none !important;
  color: var(--cyo-light-ink) !important;
  border-color: var(--cyo-light-line) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .reservation-search input,
body.theme-light #frontoffice.setup-workspace #foReservations input[type="search"] {
  background: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  border-color: rgba(17, 24, 39, 0.16) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .reservation-search input::placeholder,
body.theme-light #frontoffice.setup-workspace #foReservations input[type="search"]::placeholder,
body.theme-light #frontoffice.setup-workspace .frontoffice-daily-bar span {
  color: #475467 !important;
  opacity: 1 !important;
}

body.theme-light #frontoffice.setup-workspace .frontoffice-daily-bar strong {
  color: #0f172a !important;
}

/* Gün Sonu / Operasyon Aksiyon Listesi: uyarı kutuları artık soluk değil */
body.theme-light #endofday .eod-action-card,
body.theme-light #endofday .eod-action-card.blocker,
body.theme-light #endofday .eod-action-card.warning,
body.theme-light #endofday .eod-action-card.safe,
body.theme-light #endofday .eod-action-card.ok {
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-image: none !important;
  color: var(--cyo-light-ink) !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.09) !important;
}

body.theme-light #endofday .eod-action-card span,
body.theme-light #endofday .eod-action-card small,
body.theme-light #endofday .eod-action-card em {
  color: #334155 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #endofday .eod-action-card strong {
  color: #0f172a !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #endofday .eod-action-card em {
  background: #fff3cf !important;
  border: 1px solid rgba(217, 119, 6, 0.18) !important;
}

body.theme-light #endofday .eod-action-card.safe em {
  background: #eaf7ff !important;
  border-color: rgba(2, 132, 199, 0.18) !important;
}

/* Muhasebe: bekleyen iadeler/refund başlığı koyu blok kalmasın */
body.theme-light #accounting .refund-liability,
body.theme-light #accounting .refund-liability .panel-header,
body.theme-light #accounting .refund-liability-card,
body.theme-light #accounting .accounting-refund-panel {
  background: linear-gradient(180deg, #ffffff 0%, #fff6e8 100%) !important;
  background-image: none !important;
  color: var(--cyo-light-ink) !important;
  border-color: var(--cyo-light-line) !important;
}

body.theme-light #accounting .refund-liability span,
body.theme-light #accounting .refund-liability small,
body.theme-light #accounting .refund-liability .panel-header span {
  color: #475467 !important;
  opacity: 1 !important;
}

body.theme-light #accounting .refund-liability strong,
body.theme-light #accounting .refund-liability h3,
body.theme-light #accounting .refund-liability .panel-header h3 {
  color: #0f172a !important;
  opacity: 1 !important;
}

/* Raporlar: sağ insight kartları ve çok açık yazılar */
body.theme-light #reports .reports-insight-panel,
body.theme-light #reports .reports-insight-panel article,
body.theme-light #reports .reports-signal-card,
body.theme-light #reports .reports-command-status > div,
body.theme-light #reports .reports-safety-note {
  background: linear-gradient(180deg, #ffffff 0%, #fff7ea 100%) !important;
  background-image: none !important;
  color: var(--cyo-light-ink) !important;
  border-color: var(--cyo-light-line) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08) !important;
}

body.theme-light #reports .reports-insight-panel article strong,
body.theme-light #reports .reports-insight-panel .panel-header h3,
body.theme-light #reports .reports-signal-card strong,
body.theme-light #reports .reports-command-status strong {
  color: #0f172a !important;
  opacity: 1 !important;
}

body.theme-light #reports .reports-insight-panel article p,
body.theme-light #reports .reports-insight-panel .panel-header span,
body.theme-light #reports .reports-signal-card p,
body.theme-light #reports .reports-signal-card small,
body.theme-light #reports .reports-command-status span,
body.theme-light #reports .reports-command-status small {
  color: #475467 !important;
  opacity: 1 !important;
}

/* Log kayıtları: üst bilgi/sağ güvenlik kartları koyu kalmasın */
body.theme-light #logs .logs-hero-main,
body.theme-light #logs .logs-hero-side,
body.theme-light #logs .logs-signal-card,
body.theme-light #logs .logs-metric-card,
body.theme-light #logs .logs-table-panel,
body.theme-light #logs .logs-filter-deck,
body.theme-light #logs .log-filter-panel {
  background: linear-gradient(180deg, #ffffff 0%, #fff7ea 100%) !important;
  background-image: none !important;
  color: var(--cyo-light-ink) !important;
  border-color: var(--cyo-light-line) !important;
}

body.theme-light #logs .logs-signal-card span,
body.theme-light #logs .logs-signal-card small,
body.theme-light #logs .logs-signal-card p,
body.theme-light #logs .logs-metric-card span,
body.theme-light #logs .logs-metric-card small,
body.theme-light #logs .logs-hero-main p,
body.theme-light #logs .logs-hero-side p {
  color: #475467 !important;
  opacity: 1 !important;
}

body.theme-light #logs .logs-signal-card strong,
body.theme-light #logs .logs-metric-card strong,
body.theme-light #logs .logs-hero-main h2,
body.theme-light #logs .logs-hero-side h3 {
  color: #0f172a !important;
  opacity: 1 !important;
}

/* CRM: sekme bandı ve misafir 360 istatistik kutuları */
body.theme-light #guests .crm-command-tabs,
body.theme-light #guests .crm-tab-panel,
body.theme-light #guests .crm-guest-card,
body.theme-light #guests .guest-profile-card,
body.theme-light #guests .crm-guest-intelligence-grid article,
body.theme-light #guests .crm-command-metrics article,
body.theme-light #guests .crm-command-status > div {
  background: linear-gradient(180deg, #ffffff 0%, #fff7ea 100%) !important;
  background-image: none !important;
  color: var(--cyo-light-ink) !important;
  border-color: var(--cyo-light-line) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08) !important;
}

body.theme-light #guests .crm-command-tabs button:not(.active) {
  background: #ffffff !important;
  color: #1f2937 !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
}

body.theme-light #guests .crm-guest-card .guest-stat,
body.theme-light #guests .guest-profile-card .guest-stat,
body.theme-light #guests .crm-guest-card [class*="stat"],
body.theme-light #guests .guest-profile-card [class*="stat"] {
  background: #fff4dc !important;
  background-image: none !important;
  color: #0f172a !important;
  border-color: rgba(17, 24, 39, 0.12) !important;
}

body.theme-light #guests .crm-guest-card span,
body.theme-light #guests .crm-guest-card small,
body.theme-light #guests .guest-profile-card span,
body.theme-light #guests .guest-profile-card small,
body.theme-light #guests .crm-guest-intelligence-grid span,
body.theme-light #guests .crm-guest-intelligence-grid small,
body.theme-light #guests .crm-command-status span,
body.theme-light #guests .crm-command-status small {
  color: #475467 !important;
  opacity: 1 !important;
}

body.theme-light #guests .crm-guest-card strong,
body.theme-light #guests .guest-profile-card strong,
body.theme-light #guests .crm-guest-intelligence-grid strong,
body.theme-light #guests .crm-command-status strong {
  color: #0f172a !important;
  opacity: 1 !important;
}


/* CyotelOS Light Mode contrast final v11.1 — exact fixed bars and live DOM cards */
body.theme-light .frontoffice-daily-bar,
body.theme-light .frontoffice-daily-bar article {
  background: linear-gradient(180deg, #ffffff 0%, #fff3df 100%) !important;
  background-image: none !important;
  color: #0f172a !important;
  border-color: rgba(17, 24, 39, 0.14) !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.10) !important;
}

body.theme-light .frontoffice-daily-bar span {
  color: #475467 !important;
  opacity: 1 !important;
}

body.theme-light .frontoffice-daily-bar strong {
  color: #0f172a !important;
  opacity: 1 !important;
}

body.theme-light #accounting #pendingRefundAccountingPanel,
body.theme-light #accounting #pendingRefundAccountingPanel .section-heading,
body.theme-light #accounting #pendingRefundAccountingPanel .panel-header,
body.theme-light #accounting #pendingRefundAccountingPanel .table-wrap {
  background: linear-gradient(180deg, #ffffff 0%, #fff6e8 100%) !important;
  background-image: none !important;
  color: #0f172a !important;
  border-color: rgba(17, 24, 39, 0.12) !important;
}

body.theme-light #accounting #pendingRefundAccountingPanel span,
body.theme-light #accounting #pendingRefundAccountingPanel small,
body.theme-light #accounting #pendingRefundAccountingPanel p {
  color: #475467 !important;
  opacity: 1 !important;
}

body.theme-light #accounting #pendingRefundAccountingPanel h3,
body.theme-light #accounting #pendingRefundAccountingPanel strong {
  color: #0f172a !important;
  opacity: 1 !important;
}

body.theme-light #guests .crm-command-shell .setup-tabs,
body.theme-light #guests .crm-main .setup-tabs,
body.theme-light #guests .crm-tab-panel,
body.theme-light #guests #guestCards .card,
body.theme-light #guests #guestCards .crm-360-contact,
body.theme-light #guests #guestCards .crm-360-metrics,
body.theme-light #guests #guestCards .crm-360-badges,
body.theme-light #guests #guestCards .crm-360-whatsapp {
  background: linear-gradient(180deg, #ffffff 0%, #fff7ea 100%) !important;
  background-image: none !important;
  color: #0f172a !important;
  border-color: rgba(17, 24, 39, 0.12) !important;
}

body.theme-light #guests #guestCards .crm-360-metrics > *,
body.theme-light #guests #guestCards .crm-360-badges > *,
body.theme-light #guests #guestCards .crm-360-contact,
body.theme-light #guests #guestCards .crm-360-whatsapp {
  color: #1f2937 !important;
  opacity: 1 !important;
}

body.theme-light #guests #guestCards .crm-360-metrics strong,
body.theme-light #guests #guestCards .crm-360-metrics b,
body.theme-light #guests #guestCards .card h3,
body.theme-light #guests #guestCards .card strong {
  color: #0f172a !important;
  opacity: 1 !important;
}

body.theme-light #guests #guestCards .crm-360-metrics {
  box-shadow: inset 0 0 0 1px rgba(17, 24, 39, 0.08) !important;
}


/* CyotelOS Light Mode contrast final v12.1 — exact frontofficeDailyBar ID override */
body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar,
body.theme-light #frontoffice #frontofficeDailyBar.frontoffice-daily-bar,
body.theme-light #frontofficeDailyBar.frontoffice-daily-bar {
  background: linear-gradient(180deg, #ffffff 0%, #fff3df 100%) !important;
  background-image: none !important;
  color: #0f172a !important;
  border-color: rgba(17, 24, 39, 0.14) !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.10) !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar article,
body.theme-light #frontoffice #frontofficeDailyBar.frontoffice-daily-bar article,
body.theme-light #frontofficeDailyBar.frontoffice-daily-bar article {
  background: linear-gradient(180deg, #ffffff 0%, #fff7ea 100%) !important;
  background-image: none !important;
  color: #0f172a !important;
  border-color: rgba(17, 24, 39, 0.12) !important;
}

body.theme-light #frontofficeDailyBar.frontoffice-daily-bar span {
  color: #475467 !important;
  opacity: 1 !important;
}

body.theme-light #frontofficeDailyBar.frontoffice-daily-bar strong {
  color: #0f172a !important;
  opacity: 1 !important;
}


/* CyotelOS Light Mode v14 — Ön Büro white shell and readable fixed daily bar */
body.theme-light #frontoffice,
body.theme-light #frontoffice.setup-workspace,
body.theme-light #frontoffice.view.active,
body.theme-light #frontoffice .setup-workspace,
body.theme-light #frontoffice .setup-command-center,
body.theme-light #frontoffice #foReservations,
body.theme-light #frontoffice.setup-workspace #foReservations,
body.theme-light #frontoffice #foReservations.active {
  background: linear-gradient(180deg, #fffaf1 0%, #f8efe1 100%) !important;
  background-image: linear-gradient(180deg, #fffaf1 0%, #f8efe1 100%) !important;
  color: #101828 !important;
  border-color: rgba(17, 24, 39, 0.10) !important;
}

body.theme-light #frontoffice::before,
body.theme-light #frontoffice::after,
body.theme-light #frontoffice #foReservations::before,
body.theme-light #frontoffice #foReservations::after,
body.theme-light #frontoffice .panel::before,
body.theme-light #frontoffice .panel::after,
body.theme-light #frontoffice .table-wrap::before,
body.theme-light #frontoffice .table-wrap::after {
  background: transparent !important;
  background-image: none !important;
  opacity: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .panel,
body.theme-light #frontoffice #foReservations .panel,
body.theme-light #frontoffice.setup-workspace #foReservations .table-wrap,
body.theme-light #frontoffice #foReservations .table-wrap,
body.theme-light #frontoffice.setup-workspace #foReservations table,
body.theme-light #frontoffice #foReservations table {
  background: #ffffff !important;
  background-image: none !important;
  color: #111827 !important;
  border-color: rgba(17, 24, 39, 0.10) !important;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.08) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .frontoffice-filters,
body.theme-light #frontoffice.setup-workspace #foReservations .reservation-search,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-search-bar,
body.theme-light #frontoffice.setup-workspace #foReservations .toolbar,
body.theme-light #frontoffice.setup-workspace #foReservations .reservation-tabs,
body.theme-light #frontoffice #foReservations .frontoffice-filters,
body.theme-light #frontoffice #foReservations .reservation-search,
body.theme-light #frontoffice #foReservations .premium-search-bar,
body.theme-light #frontoffice #foReservations .toolbar,
body.theme-light #frontoffice #foReservations .reservation-tabs {
  background: #fff7ea !important;
  background-image: none !important;
  color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.10) !important;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .frontoffice-filters input,
body.theme-light #frontoffice #foReservations .frontoffice-filters input,
body.theme-light #frontoffice #foReservations input[type="search"] {
  background: #ffffff !important;
  background-image: none !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  border-color: rgba(17, 24, 39, 0.18) !important;
}

body.theme-light #frontoffice #foReservations input[type="search"]::placeholder,
body.theme-light #frontoffice #foReservations .frontoffice-filters input::placeholder {
  color: #475467 !important;
  opacity: 1 !important;
}

body.theme-light #frontoffice #foReservations thead,
body.theme-light #frontoffice #foReservations thead tr,
body.theme-light #frontoffice #foReservations thead th {
  background: #fff4df !important;
  background-image: none !important;
  color: #1f2937 !important;
  border-color: rgba(17, 24, 39, 0.10) !important;
}

body.theme-light #frontoffice #foReservations tbody,
body.theme-light #frontoffice #foReservations tbody tr,
body.theme-light #frontoffice #foReservations tbody td {
  color: #1f2937 !important;
  background-image: none !important;
}

body.theme-light #frontoffice #foReservations tbody tr:nth-child(even):not(.selected-row) td {
  background-color: #fffaf1 !important;
}

body.theme-light #frontoffice #foReservations tbody tr:hover td,
body.theme-light #frontoffice #foReservations tbody tr:hover {
  background-color: #fff1d6 !important;
  color: #0f172a !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar,
body.theme-light #frontoffice #frontofficeDailyBar.frontoffice-daily-bar,
body.theme-light #frontofficeDailyBar.frontoffice-daily-bar,
body.theme-light .frontoffice-daily-bar#frontofficeDailyBar {
  background: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  color: #0f172a !important;
  border: 1px solid rgba(17, 24, 39, 0.14) !important;
  box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.12) !important;
  backdrop-filter: blur(10px) !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar article,
body.theme-light #frontoffice #frontofficeDailyBar.frontoffice-daily-bar article,
body.theme-light #frontofficeDailyBar.frontoffice-daily-bar article,
body.theme-light .frontoffice-daily-bar#frontofficeDailyBar article {
  background: #ffffff !important;
  background-image: none !important;
  color: #0f172a !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  box-shadow: inset 0 0 0 1px rgba(17, 24, 39, 0.03) !important;
}

body.theme-light #frontofficeDailyBar.frontoffice-daily-bar article:hover,
body.theme-light .frontoffice-daily-bar#frontofficeDailyBar article:hover {
  background: #fff4df !important;
  background-image: none !important;
  color: #0f172a !important;
  border-color: rgba(180, 127, 43, 0.28) !important;
}

body.theme-light #frontofficeDailyBar.frontoffice-daily-bar span,
body.theme-light .frontoffice-daily-bar#frontofficeDailyBar span,
body.theme-light #frontofficeDailyBar.frontoffice-daily-bar article:hover span,
body.theme-light .frontoffice-daily-bar#frontofficeDailyBar article:hover span {
  color: #475467 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #frontofficeDailyBar.frontoffice-daily-bar strong,
body.theme-light .frontoffice-daily-bar#frontofficeDailyBar strong,
body.theme-light #frontofficeDailyBar.frontoffice-daily-bar article:hover strong,
body.theme-light .frontoffice-daily-bar#frontofficeDailyBar article:hover strong {
  color: #0f172a !important;
  opacity: 1 !important;
  text-shadow: none !important;
}


/* CyotelOS Light Mode v15 — Ön Büro daily bar exact text contrast */
body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar.frontoffice-daily-bar article span,
body.theme-light #frontoffice #frontofficeDailyBar.frontoffice-daily-bar article span,
body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar article span,
body.theme-light #frontoffice #frontofficeDailyBar article span,
body.theme-light body.premium-pms #frontoffice #frontofficeDailyBar.frontoffice-daily-bar article span {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar.frontoffice-daily-bar article strong,
body.theme-light #frontoffice #frontofficeDailyBar.frontoffice-daily-bar article strong,
body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar article strong,
body.theme-light #frontoffice #frontofficeDailyBar article strong,
body.theme-light body.premium-pms #frontoffice #frontofficeDailyBar.frontoffice-daily-bar article strong {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar.frontoffice-daily-bar article:hover span,
body.theme-light #frontoffice #frontofficeDailyBar.frontoffice-daily-bar article:hover span,
body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar article:hover span,
body.theme-light #frontoffice #frontofficeDailyBar article:hover span {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar.frontoffice-daily-bar article:hover strong,
body.theme-light #frontoffice #frontofficeDailyBar.frontoffice-daily-bar article:hover strong,
body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar article:hover strong,
body.theme-light #frontoffice #frontofficeDailyBar article:hover strong {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}


/* CyotelOS Light Mode v16 — Web Onay readable cards */
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-summary,
body.theme-light #frontoffice #foReservations .premium-web-review-summary,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-grid,
body.theme-light #frontoffice #foReservations .premium-web-review-grid {
  background: transparent !important;
  background-image: none !important;
  color: #101828 !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-hero,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-info,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-card,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-empty,
body.theme-light #frontoffice #foReservations .premium-web-review-hero,
body.theme-light #frontoffice #foReservations .premium-web-review-info,
body.theme-light #frontoffice #foReservations .premium-web-review-card,
body.theme-light #frontoffice #foReservations .premium-web-review-empty {
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.09) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-hero::before,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-hero::after,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-info::before,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-info::after,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-card::before,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-card::after,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-empty::before,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-empty::after,
body.theme-light #frontoffice #foReservations .premium-web-review-hero::before,
body.theme-light #frontoffice #foReservations .premium-web-review-hero::after,
body.theme-light #frontoffice #foReservations .premium-web-review-info::before,
body.theme-light #frontoffice #foReservations .premium-web-review-info::after,
body.theme-light #frontoffice #foReservations .premium-web-review-card::before,
body.theme-light #frontoffice #foReservations .premium-web-review-card::after,
body.theme-light #frontoffice #foReservations .premium-web-review-empty::before,
body.theme-light #frontoffice #foReservations .premium-web-review-empty::after {
  background: transparent !important;
  background-image: none !important;
  opacity: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-hero strong,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-info strong,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-card strong,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-empty strong,
body.theme-light #frontoffice #foReservations .premium-web-review-hero strong,
body.theme-light #frontoffice #foReservations .premium-web-review-info strong,
body.theme-light #frontoffice #foReservations .premium-web-review-card strong,
body.theme-light #frontoffice #foReservations .premium-web-review-empty strong,
body.theme-light #frontoffice #foReservations .premium-web-review-card-head strong,
body.theme-light #frontoffice #foReservations .premium-web-review-kv strong {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-hero small,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-info small,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-card small,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-empty small,
body.theme-light #frontoffice #foReservations .premium-web-review-hero small,
body.theme-light #frontoffice #foReservations .premium-web-review-info small,
body.theme-light #frontoffice #foReservations .premium-web-review-card small,
body.theme-light #frontoffice #foReservations .premium-web-review-empty small,
body.theme-light #frontoffice #foReservations .premium-web-review-card-head small,
body.theme-light #frontoffice #foReservations .premium-web-review-kv small {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-empty,
body.theme-light #frontoffice #foReservations .premium-web-review-empty {
  min-height: 136px !important;
  place-items: center !important;
  text-align: center !important;
  background: linear-gradient(180deg, #ffffff 0%, #fff6e5 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff6e5 100%) !important;
}

body.theme-light #frontoffice #foReservations .premium-web-review-warning.warn {
  background: #fff5dd !important;
  background-image: none !important;
  color: #7a5415 !important;
  border-color: rgba(184, 138, 68, 0.22) !important;
}

body.theme-light #frontoffice #foReservations .premium-web-review-warning.ready {
  background: #eaf7f1 !important;
  background-image: none !important;
  color: #10764b !important;
  border-color: rgba(16, 118, 75, 0.18) !important;
}


/* CyotelOS Rezervasyon Kartı v1 — Premium Light/Dark Modal Redesign */
.reservation-dialog {
  width: min(1400px, calc(100vw - 20px)) !important;
  max-height: calc(100vh - 18px);
  padding: 0 !important;
  border-radius: 24px !important;
  overflow: hidden;
  background: transparent !important;
}

.reservation-card-form {
  position: relative;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto auto;
  width: 100%;
  max-height: calc(100vh - 18px) !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 24px !important;
  background: #fffdf8 !important;
  box-shadow: 0 30px 80px rgba(7, 27, 51, 0.28) !important;
}

.reservation-redesign-header {
  display: grid !important;
  grid-template-columns: minmax(170px, 1.1fr) auto minmax(260px, 1.3fr) auto auto;
  gap: 18px;
  align-items: center;
  min-height: 82px;
  margin: 0 !important;
  padding: 14px 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(135deg, #071d38 0%, #0b2c54 100%) !important;
  color: #ffffff !important;
}

.reservation-title-block h3 {
  margin: 0;
  color: #ffffff !important;
  font-size: 26px;
  line-height: 1.02;
  letter-spacing: -0.04em;
}

.reservation-title-block span,
.reservation-header-summary small {
  color: rgba(255, 255, 255, 0.84) !important;
  font-size: 12px;
  font-weight: 900;
}

.reservation-header-chips,
.reservation-header-badges {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.reservation-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 18px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 950;
  white-space: nowrap;
}

.reservation-chip-muted {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.14) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
}

.reservation-chip-gold {
  color: #10213b !important;
  background: linear-gradient(180deg, #fff0bd 0%, #e2bb5d 100%) !important;
  border: 1px solid rgba(255, 236, 169, 0.85) !important;
}

.reservation-chip-night {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.16) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
}

.reservation-header-summary {
  display: grid;
  justify-items: end;
  gap: 2px;
  min-width: 0;
  text-align: right;
}

.reservation-header-summary strong {
  color: #ffffff !important;
  font-size: 16px;
  font-weight: 950;
}

.reservation-card-form .reservation-header-actions .icon-button {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: #ffffff !important;
  color: #071d38 !important;
  font-size: 24px;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.18);
}

.reservation-card-shell {
  min-height: 0;
  padding: 18px 12px 0;
  background: linear-gradient(180deg, #fff8e8 0%, #fffdf8 42%, #f8fbff 100%);
  overflow: auto;
}

.reservation-card-topbar {
  margin: 0 0 18px;
  padding: 10px 14px;
  border: 1px solid rgba(213, 187, 126, 0.34);
  border-radius: 22px;
  background: rgba(255, 250, 239, 0.86);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 12px 30px rgba(7, 27, 51, 0.06);
}

.reservation-card-tablist {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(140px, 1fr));
  gap: 14px !important;
}

.reservation-card-tablist button {
  display: grid;
  justify-items: start;
  min-height: 54px !important;
  padding: 12px 18px !important;
  border: 1px solid rgba(203, 213, 225, 0.78) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,0.88) !important;
  color: #15243a !important;
  box-shadow: 0 8px 18px rgba(7, 27, 51, 0.05) !important;
}

.reservation-card-tablist button span {
  font-size: 15px;
  font-weight: 950;
}

.reservation-card-tablist button small {
  color: #6a7486 !important;
  font-size: 11px;
  font-weight: 900;
}

.reservation-card-tablist button.active {
  border-color: rgba(188, 132, 28, 0.38) !important;
  background: linear-gradient(135deg, #f5d789 0%, #d6a83c 100%) !important;
  color: #14223a !important;
  box-shadow: 0 12px 26px rgba(188, 132, 28, 0.20) !important;
}

.reservation-card-workspace {
  min-height: 0;
}

.reservation-card-panel {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.reservation-main-panel {
  border-radius: 22px !important;
  background: #ffffff !important;
  box-shadow: 0 22px 42px rgba(7, 27, 51, 0.10) !important;
}

.reservation-panel-heading {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: end;
  padding: 20px 28px 16px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.92);
}

.reservation-panel-heading span,
.reservation-summary-label,
.reservation-operation-card p,
.reservation-record-meta strong,
.reservation-quick-note strong,
.reservation-grid-section {
  color: #6b7280 !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.reservation-panel-heading h4 {
  margin: 0;
  color: #0c1b32 !important;
  font-size: 26px;
  line-height: 1;
  letter-spacing: -0.05em;
}

.reservation-panel-heading small {
  color: #6b7280 !important;
  font-size: 12px;
  font-weight: 900;
}

.reservation-redesign-layout {
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr) 210px;
  gap: 22px;
  align-items: stretch;
  padding: 22px 28px 28px;
}

.reservation-stay-summary,
.reservation-operation-card,
.reservation-record-meta,
.reservation-quick-note {
  border: 1px solid rgba(218, 202, 164, 0.58) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #fbf7ee 0%, #f5efe4 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 12px 26px rgba(7, 27, 51, 0.06) !important;
}

.reservation-stay-summary {
  display: grid;
  gap: 14px;
  align-content: start;
  padding: 18px;
}

.reservation-summary-guest {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(218, 202, 164, 0.58);
}

.reservation-summary-avatar {
  display: grid;
  place-items: center;
  width: 50px;
  height: 50px;
  border-radius: 999px;
  color: #ffffff !important;
  background: #082344 !important;
  font-size: 16px;
  font-weight: 950;
}

.reservation-summary-guest strong,
.reservation-summary-card strong {
  color: #10213b !important;
  font-size: 16px;
  font-weight: 950;
}

.reservation-summary-guest small,
.reservation-summary-card small,
.reservation-operation-card small,
.reservation-quick-note span,
.reservation-record-meta span {
  color: #6b7280 !important;
  font-size: 12px;
  font-weight: 850;
}

.reservation-summary-card {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 12px;
  background: #ffffff;
}

.reservation-summary-warning {
  padding: 12px 14px;
  border: 1px solid rgba(220, 168, 45, 0.40);
  border-radius: 12px;
  background: #fff7da;
  color: #8a5b00 !important;
  font-size: 13px;
  font-weight: 950;
}

.reservation-summary-warning.is-clean {
  border-color: rgba(16, 185, 129, 0.28);
  background: #ecfdf5;
  color: #047857 !important;
}

.reservation-main-fields {
  min-width: 0;
}

.reservation-card-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(120px, 1fr)) !important;
  gap: 12px 14px !important;
  margin: 0 !important;
}

.reservation-card-grid label {
  display: grid !important;
  gap: 6px !important;
  min-width: 0;
  min-height: 66px;
  padding: 10px 13px !important;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 12px;
  background: #ffffff;
  color: #697386 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

.reservation-card-grid input,
.reservation-card-grid select,
.reservation-card-grid textarea,
.reservation-card-form .room-picker-button {
  min-height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #101c31 !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  box-shadow: none !important;
}

.reservation-card-grid input:focus,
.reservation-card-grid select:focus,
.reservation-card-grid textarea:focus {
  outline: 2px solid rgba(214, 168, 60, 0.28);
  outline-offset: 6px;
}

.reservation-grid-section {
  grid-column: 1 / -1;
  min-height: auto;
  padding: 2px 0 0;
  background: transparent;
}

.field-voucher,
.field-roomtype {
  grid-column: span 2;
}

.reservation-hidden-room-field {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}

.reservation-operation-card {
  align-self: end;
  display: grid;
  gap: 12px;
  padding: 18px;
  background: linear-gradient(180deg, #f5f8fc 0%, #eef4fb 100%) !important;
}

.reservation-lock-toggle {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 !important;
  min-height: auto !important;
  border: 0 !important;
  background: transparent !important;
  color: #10213b !important;
  font-size: 14px !important;
  font-weight: 950 !important;
}

.reservation-lock-toggle input {
  width: 42px !important;
  height: 24px !important;
  appearance: none;
  border-radius: 999px !important;
  background: #cbd5e1 !important;
  position: relative;
  cursor: pointer;
}

.reservation-lock-toggle input::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #ffffff;
  transition: transform 0.18s ease;
}

.reservation-lock-toggle input:checked {
  background: #082344 !important;
}

.reservation-lock-toggle input:checked::after {
  transform: translateX(18px);
}

.reservation-operation-card .ghost-button,
.reservation-card-actions .secondary-button {
  border: 1px solid rgba(214, 168, 60, 0.34) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  color: #10213b !important;
  font-weight: 950 !important;
}

.reservation-card-bottom-info {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr);
  gap: 16px;
  padding: 18px 28px;
  background: #fffdf8;
}

.reservation-record-meta,
.reservation-quick-note {
  display: grid !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 12px 18px !important;
}

.reservation-record-meta div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
}

.reservation-card-actions {
  position: sticky !important;
  bottom: 0;
  display: flex !important;
  align-items: center;
  gap: 10px;
  margin: 0 !important;
  padding: 12px 14px !important;
  border-top: 1px solid rgba(218, 202, 164, 0.38);
  background: #fff8e8 !important;
}

.reservation-command-note {
  margin-right: auto;
  color: #6b7280;
  font-size: 12px;
  font-weight: 850;
}

.reservation-card-actions button {
  min-width: 92px;
  min-height: 40px !important;
  border-radius: 14px !important;
  font-weight: 950 !important;
}

.reservation-card-actions .primary-button {
  background: #082344 !important;
  color: #ffffff !important;
}

.reservation-card-actions .secondary-button {
  background: linear-gradient(180deg, #fff0bd 0%, #e2bb5d 100%) !important;
}

body.theme-dark .reservation-card-form {
  background: #07111f !important;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.55) !important;
}

body.theme-dark .reservation-card-shell {
  background: linear-gradient(180deg, #081426 0%, #0b1525 48%, #07111f 100%) !important;
}

body.theme-dark .reservation-card-topbar {
  border-color: rgba(215, 181, 110, 0.20) !important;
  background: rgba(255, 255, 255, 0.045) !important;
}

body.theme-dark .reservation-card-tablist button,
body.theme-dark .reservation-main-panel,
body.theme-dark .reservation-card-grid label,
body.theme-dark .reservation-summary-card {
  border-color: rgba(215, 181, 110, 0.14) !important;
  background: rgba(255, 255, 255, 0.055) !important;
  color: #f8e6b7 !important;
}

body.theme-dark .reservation-card-tablist button.active {
  background: linear-gradient(135deg, #d7b56e 0%, #9f7936 100%) !important;
  color: #081426 !important;
}

body.theme-dark .reservation-card-tablist button small,
body.theme-dark .reservation-panel-heading small,
body.theme-dark .reservation-summary-guest small,
body.theme-dark .reservation-summary-card small,
body.theme-dark .reservation-operation-card small,
body.theme-dark .reservation-quick-note span,
body.theme-dark .reservation-record-meta span,
body.theme-dark .reservation-command-note {
  color: rgba(248, 230, 183, 0.72) !important;
}

body.theme-dark .reservation-panel-heading h4,
body.theme-dark .reservation-summary-guest strong,
body.theme-dark .reservation-summary-card strong,
body.theme-dark .reservation-card-grid input,
body.theme-dark .reservation-card-grid select,
body.theme-dark .reservation-card-grid textarea,
body.theme-dark .reservation-lock-toggle {
  color: #fff7e8 !important;
  -webkit-text-fill-color: #fff7e8 !important;
}

body.theme-dark .reservation-stay-summary,
body.theme-dark .reservation-operation-card,
body.theme-dark .reservation-record-meta,
body.theme-dark .reservation-quick-note {
  border-color: rgba(215, 181, 110, 0.18) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 18px 30px rgba(0,0,0,0.24) !important;
}

body.theme-dark .reservation-summary-avatar,
body.theme-dark .reservation-card-actions .primary-button {
  background: linear-gradient(135deg, #d7b56e 0%, #9f7936 100%) !important;
  color: #081426 !important;
  -webkit-text-fill-color: #081426 !important;
}

body.theme-dark .reservation-summary-warning {
  border-color: rgba(215, 181, 110, 0.30) !important;
  background: rgba(215, 181, 110, 0.12) !important;
  color: #f6d8a8 !important;
}

body.theme-dark .reservation-card-bottom-info,
body.theme-dark .reservation-card-actions {
  background: #081426 !important;
  border-color: rgba(215, 181, 110, 0.16) !important;
}

body.theme-dark .reservation-operation-card .ghost-button,
body.theme-dark .reservation-card-actions .ghost-button,
body.theme-dark .reservation-card-actions .secondary-button {
  border-color: rgba(215, 181, 110, 0.24) !important;
  background: rgba(255, 255, 255, 0.07) !important;
  color: #fff7e8 !important;
}

body.theme-dark .reservation-card-actions .secondary-button {
  background: linear-gradient(180deg, #d7b56e 0%, #9f7936 100%) !important;
  color: #081426 !important;
  -webkit-text-fill-color: #081426 !important;
}

@media (max-width: 1180px) {
  .reservation-redesign-header,
  .reservation-redesign-layout,
  .reservation-card-bottom-info {
    grid-template-columns: 1fr !important;
  }

  .reservation-header-summary {
    justify-items: start;
    text-align: left;
  }

  .reservation-card-tablist,
  .reservation-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* CyotelOS Web Onay v18 — Premium Light/Dark Card System */
#frontoffice #foReservations .premium-web-review-grid {
  grid-template-columns: repeat(3, minmax(280px, 1fr));
  gap: 22px;
  align-items: stretch;
}

#frontoffice #foReservations .premium-web-review-card-system {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 520px;
  align-content: start;
  gap: 18px;
  padding: 22px;
  border-radius: 28px;
}

#frontoffice #foReservations .premium-web-review-card-system::before {
  content: "";
  position: absolute;
  inset: 30px auto 0 0;
  z-index: -1;
  width: 5px;
  background: linear-gradient(180deg, #d8a44d 0%, #f4d68f 100%);
  border-radius: 999px;
}

#frontoffice #foReservations .premium-web-review-card-topline {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  min-height: 38px;
  gap: 12px;
}

#frontoffice #foReservations .premium-web-review-status-chip,
#frontoffice #foReservations .premium-web-review-soft-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 8px 16px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

#frontoffice #foReservations .premium-web-review-status-chip {
  color: #ffffff;
  background: linear-gradient(135deg, #0b1b36 0%, #11294d 100%);
  box-shadow: 0 14px 28px rgba(11, 27, 54, 0.18);
}

#frontoffice #foReservations .premium-web-review-soft-chip {
  color: #7b5b19;
  border: 1px solid rgba(199, 158, 76, 0.34);
  background: linear-gradient(180deg, #fff7dc 0%, #f8ebc7 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

#frontoffice #foReservations .premium-web-review-sequence {
  display: none !important;
}

#frontoffice #foReservations .premium-web-review-guest-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  margin-top: -2px;
}

#frontoffice #foReservations .premium-web-review-avatar,
#frontoffice #foReservations .premium-web-review-mini-icon,
#frontoffice #foReservations .premium-web-review-room-icon,
#frontoffice #foReservations .premium-web-review-metrics i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: #9c732e;
  background: linear-gradient(180deg, #fff9e8 0%, #f2e4c7 100%);
  border: 1px solid rgba(156, 115, 46, 0.20);
}

#frontoffice #foReservations .premium-web-review-avatar {
  width: 42px;
  height: 42px;
  color: #7b5b19;
  -webkit-text-fill-color: #7b5b19;
  font-size: 13px;
  font-weight: 950;
  background: radial-gradient(circle at 32% 24%, #fffaf0 0%, #f7e8bf 46%, #e1bf70 100%);
  border-color: rgba(202, 165, 88, 0.42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 10px 18px rgba(139, 108, 51, 0.14);
}

#frontoffice #foReservations .premium-web-review-identity {
  display: grid;
  min-width: 0;
  gap: 4px;
}

#frontoffice #foReservations .premium-web-review-identity strong {
  font-size: 22px;
  line-height: 1.02;
  letter-spacing: -0.05em;
}

#frontoffice #foReservations .premium-web-review-identity small {
  overflow: hidden;
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
}

#frontoffice #foReservations .premium-web-review-date-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(16, 24, 39, 0.08);
}

#frontoffice #foReservations .premium-web-review-mini-icon {
  width: 28px;
  height: 28px;
  font-size: 14px;
}

#frontoffice #foReservations .premium-web-review-date-row strong {
  min-width: 0;
  font-size: 15px;
  line-height: 1.12;
}

#frontoffice #foReservations .premium-web-review-date-row em {
  color: #7b5b19;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}

#frontoffice #foReservations .premium-web-review-room-card {
  position: relative;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  grid-template-areas: "icon label" "icon value";
  gap: 4px 14px;
  align-items: center;
  padding: 18px;
  border-radius: 18px;
}

#frontoffice #foReservations .premium-web-review-room-icon {
  grid-area: icon;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  font-size: 22px;
}

#frontoffice #foReservations .premium-web-review-room-card small {
  grid-area: label;
  font-size: 11px;
  font-weight: 800;
}

#frontoffice #foReservations .premium-web-review-room-card strong {
  grid-area: value;
  min-width: 0;
  font-size: 18px;
  line-height: 1.08;
  overflow-wrap: anywhere;
}

#frontoffice #foReservations .premium-web-review-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

#frontoffice #foReservations .premium-web-review-metrics span {
  position: relative;
  min-height: 76px;
  padding: 14px 44px 13px 14px;
  border-radius: 16px;
}

#frontoffice #foReservations .premium-web-review-metrics i {
  position: absolute;
  right: 12px;
  top: 50%;
  width: 30px;
  height: 30px;
  transform: translateY(-50%);
  font-size: 18px;
  font-style: normal;
}

#frontoffice #foReservations .premium-web-review-warning {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 2px 10px;
  min-height: 64px;
  padding: 13px 14px;
  border-radius: 16px;
}

#frontoffice #foReservations .premium-web-review-warning span {
  grid-row: 1 / span 2;
  align-self: center;
  color: currentColor;
  font-size: 20px;
}

#frontoffice #foReservations .premium-web-review-warning b,
#frontoffice #foReservations .premium-web-review-warning strong {
  min-width: 0;
  line-height: 1.18;
}

#frontoffice #foReservations .premium-web-review-warning b {
  font-size: 12px;
  font-weight: 950;
}

#frontoffice #foReservations .premium-web-review-warning strong {
  font-size: 13px;
  font-weight: 850;
}

#frontoffice #foReservations .premium-web-review-actions {
  gap: 12px;
  margin-top: auto;
}

#frontoffice #foReservations .premium-web-review-actions .primary-button,
#frontoffice #foReservations .premium-web-review-actions .ghost-button {
  min-height: 48px;
  border-radius: 16px;
  font-size: 14px;
  font-weight: 950;
}

body.theme-light #frontoffice #foReservations .premium-web-review-card-system {
  background:
    radial-gradient(circle at 92% 5%, rgba(221, 190, 123, 0.18) 0 82px, transparent 84px),
    linear-gradient(180deg, #fffdf8 0%, #fbf7ee 100%) !important;
  border-color: rgba(32, 35, 44, 0.10) !important;
  color: #081225 !important;
  box-shadow: 0 28px 54px rgba(73, 58, 32, 0.15) !important;
}

body.theme-light #frontoffice #foReservations .premium-web-review-room-card,
body.theme-light #frontoffice #foReservations .premium-web-review-metrics span {
  background: rgba(255, 255, 255, 0.90) !important;
  border: 1px solid rgba(122, 90, 42, 0.12) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94), 0 14px 24px rgba(47, 38, 20, 0.07) !important;
}

body.theme-light #frontoffice #foReservations .premium-web-review-identity strong,
body.theme-light #frontoffice #foReservations .premium-web-review-date-row strong,
body.theme-light #frontoffice #foReservations .premium-web-review-room-card strong,
body.theme-light #frontoffice #foReservations .premium-web-review-metrics strong {
  color: #071126 !important;
  -webkit-text-fill-color: #071126 !important;
}

body.theme-light #frontoffice #foReservations .premium-web-review-identity small,
body.theme-light #frontoffice #foReservations .premium-web-review-room-card small,
body.theme-light #frontoffice #foReservations .premium-web-review-metrics small {
  color: #6a7180 !important;
  -webkit-text-fill-color: #6a7180 !important;
}

body.theme-light #frontoffice #foReservations .premium-web-review-warning.warn {
  background: #fff4d2 !important;
  border-color: rgba(198, 150, 55, 0.24) !important;
  color: #7a5415 !important;
}

body.theme-light #frontoffice #foReservations .premium-web-review-warning.ready {
  background: #edf8f2 !important;
  border-color: rgba(16, 118, 75, 0.18) !important;
  color: #10764b !important;
}

body.theme-light #frontoffice #foReservations .premium-web-review-actions .ghost-button {
  color: #0b1224 !important;
  background: #ffffff !important;
  border-color: rgba(12, 20, 36, 0.10) !important;
}

body.theme-light #frontoffice #foReservations .premium-web-review-actions .primary-button {
  color: #ffffff !important;
  background: linear-gradient(135deg, #081a35 0%, #102746 100%) !important;
  box-shadow: 0 14px 26px rgba(8, 26, 53, 0.20) !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-card-system {
  background:
    radial-gradient(circle at 92% 4%, rgba(214, 177, 105, 0.15) 0 86px, transparent 88px),
    linear-gradient(180deg, rgba(16, 25, 43, 0.98) 0%, rgba(9, 16, 30, 0.98) 100%) !important;
  border-color: rgba(215, 181, 110, 0.18) !important;
  color: #f8eddc !important;
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.34) !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-card-system::before {
  background: linear-gradient(180deg, #d7b56e 0%, rgba(215, 181, 110, 0.34) 100%);
}

body.theme-dark #frontoffice #foReservations .premium-web-review-status-chip {
  color: #09101f !important;
  background: linear-gradient(135deg, #f8e6b7 0%, #d7b56e 100%) !important;
  box-shadow: 0 14px 28px rgba(215, 181, 110, 0.16) !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-soft-chip {
  color: #f8e6b7 !important;
  border-color: rgba(215, 181, 110, 0.28) !important;
  background: rgba(215, 181, 110, 0.10) !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-sequence {
  display: none !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-avatar {
  color: #08101e !important;
  -webkit-text-fill-color: #08101e !important;
  background: radial-gradient(circle at 35% 25%, #f2ddb0 0%, #b8914f 78%) !important;
  border-color: rgba(248, 230, 183, 0.36) !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-room-card,
body.theme-dark #frontoffice #foReservations .premium-web-review-metrics span {
  background: rgba(255, 255, 255, 0.055) !important;
  border: 1px solid rgba(215, 181, 110, 0.16) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 16px 24px rgba(0, 0, 0, 0.12) !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-identity strong,
body.theme-dark #frontoffice #foReservations .premium-web-review-date-row strong,
body.theme-dark #frontoffice #foReservations .premium-web-review-room-card strong,
body.theme-dark #frontoffice #foReservations .premium-web-review-metrics strong {
  color: #fff7e8 !important;
  -webkit-text-fill-color: #fff7e8 !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-identity small,
body.theme-dark #frontoffice #foReservations .premium-web-review-room-card small,
body.theme-dark #frontoffice #foReservations .premium-web-review-metrics small {
  color: #aebbd0 !important;
  -webkit-text-fill-color: #aebbd0 !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-date-row {
  border-bottom-color: rgba(215, 181, 110, 0.14) !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-date-row em {
  color: #f3dca7 !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-mini-icon,
body.theme-dark #frontoffice #foReservations .premium-web-review-room-icon,
body.theme-dark #frontoffice #foReservations .premium-web-review-metrics i {
  color: #f3dca7 !important;
  background: rgba(215, 181, 110, 0.11) !important;
  border-color: rgba(215, 181, 110, 0.22) !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-warning.warn {
  background: rgba(215, 181, 110, 0.14) !important;
  border-color: rgba(215, 181, 110, 0.28) !important;
  color: #f6d892 !important;
  -webkit-text-fill-color: #f6d892 !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-warning.warn b,
body.theme-dark #frontoffice #foReservations .premium-web-review-warning.warn strong,
body.theme-dark #frontoffice #foReservations .premium-web-review-warning.warn span {
  color: #f6d892 !important;
  -webkit-text-fill-color: #f6d892 !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-warning.ready {
  background: rgba(61, 194, 132, 0.12) !important;
  border-color: rgba(61, 194, 132, 0.24) !important;
  color: #9cf0bf !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-actions .ghost-button {
  color: #fff7e8 !important;
  background: rgba(255, 255, 255, 0.065) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-actions .primary-button {
  color: #09101f !important;
  background: linear-gradient(135deg, #f6dfaa 0%, #d5ac61 100%) !important;
  box-shadow: 0 16px 28px rgba(215, 181, 110, 0.18) !important;
}

@media (max-width: 1180px) {
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: repeat(2, minmax(280px, 1fr));
  }
}

@media (max-width: 760px) {
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: 1fr;
  }

  #frontoffice #foReservations .premium-web-review-metrics {
    grid-template-columns: 1fr;
  }
}

/* CyotelOS Web Onay v19 — card readability tightening */
#frontoffice #foReservations .premium-web-review-status-chip {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

#frontoffice #foReservations .premium-web-review-soft-chip {
  -webkit-text-fill-color: currentColor !important;
}

#frontoffice #foReservations .premium-web-review-card-system {
  min-height: 500px;
  gap: 16px;
  padding: 20px;
}

#frontoffice #foReservations .premium-web-review-identity strong {
  font-size: 21px;
}

#frontoffice #foReservations .premium-web-review-date-row {
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 8px;
}

#frontoffice #foReservations .premium-web-review-date-row strong {
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#frontoffice #foReservations .premium-web-review-date-row em {
  font-size: 11px;
}

#frontoffice #foReservations .premium-web-review-room-card {
  padding: 16px;
}

#frontoffice #foReservations .premium-web-review-room-card strong {
  font-size: 16px;
}

#frontoffice #foReservations .premium-web-review-metrics {
  gap: 8px;
}

#frontoffice #foReservations .premium-web-review-metrics span {
  min-height: 72px;
  padding: 12px 30px 12px 12px;
}

#frontoffice #foReservations .premium-web-review-metrics small {
  font-size: 10px;
}

#frontoffice #foReservations .premium-web-review-metrics strong {
  font-size: 11px;
  line-height: 1.12;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

#frontoffice #foReservations .premium-web-review-metrics i {
  right: 7px;
  width: 24px;
  height: 24px;
  font-size: 14px;
}

#frontoffice #foReservations .premium-web-review-warning strong {
  font-size: 12px;
}

body.theme-dark #frontoffice #foReservations .premium-web-review-status-chip {
  color: #09101f !important;
  -webkit-text-fill-color: #09101f !important;
}

/* CyotelOS Light Mode v17 — Frontoffice ops tabs readable */
body.theme-light #frontoffice.setup-workspace #foPlan,
body.theme-light #frontoffice.setup-workspace #foRack,
body.theme-light #frontoffice.setup-workspace #foStatus,
body.theme-light #frontoffice.setup-workspace #foAvailability,
body.theme-light #frontoffice #foPlan,
body.theme-light #frontoffice #foRack,
body.theme-light #frontoffice #foStatus,
body.theme-light #frontoffice #foAvailability {
  background: linear-gradient(180deg, #ffffff 0%, #fff9ed 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff9ed 100%) !important;
  color: #101828 !important;
}

body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-controls,
body.theme-light #frontoffice.setup-workspace #foAvailability .availability-controls,
body.theme-light #frontoffice #foPlan .room-plan-controls,
body.theme-light #frontoffice #foAvailability .availability-controls {
  background: rgba(255, 255, 255, 0.94) !important;
  background-image: none !important;
  border: 1px solid rgba(17, 24, 39, 0.10) !important;
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.07) !important;
  color: #101828 !important;
}

body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-controls input,
body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-controls select,
body.theme-light #frontoffice.setup-workspace #foAvailability .availability-controls input,
body.theme-light #frontoffice.setup-workspace #foAvailability .availability-controls select,
body.theme-light #frontoffice #foPlan .room-plan-controls input,
body.theme-light #frontoffice #foPlan .room-plan-controls select,
body.theme-light #frontoffice #foAvailability .availability-controls input,
body.theme-light #frontoffice #foAvailability .availability-controls select {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.16) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84), 0 8px 18px rgba(15, 23, 42, 0.05) !important;
  caret-color: #0f172a !important;
}

body.theme-light #frontoffice #foPlan .room-plan-controls input::placeholder,
body.theme-light #frontoffice #foPlan .room-plan-controls select::placeholder,
body.theme-light #frontoffice #foAvailability .availability-controls input::placeholder {
  color: #667085 !important;
  -webkit-text-fill-color: #667085 !important;
  opacity: 1 !important;
}

body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-wrap,
body.theme-light #frontoffice #foPlan .room-plan-wrap,
body.theme-light #frontoffice.setup-workspace #foAvailability .table-wrap,
body.theme-light #frontoffice #foAvailability .table-wrap {
  background: #ffffff !important;
  background-image: none !important;
  border-color: rgba(17, 24, 39, 0.10) !important;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.07) !important;
}

body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-corner,
body.theme-light #frontoffice #foPlan .room-plan-corner {
  background: linear-gradient(180deg, #fff4d8 0%, #ffffff 100%) !important;
  background-image: linear-gradient(180deg, #fff4d8 0%, #ffffff 100%) !important;
  color: #101828 !important;
  border-right: 1px solid rgba(17, 24, 39, 0.10) !important;
}

body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-corner strong,
body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-corner span,
body.theme-light #frontoffice #foPlan .room-plan-corner strong,
body.theme-light #frontoffice #foPlan .room-plan-corner span {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-room,
body.theme-light #frontoffice #foPlan .room-plan-room {
  background: #fffdf7 !important;
  background-image: none !important;
  color: #101828 !important;
  border-color: rgba(17, 24, 39, 0.08) !important;
}

body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-room strong,
body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-room span,
body.theme-light #frontoffice #foPlan .room-plan-room strong,
body.theme-light #frontoffice #foPlan .room-plan-room span {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
}

body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-days,
body.theme-light #frontoffice.setup-workspace #foPlan .room-plan-timeline,
body.theme-light #frontoffice #foPlan .room-plan-days,
body.theme-light #frontoffice #foPlan .room-plan-timeline {
  background: #ffffff !important;
  background-image: none !important;
}

body.theme-light #frontoffice.setup-workspace #foRack .rack-room-card,
body.theme-light #frontoffice #foRack .rack-room-card {
  background:
    radial-gradient(circle at 92% 10%, var(--rack-glow), transparent 32%),
    linear-gradient(145deg, #ffffff 0%, var(--rack-soft) 100%) !important;
  background-image:
    radial-gradient(circle at 92% 10%, var(--rack-glow), transparent 32%),
    linear-gradient(145deg, #ffffff 0%, var(--rack-soft) 100%) !important;
  color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  border-left-color: var(--rack-color) !important;
  border-left-width: 5px !important;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.10) !important;
}

body.theme-light #frontoffice.setup-workspace #foRack .rack-room-card::before,
body.theme-light #frontoffice #foRack .rack-room-card::before {
  background: var(--rack-color) !important;
  background-image: none !important;
  opacity: 1 !important;
  box-shadow: 0 0 0 4px var(--rack-glow) !important;
}

body.theme-light #frontoffice.setup-workspace #foRack .rack-room-card::after,
body.theme-light #frontoffice #foRack .rack-room-card::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  background-image: none !important;
  opacity: 0 !important;
  box-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #foRack .rack-room-card strong,
body.theme-light #frontoffice.setup-workspace #foRack .rack-room-card span,
body.theme-light #frontoffice.setup-workspace #foRack .rack-room-card p,
body.theme-light #frontoffice.setup-workspace #foRack .rack-room-card small,
body.theme-light #frontoffice #foRack .rack-room-card strong,
body.theme-light #frontoffice #foRack .rack-room-card span,
body.theme-light #frontoffice #foRack .rack-room-card p,
body.theme-light #frontoffice #foRack .rack-room-card small {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #foRack .rack-room-card > .status,
body.theme-light #frontoffice #foRack .rack-room-card > .status {
  background: var(--rack-status-bg) !important;
  background-image: none !important;
  color: var(--rack-strong) !important;
  -webkit-text-fill-color: var(--rack-strong) !important;
  border: 1px solid var(--rack-glow) !important;
}

body.theme-light #frontoffice.setup-workspace #foRack [data-rack-status],
body.theme-light #frontoffice #foRack [data-rack-status] {
  background: #ffffff !important;
  background-image: none !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
}

body.theme-light #frontoffice.setup-workspace #foRack [data-rack-status].active,
body.theme-light #frontoffice #foRack [data-rack-status].active {
  background: linear-gradient(180deg, #d6a94f 0%, #b8872f 100%) !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.20) !important;
}

body.theme-light #frontoffice.setup-workspace #foStatus #frontofficeStatusCards .metric,
body.theme-light #frontoffice #foStatus #frontofficeStatusCards .metric {
  background: linear-gradient(180deg, #ffffff 0%, #fff4d8 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff4d8 100%) !important;
  color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.10) !important;
}

body.theme-light #frontoffice.setup-workspace #foStatus #frontofficeStatusCards .metric span,
body.theme-light #frontoffice.setup-workspace #foStatus #frontofficeStatusCards .metric strong,
body.theme-light #frontoffice.setup-workspace #foStatus #frontofficeStatusCards .metric small,
body.theme-light #frontoffice #foStatus #frontofficeStatusCards .metric span,
body.theme-light #frontoffice #foStatus #frontofficeStatusCards .metric strong,
body.theme-light #frontoffice #foStatus #frontofficeStatusCards .metric small {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #foStatus #frontofficeStatusCards .metric small,
body.theme-light #frontoffice #foStatus #frontofficeStatusCards .metric small {
  background: #fff4bf !important;
  color: #533f12 !important;
  -webkit-text-fill-color: #533f12 !important;
  border: 1px solid rgba(184, 138, 68, 0.24) !important;
}

body.theme-light #frontoffice.setup-workspace #foAvailability table,
body.theme-light #frontoffice #foAvailability table {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
}

body.theme-light #frontoffice.setup-workspace #foAvailability thead,
body.theme-light #frontoffice.setup-workspace #foAvailability th,
body.theme-light #frontoffice #foAvailability thead,
body.theme-light #frontoffice #foAvailability th {
  background: #fff8ec !important;
  background-image: none !important;
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}

body.theme-light #frontoffice.setup-workspace #foAvailability td,
body.theme-light #frontoffice.setup-workspace #foAvailability td strong,
body.theme-light #frontoffice #foAvailability td,
body.theme-light #frontoffice #foAvailability td strong {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
}


/* CyotelOS Light Mode v18 — Accounting tabs readable */
body.theme-light #accounting,
body.theme-light #accounting.setup-workspace {
  --accounting-ink: #101828 !important;
  --accounting-muted: #475467 !important;
  --accounting-line: rgba(17, 24, 39, 0.10) !important;
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  color: #101828 !important;
}

body.theme-light #accounting .accounting-tab-panel,
body.theme-light #accounting .accounting-tab-panel.active {
  background: linear-gradient(180deg, #ffffff 0%, #fffaf0 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fffaf0 100%) !important;
  color: #101828 !important;
}

body.theme-light #accounting .accounting-tab-panel > .section-heading,
body.theme-light #accounting .accounting-tab-panel > header,
body.theme-light #accounting .panel-header,
body.theme-light #accounting #pendingRefundAccountingPanel .section-heading {
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  color: #101828 !important;
  border-color: rgba(17, 24, 39, 0.10) !important;
}

body.theme-light #accounting .accounting-tab-panel h2,
body.theme-light #accounting .accounting-tab-panel h3,
body.theme-light #accounting .accounting-tab-panel p,
body.theme-light #accounting .panel-header h3,
body.theme-light #accounting #pendingRefundAccountingPanel .section-heading h3,
body.theme-light #accounting #pendingRefundAccountingPanel .section-heading p {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  text-shadow: none !important;
}

body.theme-light #accounting .metric,
body.theme-light #accounting .metric.risk,
body.theme-light #accounting .metric.warn,
body.theme-light #accounting .panel,
body.theme-light #accounting .accounting-risk-panel,
body.theme-light #accounting .accounting-voucher-preview-panel,
body.theme-light #accounting #pendingRefundAccountingPanel {
  background: linear-gradient(180deg, #ffffff 0%, #fff6e6 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff6e6 100%) !important;
  color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08) !important;
}

body.theme-light #accounting .metric::before,
body.theme-light #accounting .metric::after,
body.theme-light #accounting .panel::before,
body.theme-light #accounting .panel::after,
body.theme-light #accounting .current-account-priority-card::before,
body.theme-light #accounting .current-account-priority-card::after,
body.theme-light #accounting .current-account-risk::before,
body.theme-light #accounting .current-account-risk::after {
  background: transparent !important;
  background-image: none !important;
  opacity: 0 !important;
  box-shadow: none !important;
}

body.theme-light #accounting .metric span,
body.theme-light #accounting .metric strong,
body.theme-light #accounting .metric small,
body.theme-light #accounting .panel span,
body.theme-light #accounting .panel strong,
body.theme-light #accounting .panel small,
body.theme-light #accounting .panel p,
body.theme-light #accounting .muted,
body.theme-light #accounting .invoice-action {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #accounting .metric span,
body.theme-light #accounting .panel small,
body.theme-light #accounting .metric small,
body.theme-light #accounting .muted {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}

body.theme-light #accounting .table-wrap,
body.theme-light #accounting .accounting-risk-panel .table-wrap,
body.theme-light #accounting .accounting-voucher-preview-panel .table-wrap,
body.theme-light #accounting #pendingRefundAccountingPanel .table-wrap {
  background: #ffffff !important;
  background-image: none !important;
  border-color: rgba(17, 24, 39, 0.10) !important;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05) !important;
}

body.theme-light #accounting table,
body.theme-light #accounting thead,
body.theme-light #accounting tbody,
body.theme-light #accounting tr,
body.theme-light #accounting td,
body.theme-light #accounting th {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  background: transparent !important;
  border-color: rgba(17, 24, 39, 0.08) !important;
}

body.theme-light #accounting thead,
body.theme-light #accounting th {
  background: #fff8ec !important;
  background-image: none !important;
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}

body.theme-light #accounting tbody tr:nth-child(odd) {
  background: #fffaf0 !important;
}

body.theme-light #accounting tbody tr:hover {
  background: #fff3d6 !important;
}

body.theme-light #accounting .status,
body.theme-light #accounting .status.clean,
body.theme-light #accounting .status.warning,
body.theme-light #accounting .status.danger,
body.theme-light #accounting .invoice-type-pill,
body.theme-light #accounting .current-account-type,
body.theme-light #accounting .badge,
body.theme-light #accounting .rate-status {
  background: #fff4d8 !important;
  background-image: none !important;
  color: #243045 !important;
  -webkit-text-fill-color: #243045 !important;
  border: 1px solid rgba(184, 138, 68, 0.26) !important;
  text-shadow: none !important;
}

body.theme-light #accounting .current-account-priority-card,
body.theme-light #accounting .current-account-priority-card.warning,
body.theme-light #accounting .current-account-priority-card.risk,
body.theme-light #accounting .current-account-priority-card.followup,
body.theme-light #accounting .current-account-risk,
body.theme-light #accounting .current-account-risk.warn,
body.theme-light #accounting .current-account-risk.risk,
body.theme-light #accounting .current-account-risk.ok {
  background: linear-gradient(180deg, #ffffff 0%, #fff1d1 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff1d1 100%) !important;
  color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08) !important;
}

body.theme-light #accounting .current-account-priority-card span,
body.theme-light #accounting .current-account-priority-card strong,
body.theme-light #accounting .current-account-priority-card small,
body.theme-light #accounting .current-account-risk span,
body.theme-light #accounting .current-account-risk strong,
body.theme-light #accounting .current-account-risk small,
body.theme-light #accounting .current-account-risk em,
body.theme-light #accounting .current-account-risk b {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #accounting .current-account-risk small,
body.theme-light #accounting .current-account-risk em,
body.theme-light #accounting .current-account-priority-card small {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}

body.theme-light #accounting .current-account-row-priority,
body.theme-light #accounting .current-account-quick-action,
body.theme-light #accounting .current-account-view-reason,
body.theme-light #accounting .current-account-next-action,
body.theme-light #accounting .source-control-chip,
body.theme-light #accounting .voucher-source-chip,
body.theme-light #accounting .payment-source-chip,
body.theme-light #accounting .folio-source-chip,
body.theme-light #accounting [class*="source"],
body.theme-light #accounting [class*="risk-badge"] {
  background: #eef4ff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(46, 98, 170, 0.16) !important;
  text-shadow: none !important;
}

body.theme-light #accounting .current-account-row-priority strong,
body.theme-light #accounting .current-account-row-priority small,
body.theme-light #accounting .current-account-quick-action strong,
body.theme-light #accounting .current-account-quick-action small,
body.theme-light #accounting .current-account-view-reason em,
body.theme-light #accounting .current-account-view-reason small,
body.theme-light #accounting [class*="source"] strong,
body.theme-light #accounting [class*="source"] small,
body.theme-light #accounting [class*="source"] span,
body.theme-light #accounting [class*="source"] p,
body.theme-light #accounting [class*="risk-badge"] {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #accounting input,
body.theme-light #accounting select,
body.theme-light #accounting textarea,
body.theme-light #accounting .accounting-controls input,
body.theme-light #accounting .accounting-controls select {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 8px 18px rgba(15,23,42,.05) !important;
  caret-color: #0f172a !important;
}

body.theme-light #accounting input::placeholder,
body.theme-light #accounting textarea::placeholder {
  color: #667085 !important;
  -webkit-text-fill-color: #667085 !important;
  opacity: 1 !important;
}


/* CyotelOS Light Mode v19 — Accounting remaining dark card cleanup */
body.theme-light #accounting #accountingCurrentAccounts .current-account-buckets > div,
body.theme-light #accounting #accountingCurrentAccounts .current-account-gates > div,
body.theme-light #accounting #accountingCurrentAccounts .current-account-bridges > div,
body.theme-light #accounting #accountingCurrentAccounts .current-account-risk,
body.theme-light #accounting #accountingCurrentAccounts .current-account-priority-card,
body.theme-light #accounting #accountingAccounts .account-plan-context-card,
body.theme-light #accounting #accountingCodes .transaction-code-context-card,
body.theme-light #accounting #accountingRevenue .revenue-context-card,
body.theme-light #accounting #accountingPayments .payment-date-summary > div,
body.theme-light #accounting #accountingPayments .payment-source-card,
body.theme-light #accounting #accountingOpenFolios .open-folio-summary-card,
body.theme-light #accounting #accountingAdvances .advance-summary-card,
body.theme-light #accounting #accountingCashier .cashier-summary-card,
body.theme-light #accounting #accountingVoucher .voucher-source-summary-card,
body.theme-light #accounting #accountingTcmb .tcmb-rate-source-card,
body.theme-light #accounting #accountingTcmb .tcmb-rate-safety-card,
body.theme-light #accounting #accountingTcmb .tcmb-rate-usage-card,
body.theme-light #accounting [class$="-context-card"],
body.theme-light #accounting [class$="-summary-card"] {
  background: linear-gradient(180deg, #ffffff 0%, #fff3da 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff3da 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.07) !important;
  text-shadow: none !important;
}

body.theme-light #accounting #accountingCurrentAccounts .current-account-buckets > div *,
body.theme-light #accounting #accountingCurrentAccounts .current-account-gates > div *,
body.theme-light #accounting #accountingCurrentAccounts .current-account-bridges > div *,
body.theme-light #accounting #accountingCurrentAccounts .current-account-risk *,
body.theme-light #accounting #accountingCurrentAccounts .current-account-priority-card *,
body.theme-light #accounting #accountingAccounts .account-plan-context-card *,
body.theme-light #accounting #accountingCodes .transaction-code-context-card *,
body.theme-light #accounting #accountingRevenue .revenue-context-card *,
body.theme-light #accounting #accountingPayments .payment-date-summary > div *,
body.theme-light #accounting #accountingPayments .payment-source-card *,
body.theme-light #accounting #accountingOpenFolios .open-folio-summary-card *,
body.theme-light #accounting #accountingAdvances .advance-summary-card *,
body.theme-light #accounting #accountingCashier .cashier-summary-card *,
body.theme-light #accounting #accountingVoucher .voucher-source-summary-card *,
body.theme-light #accounting #accountingTcmb .tcmb-rate-source-card *,
body.theme-light #accounting #accountingTcmb .tcmb-rate-safety-card *,
body.theme-light #accounting #accountingTcmb .tcmb-rate-usage-card *,
body.theme-light #accounting [class$="-context-card"] *,
body.theme-light #accounting [class$="-summary-card"] * {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #accounting #accountingCurrentAccounts .current-account-buckets > div span,
body.theme-light #accounting #accountingCurrentAccounts .current-account-gates > div small,
body.theme-light #accounting #accountingCurrentAccounts .current-account-bridges > div small,
body.theme-light #accounting #accountingCurrentAccounts .current-account-risk small,
body.theme-light #accounting #accountingCurrentAccounts .current-account-priority-card span,
body.theme-light #accounting #accountingCurrentAccounts .current-account-priority-card small,
body.theme-light #accounting #accountingAccounts .account-plan-context-card span,
body.theme-light #accounting #accountingAccounts .account-plan-context-card small,
body.theme-light #accounting #accountingCodes .transaction-code-context-card span,
body.theme-light #accounting #accountingCodes .transaction-code-context-card small,
body.theme-light #accounting #accountingRevenue .revenue-context-card span,
body.theme-light #accounting #accountingRevenue .revenue-context-card small,
body.theme-light #accounting [class$="-context-card"] span,
body.theme-light #accounting [class$="-context-card"] small,
body.theme-light #accounting [class$="-summary-card"] span,
body.theme-light #accounting [class$="-summary-card"] small {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}

body.theme-light #accounting #accountingCurrentAccounts .current-account-gates > div > strong,
body.theme-light #accounting #accountingCurrentAccounts .invoice-gate-steps > div > strong,
body.theme-light #accounting #accountingCurrentAccounts .current-account-gates strong,
body.theme-light #accounting .invoice-gate-steps strong {
  background: #fff8ec !important;
  background-image: none !important;
  color: #9a6a16 !important;
  -webkit-text-fill-color: #9a6a16 !important;
  border: 1px solid rgba(184, 138, 68, 0.22) !important;
}

body.theme-light #accounting .invoice-gate-steps > div,
body.theme-light #accounting .cash-bank-gate,
body.theme-light #accounting .current-account-gates > div {
  background: linear-gradient(180deg, #ffffff 0%, #fff3da 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff3da 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.07) !important;
}

body.theme-light #accounting .invoice-gate-steps > div *,
body.theme-light #accounting .cash-bank-gate *,
body.theme-light #accounting .current-account-gates > div * {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
}


/* CyotelOS Light Mode v20 — Accounting current account filter panels cleanup */
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter-group,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter-insight,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter-insight-title,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter-insight-grid > div {
  background: linear-gradient(180deg, #ffffff 0%, #fff3da 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff3da 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.07) !important;
  text-shadow: none !important;
}

body.theme-light #accounting #accountingCurrentAccounts .current-account-filter,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter.active,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter.zero-count,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter.followup-filter,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter.priority-filter,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter.action-filter,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter.risk-filter {
  background: #fff8ec !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(184, 138, 68, 0.24) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

body.theme-light #accounting #accountingCurrentAccounts .current-account-filter.active {
  background: #fff0c7 !important;
  border-color: rgba(184, 138, 68, 0.52) !important;
}

body.theme-light #accounting #accountingCurrentAccounts .current-account-filter-group *,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter *,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter-insight *,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter-insight-grid > div * {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #accounting #accountingCurrentAccounts .current-account-filter-group header small,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter-insight small,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter-insight span,
body.theme-light #accounting #accountingCurrentAccounts .current-account-filter small {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}


/* CyotelOS Light Mode v21 — Accounting active view chip cleanup */
body.theme-light #accounting #accountingCurrentAccounts .current-account-active-view-chip {
  background: #fff8ec !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(184, 138, 68, 0.24) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
body.theme-light #accounting #accountingCurrentAccounts .current-account-active-view-chip * {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}


/* CyotelOS Light Mode v22 — Reports readable headings */
body.theme-light #reports.reports-command-center,
body.theme-light #reports.reports-command-center * {
  text-shadow: none !important;
}

body.theme-light #reports .reports-table-panel .panel-header,
body.theme-light #reports .reports-insight-panel .panel-header {
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  border: 1px solid rgba(17, 24, 39, 0.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72) !important;
}

body.theme-light #reports .reports-table-panel .panel-header h3,
body.theme-light #reports .reports-insight-panel .panel-header h3,
body.theme-light #reports .reports-table-panel h3,
body.theme-light #reports .reports-insight-panel h3 {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  font-weight: 950 !important;
  text-shadow: none !important;
}

body.theme-light #reports .reports-table-panel .panel-header span,
body.theme-light #reports .reports-insight-panel .panel-header span,
body.theme-light #reports .reports-table-panel .panel-header small,
body.theme-light #reports .reports-insight-panel .panel-header small {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
  opacity: 1 !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

body.theme-light #reports .reports-table-panel table thead,
body.theme-light #reports .reports-table-panel table th {
  background: #fff8ec !important;
  background-image: none !important;
  color: #344054 !important;
  -webkit-text-fill-color: #344054 !important;
  opacity: 1 !important;
  font-weight: 950 !important;
  text-shadow: none !important;
  border-color: rgba(184, 138, 68, 0.22) !important;
}

body.theme-light #reports .reports-table-panel table th *,
body.theme-light #reports .reports-table-panel table thead * {
  color: #344054 !important;
  -webkit-text-fill-color: #344054 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #reports .reports-table-panel .table-empty,
body.theme-light #reports .reports-table-panel tbody td {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
}


/* CyotelOS Light Mode v23 — Reports readable table body rows */
body.theme-light #reports .reports-table-panel table tbody tr,
body.theme-light #reports .reports-table-panel table tbody tr:nth-child(even),
body.theme-light #reports .reports-table-panel table tbody tr:nth-child(odd),
body.theme-light #reports .reports-table-panel table tbody td,
body.theme-light #reports .reports-table-panel .table-empty,
body.theme-light #reports .reports-table-panel .empty-state,
body.theme-light #reports .reports-table-panel tbody .empty-row,
body.theme-light #reports .reports-table-panel tbody .empty-row td {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  border-color: rgba(17, 24, 39, 0.08) !important;
}

body.theme-light #reports .reports-table-panel table tbody tr:hover,
body.theme-light #reports .reports-table-panel table tbody tr:hover td {
  background: #fff8ec !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
}

body.theme-light #reports .reports-table-panel table tbody td *,
body.theme-light #reports .reports-table-panel .table-empty * {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}


/* CyotelOS Light Mode v24 — Logs dark residue cleanup */
body.theme-light #logs,
body.theme-light #logs * {
  text-shadow: none !important;
}

body.theme-light #logs .logs-command-shell,
body.theme-light #logs .logs-hero-main,
body.theme-light #logs .logs-hero-side,
body.theme-light #logs .logs-table-panel,
body.theme-light #logs .logs-insight-panel,
body.theme-light #logs .log-filter-panel,
body.theme-light #logs .logs-filter-deck {
  background: linear-gradient(180deg, #ffffff 0%, #fff6e6 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff6e6 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border-color: rgba(17, 24, 39, 0.12) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08) !important;
}

body.theme-light #logs .logs-hero-main::after,
body.theme-light #logs .logs-command-shell::before,
body.theme-light #logs .logs-command-shell::after {
  opacity: 0 !important;
  background: none !important;
  background-image: none !important;
}

body.theme-light #logs .logs-panel-head,
body.theme-light #logs .logs-panel-head.compact,
body.theme-light #logs .logs-signal-card,
body.theme-light #logs .logs-insight-list li,
body.theme-light #logs .logs-insight-list > *,
body.theme-light #logs .logs-metric-card,
body.theme-light #logs .logs-filter-deck label,
body.theme-light #logs .logs-filter-deck input,
body.theme-light #logs .logs-filter-deck select {
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72) !important;
  opacity: 1 !important;
}

body.theme-light #logs .logs-panel-head *,
body.theme-light #logs .logs-signal-card *,
body.theme-light #logs .logs-insight-list *,
body.theme-light #logs .logs-metric-card *,
body.theme-light #logs .logs-filter-deck *,
body.theme-light #logs .logs-table-panel * {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.theme-light #logs .logs-panel-head span,
body.theme-light #logs .logs-panel-head small,
body.theme-light #logs .logs-signal-card span,
body.theme-light #logs .logs-signal-card small,
body.theme-light #logs .logs-insight-list p,
body.theme-light #logs .logs-metric-card span,
body.theme-light #logs .logs-metric-card small,
body.theme-light #logs .logs-filter-deck label {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}

body.theme-light #logs .logs-table-panel table thead,
body.theme-light #logs .logs-table-panel table th,
body.theme-light #logs table thead,
body.theme-light #logs table th {
  background: #fff8ec !important;
  background-image: none !important;
  color: #344054 !important;
  -webkit-text-fill-color: #344054 !important;
  border-color: rgba(184, 138, 68, 0.22) !important;
  font-weight: 950 !important;
}

body.theme-light #logs .logs-table-panel table tbody tr,
body.theme-light #logs .logs-table-panel table tbody tr:nth-child(even),
body.theme-light #logs .logs-table-panel table tbody tr:nth-child(odd),
body.theme-light #logs .logs-table-panel table tbody td,
body.theme-light #logs table tbody tr,
body.theme-light #logs table tbody td {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border-color: rgba(17, 24, 39, 0.08) !important;
}

body.theme-light #logs .logs-table-panel table tbody tr:hover,
body.theme-light #logs .logs-table-panel table tbody tr:hover td {
  background: #fff8ec !important;
  background-image: none !important;
}

body.theme-light #logs .logs-panel-chip,
body.theme-light #logs .logs-panel-head button,
body.theme-light #logs .logs-clear-button,
body.theme-light #logs .secondary-button {
  background: #fff8ec !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(184, 138, 68, 0.24) !important;
  box-shadow: none !important;
}


/* CyotelOS Light Mode v25 — Logs readable vertical scrollbar */
body.theme-light #logs .log-table-wrap,
body.theme-light #logs .logs-table-panel .table-wrap {
  scrollbar-width: thin !important;
  scrollbar-color: #c8a45d #fff8ec !important;
  scrollbar-gutter: stable !important;
}

body.theme-light #logs .log-table-wrap::-webkit-scrollbar,
body.theme-light #logs .logs-table-panel .table-wrap::-webkit-scrollbar {
  width: 10px !important;
  height: 10px !important;
}

body.theme-light #logs .log-table-wrap::-webkit-scrollbar-track,
body.theme-light #logs .logs-table-panel .table-wrap::-webkit-scrollbar-track {
  background: #fff8ec !important;
  border-left: 1px solid rgba(184, 138, 68, 0.18) !important;
  border-radius: 999px !important;
}

body.theme-light #logs .log-table-wrap::-webkit-scrollbar-thumb,
body.theme-light #logs .logs-table-panel .table-wrap::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #d8bd7a 0%, #b88a44 100%) !important;
  border: 2px solid #fff8ec !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55) !important;
}

body.theme-light #logs .log-table-wrap::-webkit-scrollbar-thumb:hover,
body.theme-light #logs .logs-table-panel .table-wrap::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #cfae64 0%, #9f7133 100%) !important;
}

body.theme-light #logs .log-table-wrap::-webkit-scrollbar-corner,
body.theme-light #logs .logs-table-panel .table-wrap::-webkit-scrollbar-corner {
  background: #fff8ec !important;
}


/* CyotelOS Light Mode v26 — CRM cards and tabs readability cleanup */
body.theme-light #guests,
body.theme-light #guests * {
  text-shadow: none !important;
}

body.theme-light #guests .crm-workspace,
body.theme-light #guests .crm-main,
body.theme-light #guests .crm-tab-panel,
body.theme-light #guests .panel,
body.theme-light #guests .crm-command-source,
body.theme-light #guests .crm-command-status > div,
body.theme-light #guests .crm-profile-shell,
body.theme-light #guests .crm-360-shell,
body.theme-light #guests .crm-guest-card,
body.theme-light #guests #guestCards > article,
body.theme-light #guests .guest-card,
body.theme-light #guests .crm-section-card {
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border-color: rgba(17, 24, 39, 0.10) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08) !important;
}

body.theme-light #guests .crm-top-nav {
  background: linear-gradient(180deg, #ffffff 0%, #fff4de 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff4de 100%) !important;
  border: 1px solid rgba(184, 138, 68, 0.20) !important;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08) !important;
}

body.theme-light #guests .crm-top-nav button {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.10) !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06) !important;
}

body.theme-light #guests .crm-top-nav button.active,
body.theme-light #guests .crm-top-nav button:hover {
  background: linear-gradient(180deg, #173553 0%, #0f2a44 100%) !important;
  background-image: linear-gradient(180deg, #173553 0%, #0f2a44 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: rgba(15, 42, 68, 0.30) !important;
}

body.theme-light #guests .crm-360-metrics span,
body.theme-light #guests #guestCards .crm-360-metrics span,
body.theme-light #guests .guest-card .crm-360-metrics span {
  background: linear-gradient(180deg, #ffffff 0%, #fff3da 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff3da 100%) !important;
  color: #344054 !important;
  -webkit-text-fill-color: #344054 !important;
  border: 1px solid rgba(184, 138, 68, 0.22) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.80), 0 8px 18px rgba(15, 23, 42, 0.06) !important;
}

body.theme-light #guests .crm-360-metrics span strong,
body.theme-light #guests #guestCards .crm-360-metrics span strong,
body.theme-light #guests .guest-card .crm-360-metrics span strong {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
}

body.theme-light #guests .crm-360-contact span,
body.theme-light #guests .crm-360-badge,
body.theme-light #guests .crm-360-whatsapp,
body.theme-light #guests .crm-profile-summary,
body.theme-light #guests .crm-profile-summary *,
body.theme-light #guests .crm-panel-card,
body.theme-light #guests .crm-panel-card * {
  color: #344054 !important;
  -webkit-text-fill-color: #344054 !important;
  opacity: 1 !important;
}

body.theme-light #guests .crm-360-badge,
body.theme-light #guests .crm-360-whatsapp {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid rgba(17, 24, 39, 0.10) !important;
}

body.theme-light #guests .crm-360-badge.source {
  background: #ecfdf3 !important;
  color: #166534 !important;
  -webkit-text-fill-color: #166534 !important;
}

body.theme-light #guests .crm-360-badge.preference,
body.theme-light #guests .crm-360-badge.muted {
  background: #fff8ec !important;
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}

body.theme-light #guests .crm-360-whatsapp.ok,
body.theme-light #guests .crm-360-whatsapp.pending,
body.theme-light #guests .crm-360-whatsapp.warning {
  background: #ffffff !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
}

body.theme-light #guests .panel-header,
body.theme-light #guests .card-title-row,
body.theme-light #guests .crm-panel-head,
body.theme-light #guests .crm-command-source,
body.theme-light #guests .crm-command-status > div {
  background: transparent !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
}

body.theme-light #guests h1,
body.theme-light #guests h2,
body.theme-light #guests h3,
body.theme-light #guests h4,
body.theme-light #guests .panel-header h3,
body.theme-light #guests .crm-panel-head h3,
body.theme-light #guests .crm-panel-head h4,
body.theme-light #guests .card-title-row h4 {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
}

body.theme-light #guests .panel-header span,
body.theme-light #guests .panel-header small,
body.theme-light #guests .crm-panel-head span,
body.theme-light #guests .crm-panel-head small,
body.theme-light #guests .crm-eyebrow,
body.theme-light #guests .section-eyebrow,
body.theme-light #guests .muted {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
  opacity: 1 !important;
}

body.theme-light #guests input,
body.theme-light #guests select,
body.theme-light #guests textarea {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border-color: rgba(17, 24, 39, 0.14) !important;
}

body.theme-light #guests [class*="crm-"]::before,
body.theme-light #guests [class*="crm-"]::after,
body.theme-light #guests [class*="guest-"]::before,
body.theme-light #guests [class*="guest-"]::after {
  text-shadow: none !important;
}


/* CyotelOS Light Mode v27 — CRM queue assistant api subtab cleanup */
body.theme-light #guests #crmPanelQueue,
body.theme-light #guests #crmPanelAssistant,
body.theme-light #guests #crmPanelApi {
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border-color: rgba(184, 138, 68, 0.18) !important;
}

body.theme-light #guests #crmPanelQueue .panel-header,
body.theme-light #guests #crmPanelAssistant .panel-header,
body.theme-light #guests #crmPanelApi .panel-header {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.08) !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.06) !important;
}

body.theme-light #guests #crmPanelQueue .panel-header h3,
body.theme-light #guests #crmPanelAssistant .panel-header h3,
body.theme-light #guests #crmPanelApi .panel-header h3,
body.theme-light #guests #crmPanelQueue .panel-header span,
body.theme-light #guests #crmPanelAssistant .panel-header span,
body.theme-light #guests #crmPanelApi .panel-header span {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
}

body.theme-light #guests #crmPanelQueue .panel-header .panel-note,
body.theme-light #guests #crmPanelAssistant .panel-header .panel-note,
body.theme-light #guests #crmPanelApi .panel-header .panel-note {
  color: #344054 !important;
  -webkit-text-fill-color: #344054 !important;
}

body.theme-light #guests .crm-whatsapp-filters {
  background: transparent !important;
  background-image: none !important;
}

body.theme-light #guests .crm-whatsapp-filters button {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.06) !important;
}

body.theme-light #guests .crm-whatsapp-filters button.active,
body.theme-light #guests .crm-whatsapp-filters button:hover {
  background: linear-gradient(180deg, #fff8ec 0%, #f7e3bb 100%) !important;
  background-image: linear-gradient(180deg, #fff8ec 0%, #f7e3bb 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border-color: rgba(184, 138, 68, 0.40) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.80), 0 8px 18px rgba(184, 138, 68, 0.16) !important;
}

body.theme-light #guests #crmPanelQueue .primary-button,
body.theme-light #guests #crmPanelQueue .ghost-button,
body.theme-light #guests #crmPanelAssistant .primary-button,
body.theme-light #guests #crmPanelApi .primary-button,
body.theme-light #guests #crmPanelApi .ghost-button,
body.theme-light #guests #crmPanelApi button,
body.theme-light #guests #crmSettingsForm button {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  background: linear-gradient(180deg, #ffffff 0%, #fff1d6 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff1d6 100%) !important;
  border: 1px solid rgba(184, 138, 68, 0.26) !important;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08) !important;
}

body.theme-light #guests #crmPanelQueue .primary-button:disabled,
body.theme-light #guests #crmPanelAssistant .primary-button:disabled,
body.theme-light #guests #crmPanelApi .primary-button:disabled,
body.theme-light #guests #crmSettingsForm button:disabled {
  color: #667085 !important;
  -webkit-text-fill-color: #667085 !important;
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%) !important;
  background-image: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%) !important;
  border-color: rgba(17, 24, 39, 0.10) !important;
  opacity: 1 !important;
}

body.theme-light #guests .crm-whatsapp-live-notice,
body.theme-light #guests .crm-whatsapp-ops-summary,
body.theme-light #guests .crm-whatsapp-ops-card,
body.theme-light #guests .crm-whatsapp-preview-panel,
body.theme-light #guests #crmPanelQueue .table-wrap,
body.theme-light #guests #crmPanelQueue table,
body.theme-light #guests #crmPanelQueue .empty-state,
body.theme-light #guests #crmPanelApi .notice-card,
body.theme-light #guests #crmPanelApi .crm-settings-grid,
body.theme-light #guests #crmPanelApi .crm-template-grid,
body.theme-light #guests #crmPanelApi .crm-template-card {
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border-color: rgba(184, 138, 68, 0.18) !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06) !important;
}

body.theme-light #guests .crm-whatsapp-ops-card strong,
body.theme-light #guests .crm-whatsapp-ops-card small,
body.theme-light #guests .crm-whatsapp-live-notice strong,
body.theme-light #guests .crm-whatsapp-live-notice p,
body.theme-light #guests #crmPanelApi .notice-card strong,
body.theme-light #guests #crmPanelApi .notice-card p,
body.theme-light #guests #crmPanelApi .notice-card small,
body.theme-light #guests #crmPanelApi code,
body.theme-light #guests #crmPanelApi label,
body.theme-light #guests #crmPanelQueue th,
body.theme-light #guests #crmPanelQueue td {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
}

body.theme-light #guests .crm-whatsapp-ops-card small,
body.theme-light #guests #crmPanelApi .notice-card small,
body.theme-light #guests #crmPanelQueue td small {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}

body.theme-light #guests #crmPanelQueue thead,
body.theme-light #guests #crmPanelQueue table thead tr,
body.theme-light #guests #crmPanelQueue table th {
  background: #fff1d6 !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border-color: rgba(184, 138, 68, 0.22) !important;
}

body.theme-light #guests #crmPanelQueue tbody tr,
body.theme-light #guests #crmPanelQueue tbody td {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border-color: rgba(17, 24, 39, 0.08) !important;
}

body.theme-light #guests .staff-assistant-panel,
body.theme-light #guests .staff-assistant-result,
body.theme-light #guests .staff-assistant-answer,
body.theme-light #guests .staff-assistant-summary > *,
body.theme-light #guests .staff-assistant-context,
body.theme-light #guests .staff-assistant-panel pre {
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border-color: rgba(184, 138, 68, 0.18) !important;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06) !important;
}

body.theme-light #guests .staff-assistant-panel label,
body.theme-light #guests .staff-assistant-result,
body.theme-light #guests .staff-assistant-result *,
body.theme-light #guests .staff-assistant-panel pre,
body.theme-light #guests .staff-assistant-panel pre * {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
}

body.theme-light #guests #staffAssistantQuestion,
body.theme-light #guests #crmPanelApi input,
body.theme-light #guests #crmPanelApi textarea,
body.theme-light #guests #crmPanelApi select,
body.theme-light #guests #crmSettingsForm input {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.14) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 6px 16px rgba(15, 23, 42, 0.05) !important;
}

body.theme-light #guests #staffAssistantQuestion::placeholder,
body.theme-light #guests #crmPanelApi input::placeholder,
body.theme-light #guests #crmPanelApi textarea::placeholder {
  color: #667085 !important;
  -webkit-text-fill-color: #667085 !important;
  opacity: 1 !important;
}

body.theme-light #guests #crmPanelQueue .table-wrap,
body.theme-light #guests #crmPanelAssistant .staff-assistant-result,
body.theme-light #guests #crmPanelAssistant textarea {
  scrollbar-width: thin;
  scrollbar-color: #c8a45d #fff8ec;
}

body.theme-light #guests #crmPanelQueue .table-wrap::-webkit-scrollbar,
body.theme-light #guests #crmPanelAssistant .staff-assistant-result::-webkit-scrollbar,
body.theme-light #guests #crmPanelAssistant textarea::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

body.theme-light #guests #crmPanelQueue .table-wrap::-webkit-scrollbar-track,
body.theme-light #guests #crmPanelAssistant .staff-assistant-result::-webkit-scrollbar-track,
body.theme-light #guests #crmPanelAssistant textarea::-webkit-scrollbar-track {
  background: #fff8ec;
  border-radius: 999px;
}

body.theme-light #guests #crmPanelQueue .table-wrap::-webkit-scrollbar-thumb,
body.theme-light #guests #crmPanelAssistant .staff-assistant-result::-webkit-scrollbar-thumb,
body.theme-light #guests #crmPanelAssistant textarea::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #d8bd7a 0%, #b88a44 100%);
  border-radius: 999px;
  border: 2px solid #fff8ec;
}

/* CyotelOS Light Mode v28 — CRM assistant preview final dark override */
body.theme-light #guests #crmPanelQueue #crmWhatsappPreviewPanel,
body.theme-light #guests #crmPanelQueue .crm-whatsapp-preview-panel,
body.theme-light #guests #crmPanelQueue .crm-whatsapp-preview-panel.is-collapsed {
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-color: #ffffff !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(184, 138, 68, 0.22) !important;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.07) !important;
}

body.theme-light #guests #crmPanelQueue #crmWhatsappPreviewPanel *,
body.theme-light #guests #crmPanelQueue .crm-whatsapp-preview-panel *,
body.theme-light #guests #crmPanelQueue .crm-whatsapp-preview-panel.is-collapsed * {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  opacity: 1 !important;
}

body.theme-light #guests #crmPanelQueue .crm-whatsapp-preview-panel small,
body.theme-light #guests #crmPanelQueue .crm-whatsapp-preview-header span,
body.theme-light #guests #crmPanelQueue .crm-whatsapp-preview-meta {
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}

body.theme-light #guests #crmPanelQueue .crm-whatsapp-preview-panel pre {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.10) !important;
}

body.theme-light #guests #crmPanelAssistant .staff-assistant-panel textarea,
body.theme-light #guests #crmPanelAssistant #staffAssistantQuestion {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, 0.14) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.86), 0 8px 18px rgba(15, 23, 42, 0.06) !important;
  outline-color: rgba(184, 138, 68, 0.18) !important;
}

body.theme-light #guests #crmPanelAssistant .staff-assistant-panel textarea::placeholder,
body.theme-light #guests #crmPanelAssistant #staffAssistantQuestion::placeholder {
  color: #667085 !important;
  -webkit-text-fill-color: #667085 !important;
  opacity: 1 !important;
}

body.theme-light #guests #crmPanelAssistant .staff-assistant-result,
body.theme-light #guests #crmPanelAssistant #staffAssistantResult {
  background: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  background-color: #ffffff !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fff8ec 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(184, 138, 68, 0.22) !important;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.07) !important;
}

body.theme-light #guests #crmPanelAssistant .staff-assistant-result *,
body.theme-light #guests #crmPanelAssistant #staffAssistantResult *,
body.theme-light #guests #crmPanelAssistant .staff-assistant-result pre,
body.theme-light #guests #crmPanelAssistant #staffAssistantResult pre {
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  background-color: transparent !important;
  border-color: rgba(17, 24, 39, 0.10) !important;
  opacity: 1 !important;
}

/* CyotelOS Light Mode v29 — housekeeping status color language */
body.theme-light #housekeeping.housekeeping-command-center {
  background:
    radial-gradient(circle at 12% 0%, rgba(34, 197, 94, 0.10), transparent 28%),
    radial-gradient(circle at 92% 10%, rgba(239, 68, 68, 0.08), transparent 30%),
    linear-gradient(180deg, #fffdf8 0%, #f8fafc 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
}

body.theme-light #housekeeping .hk-hero,
body.theme-light #housekeeping .hk-ops-panel,
body.theme-light #housekeeping .hk-worklist,
body.theme-light #housekeeping .panel,
body.theme-light #housekeeping .hk-floor-card,
body.theme-light #housekeeping .hk-priority-item,
body.theme-light #housekeeping .hk-room-card {
  background: linear-gradient(180deg, #ffffff 0%, #fffaf0 100%) !important;
  background-color: #ffffff !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fffaf0 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border-color: rgba(17, 24, 39, 0.10) !important;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08) !important;
}

body.theme-light #housekeeping .hk-hero *,
body.theme-light #housekeeping .panel *,
body.theme-light #housekeeping .hk-room-card *,
body.theme-light #housekeeping .hk-priority-item *,
body.theme-light #housekeeping .hk-floor-card *,
body.theme-light #housekeeping .hk-metric * {
  -webkit-text-fill-color: currentColor !important;
}

body.theme-light #housekeeping .hk-room-card {
  position: relative;
  overflow: hidden;
  border-radius: 22px !important;
  border-left-width: 8px !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

body.theme-light #housekeeping .hk-room-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 44px rgba(15, 23, 42, 0.13) !important;
}

body.theme-light #housekeeping .hk-room-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 5px;
  background: var(--hk-status-accent, #c8a45d);
}

body.theme-light #housekeeping .hk-room-card.clean,
body.theme-light #housekeeping .hk-priority-item:has(.status.clean),
body.theme-light #housekeeping .hk-metric.hk-ready {
  --hk-status-accent: #16a34a;
  --hk-status-bg: #ecfdf3;
  --hk-status-soft: #f0fdf4;
  --hk-status-text: #065f46;
  --hk-status-border: rgba(22, 163, 74, .28);
}

body.theme-light #housekeeping .hk-room-card.dirty,
body.theme-light #housekeeping .hk-priority-item:has(.status.dirty),
body.theme-light #housekeeping .hk-metric.hk-dirty {
  --hk-status-accent: #dc2626;
  --hk-status-bg: #fef2f2;
  --hk-status-soft: #fff5f5;
  --hk-status-text: #991b1b;
  --hk-status-border: rgba(220, 38, 38, .30);
}

body.theme-light #housekeeping .hk-room-card.occupied-clean,
body.theme-light #housekeeping .hk-priority-item:has(.status.occupied-clean) {
  --hk-status-accent: #0d9488;
  --hk-status-bg: #ecfeff;
  --hk-status-soft: #f0fdfa;
  --hk-status-text: #115e59;
  --hk-status-border: rgba(13, 148, 136, .30);
}

body.theme-light #housekeeping .hk-room-card.occupied-dirty,
body.theme-light #housekeeping .hk-priority-item:has(.status.occupied-dirty),
body.theme-light #housekeeping .hk-metric.hk-occupied {
  --hk-status-accent: #f97316;
  --hk-status-bg: #fff7ed;
  --hk-status-soft: #fff4e6;
  --hk-status-text: #9a3412;
  --hk-status-border: rgba(249, 115, 22, .32);
}

body.theme-light #housekeeping .hk-room-card.maintenance,
body.theme-light #housekeeping .hk-priority-item:has(.status.maintenance),
body.theme-light #housekeeping .hk-metric.hk-blocked {
  --hk-status-accent: #e11d48;
  --hk-status-bg: #fff1f2;
  --hk-status-soft: #fff5f7;
  --hk-status-text: #9f1239;
  --hk-status-border: rgba(225, 29, 72, .30);
}

body.theme-light #housekeeping .hk-room-card.closed,
body.theme-light #housekeeping .hk-priority-item:has(.status.closed) {
  --hk-status-accent: #64748b;
  --hk-status-bg: #f1f5f9;
  --hk-status-soft: #f8fafc;
  --hk-status-text: #334155;
  --hk-status-border: rgba(100, 116, 139, .34);
}

body.theme-light #housekeeping .hk-room-card.clean,
body.theme-light #housekeeping .hk-room-card.dirty,
body.theme-light #housekeeping .hk-room-card.occupied-clean,
body.theme-light #housekeeping .hk-room-card.occupied-dirty,
body.theme-light #housekeeping .hk-room-card.maintenance,
body.theme-light #housekeeping .hk-room-card.closed {
  background: linear-gradient(180deg, #ffffff 0%, var(--hk-status-soft, #fffaf0) 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, var(--hk-status-soft, #fffaf0) 100%) !important;
  border-left-color: var(--hk-status-accent, #c8a45d) !important;
}

body.theme-light #housekeeping .status.clean,
body.theme-light #housekeeping .status.dirty,
body.theme-light #housekeeping .status.occupied-clean,
body.theme-light #housekeeping .status.occupied-dirty,
body.theme-light #housekeeping .status.maintenance,
body.theme-light #housekeeping .status.closed,
body.theme-light #housekeeping .hk-status-badge {
  background: var(--hk-status-bg, #fff8ec) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, var(--hk-status-bg, #fff8ec) 100%) !important;
  color: var(--hk-status-text, #101828) !important;
  -webkit-text-fill-color: var(--hk-status-text, #101828) !important;
  border: 1px solid var(--hk-status-border, rgba(17,24,39,.12)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 8px 18px rgba(15, 23, 42, 0.08) !important;
  font-weight: 900 !important;
}

body.theme-light #housekeeping .status.clean { --hk-status-bg: #dcfce7; --hk-status-text: #065f46; --hk-status-border: rgba(22, 163, 74, .34); }
body.theme-light #housekeeping .status.dirty { --hk-status-bg: #fee2e2; --hk-status-text: #991b1b; --hk-status-border: rgba(220, 38, 38, .36); }
body.theme-light #housekeeping .status.occupied-clean { --hk-status-bg: #ccfbf1; --hk-status-text: #115e59; --hk-status-border: rgba(13, 148, 136, .34); }
body.theme-light #housekeeping .status.occupied-dirty { --hk-status-bg: #ffedd5; --hk-status-text: #9a3412; --hk-status-border: rgba(249, 115, 22, .36); }
body.theme-light #housekeeping .status.maintenance { --hk-status-bg: #ffe4e6; --hk-status-text: #9f1239; --hk-status-border: rgba(225, 29, 72, .34); }
body.theme-light #housekeeping .status.closed { --hk-status-bg: #e2e8f0; --hk-status-text: #334155; --hk-status-border: rgba(100, 116, 139, .36); }

body.theme-light #housekeeping .hk-filter-bar button,
body.theme-light #housekeeping .hk-room-actions button {
  background: #ffffff !important;
  background-image: none !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
  border: 1px solid rgba(17, 24, 39, .12) !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .06) !important;
}

body.theme-light #housekeeping .hk-room-actions button[data-status="Temiz"],
body.theme-light #housekeeping .hk-filter-bar button[data-housekeeping-filter="Temiz"],
body.theme-light #housekeeping .hk-filter-bar button[data-housekeeping-filter="Dolu/Temiz"] {
  background: linear-gradient(180deg, #ffffff 0%, #dcfce7 100%) !important;
  color: #065f46 !important;
  -webkit-text-fill-color: #065f46 !important;
  border-color: rgba(22, 163, 74, .34) !important;
}

body.theme-light #housekeeping .hk-room-actions button[data-status="Kirli"],
body.theme-light #housekeeping .hk-filter-bar button[data-housekeeping-filter="Kirli"] {
  background: linear-gradient(180deg, #ffffff 0%, #fee2e2 100%) !important;
  color: #991b1b !important;
  -webkit-text-fill-color: #991b1b !important;
  border-color: rgba(220, 38, 38, .36) !important;
}

body.theme-light #housekeeping .hk-filter-bar button[data-housekeeping-filter="Dolu/Kirli"] {
  background: linear-gradient(180deg, #ffffff 0%, #ffedd5 100%) !important;
  color: #9a3412 !important;
  -webkit-text-fill-color: #9a3412 !important;
  border-color: rgba(249, 115, 22, .36) !important;
}

body.theme-light #housekeeping .hk-room-actions button[data-block-status="Arızalı"],
body.theme-light #housekeeping .hk-filter-bar button[data-housekeeping-filter="Arızalı"] {
  background: linear-gradient(180deg, #ffffff 0%, #ffe4e6 100%) !important;
  color: #9f1239 !important;
  -webkit-text-fill-color: #9f1239 !important;
  border-color: rgba(225, 29, 72, .34) !important;
}

body.theme-light #housekeeping .hk-room-actions button[data-block-status="Kapalı"],
body.theme-light #housekeeping .hk-filter-bar button[data-housekeeping-filter="Kapalı"] {
  background: linear-gradient(180deg, #ffffff 0%, #e2e8f0 100%) !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  border-color: rgba(100, 116, 139, .36) !important;
}

body.theme-light #housekeeping .hk-filter-bar button.active {
  outline: 3px solid rgba(184, 138, 68, .16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 10px 22px rgba(184, 138, 68, .18) !important;
  transform: translateY(-1px);
}

body.theme-light #housekeeping .hk-task-note {
  background: rgba(255, 255, 255, .72) !important;
  color: #344054 !important;
  -webkit-text-fill-color: #344054 !important;
  border: 1px solid rgba(17, 24, 39, .08) !important;
  border-radius: 14px !important;
}

body.theme-light #housekeeping .hk-metric {
  border-left: 7px solid var(--hk-status-accent, #c8a45d) !important;
  background: linear-gradient(180deg, #ffffff 0%, var(--hk-status-soft, #fffaf0) 100%) !important;
  color: #101828 !important;
  -webkit-text-fill-color: #101828 !important;
}

/* Final table-header cleanup: keep sortable/resizable header internals on the same cream strip, not white button capsules. */
body.theme-light table.pms-resizable-table thead th,
body.theme-light table.pms-resizable-table thead th.pms-resizable-header {
  background: linear-gradient(180deg, #fffaf0 0%, #f3eadb 100%) !important;
  background-color: #f6eddf !important;
  color: #14233a !important;
}

body.theme-light table.pms-resizable-table thead th .table-sort,
body.theme-light #frontoffice table.pms-resizable-table thead th .table-sort,
body.theme-light #setup table.pms-resizable-table thead th .table-sort,
body.theme-light #accounting table.pms-resizable-table thead th .table-sort,
body.theme-light #reports table.pms-resizable-table thead th .table-sort,
body.theme-light #logs table.pms-resizable-table thead th .table-sort,
body.theme-light #guests table.pms-resizable-table thead th .table-sort,
body.theme-light #housekeeping table.pms-resizable-table thead th .table-sort,
body.theme-light table.pms-resizable-table thead th > button:not(.pms-column-resizer),
body.theme-light #frontoffice table.pms-resizable-table thead th > button:not(.pms-column-resizer) {
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

body.theme-light table.pms-resizable-table thead th .sort-caret,
body.theme-light table.pms-resizable-table thead th .sort-caret::before {
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  color: inherit !important;
}

/* Reservation card light-mode + Folio viewport fit: keep every ledger row/action visible above the footer. */
#reservationDialog.reservation-dialog {
  width: min(1260px, calc(100vw - 14px));
  max-height: calc(100dvh - 18px);
  overflow: hidden;
}

#reservationDialog .reservation-card-form {
  height: min(720px, calc(100dvh - 18px));
  max-height: calc(100dvh - 18px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: border-box;
}

#reservationDialog .modal-header,
#reservationDialog .reservation-card-grid,
#reservationDialog #reservationRecordMeta,
#reservationDialog .reservation-subtabs,
#reservationDialog .modal-actions {
  flex: 0 0 auto;
}

#reservationDialog .reservation-card-panel.active {
  flex: 0 1 auto;
  min-height: 0;
  max-height: none;
  overflow: visible;
}

#reservationDialog #cardFolio.reservation-card-panel.active {
  display: block;
  overflow: visible;
  max-height: none;
  padding-right: 0;
}

#reservationDialog #cardFolio .folio-grid {
  grid-template-columns: repeat(6, minmax(118px, 1fr)) minmax(170px, .92fr);
  gap: 8px 12px;
  margin-bottom: 10px;
}

#reservationDialog #cardFolio .folio-ledger {
  display: block;
  min-height: 0;
}

#reservationDialog #cardFolio .folio-ledger .table-wrap {
  min-height: 0;
  max-height: none;
  overflow: visible;
  border-radius: 14px;
}

#reservationDialog #cardFolio .folio-ledger thead th,
#reservationDialog #cardFolio .folio-ledger tfoot th {
  position: static;
  top: auto;
  bottom: auto;
  z-index: auto;
}

#reservationDialog #cardFolio .folio-balance {
  flex: 0 0 auto;
  margin: 0;
  padding: 10px 14px;
  border-radius: 14px;
}

body.theme-light #reservationDialog.reservation-dialog {
  background: linear-gradient(180deg, #fffaf2 0%, #f4efe7 100%) !important;
  color: #17263d !important;
  border: 1px solid rgba(18, 38, 64, .14) !important;
  box-shadow: 0 24px 70px rgba(18, 38, 64, .22) !important;
}

body.theme-light #reservationDialog .reservation-card-form {
  background: linear-gradient(180deg, #fffaf2 0%, #f4efe7 100%) !important;
  color: #17263d !important;
}

body.theme-light #reservationDialog .modal-header {
  margin: -10px -14px 8px;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(185, 139, 59, .22);
  background: linear-gradient(180deg, #fff8ea 0%, #efe1c9 100%) !important;
  color: #13233b !important;
  box-shadow: none !important;
}

body.theme-light #reservationDialog .modal-header h3,
body.theme-light #reservationDialog .modal-header span,
body.theme-light #reservationDialog label,
body.theme-light #reservationDialog .lock-room-line,
body.theme-light #reservationDialog .guest-line span {
  color: #17263d !important;
  -webkit-text-fill-color: #17263d !important;
  text-shadow: none !important;
}

body.theme-light #reservationDialog .modal-header span,
body.theme-light #reservationDialog label > span,
body.theme-light #reservationDialog .folio-fx-note {
  color: #667085 !important;
  -webkit-text-fill-color: #667085 !important;
}

body.theme-light #reservationDialog .icon-button[data-close-dialog="reservationDialog"] {
  background: #ffffff !important;
  background-image: none !important;
  color: #13233b !important;
  -webkit-text-fill-color: #13233b !important;
  border: 1px solid rgba(18, 38, 64, .18) !important;
  box-shadow: 0 8px 18px rgba(18, 38, 64, .10) !important;
}

body.theme-light #reservationDialog .icon-button[data-close-dialog="reservationDialog"]:hover {
  border-color: rgba(185, 139, 59, .42) !important;
  background: #fff7e8 !important;
}

body.theme-light #reservationDialog .reservation-card-grid,
body.theme-light #reservationDialog .reservation-record-meta,
body.theme-light #reservationDialog .reservation-subtabs,
body.theme-light #reservationDialog .reservation-card-panel,
body.theme-light #reservationDialog #cardFolio .folio-ledger .table-wrap {
  background: linear-gradient(180deg, #ffffff 0%, #fbf4e8 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fbf4e8 100%) !important;
  color: #17263d !important;
  border-color: rgba(18, 38, 64, .12) !important;
  box-shadow: 0 8px 22px rgba(18, 38, 64, .06) !important;
}

body.theme-light #reservationDialog input,
body.theme-light #reservationDialog select,
body.theme-light #reservationDialog textarea,
body.theme-light #reservationDialog .room-picker-button,
body.theme-light #reservationDialog .guest-line-button {
  background: #ffffff !important;
  background-image: none !important;
  color: #17263d !important;
  -webkit-text-fill-color: #17263d !important;
  border: 1px solid rgba(18, 38, 64, .12) !important;
}

body.theme-light #reservationDialog .reservation-subtabs button:not(.active) {
  background: #ffffff !important;
  color: #263750 !important;
  -webkit-text-fill-color: #263750 !important;
  border-color: rgba(18, 38, 64, .14) !important;
}

body.theme-light #reservationDialog .reservation-subtabs button.active {
  background: linear-gradient(135deg, #071b33, #173d64) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body.theme-light #reservationDialog #cardFolio table thead th,
body.theme-light #reservationDialog #cardFolio table tfoot th {
  background: linear-gradient(180deg, #fff5df 0%, #f4e6ce 100%) !important;
  color: #475467 !important;
  -webkit-text-fill-color: #475467 !important;
}

body.theme-light #reservationDialog #cardFolio table tbody td {
  background: #ffffff !important;
  color: #344054 !important;
  -webkit-text-fill-color: #344054 !important;
}

body.theme-light #reservationDialog #cardFolio table tbody tr:nth-child(even) td {
  background: #fff8ec !important;
}

body.theme-light #reservationDialog #cardFolio .folio-balance.open {
  background: linear-gradient(180deg, #fff7d6, #ffefb0) !important;
  color: #92400e !important;
  -webkit-text-fill-color: #92400e !important;
  border: 1px solid rgba(245, 158, 11, .26);
}

body.theme-light #reservationDialog #cardFolio .folio-balance.balanced {
  background: linear-gradient(180deg, #ecfdf3, #d1fadf) !important;
  color: #067647 !important;
  -webkit-text-fill-color: #067647 !important;
  border: 1px solid rgba(22, 163, 74, .24);
}

body.theme-light #reservationDialog .modal-actions {
  position: static !important;
  bottom: auto !important;
  z-index: auto !important;
  margin: 8px -14px -10px;
  padding: 8px 14px;
  border-top: 1px solid rgba(185, 139, 59, .18);
  background: linear-gradient(180deg, rgba(255,250,242,.92), #f3eadb) !important;
  box-shadow: 0 -10px 24px rgba(18, 38, 64, .08);
}

#reservationDialog .reservation-card-form:has(#cardFolio.active) #cardFolio .folio-balance {
  padding: 9px 12px;
  min-height: 36px;
  display: flex;
  align-items: center;
}

@media (max-height: 720px) {
  #reservationDialog .reservation-card-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 5px 8px;
  }
  #reservationDialog .reservation-card-form input,
  #reservationDialog .reservation-card-form select,
  #reservationDialog .reservation-card-form .room-picker-button {
    min-height: 28px;
  }
  #reservationDialog #cardFolio .folio-grid {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
}

/* Reservation card spacing approval pass - final scoped override */
.reservation-dialog .reservation-card-form {
  display: grid !important;
  min-height: min(640px, calc(100vh - 18px));
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  align-content: stretch;
}

.reservation-dialog .reservation-card-main-tabs {
  margin: 4px 0 8px;
}

.reservation-dialog .reservation-main-panel.active {
  display: grid !important;
  grid-template-rows: auto minmax(54px, 1fr);
  align-content: stretch;
  gap: 12px;
}

.reservation-dialog .reservation-main-panel .reservation-card-grid {
  min-height: clamp(238px, 42vh, 270px);
  gap: 9px 10px;
  align-content: space-between;
}

.reservation-dialog .reservation-main-panel .reservation-card-grid input,
.reservation-dialog .reservation-main-panel .reservation-card-grid select,
.reservation-dialog .reservation-main-panel .reservation-card-grid .room-picker-button {
  min-height: 34px;
}

.reservation-dialog .reservation-record-meta {
  align-self: end;
  min-height: 50px;
  padding: 10px 12px;
}

.reservation-dialog .reservation-card-form .modal-actions {
  align-self: end;
  margin-top: 10px;
}

/* Reservation card manual resize handle */
.reservation-dialog {
  min-width: min(860px, calc(100vw - 16px));
  min-height: min(560px, calc(100vh - 8px));
}

.reservation-dialog.is-manually-resized {
  max-width: calc(100vw - 16px);
  max-height: calc(100vh - 8px);
}

.reservation-dialog.is-manually-resized .reservation-card-form {
  box-sizing: border-box;
  height: 100% !important;
  min-height: 0 !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}

.reservation-dialog .modal-actions {
  position: relative;
  padding-right: 34px;
}

.reservation-dialog-resize-handle {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 2px;
  border: 0;
  border-radius: 9px;
  padding: 5px;
  background: transparent;
  color: #b88a44;
  cursor: nwse-resize;
  touch-action: none;
}

.reservation-dialog-resize-handle span {
  display: block;
  width: 3px;
  border-radius: 999px;
  background: currentColor;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.44);
  transform: rotate(45deg);
  transform-origin: bottom center;
}

.reservation-dialog-resize-handle span:nth-child(1) { height: 9px; opacity: 0.62; }
.reservation-dialog-resize-handle span:nth-child(2) { height: 14px; opacity: 0.82; }
.reservation-dialog-resize-handle span:nth-child(3) { height: 19px; opacity: 1; }

.reservation-dialog-resize-handle:hover,
.reservation-dialog-resize-handle:focus-visible,
.reservation-dialog.is-resizing .reservation-dialog-resize-handle {
  color: #101827;
  background: linear-gradient(135deg, #f3d794, #b88a44);
  outline: none;
  box-shadow: 0 10px 20px rgba(184, 138, 68, 0.28);
}

body.reservation-dialog-resizing,
body.reservation-dialog-resizing * {
  cursor: nwse-resize !important;
  user-select: none !important;
}

.reservation-dialog.is-manually-resized .reservation-main-panel.active {
  min-height: 0;
}

.reservation-dialog.is-manually-resized .reservation-card-grid {
  min-height: clamp(200px, 34vh, 252px);
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
}

@media (max-width: 980px) {
  .reservation-dialog {
    min-width: min(640px, calc(100vw - 16px));
  }

  .reservation-dialog .modal-actions {
    padding-right: 32px;
  }
}

/* Reservation card Folio internal scroll fix */
.reservation-dialog .reservation-card-form:has(#cardFolio.active) {
  grid-template-rows: auto auto minmax(0, 1fr) auto !important;
  overflow: hidden;
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio.active {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 0;
  max-height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding-right: 12px;
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio.active::-webkit-scrollbar {
  width: 10px;
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio.active::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(226, 232, 240, 0.92);
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio.active::-webkit-scrollbar-thumb {
  border: 2px solid rgba(226, 232, 240, 0.92);
  border-radius: 999px;
  background: linear-gradient(180deg, #d7b36a, #0b2540);
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio .folio-grid {
  position: sticky;
  top: 0;
  z-index: 2;
  margin: 0 0 10px;
  padding-bottom: 8px;
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.98), rgba(255, 253, 248, 0.88));
  backdrop-filter: blur(8px);
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio .folio-ledger {
  min-height: 0;
  padding-bottom: 8px;
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio .folio-ledger .table-wrap {
  overflow: visible !important;
  max-height: none !important;
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio .folio-ledger thead th {
  position: sticky !important;
  top: calc(var(--folio-sticky-offset, 0px) + 0px) !important;
  z-index: 3 !important;
  background: linear-gradient(180deg, #fff5dc 0%, #f1ddbb 100%) !important;
  box-shadow: 0 1px 0 rgba(185, 139, 59, 0.28), 0 10px 18px rgba(18, 38, 64, 0.08);
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio .folio-ledger thead th:first-child {
  border-top-left-radius: 14px;
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio .folio-ledger thead th:last-child {
  border-top-right-radius: 14px;
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) .modal-actions {
  align-self: end;
  position: relative !important;
  z-index: 4;
  flex: 0 0 auto;
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) .reservation-dialog-resize-handle {
  z-index: 5;
}

/* Dark Premium compatibility layer. */
html[data-theme="dark"] {
  color-scheme: dark;
}

body.theme-dark {
  --bg: #06111f;
  --surface: #0d192b;
  --surface-2: #122035;
  --text: #f8fbff;
  --muted: #a9b7cc;
  --line: rgba(215, 181, 110, 0.18);
  --accent: #071b33;
  --accent-strong: #06111f;
  --sidebar-active: #173252;
  --gold: #d7b56e;
  --cyotel-navy: #071b33;
  --cyotel-cream: #faf7f1;
  --cyotel-gold-light: #e2c88d;
  --cyotel-gold: #d7b56e;
  --cyotel-gold-dark: #b98b3b;
  --shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
  --soft-shadow: 0 16px 42px rgba(0, 0, 0, 0.22);
  --border-color: rgba(215, 181, 110, 0.18);
  --card-bg: rgba(13, 25, 43, 0.92);
  background:
    radial-gradient(circle at 18% 6%, rgba(215, 181, 110, 0.16), transparent 32%),
    radial-gradient(circle at 88% 0%, rgba(72, 125, 185, 0.12), transparent 28%),
    linear-gradient(145deg, #06111f 0%, #0b1727 54%, #050b14 100%) !important;
  color: var(--text) !important;
}

body.theme-dark .app-shell,
body.theme-dark .main,
body.theme-dark .main:has(.view.active),
body.theme-dark .main:has(#home.home-command-center.active),
body.theme-dark .main:has(#setup.setup-command-center.active),
body.theme-dark .main:has(#reports.reports-command-center.active),
body.theme-dark .main:has(#logs.active),
body.theme-dark .main:has(#accounting.active),
body.theme-dark .main:has(#guests.active),
body.theme-dark .main:has(#housekeeping.active) {
  background:
    radial-gradient(circle at 16% 0%, rgba(215, 181, 110, 0.13), transparent 30%),
    linear-gradient(145deg, #06111f 0%, #0b1727 56%, #050b14 100%) !important;
  color: var(--text) !important;
}

body.theme-dark .login-screen {
  background:
    radial-gradient(circle at 22% 12%, rgba(215, 181, 110, 0.16), transparent 34%),
    linear-gradient(145deg, #06111f, #0b1727 58%, #050b14) !important;
}

body.theme-dark .login-card,
body.theme-dark .panel,
body.theme-dark .metric,
body.theme-dark .empty-module,
body.theme-dark .modal-card,
body.theme-dark dialog,
body.theme-dark .setup-header,
body.theme-dark .table-wrap,
body.theme-dark .form-grid,
body.theme-dark .guest-card,
body.theme-dark .reservation-detail,
body.theme-dark .reservation-summary,
body.theme-dark .setup-command-shell,
body.theme-dark .home-command-center,
body.theme-dark .reports-command-shell,
body.theme-dark .logs-command-shell,
body.theme-dark .crm-command-shell,
body.theme-dark .accounting-command-shell,
body.theme-dark .hk-hero,
body.theme-dark .housekeeping-command-center .panel,
body.theme-dark .booking-engine-host-header,
body.theme-dark .home-hero,
body.theme-dark .home-panel,
body.theme-dark .home-side-panel,
body.theme-dark .home-metric,
body.theme-dark .home-signal,
body.theme-dark .home-ops-card,
body.theme-dark .home-notice-card,
body.theme-dark .setup-hero-main,
body.theme-dark .setup-hero-side,
body.theme-dark .setup-metric-card,
body.theme-dark .setup-flow-panel,
body.theme-dark .reports-command-hero,
body.theme-dark .reports-kpi-card,
body.theme-dark .reports-table-panel,
body.theme-dark .reports-insight-panel,
body.theme-dark .logs-hero-grid,
body.theme-dark .logs-kpi-card,
body.theme-dark .logs-table-panel,
body.theme-dark .crm-command-hero,
body.theme-dark .crm-panel,
body.theme-dark .crm-ops-card,
body.theme-dark .accounting-kpi-card,
body.theme-dark .accounting-risk-panel,
body.theme-dark .accounting-voucher-preview-panel,
body.theme-dark .hk-stat,
body.theme-dark .hk-room-card,
body.theme-dark .hk-task-card,
body.theme-dark .room-card,
body.theme-dark .room-rack-card,
body.theme-dark .availability-card,
body.theme-dark .day-card,
body.theme-dark .reservation-card,
body.theme-dark .web-review-card,
body.theme-dark .crm-template-card,
body.theme-dark .whatsapp-preview-card,
body.theme-dark .cash-bank-card,
body.theme-dark .current-account-card,
body.theme-dark .invoice-readiness-card,
body.theme-dark .log-card {
  background: linear-gradient(180deg, rgba(13,25,43,.96), rgba(18,32,53,.82)) !important;
  border-color: rgba(215,181,110,.18) !important;
  color: var(--text) !important;
  box-shadow: var(--soft-shadow) !important;
}

body.theme-dark .topbar,
body.theme-dark .main:has(.view.active) .topbar,
body.theme-dark .main:has(#home.home-command-center.active) .topbar,
body.theme-dark .main:has(#reports.reports-command-center.active) .topbar,
body.theme-dark .main:has(#logs.active) .topbar,
body.theme-dark .main:has(#accounting.active) .topbar,
body.theme-dark .main:has(#guests.active) .topbar,
body.theme-dark .main:has(#housekeeping.active) .topbar {
  background: rgba(13, 25, 43, 0.82) !important;
  border-color: rgba(215,181,110,.16) !important;
  color: var(--text) !important;
  backdrop-filter: blur(18px);
}

body.theme-dark h1,
body.theme-dark h2,
body.theme-dark h3,
body.theme-dark h4,
body.theme-dark .panel-header h3,
body.theme-dark .setup-header h2,
body.theme-dark .home-hero-main h2,
body.theme-dark .reports-command-hero h2,
body.theme-dark .logs-hero h2,
body.theme-dark .crm-command-hero h2,
body.theme-dark .accounting-command-hero h2,
body.theme-dark .hk-hero h2,
body.theme-dark .metric strong,
body.theme-dark .metric-card strong,
body.theme-dark .home-metric strong,
body.theme-dark .home-signal strong,
body.theme-dark .home-panel-head h3,
body.theme-dark .home-ops-card strong,
body.theme-dark .setup-metric-card strong,
body.theme-dark .reports-kpi-card strong,
body.theme-dark .logs-kpi-card strong,
body.theme-dark .accounting-kpi-card strong,
body.theme-dark .crm-command-shell strong,
body.theme-dark .hk-stat strong {
  color: #f8fbff !important;
}

body.theme-dark p,
body.theme-dark small,
body.theme-dark .muted,
body.theme-dark .panel-header span,
body.theme-dark .setup-header p,
body.theme-dark .home-hero-main p,
body.theme-dark .reports-command-hero p,
body.theme-dark .logs-hero p,
body.theme-dark .crm-command-hero p,
body.theme-dark .accounting-command-hero p,
body.theme-dark .hk-hero p,
body.theme-dark .home-ops-card small,
body.theme-dark .home-notice-card p,
body.theme-dark .setup-metric-card small,
body.theme-dark .reports-kpi-card small,
body.theme-dark .logs-kpi-card small,
body.theme-dark .accounting-kpi-card small {
  color: var(--muted) !important;
}

body.theme-dark input,
body.theme-dark select,
body.theme-dark textarea,
body.theme-dark .input-like,
body.theme-dark .search-input {
  background: rgba(5, 11, 20, 0.92) !important;
  border-color: rgba(215,181,110,.20) !important;
  color: var(--text) !important;
}

body.theme-dark thead th,
body.theme-dark table th {
  background: rgba(215,181,110,.10) !important;
  border-color: rgba(215,181,110,.16) !important;
  color: #d7b56e !important;
}

body.theme-dark tbody td,
body.theme-dark table td {
  background: rgba(13,25,43,.92) !important;
  border-color: rgba(215,181,110,.10) !important;
  color: var(--text) !important;
}


/* Reservation table restore: light header surface + Excel-like column handles across PMS tables. */
.table-wrap {
  border-radius: 20px;
  background: transparent;
}

body.theme-light #foReservations .table-wrap,
body.theme-light .table-wrap:has(table.pms-resizable-table) {
  background: linear-gradient(180deg, rgba(255,255,255,.86), rgba(250,247,241,.78));
  border: 1px solid rgba(7,27,51,.08);
  box-shadow: 0 16px 44px rgba(18,32,53,.08);
}

body.theme-light table.pms-resizable-table thead,
body.theme-light table.pms-resizable-table thead tr,
body.theme-light table.pms-resizable-table thead th {
  background: linear-gradient(180deg, #fbf1dc 0%, #f8ead0 100%) !important;
  color: #14233a !important;
  border-color: rgba(7,27,51,.10) !important;
}

body.theme-dark table.pms-resizable-table thead,
body.theme-dark table.pms-resizable-table thead tr,
body.theme-dark table.pms-resizable-table thead th {
  background: linear-gradient(180deg, rgba(13,25,43,.98), rgba(9,23,41,.94)) !important;
  color: #f8fbff !important;
  border-color: rgba(215,181,110,.18) !important;
}

table.pms-resizable-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

table.pms-resizable-table th.pms-resizable-header {
  position: relative;
  overflow: visible;
}

table.pms-resizable-table th > *:not(.pms-column-resizer) {
  min-inline-size: 0;
  max-inline-size: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pms-column-resizer {
  position: absolute;
  inset-block: 5px;
  inset-inline-end: -3px;
  width: 8px;
  cursor: col-resize;
  z-index: 5;
  touch-action: none;
}

.pms-column-resizer::before {
  content: "";
  position: absolute;
  inset-block: 0;
  left: 3px;
  width: 2px;
  border-radius: 999px;
  background: rgba(7,27,51,.18);
}

body.theme-dark .pms-column-resizer::before {
  background: rgba(215,181,110,.34);
}

.pms-column-resizer:hover::before,
body.pms-column-resizing .pms-column-resizer::before {
  background: #d7b56e;
  box-shadow: 0 0 0 3px rgba(215,181,110,.16);
}

body.pms-column-resizing {
  cursor: col-resize !important;
  user-select: none;
}

#foReservations .frontoffice-check-flow-shell[hidden] {
  display: none !important;
}

/* Reservation table light-mode cream surface fix after legacy pre-TASK09 rules. */
body.theme-light #foReservations.frontoffice-tab-panel .table-wrap,
body.theme-light #foReservations .table-wrap,
body.theme-light #frontofficeReservationsGrid,
body.theme-light #frontofficeReservationsGrid thead,
body.theme-light #frontofficeReservationsGrid thead tr {
  background: linear-gradient(180deg, #fff8ea 0%, #fbf1dc 100%) !important;
}

body.theme-light #foReservations.frontoffice-tab-panel .table-wrap {
  border: 1px solid rgba(7,27,51,.10) !important;
  box-shadow: 0 16px 44px rgba(18,32,53,.08) !important;
}

body.theme-light #frontofficeReservationsGrid thead th {
  background: linear-gradient(180deg, #fff8ea 0%, #f7e8cb 100%) !important;
  color: #14233a !important;
}

/* Final override for the legacy light-mode white strip behind Front Office reservation headers. */
body.theme-light #frontoffice.setup-workspace #foReservations.frontoffice-tab-panel .table-wrap,
body.theme-light #frontoffice #foReservations.frontoffice-tab-panel .table-wrap,
body.theme-light #frontoffice.setup-workspace #foReservations.frontoffice-tab-panel table#frontofficeReservationsGrid,
body.theme-light #frontoffice #foReservations.frontoffice-tab-panel table#frontofficeReservationsGrid {
  background: linear-gradient(180deg, #fff8ea 0%, #fbf1dc 100%) !important;
  background-color: #fbf1dc !important;
  background-image: linear-gradient(180deg, #fff8ea 0%, #fbf1dc 100%) !important;
}

/* Kullanıcı Bilgileri: light mode yetki ağacı */
body.theme-light #userInfo .user-permission-builder {
  border-color: rgba(185, 139, 59, 0.18);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(255, 248, 235, 0.88));
  box-shadow: 0 18px 42px rgba(148, 113, 42, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

body.theme-light #userInfo .permission-builder-head strong,
body.theme-light #userInfo .permission-node.parent strong,
body.theme-light #userInfo .permission-node.child {
  color: #14233a;
}

body.theme-light #userInfo .permission-builder-head span,
body.theme-light #userInfo .permission-builder-head small,
body.theme-light #userInfo .permission-node.parent small,
body.theme-light #userInfo .permission-count {
  color: #526174;
}

body.theme-light #userInfo .permission-builder-head small {
  border-color: rgba(185, 139, 59, 0.28);
  background: rgba(255, 248, 235, 0.92);
  color: #8a5a12;
}

body.theme-light #userInfo .permission-group {
  border-color: rgba(185, 139, 59, 0.16);
  background: rgba(255, 255, 255, 0.74);
}

body.theme-light #userInfo .permission-node.parent {
  border-bottom-color: rgba(185, 139, 59, 0.14);
}

body.theme-light #userInfo .permission-node.child {
  background: rgba(255, 255, 255, 0.82);
  box-shadow: inset 0 0 0 1px rgba(185, 139, 59, 0.08);
}

body.theme-light #userInfo .permission-node.child:hover {
  background: rgba(255, 248, 235, 0.96);
}

/* Kullanıcı Bilgileri: rol seçimi modal düzeni */
#userInfo .users-command-workspace-single {
  grid-template-columns: minmax(0, 1fr);
}

#userInfo .users-role-panel,
#userInfo .role-definition-grid {
  display: none !important;
}

#userInfo .role-picker-field {
  display: grid;
  gap: var(--s08);
}

#userInfo .field-label {
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 800;
}

#userInfo .field-help {
  color: var(--muted);
  font-size: 12px;
}

#userInfo .role-picker-button {
  width: 100%;
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s12);
  border: 1px solid rgba(185, 139, 59, 0.22);
  border-radius: 18px;
  padding: 12px 14px;
  text-align: left;
  background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(255,248,235,.9));
  color: #14233a;
  box-shadow: 0 16px 36px rgba(148, 113, 42, 0.10);
  cursor: pointer;
}

#userInfo .role-picker-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 20px 46px rgba(148, 113, 42, 0.16);
}

#userInfo .role-picker-button:disabled {
  cursor: not-allowed;
  opacity: .72;
  transform: none;
}

#userInfo .role-picker-button span {
  display: grid;
  gap: 4px;
}

#userInfo .role-picker-button strong {
  color: #14233a;
  font-size: 14px;
}

#userInfo .role-picker-button small {
  color: #526174;
  font-size: 12px;
  font-weight: 700;
}

#userInfo .role-picker-button em {
  border: 1px solid rgba(185, 139, 59, 0.28);
  border-radius: 999px;
  padding: 8px 12px;
  color: #8a5a12;
  background: rgba(255, 248, 235, .96);
  font-style: normal;
  font-weight: 900;
}

.user-permission-modal {
  width: min(1120px, calc(100vw - 44px));
  max-height: min(820px, calc(100vh - 44px));
  border: 1px solid rgba(185, 139, 59, 0.20);
  border-radius: 28px;
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,248,235,.94));
  color: #14233a;
  box-shadow: 0 34px 90px rgba(20, 35, 58, .24);
}

.user-permission-modal::backdrop {
  background: rgba(15, 23, 42, .46);
  backdrop-filter: blur(7px);
}

.user-permission-modal .modal-header span {
  color: #526174;
  font-weight: 700;
}

.user-permission-modal .permission-modal-builder {
  margin: 18px 0;
  max-height: min(560px, calc(100vh - 250px));
  overflow: auto;
}

.user-permission-modal .permission-tree {
  display: grid;
  grid-template-columns: repeat(3, minmax(240px, 1fr));
  gap: 14px;
  align-items: start;
}

@media (max-width: 960px) {
  .user-permission-modal .permission-tree {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }
}

@media (max-width: 640px) {
  .user-permission-modal .permission-tree {
    grid-template-columns: 1fr;
  }
}


/* PMS-wide premium table headers + Excel-like column resize handles */
table.pms-resizable-table {
  table-layout: fixed;
  inline-size: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

table.pms-resizable-table thead,
table.pms-resizable-table thead tr,
table.pms-resizable-table thead th,
#foReservations table.pms-resizable-table thead th,
body.theme-light table.pms-resizable-table thead th {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--cyotel-cream) 92%, var(--cyotel-gold-light) 8%), color-mix(in srgb, var(--cyotel-cream) 78%, var(--cyotel-gold) 22%)) !important;
  color: var(--cyotel-navy) !important;
  border-block-end: 1px solid color-mix(in srgb, var(--cyotel-gold) 34%, var(--line) 66%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.58) !important;
}

body.premium-pms:not(.theme-light) table.pms-resizable-table thead,
body.premium-pms:not(.theme-light) table.pms-resizable-table thead tr,
body.premium-pms:not(.theme-light) table.pms-resizable-table thead th,
body:not(.theme-light) #frontoffice.setup-workspace table.pms-resizable-table thead th,
body:not(.theme-light) #reports.reports-command-center table.pms-resizable-table thead th,
body:not(.theme-light) #logs table.pms-resizable-table thead th,
body:not(.theme-light) #accounting table.pms-resizable-table thead th {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--cyotel-navy) 88%, var(--cyotel-gold-light) 12%), color-mix(in srgb, var(--cyotel-navy) 96%, black 4%)) !important;
  color: color-mix(in srgb, var(--cyotel-cream) 82%, var(--cyotel-gold-light) 18%) !important;
  border-block-end: 1px solid rgba(215,181,110,.24) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

table.pms-resizable-table th,
table.pms-resizable-table td,
table.pms-resizable-table th > *:not(.pms-column-resizer),
table.pms-resizable-table td > * {
  min-inline-size: 0;
  max-inline-size: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

table.pms-resizable-table th,
table.pms-resizable-table td {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

table.pms-resizable-table .status,
table.pms-resizable-table .badge,
table.pms-resizable-table .pill,
table.pms-resizable-table .premium-pill,
table.pms-resizable-table .reservation-primary-status {
  max-inline-size: 100%;
  white-space: nowrap !important;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal !important;
}

table.pms-resizable-table thead th.pms-resizable-header {
  position: relative;
  padding-inline-end: 12px !important;
}

table.pms-resizable-table thead th .table-sort,
table.pms-resizable-table thead th > button,
table.pms-resizable-table thead th .sort-caret,
body.theme-light table.pms-resizable-table thead th .table-sort,
body.theme-light table.pms-resizable-table thead th > button:not(.active),
body.theme-light table.pms-resizable-table thead th .sort-caret {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
}

table.pms-resizable-table .pms-column-resizer {
  position: absolute;
  inset-block: 5px;
  inset-inline-end: -3px;
  inline-size: 7px;
  z-index: 6;
  cursor: col-resize;
  touch-action: none;
  background:
    linear-gradient(90deg, transparent 0 2px, rgba(11,29,54,.22) 2px 3px, rgba(215,181,110,.54) 3px 4px, transparent 4px 100%) !important;
  border: 0 !important;
  box-shadow: none !important;
  opacity: .72;
}

body.premium-pms:not(.theme-light) table.pms-resizable-table .pms-column-resizer,
body:not(.theme-light) #frontoffice.setup-workspace table.pms-resizable-table .pms-column-resizer {
  background:
    linear-gradient(90deg, transparent 0 2px, rgba(255,247,220,.18) 2px 3px, rgba(215,181,110,.74) 3px 4px, transparent 4px 100%) !important;
}

table.pms-resizable-table .pms-column-resizer:hover,
table.pms-resizable-table.is-resizing-columns .pms-column-resizer {
  opacity: 1;
}

body.pms-column-resize-active,
body.pms-column-resize-active * {
  cursor: col-resize !important;
  user-select: none !important;
}


/* Reservation card side-tab workspace */
.reservation-dialog {
  width: min(1280px, calc(100vw - 16px));
  max-height: calc(100vh - 12px);
}

.reservation-card-form {
  min-height: min(680px, calc(100vh - 18px));
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 8px;
}

.reservation-card-header {
  position: relative;
}

.reservation-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.reservation-corner-grip {
  position: relative;
  display: inline-block;
  width: 34px;
  height: 28px;
  opacity: 0.95;
}

.reservation-corner-grip i {
  position: absolute;
  right: 4px;
  display: block;
  width: 18px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255,255,255,0.22), rgba(243,215,148,1));
  box-shadow: 0 2px 8px rgba(184,138,68,0.28);
  transform: rotate(-45deg);
  transform-origin: center;
}

.reservation-corner-grip i:nth-child(1) { top: 5px; }
.reservation-corner-grip i:nth-child(2) { top: 12px; }
.reservation-corner-grip i:nth-child(3) { top: 19px; }

.reservation-card-shell {
  display: grid;
  grid-template-columns: 188px minmax(0, 1fr);
  gap: 12px;
  min-height: 0;
}

.reservation-card-sidebar {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
  padding: 10px;
  border: 1px solid rgba(184, 138, 68, 0.20);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(16,24,39,0.98), rgba(32,43,66,0.96));
  box-shadow: 0 18px 38px rgba(16, 24, 39, 0.16);
}

.reservation-side-title {
  display: grid;
  gap: 3px;
  padding: 5px 6px 9px;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}

.reservation-side-title span {
  color: rgba(231,215,189,0.82);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.reservation-side-title strong {
  color: #fff;
  font-size: 17px;
  letter-spacing: -0.03em;
}

.reservation-card-sidebar button {
  display: grid;
  gap: 3px;
  width: 100%;
  min-height: 58px;
  padding: 10px 11px;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 14px;
  color: rgba(255,255,255,0.76);
  text-align: left;
  background: rgba(255,255,255,0.05);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}

.reservation-card-sidebar button span {
  font-size: 13px;
  font-weight: 900;
}

.reservation-card-sidebar button small {
  color: rgba(231,215,189,0.72);
  font-size: 10px;
  font-weight: 700;
}

.reservation-card-sidebar button:hover,
.reservation-card-sidebar button.active {
  color: #101827;
  border-color: rgba(243,215,148,0.90);
  background: linear-gradient(135deg, #fff7df, #f3d794 58%, #b88a44);
  box-shadow: 0 12px 24px rgba(184, 138, 68, 0.24);
}

.reservation-card-sidebar button:hover small,
.reservation-card-sidebar button.active small {
  color: rgba(16,24,39,0.68);
}

.reservation-card-workspace {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.reservation-card-form .reservation-card-panel {
  min-height: 100%;
  max-height: calc(100vh - 168px);
  overflow: auto;
  padding: 14px;
  border: 1px solid rgba(227, 221, 210, 0.92);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,0.84), rgba(255,250,239,0.64));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 14px 34px rgba(16,24,39,0.06);
}

.reservation-card-form .reservation-card-panel[hidden] {
  display: none !important;
}

.reservation-card-form .reservation-card-panel.active {
  display: block;
}

.reservation-card-form .reservation-main-panel.active {
  display: block;
}

.reservation-panel-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(227,221,210,0.86);
}

.reservation-panel-heading span {
  color: #b88a44;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.reservation-panel-heading h4 {
  margin: 2px 0 0;
  color: #101827;
  font-size: 20px;
  line-height: 1;
  letter-spacing: -0.04em;
}

.reservation-panel-heading small {
  color: #667085;
  font-weight: 800;
}

.reservation-card-form .reservation-main-panel .reservation-card-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px 12px;
  align-content: start;
}

.reservation-card-form .reservation-main-panel .reservation-card-grid input,
.reservation-card-form .reservation-main-panel .reservation-card-grid select,
.reservation-card-form .reservation-main-panel .reservation-card-grid .room-picker-button {
  min-height: 36px;
  font-size: 13px;
}

.reservation-card-form .reservation-record-meta {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 14px;
}

.reservation-card-form #cardGuests .guest-lines,
.reservation-card-form #cardPricing,
.reservation-card-form #cardFolio,
.reservation-card-form #cardNotes {
  min-height: 220px;
}

.reservation-card-form #cardPricing label,
.reservation-card-form #cardNotes label {
  max-width: 620px;
}

.reservation-card-form #cardNotes textarea {
  min-height: 180px;
  padding: 12px;
  resize: vertical;
}

.reservation-card-form .modal-actions {
  align-self: end;
  margin-top: 0;
}

@media (max-width: 900px) {
  .reservation-card-shell {
    grid-template-columns: 1fr;
  }

  .reservation-card-sidebar {
    display: grid;
    grid-template-columns: repeat(5, minmax(112px, 1fr));
    overflow-x: auto;
  }

  .reservation-side-title {
    grid-column: 1 / -1;
  }

  .reservation-card-form .reservation-main-panel .reservation-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* Reservation card top tabs + live resize handle */
#reservationDialog.reservation-dialog {
  width: min(1260px, calc(100vw - 16px));
  height: min(760px, calc(100dvh - 18px));
  min-width: min(640px, calc(100vw - 16px));
  min-height: min(420px, calc(100dvh - 18px));
  max-width: calc(100vw - 16px);
  max-height: calc(100dvh - 18px);
  resize: none;
}

#reservationDialog .reservation-card-form {
  height: 100% !important;
  min-height: 0 !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  container-type: inline-size;
  container-name: reservation-card;
}

#reservationDialog .reservation-corner-grip {
  cursor: nwse-resize;
  touch-action: none;
  border-radius: 10px;
  outline: none;
}

#reservationDialog .reservation-corner-grip:hover,
#reservationDialog .reservation-corner-grip:focus-visible,
#reservationDialog.is-resizing .reservation-corner-grip {
  background: rgba(243, 215, 148, 0.18);
  box-shadow: inset 0 0 0 1px rgba(243, 215, 148, 0.38);
}

#reservationDialog.is-resizing,
#reservationDialog.is-resizing * {
  user-select: none;
}

#reservationDialog .reservation-card-shell {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto minmax(0, 1fr);
  gap: clamp(8px, 1.2cqw, 14px);
  min-height: 0;
  overflow: hidden;
}

#reservationDialog .reservation-card-topbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  min-width: 0;
  padding: clamp(7px, 0.9cqw, 12px);
  border: 1px solid rgba(184, 138, 68, 0.24);
  border-radius: clamp(14px, 1.5cqw, 20px);
  background:
    linear-gradient(135deg, rgba(10,26,48,0.98), rgba(20,45,73,0.94)),
    radial-gradient(circle at 14% 0%, rgba(243,215,148,0.18), transparent 34%);
  box-shadow: 0 14px 34px rgba(16, 24, 39, 0.14);
}

#reservationDialog .reservation-card-tablist {
  display: grid;
  grid-template-columns: repeat(5, minmax(92px, 1fr));
  gap: clamp(5px, 0.8cqw, 10px);
  min-width: 0;
}

#reservationDialog .reservation-card-tablist button {
  display: grid;
  align-content: center;
  gap: 2px;
  min-width: 0;
  min-height: clamp(44px, 4.4cqw, 60px);
  padding: clamp(7px, 0.95cqw, 11px) clamp(8px, 1cqw, 12px);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: clamp(12px, 1.2cqw, 16px);
  color: rgba(255,255,255,0.82);
  text-align: left;
  background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.035));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.07), 0 8px 18px rgba(0,0,0,0.10);
}

#reservationDialog .reservation-card-tablist button span {
  overflow: hidden;
  font-size: clamp(12px, 1.03cqw, 14px);
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#reservationDialog .reservation-card-tablist button small {
  overflow: hidden;
  color: rgba(231,215,189,0.72);
  font-size: clamp(9px, 0.76cqw, 11px);
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#reservationDialog .reservation-card-tablist button:hover,
#reservationDialog .reservation-card-tablist button.active {
  color: #101827;
  border-color: rgba(243,215,148,0.92);
  background: linear-gradient(135deg, #fff7df, #f3d794 58%, #b88a44);
  box-shadow: 0 10px 22px rgba(184, 138, 68, 0.24);
}

#reservationDialog .reservation-card-tablist button:hover small,
#reservationDialog .reservation-card-tablist button.active small {
  color: rgba(16,24,39,0.68);
}

#reservationDialog .reservation-card-workspace {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

#reservationDialog .reservation-card-form .reservation-card-panel {
  min-height: 0;
  max-height: none;
  height: 100%;
  overflow: auto;
  padding: clamp(10px, 1.15cqw, 16px);
  border-radius: clamp(14px, 1.45cqw, 20px);
}

#reservationDialog .reservation-panel-heading {
  gap: clamp(8px, 1cqw, 14px);
  margin-bottom: clamp(7px, 1cqw, 12px);
  padding-bottom: clamp(7px, 1cqw, 12px);
}

#reservationDialog .reservation-panel-heading h4 {
  font-size: clamp(18px, 1.8cqw, 26px);
}

#reservationDialog .reservation-panel-heading small,
#reservationDialog .reservation-card-form label {
  font-size: clamp(11px, 0.9cqw, 13px);
}

#reservationDialog .reservation-card-form .reservation-main-panel .reservation-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(clamp(128px, 15cqw, 210px), 1fr));
  gap: clamp(7px, 0.95cqw, 14px);
  min-height: 0;
}

#reservationDialog .reservation-card-form input,
#reservationDialog .reservation-card-form select,
#reservationDialog .reservation-card-form textarea,
#reservationDialog .reservation-card-form .room-picker-button,
#reservationDialog .reservation-card-form .guest-line-button {
  min-height: clamp(30px, 3.1cqw, 42px);
  padding: clamp(6px, 0.8cqw, 10px) clamp(8px, 0.95cqw, 12px);
  font-size: clamp(11px, 0.95cqw, 14px);
}

#reservationDialog #cardFolio .folio-grid {
  grid-template-columns: repeat(auto-fit, minmax(clamp(118px, 13cqw, 180px), 1fr));
  gap: clamp(6px, 0.85cqw, 12px);
}

#reservationDialog #cardFolio table {
  font-size: clamp(11px, 0.85cqw, 13px);
}

#reservationDialog .modal-actions {
  flex: 0 0 auto;
}

#reservationDialog .reservation-card-actions {
  position: relative;
  align-items: center;
  justify-content: flex-end !important;
  gap: 8px;
}

#reservationDialog .reservation-card-actions .reservation-corner-grip {
  order: 2;
  margin: 0 -2px 0 4px;
  align-self: flex-end;
}

#reservationDialog .reservation-card-actions .primary-button {
  order: 3;
}

#reservationDialog .reservation-card-actions .ghost-button {
  order: 1;
}

body.theme-light #reservationDialog .reservation-card-topbar {
  background:
    linear-gradient(135deg, rgba(255,255,255,0.96), rgba(250,244,232,0.94)),
    radial-gradient(circle at 14% 0%, rgba(184,138,68,0.16), transparent 34%) !important;
  border-color: rgba(184, 138, 68, 0.24) !important;
  box-shadow: 0 14px 30px rgba(83, 64, 38, 0.10) !important;
}

body.theme-light #reservationDialog .reservation-card-tablist button {
  color: #223047;
  border-color: rgba(18,38,64,0.12);
  background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(246,241,232,0.86));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.78), 0 8px 18px rgba(83,64,38,0.08);
}

body.theme-light #reservationDialog .reservation-card-tablist button small {
  color: rgba(64,76,96,0.72);
}

body.theme-light #reservationDialog .reservation-card-tablist button:hover,
body.theme-light #reservationDialog .reservation-card-tablist button.active {
  color: #101827;
  border-color: rgba(184,138,68,0.48);
  background: linear-gradient(135deg, #fff7df, #f3d794 58%, #c99a54);
  box-shadow: 0 10px 22px rgba(184,138,68,0.18);
}

body.theme-light #reservationDialog .reservation-corner-grip i {
  background: linear-gradient(90deg, rgba(20,34,55,0.18), rgba(184,138,68,0.96));
  box-shadow: 0 2px 8px rgba(184,138,68,0.20);
}

@container reservation-card (max-width: 820px) {
  #reservationDialog .reservation-card-tablist {
    grid-template-columns: repeat(5, minmax(84px, 1fr));
    overflow-x: auto;
  }
}

@media (max-width: 760px) {
  #reservationDialog.reservation-dialog {
    min-width: min(640px, calc(100vw - 16px));
  }
  #reservationDialog .reservation-card-tablist {
    grid-template-columns: repeat(5, minmax(112px, 1fr));
  }
}

body.theme-light #reservationDialog .reservation-card-tablist button:hover,
body.theme-light #reservationDialog .reservation-card-tablist button.active,
body.theme-light #reservationDialog .reservation-card-tablist button[aria-selected="true"] {
  color: #101827 !important;
  border-color: rgba(184,138,68,0.50) !important;
  background: linear-gradient(135deg, #fff7df, #f3d794 58%, #c99a54) !important;
  box-shadow: 0 10px 22px rgba(184,138,68,0.18) !important;
}

body.theme-light #reservationDialog .reservation-card-tablist button:hover small,
body.theme-light #reservationDialog .reservation-card-tablist button.active small,
body.theme-light #reservationDialog .reservation-card-tablist button[aria-selected="true"] small {
  color: rgba(16,24,39,0.68) !important;
}

body:not(.theme-light) #reservationDialog .reservation-card-form .reservation-card-panel,
body.theme-dark #reservationDialog .reservation-card-form .reservation-card-panel {
  color: rgba(241,246,255,0.94) !important;
  border-color: rgba(243,215,148,0.20) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(243,215,148,0.10), transparent 28%),
    linear-gradient(180deg, rgba(18,37,62,0.98), rgba(10,23,39,0.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 18px 38px rgba(0,0,0,0.26) !important;
}

body:not(.theme-light) #reservationDialog .reservation-panel-heading,
body.theme-dark #reservationDialog .reservation-panel-heading {
  border-bottom-color: rgba(243,215,148,0.18) !important;
}

body:not(.theme-light) #reservationDialog .reservation-panel-heading h4,
body.theme-dark #reservationDialog .reservation-panel-heading h4,
body:not(.theme-light) #reservationDialog .reservation-card-form label,
body.theme-dark #reservationDialog .reservation-card-form label {
  color: rgba(241,246,255,0.94) !important;
}

body:not(.theme-light) #reservationDialog .reservation-panel-heading small,
body.theme-dark #reservationDialog .reservation-panel-heading small {
  color: rgba(188,204,225,0.78) !important;
}

body:not(.theme-light) #reservationDialog .reservation-card-form input,
body:not(.theme-light) #reservationDialog .reservation-card-form select,
body:not(.theme-light) #reservationDialog .reservation-card-form textarea,
body:not(.theme-light) #reservationDialog .reservation-card-form .room-picker-button,
body.theme-dark #reservationDialog .reservation-card-form input,
body.theme-dark #reservationDialog .reservation-card-form select,
body.theme-dark #reservationDialog .reservation-card-form textarea,
body.theme-dark #reservationDialog .reservation-card-form .room-picker-button {
  color: rgba(255,255,255,0.94) !important;
  border-color: rgba(216,226,238,0.18) !important;
  background: linear-gradient(180deg, rgba(10,18,30,0.96), rgba(16,26,41,0.94)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05) !important;
}

body:not(.theme-light) #reservationDialog .reservation-card-form input[readonly],
body.theme-dark #reservationDialog .reservation-card-form input[readonly] {
  color: rgba(243,215,148,0.96) !important;
}

body:not(.theme-light) #reservationDialog .modal-actions,
body.theme-dark #reservationDialog .modal-actions {
  border-top: 1px solid rgba(243,215,148,0.14) !important;
  background: linear-gradient(180deg, rgba(8,18,32,0.92), rgba(7,16,28,0.98)) !important;
}

body:not(.theme-light) #reservationDialog .reservation-card-form .reservation-record-meta,
body.theme-dark #reservationDialog .reservation-card-form .reservation-record-meta {
  color: rgba(221,231,246,0.88) !important;
  border: 1px solid rgba(243,215,148,0.16) !important;
  background: linear-gradient(180deg, rgba(20,38,61,0.92), rgba(12,24,40,0.90)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05) !important;
}

body:not(.theme-light) #reservationDialog .reservation-card-form .reservation-record-meta strong,
body.theme-dark #reservationDialog .reservation-card-form .reservation-record-meta strong {
  color: rgba(255,255,255,0.94) !important;
}

body.theme-light #reservationDialog .reservation-card-form .reservation-record-meta {
  color: #14233a !important;
  border: 1px solid rgba(184,138,68,0.18) !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(250,244,232,0.90)) !important;
}

/* Reservation resize handle: keep it on the bottom-right corner after Kaydet */
#reservationDialog .reservation-card-actions {
  justify-content: flex-end !important;
  padding-right: 4px !important;
}

#reservationDialog .reservation-card-actions .ghost-button {
  order: 1 !important;
  margin-right: 56px !important;
}

#reservationDialog .reservation-card-actions .primary-button {
  order: 2 !important;
}

#reservationDialog .reservation-card-actions .reservation-corner-grip {
  order: 3 !important;
  flex: 0 0 34px !important;
  margin: 0 0 0 6px !important;
  align-self: center !important;
}

/* 20260618: Admin login Lighthouse logo readability on dark premium panel. */
.login-card .login-logo {
  margin: 22px 0 24px !important;
  padding: 14px 18px 12px !important;
  min-height: 116px !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 50% 18%, rgba(215, 181, 110, 0.13), transparent 58%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018)) !important;
  border: 1px solid rgba(215, 181, 110, 0.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 42px rgba(0,0,0,.16) !important;
}

.login-card .login-logo img {
  width: min(400px, 92%) !important;
  max-height: 132px !important;
  object-fit: contain !important;
  opacity: 1 !important;
  filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.36)) drop-shadow(0 0 10px rgba(214, 188, 124, 0.16)) !important;
}

body.theme-light .login-card .login-logo {
  background: linear-gradient(180deg, rgba(255,255,255,.76), rgba(248,241,229,.62)) !important;
  border-color: rgba(18, 38, 64, 0.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.86), 0 14px 34px rgba(19,34,55,.08) !important;
}

body.theme-light .login-card .login-logo img {
  filter: none !important;
}

/* 20260618: Web Onay light-mode summary cards need crisp contrast, not washed glass. */
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-summary {
  gap: 18px !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-hero,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-info {
  color: #111827 !important;
  border: 1px solid rgba(17, 24, 39, 0.14) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 248, 237, 0.94)) !important;
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 248, 237, 0.94)) !important;
  box-shadow: 0 12px 28px rgba(17, 24, 39, 0.10), inset 0 1px 0 rgba(255,255,255,.95) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-hero strong,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-info strong {
  color: #07111f !important;
  -webkit-text-fill-color: #07111f !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-hero small,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-web-review-info small {
  color: #4b5563 !important;
  -webkit-text-fill-color: #4b5563 !important;
  text-shadow: none !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .premium-pill,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-pill.gold,
body.theme-light #frontoffice.setup-workspace #foReservations .premium-pill.ok {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  border-color: rgba(17, 24, 39, 0.18) !important;
  background: linear-gradient(180deg, rgba(229, 233, 240, 0.98), rgba(196, 203, 214, 0.90)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 4px 10px rgba(17,24,39,.10) !important;
}


/* Web Onay dark-mode readability patch - 20260618 */
body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-card,
body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-empty {
  border-color: rgba(215, 181, 110, 0.24);
  background:
    linear-gradient(180deg, rgba(19, 33, 55, 0.98), rgba(10, 24, 43, 0.98));
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.28);
}

body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-card-head strong,
body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-empty strong {
  color: var(--cyotel-cream);
  -webkit-text-fill-color: var(--cyotel-cream);
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.34);
}

body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-card-head small,
body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-empty small {
  color: rgba(226, 232, 240, 0.78);
  -webkit-text-fill-color: rgba(226, 232, 240, 0.78);
}

body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-kv span {
  border-color: rgba(215, 181, 110, 0.18);
  background: rgba(8, 21, 38, 0.84);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-kv small {
  color: rgba(226, 232, 240, 0.68);
  -webkit-text-fill-color: rgba(226, 232, 240, 0.68);
}

body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-kv strong {
  color: var(--cyotel-cream);
  -webkit-text-fill-color: var(--cyotel-cream);
  font-weight: 850;
}

body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-warning.warn {
  color: rgb(63, 43, 8);
  -webkit-text-fill-color: rgb(63, 43, 8);
  background: linear-gradient(135deg, rgba(255, 244, 214, 0.98), rgba(232, 183, 79, 0.92));
  border-color: rgba(215, 181, 110, 0.72);
}

body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-warning.ready {
  color: rgb(5, 46, 26);
  -webkit-text-fill-color: rgb(5, 46, 26);
  background: linear-gradient(135deg, rgba(220, 252, 231, 0.98), rgba(99, 210, 142, 0.88));
  border-color: rgba(99, 210, 142, 0.56);
}

body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-actions .ghost-button {
  color: var(--cyotel-cream);
  -webkit-text-fill-color: var(--cyotel-cream);
  border-color: rgba(215, 181, 110, 0.28);
  background: rgba(8, 21, 38, 0.86);
}

body.theme-dark #frontoffice.setup-workspace #foReservations .premium-web-review-actions .ghost-button:hover {
  border-color: rgba(215, 181, 110, 0.52);
  background: rgba(19, 33, 55, 0.96);
}

/* CyotelOS Rezervasyon Kartı v1.1 — final override after legacy side-tab rules */
.reservation-dialog {
  width: min(1400px, calc(100vw - 20px)) !important;
  height: calc(100vh - 18px) !important;
  max-height: calc(100vh - 18px) !important;
  padding: 0 !important;
  border-radius: 24px !important;
}

.reservation-card-form {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto auto !important;
  gap: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-height: calc(100vh - 18px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  border-radius: 24px !important;
}

.reservation-card-form .reservation-redesign-header.reservation-card-header {
  display: grid !important;
  grid-template-columns: minmax(180px, 1fr) auto minmax(260px, 1.25fr) auto auto !important;
  gap: 18px !important;
  align-items: center !important;
  min-height: 82px !important;
  margin: 0 !important;
  padding: 14px 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(135deg, #071d38 0%, #0b2c54 100%) !important;
  color: #ffffff !important;
}

.reservation-card-form .reservation-card-shell {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  min-height: 0 !important;
  padding: 18px 12px 0 !important;
  overflow: auto !important;
  background: linear-gradient(180deg, #fff8e8 0%, #fffdf8 42%, #f8fbff 100%) !important;
}

.reservation-card-form .reservation-card-sidebar {
  display: none !important;
}

.reservation-card-form .reservation-card-workspace {
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: visible !important;
}

.reservation-card-form .reservation-card-topbar {
  margin: 0 0 18px !important;
  padding: 10px 14px !important;
  border: 1px solid rgba(213, 187, 126, 0.34) !important;
  border-radius: 22px !important;
  background: rgba(255, 250, 239, 0.86) !important;
}

.reservation-card-form .reservation-card-tablist {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(140px, 1fr)) !important;
  gap: 14px !important;
}

.reservation-card-form .reservation-card-tablist button {
  min-height: 54px !important;
  padding: 12px 18px !important;
  border-radius: 14px !important;
}

.reservation-card-form .reservation-redesign-layout {
  display: grid !important;
  grid-template-columns: 270px minmax(0, 1fr) 210px !important;
  gap: 22px !important;
  align-items: stretch !important;
}

.reservation-card-form .reservation-card-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(120px, 1fr)) !important;
  gap: 12px 14px !important;
}

.reservation-card-form .reservation-hidden-room-field {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}

body.theme-dark .reservation-card-form .reservation-card-shell {
  background: linear-gradient(180deg, #081426 0%, #0b1525 48%, #07111f 100%) !important;
}

body.theme-dark .reservation-card-form .reservation-card-topbar {
  border-color: rgba(215, 181, 110, 0.20) !important;
  background: rgba(255, 255, 255, 0.045) !important;
}

body.theme-light #reservationDialog .reservation-card-form .reservation-redesign-header.modal-header,
body.theme-dark #reservationDialog .reservation-card-form .reservation-redesign-header.modal-header {
  margin: 0 !important;
  padding: 14px 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(135deg, #071d38 0%, #0b2c54 100%) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

body.theme-light #reservationDialog .reservation-redesign-header *,
body.theme-dark #reservationDialog .reservation-redesign-header * {
  color: inherit;
}

body.theme-light #reservationDialog .reservation-redesign-header .reservation-header-summary strong,
body.theme-light #reservationDialog .reservation-redesign-header .reservation-title-block h3,
body.theme-dark #reservationDialog .reservation-redesign-header .reservation-header-summary strong,
body.theme-dark #reservationDialog .reservation-redesign-header .reservation-title-block h3 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body.theme-light #reservationDialog .reservation-redesign-header .reservation-title-block span,
body.theme-light #reservationDialog .reservation-redesign-header .reservation-header-summary small,
body.theme-dark #reservationDialog .reservation-redesign-header .reservation-title-block span,
body.theme-dark #reservationDialog .reservation-redesign-header .reservation-header-summary small {
  color: rgba(255, 255, 255, 0.84) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.84) !important;
}

body.theme-light #reservationDialog .reservation-redesign-header .icon-button,
body.theme-dark #reservationDialog .reservation-redesign-header .icon-button {
  background: #ffffff !important;
  color: #071d38 !important;
  -webkit-text-fill-color: #071d38 !important;
}

#reservationDialog .reservation-card-actions .reservation-command-note { order: 1 !important; }
#reservationDialog .reservation-card-actions button[data-close-dialog="reservationDialog"] { order: 2 !important; }
#reservationDialog .reservation-card-actions #reservationFooterRoomButton { order: 3 !important; }
#reservationDialog .reservation-card-actions button[name="saveReservation"] { order: 4 !important; }
#reservationDialog .reservation-card-actions .reservation-corner-grip { order: 5 !important; }

/* CyotelOS Rezervasyon Kartı v1.2 — tek ekran, iç-scroll yok */
#reservationDialog.reservation-dialog {
  width: min(1440px, calc(100vw - 10px)) !important;
  height: calc(100vh - 10px) !important;
  max-height: calc(100vh - 10px) !important;
  overflow: hidden !important;
}

#reservationDialog .reservation-card-form {
  grid-template-rows: 62px minmax(0, 1fr) 58px 46px !important;
  overflow: hidden !important;
}

#reservationDialog .reservation-redesign-header.reservation-card-header {
  min-height: 62px !important;
  padding: 8px 14px !important;
  gap: 12px !important;
  grid-template-columns: minmax(150px, 0.75fr) auto minmax(220px, 1.1fr) auto auto !important;
}

#reservationDialog .reservation-title-block h3 {
  font-size: 18px !important;
  line-height: 1.05 !important;
}

#reservationDialog .reservation-title-block span,
#reservationDialog .reservation-header-summary small,
#reservationDialog .reservation-chip {
  font-size: 10px !important;
}

#reservationDialog .reservation-card-shell {
  padding: 8px 10px 0 !important;
  overflow: hidden !important;
}

#reservationDialog .reservation-card-workspace,
#reservationDialog .reservation-card-panel,
#reservationDialog #cardReservation {
  min-height: 0 !important;
  overflow: hidden !important;
}

#reservationDialog .reservation-card-topbar {
  margin: 0 0 6px !important;
  padding: 5px 8px !important;
  border-radius: 16px !important;
}

#reservationDialog .reservation-card-tablist {
  gap: 8px !important;
}

#reservationDialog .reservation-card-tablist button {
  min-height: 38px !important;
  padding: 7px 10px !important;
  border-radius: 12px !important;
}

#reservationDialog .reservation-card-tablist button span {
  font-size: 12px !important;
  line-height: 1.05 !important;
}

#reservationDialog .reservation-card-tablist button small {
  font-size: 9px !important;
  line-height: 1.05 !important;
}

#reservationDialog .reservation-panel-heading {
  margin-bottom: 6px !important;
  padding-bottom: 6px !important;
}

#reservationDialog .reservation-panel-heading h4 {
  font-size: 18px !important;
  line-height: 1 !important;
}

#reservationDialog .reservation-panel-heading small,
#reservationDialog .reservation-panel-heading span {
  font-size: 10px !important;
}

#reservationDialog .reservation-stay-summary {
  display: none !important;
}

#reservationDialog .reservation-redesign-layout {
  grid-template-columns: minmax(0, 1fr) 190px !important;
  gap: 10px !important;
  align-items: stretch !important;
}

#reservationDialog .reservation-main-fields {
  min-width: 0 !important;
}

#reservationDialog .reservation-card-grid {
  grid-template-columns: 1.25fr 0.95fr 1fr 1.1fr 0.82fr !important;
  gap: 6px 8px !important;
}

#reservationDialog .reservation-card-grid label {
  min-height: 48px !important;
  padding: 6px 8px !important;
  gap: 3px !important;
  border-radius: 12px !important;
  font-size: 9.5px !important;
  letter-spacing: 0.05em !important;
}

#reservationDialog .reservation-card-grid input,
#reservationDialog .reservation-card-grid select,
#reservationDialog .reservation-card-form .room-picker-button {
  min-height: 25px !important;
  height: 25px !important;
  padding: 3px 6px !important;
  border-radius: 8px !important;
  font-size: 11px !important;
}

#reservationDialog .reservation-grid-section {
  grid-column: 1 / -1 !important;
  min-height: 15px !important;
  margin: 0 !important;
  padding: 1px 2px !important;
  font-size: 9px !important;
  letter-spacing: 0.08em !important;
}

#reservationDialog .reservation-operation-card {
  padding: 9px !important;
  gap: 8px !important;
  border-radius: 14px !important;
}

#reservationDialog .reservation-operation-card p {
  margin: 0 !important;
  font-size: 10px !important;
}

#reservationDialog .reservation-operation-card small {
  font-size: 11px !important;
  line-height: 1.25 !important;
}

#reservationDialog .reservation-operation-card .ghost-button {
  min-height: 30px !important;
  padding: 6px 9px !important;
  font-size: 11px !important;
}

#reservationDialog .reservation-lock-toggle {
  padding: 7px !important;
  border-radius: 12px !important;
}

#reservationDialog .reservation-card-bottom-info {
  padding: 6px 10px !important;
  gap: 8px !important;
}

#reservationDialog .reservation-record-meta,
#reservationDialog .reservation-quick-note {
  min-height: 42px !important;
  padding: 7px 10px !important;
  border-radius: 14px !important;
}

#reservationDialog .reservation-record-meta p,
#reservationDialog .reservation-quick-note p {
  font-size: 10px !important;
  margin: 0 0 2px !important;
}

#reservationDialog .reservation-record-meta small,
#reservationDialog .reservation-quick-note small {
  font-size: 10px !important;
  line-height: 1.2 !important;
}

#reservationDialog .reservation-card-actions {
  min-height: 46px !important;
  padding: 6px 10px !important;
  gap: 8px !important;
}

#reservationDialog .reservation-card-actions button {
  min-height: 32px !important;
  padding: 7px 12px !important;
  font-size: 11px !important;
}

#reservationDialog .reservation-command-note {
  font-size: 10px !important;
  line-height: 1.2 !important;
}

#reservationDialog .reservation-main-panel.active {
  display: grid !important;
  grid-template-rows: 28px minmax(0, 1fr) !important;
  padding: 8px 10px !important;
}

#reservationDialog .reservation-card-grid .field-voucher,
#reservationDialog .reservation-card-grid .field-roomtype {
  grid-column: auto !important;
}

#reservationDialog .reservation-card-grid {
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  align-content: start !important;
}

#reservationDialog .reservation-card-grid label {
  min-height: 40px !important;
  padding: 4px 6px !important;
  font-size: 8.8px !important;
}

#reservationDialog .reservation-card-grid input,
#reservationDialog .reservation-card-grid select,
#reservationDialog .reservation-card-form .room-picker-button {
  min-height: 21px !important;
  height: 21px !important;
  padding: 2px 5px !important;
  font-size: 10px !important;
}

#reservationDialog .reservation-grid-section {
  min-height: 12px !important;
  height: 12px !important;
  line-height: 12px !important;
  padding: 0 2px !important;
}

#reservationDialog .reservation-panel-heading {
  margin-bottom: 4px !important;
  padding-bottom: 3px !important;
}

#reservationDialog .reservation-panel-heading h4 {
  font-size: 15px !important;
}

#reservationDialog .reservation-panel-heading small {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* CyotelOS Rezervasyon Kartı v1.3 — okunabilir tek ekran dengelemesi */
#reservationDialog.reservation-dialog {
  width: min(1440px, calc(100vw - 8px)) !important;
  height: calc(100vh - 8px) !important;
  max-height: calc(100vh - 8px) !important;
}

#reservationDialog .reservation-card-form {
  grid-template-rows: 64px minmax(0, 1fr) 52px 44px !important;
}

#reservationDialog .reservation-redesign-header.reservation-card-header {
  min-height: 64px !important;
  padding: 9px 16px !important;
}

#reservationDialog .reservation-title-block h3 {
  font-size: 22px !important;
}

#reservationDialog .reservation-title-block span,
#reservationDialog .reservation-header-summary small {
  font-size: 12px !important;
}

#reservationDialog .reservation-header-summary strong {
  font-size: 17px !important;
}

#reservationDialog .reservation-chip {
  min-height: 34px !important;
  padding: 8px 16px !important;
  font-size: 12px !important;
  border-radius: 18px !important;
}

#reservationDialog .reservation-card-shell {
  padding: 10px 12px 0 !important;
}

#reservationDialog .reservation-card-topbar {
  margin: 0 0 8px !important;
  padding: 7px 10px !important;
}

#reservationDialog .reservation-card-tablist {
  gap: 10px !important;
}

#reservationDialog .reservation-card-tablist button {
  min-height: 42px !important;
  padding: 7px 14px !important;
}

#reservationDialog .reservation-card-tablist button span {
  font-size: 13.5px !important;
}

#reservationDialog .reservation-card-tablist button small {
  font-size: 10.5px !important;
}

#reservationDialog .reservation-main-panel.active {
  grid-template-rows: 26px minmax(0, 1fr) !important;
  padding: 8px 12px !important;
}

#reservationDialog .reservation-panel-heading {
  margin-bottom: 3px !important;
  padding-bottom: 2px !important;
}

#reservationDialog .reservation-panel-heading h4 {
  font-size: 19px !important;
}

#reservationDialog .reservation-panel-heading span,
#reservationDialog .reservation-panel-heading small {
  font-size: 11px !important;
}

#reservationDialog .reservation-redesign-layout {
  grid-template-columns: minmax(0, 1fr) 220px !important;
  gap: 14px !important;
}

#reservationDialog .reservation-card-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 5px 9px !important;
}

#reservationDialog .reservation-card-grid label {
  min-height: 46px !important;
  padding: 4px 8px !important;
  gap: 2px !important;
  font-size: 10.2px !important;
  letter-spacing: 0.04em !important;
}

#reservationDialog .reservation-card-grid input,
#reservationDialog .reservation-card-grid select,
#reservationDialog .reservation-card-form .room-picker-button {
  min-height: 25px !important;
  height: 25px !important;
  padding: 3px 8px !important;
  font-size: 11.5px !important;
  border-radius: 9px !important;
}

#reservationDialog .reservation-grid-section {
  min-height: 15px !important;
  height: 15px !important;
  line-height: 15px !important;
  font-size: 10px !important;
  margin: 0 !important;
}

#reservationDialog .reservation-operation-card {
  padding: 12px !important;
  gap: 12px !important;
}

#reservationDialog .reservation-operation-card p {
  font-size: 11px !important;
}

#reservationDialog .reservation-operation-card small {
  font-size: 12px !important;
}

#reservationDialog .reservation-operation-card .ghost-button {
  min-height: 34px !important;
  font-size: 12px !important;
}

#reservationDialog .reservation-lock-toggle {
  padding: 9px !important;
}

#reservationDialog .reservation-card-bottom-info {
  padding: 7px 12px !important;
}

#reservationDialog .reservation-record-meta,
#reservationDialog .reservation-quick-note {
  min-height: 40px !important;
  padding: 6px 12px !important;
}

#reservationDialog .reservation-record-meta p,
#reservationDialog .reservation-quick-note p {
  font-size: 11px !important;
}

#reservationDialog .reservation-record-meta small,
#reservationDialog .reservation-quick-note small {
  font-size: 11.5px !important;
}

#reservationDialog .reservation-card-actions {
  min-height: 44px !important;
  padding: 5px 12px !important;
}

#reservationDialog .reservation-card-actions button {
  min-height: 36px !important;
  padding: 8px 16px !important;
  font-size: 12.5px !important;
}

#reservationDialog .reservation-command-note {
  font-size: 11px !important;
}

@media (max-width: 1180px) {
  .reservation-card-form .reservation-redesign-header.reservation-card-header,
  .reservation-card-form .reservation-redesign-layout,
  .reservation-card-form .reservation-card-bottom-info {
    grid-template-columns: 1fr !important;
  }
  .reservation-card-form .reservation-card-tablist,
  .reservation-card-form .reservation-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* CyotelOS Rezervasyon Kartı v1.4 — başlık/operasyon hizalama */
#reservationDialog .reservation-main-panel.active {
  grid-template-rows: 20px minmax(0, 1fr) !important;
  padding: 10px 12px 6px !important;
}

#reservationDialog .reservation-panel-heading {
  align-items: end !important;
  margin-bottom: 8px !important;
  padding: 0 0 3px !important;
  min-height: 20px !important;
}

#reservationDialog .reservation-panel-heading span {
  display: none !important;
}

#reservationDialog .reservation-panel-heading h4 {
  font-size: 18px !important;
  line-height: 1 !important;
  margin: 0 !important;
}

#reservationDialog .reservation-panel-heading small {
  align-self: center !important;
  transform: translateY(2px) !important;
}

#reservationDialog .reservation-redesign-layout {
  align-items: start !important;
  padding-top: 12px !important;
  grid-template-columns: minmax(0, 1fr) 204px !important;
  gap: 12px !important;
}

#reservationDialog .reservation-main-fields {
  align-self: start !important;
}

#reservationDialog .reservation-operation-card {
  align-self: start !important;
  justify-self: center !important;
  width: 188px !important;
  min-height: 150px !important;
  max-height: 154px !important;
  margin-top: -4px !important;
  padding: 10px 12px !important;
  gap: 8px !important;
  display: grid !important;
  grid-template-rows: auto 1fr auto auto !important;
  align-items: center !important;
  text-align: center !important;
}

#reservationDialog .reservation-operation-card p {
  font-size: 10.5px !important;
  line-height: 1.05 !important;
  justify-self: start !important;
  text-align: left !important;
}

#reservationDialog .reservation-lock-toggle {
  justify-self: center !important;
  align-self: center !important;
  padding: 6px !important;
  min-height: 36px !important;
}

#reservationDialog .reservation-operation-card small {
  align-self: center !important;
  font-size: 11px !important;
  line-height: 1.15 !important;
}

#reservationDialog .reservation-operation-card .ghost-button {
  align-self: end !important;
  justify-self: stretch !important;
  min-height: 30px !important;
  padding: 6px 10px !important;
  font-size: 11px !important;
}

/* 20260618: Admin login Light theme logo contrast fix. */
body.theme-light .login-card .login-logo {
  background:
    radial-gradient(circle at 50% 35%, rgba(214, 168, 60, 0.20), transparent 58%),
    linear-gradient(135deg, rgba(6, 20, 40, 0.96), rgba(11, 45, 82, 0.94)) !important;
  border: 1px solid rgba(214, 168, 60, 0.28) !important;
  box-shadow: 0 22px 48px rgba(15, 28, 46, 0.20), inset 0 1px 0 rgba(255,255,255,0.10) !important;
}

body.theme-light .login-card .login-logo img {
  opacity: 1 !important;
  filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.22)) !important;
  mix-blend-mode: normal !important;
}

/* 20260618: Rezervasyon kartı operasyon alanı yatay yerleşim + aktif manuel ölçekleme. */
#reservationDialog.reservation-dialog.is-manually-resized {
  width: var(--reservation-dialog-width, min(1440px, calc(100vw - 8px))) !important;
  height: var(--reservation-dialog-height, calc(100vh - 8px)) !important;
  max-width: calc(100vw - 8px) !important;
  max-height: calc(100vh - 8px) !important;
}

#reservationDialog .reservation-redesign-layout {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
  padding: 10px 12px 6px !important;
}

#reservationDialog .reservation-main-fields {
  width: 100% !important;
  max-width: 100% !important;
}

#reservationDialog .reservation-card-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 6px 9px !important;
  max-width: 100% !important;
}

#reservationDialog .reservation-card-form {
  overflow: hidden !important;
}

#reservationDialog .reservation-operation-card {
  grid-column: 3 / 5 !important;
  justify-self: stretch !important;
  align-self: start !important;
  width: auto !important;
  min-height: 44px !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 7px 10px !important;
  display: grid !important;
  grid-template-columns: auto minmax(130px, .8fr) minmax(150px, 1fr) minmax(116px, .8fr) !important;
  grid-template-rows: minmax(32px, auto) !important;
  align-items: center !important;
  gap: 8px !important;
  text-align: left !important;
}

#reservationDialog .reservation-operation-card p,
#reservationDialog .reservation-operation-card small {
  margin: 0 !important;
  align-self: center !important;
}

#reservationDialog .reservation-operation-card p {
  justify-self: start !important;
  white-space: nowrap !important;
}

#reservationDialog .reservation-lock-toggle {
  justify-self: stretch !important;
  min-height: 32px !important;
  padding: 5px 7px !important;
  display: flex !important;
}

#reservationDialog .reservation-operation-card small {
  font-size: 10.5px !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#reservationDialog .reservation-operation-card .ghost-button {
  justify-self: stretch !important;
  align-self: center !important;
  min-height: 32px !important;
  padding: 6px 10px !important;
}

#reservationDialog .reservation-card-bottom-info {
  padding: 6px 12px !important;
  gap: 8px !important;
}

#reservationDialog .reservation-card-actions {
  padding: 5px 12px !important;
  padding-right: 38px !important;
}

#reservationDialog .reservation-corner-grip.reservation-dialog-resize-handle {
  position: absolute !important;
  right: 6px !important;
  bottom: 5px !important;
  width: 28px !important;
  height: 32px !important;
  display: inline-grid !important;
  place-items: end !important;
  cursor: nwse-resize !important;
  touch-action: none !important;
  z-index: 8 !important;
}

#reservationDialog .reservation-corner-grip.reservation-dialog-resize-handle i,
#reservationDialog .reservation-corner-grip.reservation-dialog-resize-handle span {
  display: block !important;
  width: 3px !important;
  border-radius: 999px !important;
  background: currentColor !important;
  transform: rotate(45deg) !important;
  transform-origin: bottom center !important;
}

#reservationDialog .reservation-corner-grip.reservation-dialog-resize-handle i:nth-child(1) { height: 9px !important; opacity: .62 !important; }
#reservationDialog .reservation-corner-grip.reservation-dialog-resize-handle i:nth-child(2) { height: 14px !important; opacity: .82 !important; }
#reservationDialog .reservation-corner-grip.reservation-dialog-resize-handle i:nth-child(3) { height: 19px !important; opacity: 1 !important; }

@media (max-width: 1180px) {
  #reservationDialog .reservation-operation-card {
    grid-column: 1 / -1 !important;
    grid-template-columns: 1fr !important;
  }
}

/* 20260618: Rezervasyon Kartı > Folyo hareketleri; üst işlem barı sabit, döküm satırları kendi içinde kayar. */
#reservationDialog .reservation-card-form:has(#cardFolio.active) {
  overflow: hidden !important;
}

#reservationDialog #cardFolio.reservation-card-panel.active {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 10px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#reservationDialog #cardFolio .folio-grid {
  position: relative !important;
  z-index: 4 !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}

#reservationDialog #cardFolio .folio-ledger {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  gap: 8px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#reservationDialog #cardFolio .folio-ledger .table-wrap {
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
  border-radius: 14px !important;
}

body.theme-light #reservationDialog #cardFolio .folio-ledger .table-wrap,
body.theme-dark #reservationDialog #cardFolio .folio-ledger .table-wrap {
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

#reservationDialog #cardFolio .folio-ledger table {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

#reservationDialog #cardFolio .folio-ledger thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 5 !important;
}

#reservationDialog #cardFolio .folio-ledger tfoot th {
  position: static !important;
  z-index: 1 !important;
}

#reservationDialog #cardFolio .folio-balance {
  flex: 0 0 auto !important;
  margin: 0 !important;
}

#reservationDialog #cardFolio .folio-ledger .table-wrap::-webkit-scrollbar {
  width: 10px;
}

#reservationDialog #cardFolio .folio-ledger .table-wrap::-webkit-scrollbar-track {
  background: rgba(148, 163, 184, .14);
  border-radius: 999px;
}

#reservationDialog #cardFolio .folio-ledger .table-wrap::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(214, 168, 60, .88), rgba(11, 45, 82, .88));
  border: 2px solid rgba(255, 255, 255, .55);
  border-radius: 999px;
}

body.theme-dark #reservationDialog #cardFolio .folio-ledger .table-wrap::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, .72);
}

body.theme-dark #reservationDialog #cardFolio .folio-ledger .table-wrap::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(243, 215, 148, .86), rgba(51, 65, 85, .92));
  border-color: rgba(15, 23, 42, .82);
}

.reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio .folio-ledger .table-wrap,
body.theme-light .reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio .folio-ledger .table-wrap,
body.theme-dark .reservation-dialog .reservation-card-form:has(#cardFolio.active) #cardFolio .folio-ledger .table-wrap {
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-gutter: stable !important;
}


/* WEB-LIVE-34 compact Web Onay cards */
#frontoffice #foReservations .premium-web-review-grid {
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  gap: 10px;
  align-items: start;
}

#frontoffice #foReservations .premium-web-review-card-compact {
  min-height: 0;
  max-height: 240px;
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border-radius: 18px;
  align-content: start;
}

#frontoffice #foReservations .premium-web-review-card-compact::before {
  inset: 14px auto 14px 0;
  width: 3px;
}

#frontoffice #foReservations .premium-web-review-mainline {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

#frontoffice #foReservations .premium-web-review-title,
#frontoffice #foReservations .premium-web-review-money {
  display: grid;
  gap: 1px;
  min-width: 0;
}

#frontoffice #foReservations .premium-web-review-title strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  line-height: 1.15;
}

#frontoffice #foReservations .premium-web-review-title small,
#frontoffice #foReservations .premium-web-review-money small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
  line-height: 1.15;
}

#frontoffice #foReservations .premium-web-review-money {
  justify-items: end;
  text-align: right;
}

#frontoffice #foReservations .premium-web-review-money strong {
  font-size: 15px;
  line-height: 1.1;
}

#frontoffice #foReservations .premium-web-review-card-compact .premium-web-review-status-chip,
#frontoffice #foReservations .premium-web-review-card-compact .premium-web-review-soft-chip {
  min-height: 22px;
  padding: 5px 9px;
  font-size: 9px;
  letter-spacing: 0.05em;
}

#frontoffice #foReservations .premium-web-review-subline,
#frontoffice #foReservations .premium-web-review-chipline {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
}

#frontoffice #foReservations .premium-web-review-subline span,
#frontoffice #foReservations .premium-web-review-chipline span {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 4px 7px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.15;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: rgba(255, 255, 255, 0.62);
}

#frontoffice #foReservations .premium-web-review-footerline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

#frontoffice #foReservations .premium-web-review-card-compact .premium-web-review-warning {
  min-height: 0;
  display: block;
  padding: 5px 8px;
  border-radius: 999px;
}

#frontoffice #foReservations .premium-web-review-card-compact .premium-web-review-warning strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
  line-height: 1.2;
}

#frontoffice #foReservations .premium-web-review-actions {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  margin-left: auto;
}

#frontoffice #foReservations .premium-web-review-actions .compact-action,
#frontoffice #foReservations .premium-web-review-actions .primary-button,
#frontoffice #foReservations .premium-web-review-actions .ghost-button {
  min-height: 26px;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 10px;
  line-height: 1.1;
}

@media (max-width: 720px) {
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #frontoffice #foReservations .premium-web-review-mainline,
  #frontoffice #foReservations .premium-web-review-footerline {
    grid-template-columns: minmax(0, 1fr);
  }

  #frontoffice #foReservations .premium-web-review-money {
    justify-items: start;
    text-align: left;
  }
}


/* WEB-LIVE-35 square grid Web Onay cards */
#frontoffice #foReservations .premium-web-review-grid {
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  gap: 16px;
  align-items: start;
  justify-items: start;
}

#frontoffice #foReservations .premium-web-review-card-square {
  width: 100%;
  max-width: 430px;
  min-height: 220px;
  max-height: 280px;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 10px;
  padding: 16px;
  border-radius: 22px;
  align-content: stretch;
}

#frontoffice #foReservations .premium-web-review-card-square::before {
  inset: 18px auto 18px 0;
  width: 4px;
}

#frontoffice #foReservations .premium-web-review-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

#frontoffice #foReservations .premium-web-review-card-price {
  display: grid;
  gap: 2px;
  justify-items: end;
  text-align: right;
  white-space: nowrap;
}

#frontoffice #foReservations .premium-web-review-card-price strong {
  font-size: 17px;
  line-height: 1.05;
}

#frontoffice #foReservations .premium-web-review-card-price small {
  font-size: 10px;
  font-weight: 900;
}

#frontoffice #foReservations .premium-web-review-card-body {
  display: grid;
  gap: 8px;
  min-width: 0;
  min-height: 0;
}

#frontoffice #foReservations .premium-web-review-card-identity {
  display: grid;
  gap: 2px;
  min-width: 0;
}

#frontoffice #foReservations .premium-web-review-card-identity strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
  line-height: 1.08;
}

#frontoffice #foReservations .premium-web-review-card-identity small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 850;
}

#frontoffice #foReservations .premium-web-review-stayline {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

#frontoffice #foReservations .premium-web-review-stayline span,
#frontoffice #foReservations .premium-web-review-chipline span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 5px 8px;
  border-radius: 12px;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.15;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: rgba(255, 255, 255, 0.64);
}

#frontoffice #foReservations .premium-web-review-card-square .premium-web-review-chipline {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

#frontoffice #foReservations .premium-web-review-card-square .premium-web-review-warning {
  min-height: 0;
  display: block;
  padding: 6px 9px;
  border-radius: 12px;
}

#frontoffice #foReservations .premium-web-review-card-square .premium-web-review-warning strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
  line-height: 1.2;
}

#frontoffice #foReservations .premium-web-review-card-footer {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
}

#frontoffice #foReservations .premium-web-review-card-footer .square-action {
  min-height: 28px;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 10px;
  line-height: 1.1;
}

@media (max-width: 720px) {
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: minmax(0, 1fr);
    justify-items: stretch;
  }

  #frontoffice #foReservations .premium-web-review-card-square {
    max-width: none;
    max-height: none;
  }
}


/* WEB-LIVE-36 reference Web Onay reservation cards */
#frontoffice #foReservations .premium-web-review-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
  justify-items: stretch;
}

#frontoffice #foReservations .premium-web-review-card-reference {
  width: 100%;
  max-width: none;
  min-height: 420px;
  max-height: none;
  position: relative;
  display: grid;
  grid-template-rows: auto auto auto 1fr auto;
  gap: 12px;
  padding: 18px 18px 16px 22px;
  border-radius: 26px;
  overflow: hidden;
}

#frontoffice #foReservations .premium-web-review-card-reference::before {
  display: none;
}

#frontoffice #foReservations .premium-web-review-left-rail {
  position: absolute;
  left: 0;
  top: 28px;
  bottom: 42px;
  width: 5px;
  border-radius: 0 999px 999px 0;
  background: linear-gradient(180deg, #d9a62c, #f4d784);
}

#frontoffice #foReservations .premium-web-review-reference-header {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: start;
  gap: 8px;
  min-width: 0;
}

#frontoffice #foReservations .premium-web-review-sequence {
  justify-self: end;
  align-self: center;
  font-size: 48px;
  line-height: 0.85;
  font-weight: 950;
  color: rgba(201, 161, 82, 0.24);
  letter-spacing: -0.08em;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-card-price {
  min-width: 78px;
}

#frontoffice #foReservations .premium-web-review-person-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

#frontoffice #foReservations .premium-web-review-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  color: #fff;
  background: radial-gradient(circle at 35% 25%, #6d624b, #111827 72%);
  font-size: 12px;
  font-weight: 950;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.18);
}

#frontoffice #foReservations .premium-web-review-date-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px 2px 10px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  font-size: 12px;
}

#frontoffice #foReservations .premium-web-review-date-row strong,
#frontoffice #foReservations .premium-web-review-date-row small {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#frontoffice #foReservations .premium-web-review-reference-body {
  display: grid;
  gap: 12px;
  align-content: start;
}

#frontoffice #foReservations .premium-web-review-room-panel {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 62px;
  padding: 12px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.58);
}

#frontoffice #foReservations .premium-web-review-room-panel .room-panel-icon {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: inline-grid;
  place-items: center;
  color: #9a6b13;
  background: #fff7df;
  border: 1px solid rgba(217, 166, 44, 0.22);
  font-weight: 950;
}

#frontoffice #foReservations .premium-web-review-room-panel small,
#frontoffice #foReservations .premium-web-review-metric-card small {
  display: block;
  color: rgba(71, 85, 105, 0.76);
  font-size: 10px;
  font-weight: 900;
  margin-bottom: 4px;
}

#frontoffice #foReservations .premium-web-review-room-panel strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 15px;
  line-height: 1.15;
}

#frontoffice #foReservations .premium-web-review-metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

#frontoffice #foReservations .premium-web-review-metric-card {
  min-height: 58px;
  padding: 10px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.78);
  overflow: hidden;
}

#frontoffice #foReservations .premium-web-review-metric-card strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  line-height: 1.15;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-chipline {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-chipline span {
  padding: 5px 8px;
  font-size: 10px;
  border-radius: 999px;
}

#frontoffice #foReservations .premium-web-review-warning-band {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 10px 12px;
  border-radius: 16px;
  background: #fff4ce;
  border: 1px solid rgba(217, 166, 44, 0.28);
}

#frontoffice #foReservations .premium-web-review-warning-band strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  line-height: 1.2;
}

#frontoffice #foReservations .premium-web-review-reference-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

#frontoffice #foReservations .premium-web-review-reference-actions .reference-action {
  min-height: 42px;
  border-radius: 16px;
  font-size: 13px;
  font-weight: 950;
}

@media (max-width: 1180px) {
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #frontoffice #foReservations .premium-web-review-card-reference {
    min-height: 0;
  }
}


/* WEB-LIVE-37 compact reference scale */
#frontoffice #foReservations .premium-web-review-grid {
  grid-template-columns: repeat(3, minmax(340px, 1fr));
  gap: 14px;
}

#frontoffice #foReservations .premium-web-review-card-reference {
  min-height: 330px;
  max-height: 390px;
  padding: 14px 14px 12px 18px;
  gap: 8px;
  border-radius: 22px;
  grid-template-rows: auto auto auto 1fr auto;
}

#frontoffice #foReservations .premium-web-review-left-rail {
  top: 24px;
  bottom: 34px;
  width: 4px;
}

#frontoffice #foReservations .premium-web-review-reference-header {
  gap: 6px;
}

#frontoffice #foReservations .premium-web-review-status-chip {
  padding: 6px 10px;
  font-size: 10px;
  line-height: 1;
}

#frontoffice #foReservations .premium-web-review-sequence {
  font-size: 36px;
  line-height: 0.82;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-card-price {
  min-width: 68px;
  padding: 6px 9px;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-card-price strong {
  font-size: 13px;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-card-price small {
  font-size: 10px;
}

#frontoffice #foReservations .premium-web-review-person-row {
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 9px;
}

#frontoffice #foReservations .premium-web-review-avatar {
  width: 34px;
  height: 34px;
  font-size: 10px;
}

#frontoffice #foReservations .premium-web-review-card-identity strong {
  font-size: 16px;
  line-height: 1.05;
}

#frontoffice #foReservations .premium-web-review-card-identity small {
  font-size: 11px;
}

#frontoffice #foReservations .premium-web-review-date-row {
  padding: 6px 1px 8px;
  font-size: 11px;
  gap: 6px;
}

#frontoffice #foReservations .premium-web-review-reference-body {
  gap: 8px;
}

#frontoffice #foReservations .premium-web-review-room-panel {
  min-height: 52px;
  padding: 9px 10px;
  border-radius: 15px;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 9px;
}

#frontoffice #foReservations .premium-web-review-room-panel .room-panel-icon {
  width: 28px;
  height: 28px;
  border-radius: 10px;
}

#frontoffice #foReservations .premium-web-review-room-panel small,
#frontoffice #foReservations .premium-web-review-metric-card small {
  font-size: 9px;
  margin-bottom: 3px;
}

#frontoffice #foReservations .premium-web-review-room-panel strong {
  font-size: 14px;
}

#frontoffice #foReservations .premium-web-review-metric-grid {
  gap: 8px;
}

#frontoffice #foReservations .premium-web-review-metric-card {
  min-height: 48px;
  padding: 8px;
  border-radius: 14px;
}

#frontoffice #foReservations .premium-web-review-metric-card strong {
  font-size: 12px;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-chipline {
  gap: 5px;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-chipline span {
  padding: 4px 7px;
  font-size: 9px;
}

#frontoffice #foReservations .premium-web-review-warning-band {
  min-height: 42px;
  padding: 8px 10px;
  border-radius: 14px;
  gap: 7px;
}

#frontoffice #foReservations .premium-web-review-warning-band strong {
  font-size: 11px;
}

#frontoffice #foReservations .premium-web-review-reference-actions {
  gap: 8px;
}

#frontoffice #foReservations .premium-web-review-reference-actions .reference-action {
  min-height: 38px;
  border-radius: 14px;
  font-size: 12px;
}

@media (max-width: 1220px) {
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: repeat(2, minmax(340px, 1fr));
  }
}

@media (max-width: 760px) {
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}


/* WEB-LIVE-38 square card grid */
#frontoffice #foReservations .premium-web-review-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(310px, 330px));
  gap: 16px;
  justify-content: start;
  justify-items: stretch;
  align-items: start;
}

#frontoffice #foReservations .premium-web-review-card-reference {
  width: 100%;
  max-width: 330px;
  aspect-ratio: 1 / 1;
  min-height: 0;
  height: auto;
  max-height: none;
  padding: 13px 13px 12px 17px;
  gap: 7px;
  border-radius: 22px;
  overflow: hidden;
  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
}

#frontoffice #foReservations .premium-web-review-left-rail {
  top: 22px;
  bottom: 30px;
  width: 4px;
}

#frontoffice #foReservations .premium-web-review-reference-header {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
  align-items: start;
}

#frontoffice #foReservations .premium-web-review-status-chip {
  justify-self: start;
  padding: 5px 9px;
  font-size: 9px;
  letter-spacing: .05em;
}

#frontoffice #foReservations .premium-web-review-sequence {
  font-size: 34px;
  line-height: .82;
  opacity: .13;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-card-price {
  min-width: 62px;
  padding: 5px 8px;
  text-align: right;
}

#frontoffice #foReservations .premium-web-review-person-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
}

#frontoffice #foReservations .premium-web-review-avatar {
  width: 34px;
  height: 34px;
  font-size: 10px;
}

#frontoffice #foReservations .premium-web-review-card-identity strong {
  font-size: 15px;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#frontoffice #foReservations .premium-web-review-card-identity small {
  font-size: 10px;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#frontoffice #foReservations .premium-web-review-date-row {
  padding: 4px 0 6px;
  font-size: 10px;
  line-height: 1.15;
  gap: 5px;
  white-space: nowrap;
}

#frontoffice #foReservations .premium-web-review-reference-body {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
  min-height: 0;
}

#frontoffice #foReservations .premium-web-review-room-panel {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  min-height: 48px;
  padding: 8px 9px;
  border-radius: 14px;
  gap: 8px;
}

#frontoffice #foReservations .premium-web-review-room-panel .room-panel-icon {
  width: 26px;
  height: 26px;
  border-radius: 9px;
}

#frontoffice #foReservations .premium-web-review-room-panel small,
#frontoffice #foReservations .premium-web-review-metric-card small {
  font-size: 8px;
  margin-bottom: 2px;
}

#frontoffice #foReservations .premium-web-review-room-panel strong {
  font-size: 12px;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#frontoffice #foReservations .premium-web-review-metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

#frontoffice #foReservations .premium-web-review-metric-card {
  min-height: 42px;
  padding: 6px;
  border-radius: 12px;
}

#frontoffice #foReservations .premium-web-review-metric-card strong {
  font-size: 10px;
  line-height: 1.08;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-chipline {
  gap: 4px;
  max-height: 38px;
  overflow: hidden;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-chipline span {
  padding: 3px 6px;
  font-size: 8px;
}

#frontoffice #foReservations .premium-web-review-warning-band {
  min-height: 36px;
  padding: 7px 8px;
  border-radius: 12px;
  gap: 6px;
}

#frontoffice #foReservations .premium-web-review-warning-band strong {
  font-size: 10px;
  line-height: 1.12;
}

#frontoffice #foReservations .premium-web-review-reference-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}

#frontoffice #foReservations .premium-web-review-reference-actions .reference-action {
  min-height: 34px;
  border-radius: 12px;
  font-size: 11px;
  padding: 0 8px;
}

@media (max-width: 1280px) {
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: repeat(2, minmax(310px, 330px));
  }
}

@media (max-width: 760px) {
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  #frontoffice #foReservations .premium-web-review-card-reference {
    max-width: none;
    aspect-ratio: auto;
  }
}


/* WEB-LIVE-39 wide multicolumn web onay cards */
#frontoffice #foReservations,
#frontoffice #foReservations > .panel {
  width: 100%;
  max-width: none;
  min-width: 0;
}

#frontoffice #foReservations > .panel,
#frontoffice #foReservations .panel {
  overflow: visible;
}

#frontoffice #foReservations .premium-web-review-summary,
#frontoffice #foReservations .premium-web-review-cards,
#frontoffice #foReservations .premium-web-review-grid {
  width: 100%;
  max-width: none;
  min-width: 0;
}

#frontoffice #foReservations .premium-web-review-cards,
#frontoffice #foReservations .premium-web-review-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(360px, 390px));
  gap: 18px;
  justify-content: start;
  justify-items: stretch;
  align-items: start;
  margin-bottom: 18px;
}

#frontoffice #foReservations .premium-web-review-card-reference {
  width: 100%;
  max-width: 390px;
  min-width: 360px;
  aspect-ratio: 1 / 1;
  min-height: 0;
  height: auto;
  max-height: none;
  padding: 15px 15px 14px 19px;
  gap: 8px;
  overflow: hidden;
}

#frontoffice #foReservations .premium-web-review-person-row {
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 10px;
}

#frontoffice #foReservations .premium-web-review-avatar {
  width: 38px;
  height: 38px;
}

#frontoffice #foReservations .premium-web-review-card-identity strong {
  font-size: 16px;
}

#frontoffice #foReservations .premium-web-review-card-identity small {
  font-size: 11px;
}

#frontoffice #foReservations .premium-web-review-date-row {
  font-size: 11px;
  gap: 7px;
}

#frontoffice #foReservations .premium-web-review-room-panel {
  grid-template-columns: 32px minmax(0, 1fr);
  min-height: 54px;
  padding: 9px 10px;
}

#frontoffice #foReservations .premium-web-review-room-panel strong {
  font-size: 13px;
}

#frontoffice #foReservations .premium-web-review-room-panel small,
#frontoffice #foReservations .premium-web-review-metric-card small {
  font-size: 9px;
}

#frontoffice #foReservations .premium-web-review-metric-card {
  min-height: 48px;
  padding: 7px;
}

#frontoffice #foReservations .premium-web-review-metric-card strong {
  font-size: 11px;
}

#frontoffice #foReservations .premium-web-review-card-reference .premium-web-review-chipline span {
  font-size: 9px;
  padding: 4px 7px;
}

#frontoffice #foReservations .premium-web-review-warning-band {
  min-height: 40px;
  padding: 8px 9px;
}

#frontoffice #foReservations .premium-web-review-warning-band strong {
  font-size: 11px;
}

#frontoffice #foReservations .premium-web-review-reference-actions .reference-action {
  min-height: 38px;
  font-size: 12px;
}

@media (min-width: 1320px) {
  #frontoffice #foReservations .premium-web-review-cards,
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: repeat(3, minmax(360px, 390px));
  }
}

@media (max-width: 1180px) {
  #frontoffice #foReservations .premium-web-review-cards,
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  }
  #frontoffice #foReservations .premium-web-review-card-reference {
    min-width: 0;
    max-width: none;
  }
}

@media (max-width: 760px) {
  #frontoffice #foReservations .premium-web-review-cards,
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  #frontoffice #foReservations .premium-web-review-card-reference {
    aspect-ratio: auto;
  }
}


/* WEB-LIVE-40 spacing light avatar */
#frontoffice #foReservations .premium-web-review-cards,
#frontoffice #foReservations .premium-web-review-grid {
  display: grid;
  width: 100%;
  max-width: none;
  grid-template-columns: repeat(auto-fit, minmax(410px, 430px));
  gap: 24px;
  margin-top: 24px;
  margin-bottom: 28px;
  justify-content: start;
  justify-items: stretch;
  align-items: start;
}

#frontoffice #foReservations .premium-web-review-card-reference {
  width: 100%;
  max-width: 430px;
  min-width: 410px;
  aspect-ratio: 1 / 1;
  padding: 16px 17px 15px 21px;
  gap: 9px;
  border-radius: 24px;
}

#frontoffice #foReservations .premium-web-review-person-row {
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 11px;
}

#frontoffice #foReservations .premium-web-review-avatar {
  width: 42px;
  height: 42px;
  background: linear-gradient(135deg, #fffdf7, #f6ead6);
  color: #10233f;
  border: 2px solid rgba(184, 138, 68, 0.55);
  box-shadow: 0 10px 20px rgba(184, 138, 68, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.9);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.03em;
}

#frontoffice #foReservations .premium-web-review-card-identity strong {
  font-size: 17px;
}

#frontoffice #foReservations .premium-web-review-card-identity small,
#frontoffice #foReservations .premium-web-review-date-row {
  font-size: 11.5px;
}

#frontoffice #foReservations .premium-web-review-room-panel {
  min-height: 58px;
  padding: 10px 11px;
}

#frontoffice #foReservations .premium-web-review-room-panel strong {
  font-size: 13.5px;
}

#frontoffice #foReservations .premium-web-review-metric-grid {
  gap: 8px;
}

#frontoffice #foReservations .premium-web-review-metric-card {
  min-height: 50px;
  padding: 8px;
}

#frontoffice #foReservations .premium-web-review-warning-band {
  min-height: 42px;
}

#frontoffice #foReservations .premium-web-review-reference-actions {
  gap: 9px;
}

#frontoffice #foReservations .premium-web-review-reference-actions .reference-action {
  min-height: 40px;
}

@media (min-width: 1400px) {
  #frontoffice #foReservations .premium-web-review-cards,
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: repeat(3, minmax(410px, 430px));
  }
}

@media (max-width: 1280px) {
  #frontoffice #foReservations .premium-web-review-cards,
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: repeat(auto-fit, minmax(370px, 1fr));
  }
  #frontoffice #foReservations .premium-web-review-card-reference {
    max-width: none;
    min-width: 0;
  }
}

@media (max-width: 760px) {
  #frontoffice #foReservations .premium-web-review-cards,
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    margin-top: 16px;
  }
  #frontoffice #foReservations .premium-web-review-card-reference {
    aspect-ratio: auto;
  }
}


/* WEB-LIVE-41 100pct no overflow scale */
#frontoffice #foReservations,
#frontoffice #foReservations > .panel {
  width: 100%;
  max-width: none;
  min-width: 0;
  overflow-x: hidden;
}

#frontoffice #foReservations .premium-web-review-cards,
#frontoffice #foReservations .premium-web-review-grid {
  display: grid;
  width: 100%;
  max-width: none;
  min-width: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
  margin-bottom: 22px;
  justify-content: stretch;
  justify-items: stretch;
  align-items: start;
  overflow-x: hidden;
}

#frontoffice #foReservations .premium-web-review-card-reference {
  width: 100%;
  max-width: none;
  min-width: 0;
  aspect-ratio: 1 / 1;
  box-sizing: border-box;
  padding: 14px 14px 13px 18px;
  gap: 7px;
  border-radius: 22px;
}

#frontoffice #foReservations .premium-web-review-person-row {
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 9px;
}

#frontoffice #foReservations .premium-web-review-avatar {
  width: 38px;
  height: 38px;
  font-size: 11px;
}

#frontoffice #foReservations .premium-web-review-card-identity strong {
  font-size: 15px;
}

#frontoffice #foReservations .premium-web-review-card-identity small,
#frontoffice #foReservations .premium-web-review-date-row {
  font-size: 10.5px;
}

#frontoffice #foReservations .premium-web-review-room-panel {
  min-height: 52px;
  padding: 8px 9px;
}

#frontoffice #foReservations .premium-web-review-room-panel strong {
  font-size: 12.5px;
}

#frontoffice #foReservations .premium-web-review-metric-grid {
  gap: 6px;
}

#frontoffice #foReservations .premium-web-review-metric-card {
  min-height: 44px;
  padding: 7px;
}

#frontoffice #foReservations .premium-web-review-chip-row {
  gap: 5px;
}

#frontoffice #foReservations .premium-web-review-warning-band {
  min-height: 38px;
  padding: 7px 8px;
}

#frontoffice #foReservations .premium-web-review-reference-actions {
  gap: 8px;
}

#frontoffice #foReservations .premium-web-review-reference-actions .reference-action {
  min-height: 38px;
}

@media (min-width: 1500px) {
  #frontoffice #foReservations .premium-web-review-cards,
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: repeat(3, minmax(340px, 1fr));
    gap: 20px;
  }
}

@media (max-width: 1080px) {
  #frontoffice #foReservations .premium-web-review-cards,
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  #frontoffice #foReservations .premium-web-review-cards,
  #frontoffice #foReservations .premium-web-review-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    margin-top: 14px;
  }
  #frontoffice #foReservations .premium-web-review-card-reference {
    aspect-ratio: auto;
  }
}


/* WEB-LIVE-42 warning visible bottom spacing */
#frontoffice #foReservations .premium-web-review-card-reference {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  aspect-ratio: 1 / 1.12;
  padding-bottom: 12px;
}

#frontoffice #foReservations .premium-web-review-warning-band {
  min-height: 46px;
  align-items: start;
  margin-top: 1px;
  padding: 7px 8px 6px;
}

#frontoffice #foReservations .premium-web-review-warning-band strong {
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.15;
}

#frontoffice #foReservations .premium-web-review-reference-actions {
  margin-top: auto;
  transform: none;
  gap: 8px;
}

#frontoffice #foReservations .premium-web-review-reference-actions .reference-action {
  min-height: 36px;
}


/* WEB-LIVE-58 premium Web Onay new reservation signal */
.premium-web-onay-alert {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 2400;
  width: min(420px, calc(100vw - 32px));
  min-height: 142px;
  padding: 18px;
  overflow: hidden;
  color: #fff7e7;
  border: 1px solid rgba(212, 175, 106, 0.56);
  border-radius: 24px;
  background: linear-gradient(142deg, rgba(9, 16, 30, 0.96), rgba(24, 35, 58, 0.94));
  box-shadow: 0 24px 70px rgba(2, 6, 23, 0.36), 0 0 0 1px rgba(255, 255, 255, 0.05) inset;
  backdrop-filter: blur(18px);
  transform: translate3d(28px, 18px, 0) scale(0.98);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.28s ease, transform 0.32s cubic-bezier(.2,.8,.2,1), width 0.25s ease, min-height 0.25s ease;
}

.premium-web-onay-alert.show {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0) scale(1);
  animation: premiumWebOnayPulse 1.55s ease-in-out 3;
}

.premium-web-onay-alert.compact {
  width: min(340px, calc(100vw - 32px));
  min-height: 92px;
}

.premium-web-onay-alert.dismissed {
  pointer-events: none;
  opacity: 0;
  transform: translate3d(30px, 16px, 0) scale(0.96);
}

.premium-web-onay-alert-glow {
  position: absolute;
  inset: -42% -18% auto auto;
  width: 220px;
  height: 220px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(212, 175, 106, 0.34), transparent 68%);
  filter: blur(2px);
}

.premium-web-onay-alert-header,
.premium-web-onay-alert-actions {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.premium-web-onay-alert-badge,
.premium-web-review-new-badge {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  border: 1px solid rgba(212, 175, 106, 0.54);
  border-radius: 999px;
  background: rgba(212, 175, 106, 0.16);
  color: #ffe4ad;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.premium-web-onay-alert-badge { padding: 6px 10px; }
.premium-web-review-new-badge { padding: 5px 8px; }

.premium-web-onay-alert-close {
  width: 30px;
  height: 30px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  color: #fff7e7;
  background: rgba(255, 255, 255, 0.08);
  cursor: pointer;
}

.premium-web-onay-alert-body {
  position: relative;
  display: grid;
  gap: 5px;
  margin: 14px 0 16px;
}

.premium-web-onay-alert-body strong {
  color: #ffffff;
  font-size: 21px;
  line-height: 1.06;
  letter-spacing: -0.035em;
}

.premium-web-onay-alert-body small,
.premium-web-onay-alert-body em {
  color: #cbd5e1;
  font-size: 12px;
  line-height: 1.34;
}

.premium-web-onay-alert-body p {
  margin: 6px 0 0;
  color: #ffe0a3;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.32;
}

.premium-web-onay-alert-actions .primary-button {
  color: #151b26;
  border: 0;
  background: linear-gradient(135deg, #b88a44, #d4af6a);
  box-shadow: 0 10px 24px rgba(212, 175, 106, 0.22);
}

.premium-web-onay-alert-actions .ghost-button {
  color: #f8fafc;
  border-color: rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.08);
}

#foReservations .premium-web-review-card.premium-web-review-new-signal {
  border-color: rgba(212, 175, 106, 0.82);
  box-shadow: 0 18px 46px rgba(184, 138, 68, 0.20), 0 0 0 1px rgba(212, 175, 106, 0.22) inset;
  animation: premiumWebOnayCardGlow 1.55s ease-in-out 4;
}

@keyframes premiumWebOnayPulse {
  0%, 100% { box-shadow: 0 24px 70px rgba(2, 6, 23, 0.36), 0 0 0 1px rgba(212, 175, 106, 0.22) inset; }
  50% { box-shadow: 0 28px 86px rgba(2, 6, 23, 0.46), 0 0 0 2px rgba(212, 175, 106, 0.46) inset, 0 0 28px rgba(212, 175, 106, 0.22); }
}

@keyframes premiumWebOnayCardGlow {
  0%, 100% { box-shadow: 0 14px 36px rgba(16, 24, 39, 0.08); }
  50% { box-shadow: 0 20px 50px rgba(184, 138, 68, 0.24), 0 0 0 1px rgba(212, 175, 106, 0.26) inset; }
}

@media (max-width: 720px) {
  .premium-web-onay-alert {
    right: 12px;
    bottom: 12px;
    left: 12px;
    width: auto;
    min-height: 124px;
    border-radius: 20px;
  }

  .premium-web-onay-alert-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}


/* WEB-LIVE-58A light-mode premium Web Onay signal */
html:not([data-theme="dark"]) .premium-web-onay-alert,
body.theme-light .premium-web-onay-alert {
  color: #243044;
  border-color: rgba(184, 138, 68, 0.34);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.94), rgba(251, 247, 238, 0.92)),
    radial-gradient(circle at 88% 0%, rgba(212, 175, 106, 0.22), transparent 44%);
  box-shadow: 0 22px 62px rgba(30, 41, 59, 0.16), 0 2px 0 rgba(255, 255, 255, 0.86) inset, 0 0 0 1px rgba(255, 255, 255, 0.68) inset;
}

html:not([data-theme="dark"]) .premium-web-onay-alert::before,
body.theme-light .premium-web-onay-alert::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(180deg, #d4af6a, #b88a44 55%, #f4dfb4);
  opacity: 0.92;
}

html:not([data-theme="dark"]) .premium-web-onay-alert-glow,
body.theme-light .premium-web-onay-alert-glow {
  background: radial-gradient(circle, rgba(212, 175, 106, 0.26), transparent 70%);
  filter: blur(4px);
}

html:not([data-theme="dark"]) .premium-web-onay-alert-badge,
body.theme-light .premium-web-onay-alert-badge {
  color: #76521a;
  border-color: rgba(184, 138, 68, 0.38);
  background: rgba(250, 238, 216, 0.9);
  box-shadow: 0 7px 18px rgba(184, 138, 68, 0.10);
}

html:not([data-theme="dark"]) .premium-web-onay-alert-close,
body.theme-light .premium-web-onay-alert-close {
  color: #344054;
  border-color: rgba(148, 163, 184, 0.34);
  background: rgba(255, 255, 255, 0.72);
}

html:not([data-theme="dark"]) .premium-web-onay-alert-body strong,
body.theme-light .premium-web-onay-alert-body strong {
  color: #111827;
}

html:not([data-theme="dark"]) .premium-web-onay-alert-body small,
html:not([data-theme="dark"]) .premium-web-onay-alert-body em,
body.theme-light .premium-web-onay-alert-body small,
body.theme-light .premium-web-onay-alert-body em {
  color: #667085;
}

html:not([data-theme="dark"]) .premium-web-onay-alert-body p,
body.theme-light .premium-web-onay-alert-body p {
  color: #8a5d17;
  background: rgba(255, 249, 235, 0.86);
  border: 1px solid rgba(212, 175, 106, 0.24);
  border-radius: 14px;
  padding: 9px 10px;
}

html:not([data-theme="dark"]) .premium-web-onay-alert-actions .primary-button,
body.theme-light .premium-web-onay-alert-actions .primary-button {
  color: #1f2937;
  background: linear-gradient(135deg, #f6dca5, #d4af6a);
  box-shadow: 0 12px 24px rgba(184, 138, 68, 0.20);
}

html:not([data-theme="dark"]) .premium-web-onay-alert-actions .ghost-button,
body.theme-light .premium-web-onay-alert-actions .ghost-button {
  color: #344054;
  border-color: rgba(148, 163, 184, 0.30);
  background: rgba(255, 255, 255, 0.72);
}

html:not([data-theme="dark"]) .premium-web-onay-alert.show,
body.theme-light .premium-web-onay-alert.show {
  animation: premiumWebOnayLightPulse 1.55s ease-in-out 3;
}

@keyframes premiumWebOnayLightPulse {
  0%, 100% { box-shadow: 0 22px 62px rgba(30, 41, 59, 0.16), 0 0 0 1px rgba(212, 175, 106, 0.16) inset; }
  50% { box-shadow: 0 26px 74px rgba(30, 41, 59, 0.20), 0 0 0 2px rgba(212, 175, 106, 0.32) inset, 0 0 24px rgba(212, 175, 106, 0.16); }
}

/* ===== PILOT-02 Ön Büro Rezervasyonlar premium polish ===== */
/* Marker: pilot02-frontoffice-20260625 */
#frontoffice.setup-workspace #foReservations .table-wrap thead th,
body.premium-pms #frontoffice #foReservations .table-wrap thead th {
  border-bottom: 1px solid rgba(184, 138, 68, 0.26) !important;
  padding-block: 10px !important;
  padding-inline: 8px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
}

#frontoffice.setup-workspace #foReservations .table-wrap thead th .table-sort,
body.premium-pms #frontoffice #foReservations .table-wrap thead th .table-sort {
  color: inherit !important;
  background: transparent !important;
  border-color: transparent !important;
}

#frontoffice.setup-workspace #foReservations .table-wrap thead th .sort-caret,
body.premium-pms #frontoffice #foReservations .table-wrap thead th .sort-caret {
  opacity: 0.78 !important;
}

#frontoffice.setup-workspace #foReservations #frontofficeReservationTable tr,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable tr {
  transition: background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease !important;
}

#frontoffice.setup-workspace #foReservations #frontofficeReservationTable tr:hover,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable tr:hover {
  background: linear-gradient(90deg, rgba(184, 138, 68, 0.08), rgba(184, 138, 68, 0.02)) !important;
}

#frontoffice.setup-workspace #foReservations #frontofficeReservationTable tr.selected-row,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable tr.selected-row {
  background: linear-gradient(90deg, rgba(184, 138, 68, 0.13), rgba(184, 138, 68, 0.04)) !important;
  box-shadow: inset 3px 0 0 #b88a44 !important;
}

#frontoffice.setup-workspace #foReservations #frontofficeReservationTable .status,
#frontoffice.setup-workspace #foReservations #frontofficeReservationTable .badge,
#frontoffice.setup-workspace #foReservations #frontofficeReservationTable .pill,
#frontoffice.setup-workspace #foReservations #frontofficeReservationTable .reservation-primary-status,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable .status,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable .badge,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable .pill,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable .reservation-primary-status {
  border-radius: 999px !important;
  font-weight: 850 !important;
  letter-spacing: -0.01em !important;
}

#frontoffice.setup-workspace #foReservations #frontofficeReservationTable .inline-action-cell button,
#frontoffice.setup-workspace #foReservations #frontofficeReservationTable .reservation-row-action button,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable .inline-action-cell button,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable .reservation-row-action button {
  border-radius: 999px !important;
  min-height: 30px !important;
  padding: 4px 12px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

#frontoffice.setup-workspace #foReservations #frontofficeReservationTable .inline-action-cell .primary-button,
#frontoffice.setup-workspace #foReservations #frontofficeReservationTable .reservation-row-action .primary-button,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable .inline-action-cell .primary-button,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable .reservation-row-action .primary-button {
  color: #151b26 !important;
  background: linear-gradient(135deg, #b88a44, #d4af6a) !important;
  border-color: rgba(184, 138, 68, 0.52) !important;
  box-shadow: 0 10px 24px rgba(184, 138, 68, 0.16) !important;
}

#frontoffice.setup-workspace #foReservations #frontofficeReservationTable td,
body.premium-pms #frontoffice #foReservations #frontofficeReservationTable td {
  font-size: 12px !important;
  line-height: 1.35 !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .table-wrap thead th,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .table-wrap thead th {
  color: #475467 !important;
  background: linear-gradient(180deg, #fbfaf7, #f6f3ee) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .table-wrap thead th .table-sort:hover,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .table-wrap thead th .table-sort:hover {
  color: #101827 !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations #frontofficeReservationTable tr:hover,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations #frontofficeReservationTable tr:hover {
  background: linear-gradient(90deg, rgba(184, 138, 68, 0.08), transparent) !important;
}

body.theme-dark #frontoffice.setup-workspace #foReservations .table-wrap thead th,
html[data-theme="dark"] #frontoffice.setup-workspace #foReservations .table-wrap thead th {
  color: #9fb0c8 !important;
  background: linear-gradient(180deg, rgba(11, 29, 54, 0.98), rgba(7, 18, 34, 0.98)) !important;
  border-bottom-color: rgba(184, 138, 68, 0.20) !important;
}

body.theme-dark #frontoffice.setup-workspace #foReservations #frontofficeReservationTable tr:hover,
html[data-theme="dark"] #frontoffice.setup-workspace #foReservations #frontofficeReservationTable tr:hover {
  background: rgba(184, 138, 68, 0.07) !important;
}

/* ===== PILOT-02 görünür premium refresh — kullanıcı screenshot düzeltmesi ===== */
/* Marker: pilot02-visible-refresh-20260625 */
body.theme-light #frontoffice.setup-workspace #foReservations > .panel,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations > .panel {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(184, 138, 68, 0.32) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.96), rgba(255,250,241,0.94) 42%, rgba(249,242,229,0.96)) !important;
  box-shadow: 0 26px 70px rgba(94, 72, 38, 0.16), inset 0 1px 0 rgba(255,255,255,0.92) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations > .panel::before,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations > .panel::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 0 auto !important;
  height: 5px !important;
  background: linear-gradient(90deg, #0b1d36, #b88a44 48%, #f2d79d) !important;
  z-index: 1 !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .panel-header,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .panel-header {
  margin: 10px 12px 14px !important;
  padding: 16px 18px !important;
  border: 1px solid rgba(184, 138, 68, 0.28) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(246, 221, 168, 0.38), transparent 36%),
    linear-gradient(135deg, #fffaf2 0%, #f3e7d2 58%, #e7d4b4 100%) !important;
  box-shadow: 0 18px 42px rgba(80, 56, 22, 0.13), inset 0 1px 0 rgba(255,255,255,0.86) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .panel-header h3,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .panel-header h3 {
  color: #0b1d36 !important;
  font-size: clamp(26px, 2.05vw, 34px) !important;
  letter-spacing: -0.055em !important;
  text-shadow: 0 1px 0 rgba(255,255,255,0.68) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .panel-header .primary-button,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .panel-header .primary-button {
  color: #fff7dc !important;
  background: linear-gradient(135deg, #071a33, #0f2c50 58%, #b88a44) !important;
  border-color: rgba(184, 138, 68, 0.42) !important;
  box-shadow: 0 14px 28px rgba(10, 28, 55, 0.20) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .reservation-tabs,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .reservation-tabs {
  margin-inline: 12px !important;
  padding: 8px !important;
  border: 1px solid rgba(184, 138, 68, 0.24) !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg, rgba(255,248,236,0.98), rgba(247,238,222,0.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.92), 0 10px 22px rgba(80,56,22,0.06) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .reservation-tabs button.active,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .reservation-tabs button.active {
  color: #fff7dc !important;
  background: linear-gradient(135deg, #071a33, #0d294c) !important;
  border-color: rgba(184, 138, 68, 0.36) !important;
  box-shadow: 0 12px 24px rgba(10, 28, 55, 0.18), inset 0 1px 0 rgba(255,255,255,0.08) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .frontoffice-filters,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .frontoffice-filters {
  margin-inline: 12px !important;
  border: 1px solid rgba(184, 138, 68, 0.18) !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg, rgba(255,249,237,0.92), rgba(246,235,216,0.88)) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .frontoffice-filters input,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .frontoffice-filters input {
  border: 1px solid rgba(15, 40, 73, 0.13) !important;
  border-radius: 17px !important;
  background: rgba(255,255,255,0.88) !important;
  box-shadow: 0 10px 24px rgba(80,56,22,0.07) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .table-wrap,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .table-wrap {
  margin: 28px 12px 0 !important;
  border: 1px solid rgba(184, 138, 68, 0.30) !important;
  border-radius: 22px !important;
  background: #fffaf2 !important;
  box-shadow: 0 24px 58px rgba(82, 59, 25, 0.14), inset 0 1px 0 rgba(255,255,255,0.90) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .table-wrap thead th,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .table-wrap thead th {
  color: #fff4d5 !important;
  background: linear-gradient(180deg, #102a4b 0%, #071a33 100%) !important;
  border-right: 1px solid rgba(244, 214, 157, 0.18) !important;
  border-bottom: 1px solid rgba(184, 138, 68, 0.46) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.22) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .table-wrap thead th .table-sort,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .table-wrap thead th .table-sort {
  color: #fff4d5 !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeReservationTable tr,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #frontofficeReservationTable tr {
  background: #fffdf8 !important;
  box-shadow: inset 0 -1px 0 rgba(184, 138, 68, 0.11) !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeReservationTable tr:nth-child(even),
html:not([data-theme="dark"]) #frontoffice.setup-workspace #frontofficeReservationTable tr:nth-child(even) {
  background: linear-gradient(90deg, rgba(255,248,235,0.98), rgba(255,252,247,0.98)) !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeReservationTable tr:hover,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #frontofficeReservationTable tr:hover {
  background: linear-gradient(90deg, rgba(184,138,68,0.16), rgba(255,248,235,0.96)) !important;
  box-shadow: inset 4px 0 0 #b88a44, inset 0 -1px 0 rgba(184, 138, 68, 0.16) !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeReservationTable .status,
body.theme-light #frontoffice.setup-workspace #frontofficeReservationTable .reservation-primary-status,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #frontofficeReservationTable .status,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #frontofficeReservationTable .reservation-primary-status {
  color: #fff8dd !important;
  background: linear-gradient(135deg, #071a33, #13345c) !important;
  border: 1px solid rgba(184, 138, 68, 0.38) !important;
  box-shadow: 0 9px 18px rgba(7, 26, 51, 0.14) !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #frontofficeDailyBar {
  border: 1px solid rgba(184, 138, 68, 0.30) !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(250,242,227,0.96)) !important;
  box-shadow: 0 -18px 48px rgba(82,59,25,0.13), inset 0 4px 0 rgba(184,138,68,0.16) !important;
}

/* ===== PILOT-06A Ön Büro full-width premium light ===== */
/* Marker: pilot06a-fullwidth-20260625 */

/* --- Layout: reduce padding/margins for full-width feel --- */
#frontoffice.setup-workspace {
  padding: 14px 10px 108px !important;
}

#frontoffice.setup-workspace #foReservations > .panel {
  margin-inline: 0 !important;
  border-radius: 16px !important;
}

#frontoffice.setup-workspace #foReservations .panel-header {
  margin: 6px 4px 10px !important;
  padding: 12px 14px !important;
  border-radius: 14px !important;
}

#frontoffice.setup-workspace #foReservations .panel-header h3 {
  font-size: clamp(20px, 1.6vw, 28px) !important;
}

#frontoffice.setup-workspace #foReservations .reservation-tabs {
  margin-inline: 4px !important;
  padding: 5px 6px !important;
  border-radius: 14px !important;
}

#frontoffice.setup-workspace #foReservations .frontoffice-filters {
  margin-inline: 4px !important;
  border-radius: 14px !important;
  padding: 8px 10px !important;
}

#frontoffice.setup-workspace #foReservations .table-wrap {
  margin: 10px 4px 0 !important;
  border-radius: 16px !important;
}

#frontoffice.setup-workspace #frontofficeDailyBar,
#frontoffice.setup-workspace .frontoffice-daily-bar {
  margin: 10px 4px 0 !important;
  border-radius: 14px !important;
  padding: 8px 10px !important;
}

/* --- Table: full-width cells, no boxed look --- */
#frontoffice.setup-workspace #foReservations .table-wrap {
  overflow-x: auto !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable {
  width: 100% !important;
  table-layout: auto !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable th,
#frontoffice.setup-workspace #frontofficeReservationTable td {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable th:first-child,
#frontoffice.setup-workspace #frontofficeReservationTable td:first-child {
  padding-left: 12px !important;
}

#frontoffice.setup-workspace #frontofficeReservationTable th:last-child,
#frontoffice.setup-workspace #frontofficeReservationTable td:last-child {
  padding-right: 12px !important;
}

/* --- Light mode premium refinements --- */
body.theme-light #frontoffice.setup-workspace,
html:not([data-theme="dark"]) #frontoffice.setup-workspace {
  background: linear-gradient(180deg, #faf9f6 0%, #f5f2ed 100%) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations > .panel,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations > .panel {
  border: 1px solid rgba(184, 138, 68, 0.22) !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.97), rgba(255,251,244,0.96)) !important;
  box-shadow: 0 8px 32px rgba(94, 72, 38, 0.08), 0 2px 8px rgba(94, 72, 38, 0.04) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations > .panel::before,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations > .panel::before {
  height: 3px !important;
  background: linear-gradient(90deg, #0b1d36 0%, #b88a44 50%, #f2d79d 100%) !important;
  border-radius: 16px 16px 0 0 !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .table-wrap,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .table-wrap {
  margin: 8px 4px 0 !important;
  border: 1px solid rgba(184, 138, 68, 0.18) !important;
  border-radius: 14px !important;
  background: #fffdf9 !important;
  box-shadow: 0 4px 16px rgba(94, 72, 38, 0.06) !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .table-wrap thead th,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .table-wrap thead th {
  color: #f0e6cc !important;
  background: linear-gradient(180deg, #0f2c50 0%, #071a33 100%) !important;
  border-right: 1px solid rgba(184, 138, 68, 0.12) !important;
  border-bottom: 2px solid rgba(184, 138, 68, 0.38) !important;
  font-size: 10.5px !important;
  letter-spacing: 0.04em !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .table-wrap thead th:first-child,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .table-wrap thead th:first-child {
  border-radius: 13px 0 0 0 !important;
}

body.theme-light #frontoffice.setup-workspace #foReservations .table-wrap thead th:last-child,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #foReservations .table-wrap thead th:last-child {
  border-radius: 0 13px 0 0 !important;
  border-right: none !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeReservationTable tr,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #frontofficeReservationTable tr {
  background: #fffef9 !important;
  border-bottom: 1px solid rgba(184, 138, 68, 0.07) !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeReservationTable tr:nth-child(even),
html:not([data-theme="dark"]) #frontoffice.setup-workspace #frontofficeReservationTable tr:nth-child(even) {
  background: linear-gradient(90deg, rgba(255,250,240,0.7), rgba(255,253,249,0.9)) !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeReservationTable tr:hover,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #frontofficeReservationTable tr:hover {
  background: linear-gradient(90deg, rgba(184,138,68,0.10), rgba(255,250,240,0.6)) !important;
}

body.theme-light #frontoffice.setup-workspace #frontofficeReservationTable td,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #frontofficeReservationTable td {
  color: #1d2939 !important;
  font-size: 12px !important;
  border-bottom: 1px solid rgba(184, 138, 68, 0.06) !important;
}

/* --- Daily bar premium integration --- */
body.theme-light #frontoffice.setup-workspace #frontofficeDailyBar,
body.theme-light #frontoffice.setup-workspace .frontoffice-daily-bar,
html:not([data-theme="dark"]) #frontoffice.setup-workspace #frontofficeDailyBar,
html:not([data-theme="dark"]) #frontoffice.setup-workspace .frontoffice-daily-bar {
  border: 1px solid rgba(184, 138, 68, 0.18) !important;
  background: linear-gradient(135deg, rgba(255,252,245,0.96), rgba(250,246,238,0.94)) !important;
  box-shadow: 0 4px 16px rgba(94, 72, 38, 0.06) !important;
}

body.theme-light #frontoffice.setup-workspace .frontoffice-daily-bar article,
html:not([data-theme="dark"]) #frontoffice.setup-workspace .frontoffice-daily-bar article {
  border: 1px solid rgba(184, 138, 68, 0.14) !important;
  background: linear-gradient(135deg, #fffef8, #fffaf0) !important;
  border-radius: 10px !important;
}

/* --- Dark mode: keep existing premium but wider --- */
body.theme-dark #frontoffice.setup-workspace,
html[data-theme="dark"] #frontoffice.setup-workspace {
  padding: 14px 10px 108px !important;
}

body.theme-dark #frontoffice.setup-workspace #foReservations > .panel,
html[data-theme="dark"] #frontoffice.setup-workspace #foReservations > .panel {
  margin-inline: 0 !important;
  border-radius: 16px !important;
}

body.theme-dark #frontoffice.setup-workspace #foReservations .panel-header,
html[data-theme="dark"] #frontoffice.setup-workspace #foReservations .panel-header {
  margin: 6px 4px 10px !important;
  border-radius: 14px !important;
}

body.theme-dark #frontoffice.setup-workspace #foReservations .reservation-tabs,
html[data-theme="dark"] #frontoffice.setup-workspace #foReservations .reservation-tabs {
  margin-inline: 4px !important;
  border-radius: 14px !important;
}

body.theme-dark #frontoffice.setup-workspace #foReservations .frontoffice-filters,
html[data-theme="dark"] #frontoffice.setup-workspace #foReservations .frontoffice-filters {
  margin-inline: 4px !important;
  border-radius: 14px !important;
}

body.theme-dark #frontoffice.setup-workspace #foReservations .table-wrap,
html[data-theme="dark"] #frontoffice.setup-workspace #foReservations .table-wrap {
  margin: 10px 4px 0 !important;
  border-radius: 16px !important;
}

body.theme-dark #frontoffice.setup-workspace #frontofficeDailyBar,
body.theme-dark #frontoffice.setup-workspace .frontoffice-daily-bar,
html[data-theme="dark"] #frontoffice.setup-workspace #frontofficeDailyBar,
html[data-theme="dark"] #frontoffice.setup-workspace .frontoffice-daily-bar {
  margin: 10px 4px 0 !important;
  border-radius: 14px !important;
}