/*
 * ORDER shared visual system
 * Theme 1: Ocean / Theme 2: Indigo / Theme 3: Warm graphite
 */
:root,
html[data-order-theme="1"] {
  color-scheme: light;
  --brand: #0b2f44;
  --brand-l: #174e69;
  --order-accent: #16796d;
  --order-accent-strong: #0f655b;
  --order-accent-rgb: 22, 121, 109;
  --order-ink: #162631;
  --order-muted: #687984;
  --order-line: #d9e2e7;
  --order-bg: #f4f7f8;
  --order-surface: #ffffff;
  --order-soft: #edf4f5;
  --order-sidebar: #0c3146;
  --order-sidebar-2: #123f57;
  --order-sidebar-ink: #ffffff;
  --order-active-bg: #ffffff;
  --order-active-ink: #0b2f44;
  --order-focus: rgba(22, 121, 109, 0.14);
  --order-shadow: 0 8px 26px rgba(11, 47, 68, 0.07);
  --order-shadow-lg: 0 18px 42px rgba(8, 38, 55, 0.15);
  --order-radius: 16px;
  --order-radius-sm: 9px;
  --bs-primary: #16796d;
  --bs-primary-rgb: 22, 121, 109;
}

html[data-order-theme="2"] {
  --brand: #172554;
  --brand-l: #263b7a;
  --order-accent: #4f46e5;
  --order-accent-strong: #4338ca;
  --order-accent-rgb: 79, 70, 229;
  --order-ink: #1e293b;
  --order-muted: #6b7280;
  --order-line: #dce1ee;
  --order-bg: #f4f6fb;
  --order-surface: #ffffff;
  --order-soft: #eef0ff;
  --order-sidebar: #172554;
  --order-sidebar-2: #263b7a;
  --order-sidebar-ink: #ffffff;
  --order-active-bg: #ffffff;
  --order-active-ink: #172554;
  --order-focus: rgba(79, 70, 229, 0.14);
  --order-shadow: 0 8px 26px rgba(30, 41, 93, 0.075);
  --order-shadow-lg: 0 18px 42px rgba(23, 37, 84, 0.16);
  --bs-primary: #4f46e5;
  --bs-primary-rgb: 79, 70, 229;
}

html[data-order-theme="3"] {
  --brand: #292524;
  --brand-l: #44403c;
  --order-accent: #c66b18;
  --order-accent-strong: #a8550f;
  --order-accent-rgb: 198, 107, 24;
  --order-ink: #292524;
  --order-muted: #78716c;
  --order-line: #e4ddd5;
  --order-bg: #f8f6f2;
  --order-surface: #fffefa;
  --order-soft: #f5eee4;
  --order-sidebar: #292524;
  --order-sidebar-2: #44403c;
  --order-sidebar-ink: #fffaf2;
  --order-active-bg: #fffaf2;
  --order-active-ink: #292524;
  --order-focus: rgba(198, 107, 24, 0.14);
  --order-shadow: 0 8px 26px rgba(68, 50, 35, 0.075);
  --order-shadow-lg: 0 18px 42px rgba(58, 43, 31, 0.16);
  --bs-primary: #c66b18;
  --bs-primary-rgb: 198, 107, 24;
}

html {
  background: var(--order-bg);
}

body {
  margin: 0;
  color: var(--order-ink);
  background:
    radial-gradient(circle at 100% 0, rgba(var(--order-accent-rgb), 0.045), transparent 27rem),
    var(--order-bg);
  font-family:
    "Pretendard",
    "Noto Sans KR",
    "Malgun Gothic",
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
  letter-spacing: -0.012em;
  transition: background-color 0.2s ease, color 0.2s ease;
}

a {
  color: var(--order-accent);
}

a:hover {
  color: var(--order-accent-strong);
}

/* Theme selector */
.order-theme-switcher {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  min-height: 34px;
  padding: 3px;
  border: 1px solid var(--order-line);
  border-radius: 10px;
  background: var(--order-soft);
}

.order-theme-switcher .theme-switcher-label {
  padding: 0 6px 0 7px;
  color: var(--order-muted);
  font-size: 0.7rem;
  font-weight: 800;
}

.order-theme-switcher [data-order-theme-btn] {
  display: inline-grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--order-muted);
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1;
  transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.order-theme-switcher [data-order-theme-btn]:hover {
  color: var(--order-ink);
  background: rgba(var(--order-accent-rgb), 0.09);
}

.order-theme-switcher [data-order-theme-btn].is-active {
  color: #fff;
  background: var(--order-accent);
  box-shadow: 0 3px 9px rgba(var(--order-accent-rgb), 0.24);
}

.navbar-dark .order-theme-switcher {
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.09);
}

.navbar-dark .order-theme-switcher .theme-switcher-label,
.navbar-dark .order-theme-switcher [data-order-theme-btn] {
  color: rgba(255, 255, 255, 0.72);
}

.navbar-dark .order-theme-switcher [data-order-theme-btn]:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.13);
}

.navbar-dark .order-theme-switcher [data-order-theme-btn].is-active {
  color: var(--order-active-ink);
  background: #fff;
  box-shadow: none;
}

/* Login */
.order-login-page .bg-video-wrap {
  background: var(--order-sidebar);
}

.order-login-page .bg-overlay {
  background:
    linear-gradient(135deg, rgba(5, 19, 30, 0.8), rgba(var(--order-accent-rgb), 0.34)),
    linear-gradient(180deg, transparent, rgba(4, 16, 25, 0.56));
}

.order-login-page .login-card {
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: var(--order-radius);
  background: var(--order-surface);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(18px);
}

.order-login-page .login-header,
.order-login-page .login-body {
  background: var(--order-surface);
}

.order-login-page .login-header {
  border-color: var(--order-line);
}

.order-login-page .login-header h5 {
  color: var(--brand);
}

.order-login-page .login-header small,
.order-login-page .security-note {
  color: var(--order-muted);
}

.order-login-page .btn-login {
  border-color: var(--order-accent);
  background: var(--order-accent);
  box-shadow: none;
}

.order-login-page .btn-login:hover,
.order-login-page .btn-login:focus,
.order-login-page .btn-login:active {
  border-color: var(--order-accent-strong);
  background: var(--order-accent-strong);
  box-shadow: 0 7px 18px rgba(var(--order-accent-rgb), 0.25);
}

.login-theme-switcher {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 4;
  border-color: rgba(255, 255, 255, 0.2);
  background: rgba(6, 20, 33, 0.48);
  backdrop-filter: blur(14px);
}

.login-theme-switcher .theme-switcher-label,
.login-theme-switcher [data-order-theme-btn] {
  color: rgba(255, 255, 255, 0.75);
}

.login-theme-switcher [data-order-theme-btn]:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
}

/* Admin application frame */
#sidebar {
  width: 244px;
  background: linear-gradient(180deg, var(--order-sidebar), var(--order-sidebar-2));
  border-right: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: var(--order-shadow-lg);
}

#sidebar .sidebar-brand {
  min-height: 66px;
  display: grid;
  place-items: center;
  padding: 10px 18px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  background: rgba(255, 255, 255, 0.97);
}

#sidebar .sidebar-brand img {
  max-height: 40px !important;
  max-width: 164px !important;
}

#sidebar .sidebar-nav {
  padding: 10px 0 18px;
}

#sidebar .sec-btn {
  padding: 13px 18px 7px;
  color: rgba(255, 255, 255, 0.44);
  font-size: 0.65rem;
  letter-spacing: 0.14em;
}

#sidebar .sec-btn:hover {
  color: rgba(255, 255, 255, 0.72);
}

#sidebar .nav-link {
  min-height: 40px;
  gap: 10px;
  margin: 2px 10px;
  padding: 9px 12px;
  border: 1px solid transparent;
  border-radius: var(--order-radius-sm);
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.82rem;
  font-weight: 650;
}

#sidebar .nav-link:hover {
  border-color: rgba(255, 255, 255, 0.08);
  color: #fff;
  background: rgba(255, 255, 255, 0.075);
  transform: translateX(2px);
}

#sidebar .nav-link.active {
  border-color: rgba(255, 255, 255, 0.7);
  color: var(--order-active-ink);
  background: var(--order-active-bg);
  box-shadow: 0 8px 20px rgba(3, 23, 34, 0.17);
}

#sidebar .nav-link i {
  width: 18px;
  color: rgba(255, 255, 255, 0.64);
  text-align: center;
}

#sidebar .nav-link.active i {
  color: var(--order-accent);
}

#content {
  margin-left: 244px;
}

.topbar {
  min-height: 66px;
  padding: 10px clamp(18px, 2.2vw, 34px);
  border-bottom: 1px solid rgba(var(--order-accent-rgb), 0.1);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 4px 22px rgba(11, 47, 68, 0.045);
  backdrop-filter: blur(18px);
}

.topbar-title {
  color: var(--brand);
  font-size: 1rem;
  font-weight: 850 !important;
  letter-spacing: -0.025em;
}

.topbar-actions {
  row-gap: 7px;
}

.menu-mode-switch {
  padding: 3px;
  border: 1px solid var(--order-line);
  border-radius: 10px;
  background: var(--order-soft);
}

.menu-mode-switch .btn {
  min-height: 27px;
  border: 0;
  border-radius: 7px !important;
  color: var(--order-muted);
  background: transparent;
}

html[data-menu-mode="full"] .menu-mode-switch [data-menu-mode-btn="full"],
html[data-menu-mode="slide"] .menu-mode-switch [data-menu-mode-btn="slide"] {
  color: #fff;
  background: var(--order-accent);
  border-color: var(--order-accent);
  box-shadow: 0 3px 9px rgba(var(--order-accent-rgb), 0.2);
}

.page-body {
  padding: clamp(18px, 2.2vw, 34px);
}

.admin-footer {
  margin-left: 244px;
  border-color: var(--order-line) !important;
  color: var(--order-muted) !important;
  background: var(--order-surface) !important;
}

/* Partner application frame */
.partner-navbar {
  position: sticky;
  top: 0;
  z-index: 1030;
  min-height: 66px;
  padding: 7px clamp(10px, 2vw, 28px);
  background: linear-gradient(90deg, var(--order-sidebar), var(--order-sidebar-2)) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 10px 26px rgba(8, 38, 55, 0.14);
}

.partner-navbar .navbar-brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  flex: 0 0 auto;
  color: #fff;
  font-size: 1rem;
  letter-spacing: -0.025em;
  white-space: nowrap;
}

.partner-navbar .navbar-brand:hover,
.partner-navbar .navbar-brand:focus {
  color: #fff;
}

.partner-brand-symbol {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 34px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
}

.partner-brand-symbol-crop {
  width: 26px;
  height: 26px;
  display: block;
  overflow: hidden;
}

.partner-brand-symbol-crop img {
  display: block;
  width: auto;
  max-width: none;
  height: 26px;
}

.partner-brand-title {
  line-height: 1.15;
}

.partner-navbar .navbar-nav {
  gap: 3px;
  margin-left: 18px;
}

.partner-navbar .nav-link {
  padding: 8px 11px !important;
  border-radius: 8px;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.82rem;
  font-weight: 700;
}

.partner-navbar .nav-link:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.09);
}

.partner-navbar .nav-link.active {
  color: var(--order-active-ink);
  background: #fff;
}

.partner-page-body {
  min-height: calc(100vh - 66px);
  padding: clamp(18px, 2.2vw, 34px) !important;
}

.partner-footer {
  border-top: 1px solid var(--order-line);
  color: var(--order-muted);
  background: var(--order-surface);
  font-size: 0.74rem;
  line-height: 1.75;
}

/* Shared Bootstrap refinements */
.card {
  overflow: hidden;
  border: 1px solid rgba(var(--order-accent-rgb), 0.1);
  border-radius: var(--order-radius);
  background: var(--order-surface);
  box-shadow: var(--order-shadow);
}

.card-header,
.card-footer {
  border-color: var(--order-line);
  background: var(--order-surface);
}

.card-header {
  padding: 1rem 1.2rem;
  color: var(--brand);
  font-weight: 800;
}

.table {
  --bs-table-color: var(--order-ink);
  --bs-table-bg: transparent;
  --bs-table-hover-bg: rgba(var(--order-accent-rgb), 0.045);
  margin-bottom: 0;
}

.table > :not(caption) > * > * {
  padding: 0.8rem 0.72rem;
  border-bottom-color: var(--order-line);
}

.table th,
.table thead th {
  color: #536772;
  background: var(--order-soft);
  font-size: 0.77rem;
  font-weight: 800;
  letter-spacing: 0;
  white-space: nowrap;
}

.table td {
  color: var(--order-ink);
  font-size: 0.84rem;
}

.table-responsive {
  border-radius: 0 0 var(--order-radius) var(--order-radius);
}

.form-label {
  color: #465b66;
  font-size: 0.82rem;
  font-weight: 750;
}

.form-control,
.form-select,
.input-group-text {
  min-height: 39px;
  border-color: var(--order-line);
  border-radius: 8px;
}

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

.input-group-text {
  color: var(--order-muted);
  background: var(--order-soft);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--order-accent);
  box-shadow: 0 0 0 0.2rem var(--order-focus);
}

.form-check-input:checked {
  border-color: var(--order-accent);
  background-color: var(--order-accent);
}

.btn {
  border-radius: 8px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.btn-primary {
  border-color: var(--order-accent);
  background: var(--order-accent);
}

.btn-primary:hover,
.btn-primary:focus {
  border-color: var(--order-accent-strong);
  background: var(--order-accent-strong);
}

.btn-outline-primary {
  border-color: var(--order-accent);
  color: var(--order-accent);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
  border-color: var(--order-accent);
  color: #fff;
  background: var(--order-accent);
}

.text-primary {
  color: var(--order-accent) !important;
}

.bg-primary {
  background-color: var(--order-accent) !important;
}

.border-primary {
  border-color: var(--order-accent) !important;
}

.badge {
  padding: 0.45em 0.64em;
  border-radius: 7px;
  font-weight: 750;
}

.dropdown-menu,
.modal-content,
.offcanvas,
.list-group {
  border-color: var(--order-line);
  border-radius: 12px;
  background: var(--order-surface);
  box-shadow: var(--order-shadow-lg);
}

.modal-header,
.modal-footer,
.list-group-item {
  border-color: var(--order-line);
}

.modal-title {
  color: var(--brand);
  font-weight: 850;
}

.nav-tabs {
  border-color: var(--order-line);
}

.nav-tabs .nav-link {
  border-radius: 9px 9px 0 0;
  color: var(--order-muted);
  font-weight: 700;
}

.nav-tabs .nav-link.active {
  border-color: var(--order-line) var(--order-line) var(--order-surface);
  color: var(--order-accent);
  background: var(--order-surface);
}

.pagination {
  gap: 4px;
}

.page-link {
  min-width: 34px;
  border-color: var(--order-line);
  border-radius: 8px !important;
  color: var(--order-muted);
  text-align: center;
}

.page-link:hover {
  border-color: rgba(var(--order-accent-rgb), 0.3);
  color: var(--order-accent);
  background: var(--order-soft);
}

.page-item.active .page-link {
  border-color: var(--order-accent);
  background: var(--order-accent);
}

.alert {
  border-radius: 11px;
}

.text-muted {
  color: var(--order-muted) !important;
}

@media (max-width: 1199.98px) {
  .partner-navbar .navbar-nav {
    margin-left: 6px;
  }
}

@media (max-width: 991.98px) {
  .partner-navbar .navbar-collapse {
    margin-top: 10px;
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.1);
  }

  .partner-navbar .navbar-nav {
    gap: 2px;
    margin: 0 0 12px;
  }

  .partner-navbar .navbar-collapse > .d-flex {
    align-items: flex-start !important;
    flex-wrap: wrap;
    gap: 10px !important;
  }
}

@media (max-width: 768px) {
  #sidebar {
    width: min(286px, 86vw);
  }

  #content,
  .admin-footer {
    margin-left: 0;
  }

  .topbar {
    min-height: 60px;
  }

  .topbar-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .topbar-actions .badge,
  .topbar-actions > a.text-muted {
    display: none;
  }

  .page-body,
  .partner-page-body {
    padding: 16px !important;
  }

  .card {
    border-radius: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}