/* --------------------------------------------------------------------------
   Order form — DREAM luxury dark theme, contrast + focus (accessibility)
   Loads after order-form.css; use body.order-form-page for scope.
   -------------------------------------------------------------------------- */

body.order-form-page.mo-skin {
  color-scheme: dark;
  --font-body: Montserrat, system-ui, sans-serif;
  --font-display: "Cormorant Garamond", Georgia, serif;
  --mo-surface-0: #0e0e12;
  --mo-surface-1: #16161c;
  --mo-surface-2: #1c1c24;
  --mo-border: rgba(255, 255, 255, 0.1);
  --mo-text: rgba(255, 252, 248, 0.96);
  --mo-text-muted: rgba(196, 200, 214, 0.92);
  --mo-text-dim: rgba(154, 162, 180, 0.95);
  --mo-focus: rgba(230, 195, 106, 0.85);
  background: radial-gradient(ellipse 120% 80% at 50% 0%, #1a1510 0%, #060606 45%, #020202 100%);
}

body.order-form-page .site-main--order-form {
  background: transparent;
}

body.order-form-page .mo-order-shell {
  background: transparent;
}

body.order-form-page .mobile-order-page {
  --mo-input-bg: var(--mo-surface-1);
  --mo-muted: var(--mo-text-dim);
  --mo-shadow-float: 0 12px 40px rgba(0, 0, 0, 0.55), 0 4px 16px rgba(0, 0, 0, 0.35);
  background: transparent !important;
  padding-bottom: clamp(1rem, 3vh, 2rem);
}

/* ----- Access gate ----- */
body.order-form-page .mo-auth-gate {
  background:
    radial-gradient(ellipse 80% 60% at 50% 20%, rgba(230, 195, 106, 0.08), transparent 55%),
    linear-gradient(180deg, #0c0c10 0%, #050508 100%);
}

body.order-form-page .mo-auth-gate__panel {
  background: linear-gradient(168deg, rgba(18, 18, 22, 0.96) 0%, rgba(8, 8, 12, 0.98) 100%);
  border: 1px solid rgba(212, 175, 55, 0.22);
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

body.order-form-page .mo-auth-gate__title {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--mo-text);
}

body.order-form-page .mo-auth-gate__hint {
  color: rgba(255, 255, 255, 0.58);
}

body.order-form-page .mo-auth-gate__input {
  background: rgba(6, 6, 8, 0.95);
  border: 1px solid var(--mo-border);
  color: var(--mo-text);
  border-radius: 8px;
}

body.order-form-page .mo-auth-gate__input:focus {
  outline: none;
  border-color: rgba(230, 195, 106, 0.55);
  box-shadow: 0 0 0 3px rgba(230, 195, 106, 0.22);
  background: rgba(12, 12, 16, 0.98);
}

body.order-form-page .mo-auth-gate__input:focus-visible {
  outline: 2px solid var(--mo-focus);
  outline-offset: 2px;
}

body.order-form-page .mo-auth-gate__err {
  color: #fecaca !important;
  background: rgba(127, 29, 29, 0.35) !important;
  border: 1px solid rgba(248, 113, 113, 0.35) !important;
  border-radius: 8px;
  padding: 0.5rem 0.65rem !important;
}

body.order-form-page .mo-auth-gate__submit {
  background: linear-gradient(135deg, #e8d49a 0%, #c9a24a 45%, #f0e0a8 100%);
  color: rgba(18, 16, 12, 0.95);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

body.order-form-page .mo-auth-gate__submit:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

body.order-form-page .mo-auth-gate__submit:hover:not(:disabled) {
  filter: brightness(1.06);
}

/* ----- Cards ----- */
body.order-form-page .mo-card {
  background: rgba(14, 14, 18, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28) !important;
}

body.order-form-page .mo-card__head {
  background: rgba(18, 18, 22, 0.95) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: var(--mo-text) !important;
}

body.order-form-page .mo-card__head-title {
  color: var(--mo-text) !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
}

body.order-form-page .mo-field label,
body.order-form-page .mo-item-label-row label {
  color: rgba(230, 195, 106, 0.82) !important;
}

/* ----- Inputs (no white focus flash) ----- */
body.order-form-page .mo-field input,
body.order-form-page .mo-field textarea,
body.order-form-page #partySearch {
  background: var(--mo-surface-1) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-text) !important;
  border-radius: 6px !important;
}

body.order-form-page .mo-field input::placeholder,
body.order-form-page .mo-field textarea::placeholder,
body.order-form-page #partySearch::placeholder,
body.order-form-page .mo-search-wrap input::placeholder,
body.order-form-page .mo-search-wrap textarea::placeholder {
  color: rgba(154, 162, 180, 0.85) !important;
}

body.order-form-page .mo-field input:focus,
body.order-form-page .mo-field textarea:focus,
body.order-form-page #partySearch:focus,
body.order-form-page .mo-search-wrap input:focus,
body.order-form-page .mo-search-wrap textarea:focus {
  outline: none !important;
  border-color: rgba(230, 195, 106, 0.55) !important;
  background: var(--mo-surface-2) !important;
  box-shadow: 0 0 0 3px rgba(230, 195, 106, 0.2) !important;
}

body.order-form-page .mo-field input:focus-visible,
body.order-form-page .mo-field textarea:focus-visible,
body.order-form-page #partySearch:focus-visible,
body.order-form-page .mo-search-wrap input:focus-visible,
body.order-form-page .mo-search-wrap textarea:focus-visible {
  outline: 2px solid var(--mo-focus) !important;
  outline-offset: 2px !important;
}

body.order-form-page .mo-field input[readonly] {
  background: rgba(10, 10, 14, 0.9) !important;
  color: rgba(220, 224, 235, 0.92) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.order-form-page .mo-item-alias-badge {
  color: rgba(230, 195, 106, 0.95) !important;
}

/* ----- Suggestions dropdown (was white row + light text = invisible) ----- */
body.order-form-page .mo-suggestions {
  background: var(--mo-surface-2) !important;
  border: 1px solid rgba(212, 175, 55, 0.28) !important;
  border-radius: 12px !important;
  box-shadow: var(--mo-shadow-float) !important;
  scrollbar-color: rgba(230, 195, 106, 0.4) rgba(255, 255, 255, 0.06);
}

body.order-form-page .mo-suggestion {
  background: var(--mo-surface-1) !important;
  color: var(--mo-text) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
}

body.order-form-page .mo-suggestion:last-child {
  border-bottom: none !important;
}

body.order-form-page .mo-suggestion:hover {
  background: rgba(230, 195, 106, 0.1) !important;
}

body.order-form-page .mo-suggestion:active {
  background: rgba(230, 195, 106, 0.16) !important;
}

body.order-form-page .mo-suggestion:focus {
  outline: none;
}

body.order-form-page .mo-suggestion:focus-visible {
  outline: 2px solid var(--mo-focus) !important;
  outline-offset: -2px !important;
  box-shadow: inset 0 0 0 1px rgba(230, 195, 106, 0.35);
  z-index: 1;
  position: relative;
}

body.order-form-page .mo-suggestion__title {
  color: #faf8f5 !important;
  font-weight: 600 !important;
}

body.order-form-page .mo-suggestion__line {
  color: #c8cedd !important;
  font-weight: 500 !important;
}

body.order-form-page .mo-suggestion__detail {
  color: #9aa3b8 !important;
}

/* ----- Party collapsed bar ----- */
body.order-form-page .mo-party-collapsed {
  background: rgba(16, 16, 20, 0.96) !important;
  border: 1px solid rgba(212, 175, 55, 0.22) !important;
  color: var(--mo-text) !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35) !important;
}

body.order-form-page .mo-party-collapsed:hover {
  border-color: rgba(230, 195, 106, 0.35) !important;
}

body.order-form-page .mo-party-collapsed:focus-visible {
  box-shadow: 0 0 0 3px rgba(230, 195, 106, 0.28), 0 8px 28px rgba(0, 0, 0, 0.35) !important;
}

body.order-form-page .mo-party-collapsed__name {
  color: var(--mo-text) !important;
  border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

body.order-form-page .mo-party-collapsed__meta {
  color: #c5cad8 !important;
}

body.order-form-page .mo-party-collapsed__gstin {
  color: rgba(250, 204, 120, 0.95) !important;
}

body.order-form-page .mo-party-collapsed__addr {
  color: #aeb6ca !important;
}

body.order-form-page .mo-party-collapsed__email {
  color: rgba(186, 230, 200, 0.95) !important;
}

/* ----- Grid ----- */
body.order-form-page .mo-grid-wrap {
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  scrollbar-color: rgba(230, 195, 106, 0.35) transparent;
}

body.order-form-page .mo-grid th {
  background: rgba(230, 195, 106, 0.14) !important;
  color: #faf8f5 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.order-form-page .mo-grid td {
  color: rgba(235, 238, 248, 0.9) !important;
  border-color: rgba(255, 255, 255, 0.07) !important;
}

body.order-form-page .mo-grid tbody tr:nth-child(even) td {
  background: rgba(255, 255, 255, 0.03) !important;
}

body.order-form-page .mo-grid tbody tr:nth-child(odd) td {
  background: rgba(12, 12, 16, 0.5) !important;
}

body.order-form-page .mo-grid td.mo-desc {
  color: #d1d5e0 !important;
}

body.order-form-page .mo-grid .mo-num {
  color: #faf8f5 !important;
}

body.order-form-page .mo-grid-footer td {
  background: rgba(230, 195, 106, 0.12) !important;
  border-top: 2px solid rgba(230, 195, 106, 0.35) !important;
  color: var(--mo-text) !important;
}

/* ----- Buttons & messages ----- */
body.order-form-page .mo-btn-add {
  background: linear-gradient(135deg, #e8d49a 0%, #c9a24a 45%, #f0e0a8 100%) !important;
  color: rgba(18, 16, 12, 0.95) !important;
}

body.order-form-page .mo-btn-add:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

body.order-form-page .mo-btn-pdf {
  border-color: rgba(230, 195, 106, 0.45) !important;
  color: rgba(230, 195, 106, 0.98) !important;
  background: rgba(255, 255, 255, 0.04) !important;
}

body.order-form-page .mo-btn-pdf:focus-visible {
  outline: 2px solid var(--mo-focus);
  outline-offset: 2px;
}

body.order-form-page .mo-remove {
  background: rgba(40, 20, 22, 0.85) !important;
  border: 1px solid rgba(248, 113, 113, 0.45) !important;
  color: #fecaca !important;
}

body.order-form-page .mo-remove:hover {
  background: rgba(80, 30, 32, 0.9) !important;
  border-color: #f87171 !important;
}

body.order-form-page .mo-remove:focus-visible {
  outline: 2px solid #fecaca;
  outline-offset: 2px;
}

body.order-form-page .mo-msg.error {
  color: #fecaca !important;
}

body.order-form-page .mo-msg.ok {
  color: #86efac !important;
}

body.order-form-page .mo-data-warning {
  background: rgba(60, 30, 20, 0.55) !important;
  border: 1px solid rgba(230, 160, 106, 0.35) !important;
  color: #fde68a !important;
}

body.order-form-page .mo-data-warning code {
  color: #fef3c7;
  background: rgba(0, 0, 0, 0.25);
  padding: 0.1em 0.35em;
  border-radius: 4px;
}

body.order-form-page .mo-section-disabled {
  opacity: 0.5;
}

@media (prefers-reduced-motion: reduce) {
  body.order-form-page .mo-suggestion,
  body.order-form-page .mo-field input,
  body.order-form-page .mo-field textarea {
    transition: none !important;
  }
}
