/* Cosmic account auth light theme */
.account-page .premium-account-auth {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.14) !important;
  color: #111827 !important;
}
.account-page .premium-account-auth::before { background: rgba(80, 211, 141, 0.08) !important; }
.account-page .account-auth-copy h1,
.account-page .account-auth-copy p,
.account-page .premium-auth-form,
.account-page .customer-login-head strong,
.account-page .customer-login-head small,
.account-page .customer-login-field span,
.account-page .auth-field,
.account-page .account-message { color: #111827 !important; }
.account-page .account-auth-copy p,
.account-page .customer-login-head small { color: #334155 !important; }
.account-page .account-auth-box {
  background: #ffffff !important;
  border: 0 !important;
  box-shadow: none !important;
}
.account-page .account-auth-tabs {
  background: #f1f5f9 !important;
  border-color: #e2e8f0 !important;
}
.account-page .account-auth-tab { color: #111827 !important; }
.account-page .account-auth-tab:hover {
  color: #111827 !important;
  background: #e2e8f0 !important;
}
.account-page .premium-auth-form,
.account-page .customer-login-card.premium-auth-form,
.account-page .account-auth-forms-grid .account-form {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.10) !important;
  color: #111827 !important;
}
.account-page .customer-login-head {
  background: #f8fafc !important;
  border-color: #e2e8f0 !important;
}
.account-page .customer-login-head strong,
.account-page .customer-login-field span,
.account-page .form-group label { color: #111827 !important; }
.account-page .customer-login-head small { color: #475569 !important; }
.account-page .customer-login-field input,
.account-page .account-form input,
.account-page .account-form select,
.account-page .address-phone-form input,
.account-page .address-phone-form select,
.account-page .premium-account-auth .auth-field .iti,
.account-page .premium-account-auth .auth-field .country-select,
.account-page .premium-account-auth .auth-field .country-select.inside {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #111827 !important;
}
.account-page .customer-login-field input::placeholder,
.account-page .account-form input::placeholder { color: #64748b !important; }
.account-page .customer-login-field input:focus,
.account-page .account-form input:focus,
.account-page .account-form select:focus {
  background: #ffffff !important;
  border-color: #50d38d !important;
  box-shadow: 0 0 0 3px rgba(80, 211, 141, 0.16) !important;
}
.account-page .premium-account-auth .auth-field .iti input[type="tel"],
.account-page .premium-account-auth .auth-field .country-select > input[type="text"] {
  background: transparent !important;
  color: #111827 !important;
}
.account-page .premium-account-auth .auth-field .iti__selected-flag,
.account-page .premium-account-auth .auth-field .country-select .flag-dropdown,
.account-page .premium-account-auth .auth-field .country-select .selected-flag {
  background: #f8fafc !important;
  border-right-color: #e2e8f0 !important;
}
.account-page .premium-account-auth .auth-field .country-select .country-list {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
  box-shadow: 0 22px 55px rgba(15, 23, 42, 0.18) !important;
  color: #111827 !important;
}
.account-page .premium-account-auth .auth-field .country-select .country-list .cosmic-country-search-item,
.account-page .premium-account-auth .auth-field .country-select .country-list .cosmic-country-search { background: #ffffff !important; }
.account-page .premium-account-auth .auth-field .country-select .country-list li.country,
.account-page .premium-account-auth .auth-field .country-select .country-list .country { color: #111827 !important; }
.account-page .premium-account-auth .auth-field .country-select .country-list li.country:hover,
.account-page .premium-account-auth .auth-field .country-select .country-list li.country.highlight,
.account-page .premium-account-auth .auth-field .country-select .country-list .country.highlight { background: #f1f5f9 !important; }
.account-page .customer-login-forgot { color: #111827 !important; }
.account-page .premium-account-auth .btn-auth-dark,
.account-page .premium-account-auth .btn-auth-dark.customer-login-btn {
  background: #50d38d !important;
  border-color: #50d38d !important;
  color: #111827 !important;
}
.account-page .premium-account-auth .btn-auth-dark:hover,
.account-page .premium-account-auth .btn-auth-dark.customer-login-btn:hover {
  transform: scale(1.035) !important;
}
body:not(.admin-body) .account-page select option {
  background: #ffffff !important;
  color: #111827 !important;
}

/* Keep the page-specific field colors above global appearance tokens. */
html body .account-page .premium-account-auth .customer-login-field input,
html body .account-page .premium-account-auth .auth-field input,
html body .account-page .premium-account-auth .auth-field select,
html body .account-page .premium-account-auth .auth-field .iti,
html body .account-page .premium-account-auth .auth-field .country-select {
  background-color: #ffffff !important;
  background-image: none !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  border-color: #cbd5e1 !important;
}
html body:not(.admin-body) .account-page .premium-account-auth .customer-login-field input,
html body:not(.admin-body) .account-page .premium-account-auth .auth-field input,
html body:not(.admin-body) .account-page .premium-account-auth .auth-field select {
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
}
#account-auth-card .customer-login-field input,
#account-auth-card .auth-field input,
#account-auth-card .auth-field select {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  border-color: #cbd5e1 !important;
}

/* Refined simple auth card and premium fields */
#account-auth-card.premium-account-auth {
  max-width: 760px !important;
  padding: clamp(20px, 4vw, 38px) !important;
  border: 1px solid #e9edf2 !important;
  border-radius: 20px !important;
  background: #ffffff !important;
  box-shadow: 0 8px 26px rgba(15, 23, 42, 0.07) !important;
}
#account-auth-card.premium-account-auth::before { display: none !important; }
#account-auth-card .account-auth-copy { margin-bottom: 24px !important; }
#account-auth-card .account-auth-copy h1 {
  margin-bottom: 10px !important;
  font-size: clamp(1.55rem, 3vw, 2.15rem) !important;
  letter-spacing: -0.025em !important;
}
#account-auth-card .account-auth-copy p {
  max-width: 560px !important;
  padding: 0 !important;
  color: #64748b !important;
}
#account-auth-card .account-auth-box,
#account-auth-card .premium-auth-form,
#account-auth-card .customer-login-card.premium-auth-form,
#account-auth-card .account-auth-forms-grid .account-form {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#account-auth-card .account-auth-tabs {
  width: 100% !important;
  margin-bottom: 22px !important;
  padding: 4px !important;
  border: 1px solid #e6eaf0 !important;
  border-radius: 12px !important;
  background: #f8fafc !important;
  box-shadow: none !important;
}
#account-auth-card .account-auth-tab {
  height: 40px !important;
  border-radius: 9px !important;
  color: #475569 !important;
  font-size: .84rem !important;
}
#account-auth-card .account-auth-tab:hover { background: #eef2f7 !important; color: #111827 !important; }
#account-auth-card .account-auth-tab.active {
  background: #ffffff !important;
  color: #111827 !important;
  border: 1px solid #dfe5ec !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08) !important;
}
#account-auth-card .customer-login-head {
  margin: 0 0 20px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
#account-auth-card .customer-login-head span {
  margin-bottom: 4px !important;
  color: #16a66a !important;
  font-size: .7rem !important;
}
#account-auth-card .customer-login-head strong {
  color: #111827 !important;
  font-size: 1.25rem !important;
  letter-spacing: -0.015em !important;
}
#account-auth-card .customer-login-head small { color: #64748b !important; }
#account-auth-card .customer-login-field,
#account-auth-card .auth-field { gap: 7px !important; }
#account-auth-card .customer-login-field span,
#account-auth-card .form-group label {
  color: #334155 !important;
  font-size: .76rem !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
}
#account-auth-card .customer-login-field input,
#account-auth-card .auth-field input,
#account-auth-card .auth-field select,
#account-auth-card .auth-field .iti,
#account-auth-card .auth-field .country-select,
#account-auth-card .auth-field .country-select.inside {
  height: 50px !important;
  min-height: 50px !important;
  border: 1px solid #d7dee8 !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.025), 0 1px 1px rgba(15, 23, 42, 0.02) !important;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease, transform .2s ease !important;
}
#account-auth-card .customer-login-field input:hover,
#account-auth-card .auth-field input:hover,
#account-auth-card .auth-field select:hover { border-color: #aeb9c8 !important; }
#account-auth-card .customer-login-field input:focus,
#account-auth-card .auth-field input:focus,
#account-auth-card .auth-field select:focus {
  outline: none !important;
  border-color: #36bd7a !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 4px rgba(80, 211, 141, 0.13), 0 4px 12px rgba(15, 23, 42, 0.06) !important;
}
#account-auth-card .customer-login-field input::placeholder,
#account-auth-card .auth-field input::placeholder { color: #94a3b8 !important; opacity: 1 !important; }
#account-auth-card .auth-field .iti input[type="tel"],
#account-auth-card .auth-field .country-select > input[type="text"] {
  height: 48px !important;
  min-height: 48px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #111827 !important;
}
#account-auth-card .auth-field .iti__selected-flag,
#account-auth-card .auth-field .country-select .flag-dropdown,
#account-auth-card .auth-field .country-select .selected-flag {
  height: 48px !important;
  min-height: 48px !important;
  background: #f8fafc !important;
  border-right: 1px solid #e2e8f0 !important;
}
#account-auth-card .premium-account-auth .btn-auth-dark,
#account-auth-card .btn-auth-dark.customer-login-btn {
  height: 50px !important;
  min-height: 50px !important;
  margin-top: 8px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #20b873 !important;
  color: #07110c !important;
  box-shadow: 0 8px 18px rgba(32, 184, 115, 0.18) !important;
}
#account-auth-card .premium-account-auth .btn-auth-dark:hover,
#account-auth-card .btn-auth-dark.customer-login-btn:hover {
  transform: scale(1.035) !important;
}
#account-auth-card .customer-login-forgot { color: #334155 !important; }

/* Compact account auth sizing */
#account-auth-card.premium-account-auth {
  max-width: 620px !important;
  padding: 24px !important;
  border-radius: 16px !important;
}
#account-auth-card .account-auth-copy { margin-bottom: 18px !important; }
#account-auth-card .account-auth-copy h1 {
  font-size: clamp(1.35rem, 2.6vw, 1.8rem) !important;
  margin: .25rem 0 .5rem !important;
}
#account-auth-card .account-auth-copy p { font-size: .88rem !important; line-height: 1.45 !important; }
#account-auth-card .account-auth-tab-panels,
#account-auth-card .account-auth-tab-panels .premium-auth-form {
  max-width: 500px !important;
}
#account-auth-card .account-auth-tabs {
  margin-bottom: 16px !important;
  padding: 3px !important;
}
#account-auth-card .account-auth-tab { height: 36px !important; font-size: .78rem !important; }
#account-auth-card .customer-login-head { margin-bottom: 14px !important; }
#account-auth-card .customer-login-head strong { font-size: 1.1rem !important; }
#account-auth-card .customer-login-head small { font-size: .76rem !important; }
#account-auth-card .customer-login-field,
#account-auth-card .auth-field { gap: 5px !important; }
#account-auth-card .customer-login-field span,
#account-auth-card .form-group label { font-size: .7rem !important; }
#account-auth-card .customer-login-field input,
#account-auth-card .auth-field input,
#account-auth-card .auth-field select,
#account-auth-card .auth-field .iti,
#account-auth-card .auth-field .country-select,
#account-auth-card .auth-field .country-select.inside {
  height: 44px !important;
  min-height: 44px !important;
  border-radius: 10px !important;
  font-size: .86rem !important;
}
#account-auth-card .auth-field .iti input[type="tel"],
#account-auth-card .auth-field .country-select > input[type="text"],
#account-auth-card .auth-field .iti__selected-flag,
#account-auth-card .auth-field .country-select .flag-dropdown,
#account-auth-card .auth-field .country-select .selected-flag {
  height: 42px !important;
  min-height: 42px !important;
}
#account-auth-card .premium-account-auth .btn-auth-dark,
#account-auth-card .btn-auth-dark.customer-login-btn {
  height: 44px !important;
  min-height: 44px !important;
  margin-top: 4px !important;
  border-radius: 10px !important;
  font-size: .78rem !important;
}

/* Narrow compact auth layout; signup remains one column */
#account-auth-card.premium-account-auth {
  max-width: 540px !important;
  padding: 20px !important;
}
#account-auth-card .account-auth-tab-panels,
#account-auth-card .account-auth-tab-panels .premium-auth-form {
  width: 100% !important;
  max-width: 420px !important;
}
#account-auth-card .auth-grid-2 {
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}
#account-auth-card .customer-login-field input,
#account-auth-card .auth-field input,
#account-auth-card .auth-field select,
#account-auth-card .auth-field .iti,
#account-auth-card .auth-field .country-select,
#account-auth-card .auth-field .country-select.inside,
#account-auth-card .premium-account-auth .btn-auth-dark,
#account-auth-card .btn-auth-dark.customer-login-btn {
  width: 100% !important;
}

/* Extra-compact auth layout */
#account-auth-card.premium-account-auth {
  max-width: 460px !important;
  padding: 16px !important;
  border-radius: 14px !important;
}
#account-auth-card .account-auth-copy { margin-bottom: 14px !important; }
#account-auth-card .account-auth-copy h1 { font-size: 1.3rem !important; }
#account-auth-card .account-auth-copy p { font-size: .8rem !important; }
#account-auth-card .account-auth-tab-panels,
#account-auth-card .account-auth-tab-panels .premium-auth-form {
  max-width: 360px !important;
}
#account-auth-card .account-auth-tabs { margin-bottom: 12px !important; }
#account-auth-card .customer-login-head { margin-bottom: 10px !important; }
#account-auth-card .customer-login-field input,
#account-auth-card .auth-field input,
#account-auth-card .auth-field select,
#account-auth-card .auth-field .iti,
#account-auth-card .auth-field .country-select,
#account-auth-card .auth-field .country-select.inside,
#account-auth-card .premium-account-auth .btn-auth-dark,
#account-auth-card .btn-auth-dark.customer-login-btn {
  height: 42px !important;
  min-height: 42px !important;
  border-radius: 9px !important;
  font-size: .82rem !important;
}
#account-auth-card .auth-grid-2 { gap: 8px !important; }

/* Match phone country dropdown to the light Country dropdown */
#account-auth-card .auth-phone-field .iti__country-list {
  width: 100% !important;
  min-width: 300px !important;
  max-height: 280px !important;
  margin-top: 8px !important;
  padding: 8px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 22px 55px rgba(15, 23, 42, 0.18) !important;
  color: #111827 !important;
}
#account-auth-card .auth-phone-field .iti__country-list .iti__country {
  display: flex !important;
  align-items: center !important;
  min-height: 38px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  color: #111827 !important;
  font-size: .86rem !important;
}
#account-auth-card .auth-phone-field .iti__country-list .iti__country:hover,
#account-auth-card .auth-phone-field .iti__country-list .iti__country--highlight {
  background: #f1f5f9 !important;
  color: #111827 !important;
}
#account-auth-card .auth-phone-field .iti__divider {
  border-bottom-color: #e2e8f0 !important;
}

/* Phone field cleanup and stable dropdown layering */
#account-auth-card .auth-phone-field .iti {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  position: relative !important;
  z-index: 20 !important;
}
#account-auth-card .auth-phone-field .iti input[type="tel"] {
  border: 0 !important;
  background: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  box-shadow: none !important;
}
#account-auth-card .auth-phone-field .iti__flag-container,
#account-auth-card .auth-phone-field .iti__selected-flag {
  border: 0 !important;
  background: #f8fafc !important;
  color: #111827 !important;
}
#account-auth-card .auth-phone-field .iti__selected-flag {
  border-radius: 9px 0 0 9px !important;
}
#account-auth-card .auth-phone-field .iti__arrow {
  border-top-color: #475569 !important;
}
#account-auth-card .auth-phone-field .iti__dropdown-content {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 8px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 22px 55px rgba(15, 23, 42, 0.18) !important;
  overflow: hidden !important;
  z-index: 2147483001 !important;
}
#account-auth-card .auth-phone-field .iti__search-input {
  display: block !important;
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid #d7dee8 !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  box-shadow: none !important;
}
#account-auth-card .auth-phone-field .iti__country-list {
  position: static !important;
  width: 100% !important;
  min-width: 0 !important;
  max-height: 250px !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}
#account-auth-card .auth-phone-field .iti__country-list .iti__country {
  color: #111827 !important;
  border-radius: 10px !important;
}
#account-auth-card .auth-phone-field .iti__country-list .iti__country:hover,
#account-auth-card .auth-phone-field .iti__country-list .iti__country--highlight {
  background: #f1f5f9 !important;
  color: #111827 !important;
}
#account-auth-card .auth-country-field { position: relative !important; z-index: 10 !important; }
#account-auth-card .auth-country-field .country-list {
  top: calc(100% + 8px) !important;
  left: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  z-index: 2147483000 !important;
}

/* Keep the phone dropdown as wide as the complete field, not the flag button. */
#account-auth-card .auth-phone-field .iti__flag-container {
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
}
#account-auth-card .auth-phone-field .iti__selected-flag,
#account-auth-card .auth-phone-field .iti__dropdown-content {
  pointer-events: auto !important;
}
#account-auth-card .auth-phone-field .iti__selected-flag {
  width: 46px !important;
}

/* Final field and button treatment */
#account-auth-card .auth-phone-field .iti {
  border: 1px solid #d7dee8 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.024), 0 1px 1px rgba(15, 23, 42, 0.02) !important;
}
#account-auth-card .auth-phone-field .iti input[type="tel"] {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#account-auth-card input::placeholder,
#account-auth-card textarea::placeholder,
#account-auth-card .iti__search-input::placeholder {
  color: #6b7280 !important;
  opacity: 1 !important;
}
#account-auth-card .premium-account-auth .btn-auth-dark,
#account-auth-card .btn-auth-dark.customer-login-btn {
  border: 1px solid #20b873 !important;
  background: transparent !important;
  color: #168a5c !important;
  box-shadow: none !important;
}
#account-auth-card .premium-account-auth .btn-auth-dark:hover,
#account-auth-card .btn-auth-dark.customer-login-btn:hover {
  border-color: #168a5c !important;
  background: rgba(32, 184, 115, 0.08) !important;
  color: #117149 !important;
  box-shadow: 0 5px 14px rgba(32, 184, 115, 0.12) !important;
}

/* Apply the final outline/button and placeholder rules at the actual component level. */
#account-auth-card .customer-login-field input::placeholder,
#account-auth-card .auth-field input::placeholder,
#account-auth-card .auth-field select::placeholder,
#account-auth-card .iti__search-input::placeholder {
  color: #6b7280 !important;
  opacity: 1 !important;
}
#account-auth-card .btn-auth-dark {
  border: 1px solid #20b873 !important;
  background: transparent !important;
  color: #168a5c !important;
  box-shadow: none !important;
}
#account-auth-card .btn-auth-dark:hover {
  transform: scale(1.035) !important;
}

/* Charcoal-gray placeholders: dark, but not pure black. */
#account-auth-card .customer-login-field input::placeholder,
#account-auth-card .auth-field input::placeholder,
#account-auth-card .auth-field select::placeholder,
#account-auth-card .iti__search-input::placeholder {
  color: #4b5563 !important;
  opacity: 1 !important;
}

/* Final compact controls and empty registration fields */
#account-auth-card .account-auth-tabs {
  width: min(280px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
#account-auth-card .btn-auth-dark {
  width: auto !important;
  min-width: 128px !important;
  max-width: 150px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 16px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  font-size: .72rem !important;
}
#account-auth-card .customer-login-field input::placeholder,
#account-auth-card .auth-field input::placeholder,
#account-auth-card .auth-field select::placeholder,
#account-auth-card .iti__search-input::placeholder {
  color: #f5f5f5 !important;
  opacity: 1 !important;
}

/* Keep compact buttons wide enough for one-line labels. */
#account-auth-card .btn-auth-dark {
  min-width: 176px !important;
  max-width: 200px !important;
  padding: 0 20px !important;
  white-space: nowrap !important;
}

/* Final alignment and label inset */
#account-auth-card .btn-auth-dark {
  display: flex !important;
  justify-self: center !important;
  margin: 12px auto 0 !important;
}
#account-auth-card .customer-login-head,
#account-auth-card .customer-login-field span,
#account-auth-card .auth-field label,
#account-auth-card .form-group label {
  padding-left: 10px !important;
}
#account-auth-card .btn-auth-dark.customer-login-btn,
#account-auth-card .btn-auth-dark {
  margin-top: 12px !important;
}

/* Final spacing adjustment */
#account-auth-card .customer-login-head,
#account-auth-card .customer-login-field span,
#account-auth-card .auth-field label,
#account-auth-card .form-group label {
  padding-left: 5px !important;
}
#account-auth-card .premium-register-form .auth-grid-2 {
  row-gap: 12px !important;
}

#account-auth-card .account-auth-tabs {
  width: min(300px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Account password-reset link spacing */
#account-auth-card .customer-login-btn { margin-bottom: 5px !important; }
#account-auth-card .customer-login-forgot {
  margin-top: 5px !important;
  padding-left: 5px !important;
}

/* Match the guest order auth page to the light account page. */
.order-page {
  background: linear-gradient(180deg, #ffffff 0%, #f7fbf8 100%) !important;
}
.order-page .order-page-head,
.order-page .order-page-head .section-title {
  color: #111827 !important;
}
.order-page .order-page-head p {
  color: #475569 !important;
}

/* Override the dark premium checkout shell to match the account page. */
body:not(.admin-body) main.order-page {
  background: linear-gradient(180deg, #ffffff 0%, #f7fbf8 100%) !important;
}

/* Keep order guest auth text identical to the light account card. */
#account-auth-card {
  color: #111827 !important;
}
#account-auth-card .account-auth-copy h1 {
  color: #111827 !important;
}

/* Match the authenticated checkout cards and controls to the light account page. */
body:not(.admin-body) main.order-page .order-checkout-card,
body:not(.admin-body) main.order-page .order-summary-card,
body:not(.admin-body) main.order-page .checkout-card {
  background: #ffffff !important;
  background-image: none !important;
  color: #111827 !important;
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  box-shadow: 0 8px 26px rgba(15, 23, 42, 0.07) !important;
}

body:not(.admin-body) main.order-page .order-card-head h3,
body:not(.admin-body) main.order-page .order-summary-card h3,
body:not(.admin-body) main.order-page .order-summary-card .summary-row,
body:not(.admin-body) main.order-page .order-summary-card .cart-item h4,
body:not(.admin-body) main.order-page .order-summary-card .cart-item p,
body:not(.admin-body) main.order-page .checkout-mode-item {
  color: #111827 !important;
}

body:not(.admin-body) main.order-page .order-card-head p,
body:not(.admin-body) main.order-page .checkout-mode-note,
body:not(.admin-body) main.order-page .form-group label {
  color: #475569 !important;
}

body:not(.admin-body) main.order-page .order-account-note {
  background: #f4fff9 !important;
  color: #111827 !important;
  border-color: rgba(80, 211, 141, 0.18) !important;
}

body:not(.admin-body) main.order-page .order-compact-form .form-control,
body:not(.admin-body) main.order-page .order-coupon-box .form-control,
body:not(.admin-body) main.order-page select.form-control {
  background: #ffffff !important;
  background-image: none !important;
  color: #111827 !important;
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
}

body:not(.admin-body) main.order-page .order-compact-form .form-control::placeholder,
body:not(.admin-body) main.order-page .order-coupon-box .form-control::placeholder {
  color: #94a3b8 !important;
}

body:not(.admin-body) main.order-page .country-select-wrap .country-select,
body:not(.admin-body) main.order-page .phone-row .iti,
body:not(.admin-body) main.order-page .phone-row .iti input,
body:not(.admin-body) main.order-page .country-select-wrap .country-select > input {
  background: #ffffff !important;
  background-image: none !important;
  color: #111827 !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
}

body:not(.admin-body) main.order-page .phone-row .iti input,
body:not(.admin-body) main.order-page .country-select-wrap .country-select > input {
  border: 0 !important;
}

body:not(.admin-body) main.order-page .country-select .country-list {
  background: #ffffff !important;
  color: #111827 !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12) !important;
}
body:not(.admin-body) main.order-page .country-select .country-list .country {
  color: #111827 !important;
}
body:not(.admin-body) main.order-page .country-select .country-list .country:hover,
body:not(.admin-body) main.order-page .country-select .country-list .country.highlight {
  background: #f1f5f9 !important;
}

body:not(.admin-body) main.order-page .order-submit-btn,
body:not(.admin-body) main.order-page #apply-coupon-btn {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid #20b873 !important;
  color: #111827 !important;
}

body:not(.admin-body) main.order-page .order-compact-form .form-control,
body:not(.admin-body) main.order-page .order-coupon-box .form-control,
body:not(.admin-body) main.order-page select.form-control,
body:not(.admin-body) main.order-page .country-select-wrap .country-select > input,
body:not(.admin-body) main.order-page .phone-row .iti input {
  -webkit-text-fill-color: #111827 !important;
}

/* Match logged-in checkout phone and country controls to the Account form. */
body:not(.admin-body) main.order-page .phone-row .iti,
body:not(.admin-body) main.order-page .country-select-wrap .country-select {
  height: 42px !important;
  min-height: 42px !important;
  border-radius: 9px !important;
  border: 1px solid #d7dee8 !important;
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: none !important;
}
body:not(.admin-body) main.order-page .phone-row .iti input,
body:not(.admin-body) main.order-page .country-select-wrap .country-select > input {
  height: 42px !important;
  min-height: 42px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  box-shadow: none !important;
}
body:not(.admin-body) main.order-page .phone-row .iti__selected-flag,
body:not(.admin-body) main.order-page .country-select-wrap .country-select .selected-flag {
  height: 42px !important;
  border-radius: 9px 0 0 9px !important;
  background: #f8fafc !important;
}


/* Center and stabilize the authenticated checkout action. */
body:not(.admin-body) main.order-page .order-submit-btn {
  width: min(180px, 100%) !important;
  min-width: 180px !important;
  margin: 1.75rem auto 0 !important;
  display: flex !important;
  justify-content: center !important;
  background: transparent !important;
  background-image: none !important;
  border: 1px solid #20b873 !important;
  color: #111827 !important;
  transform: none !important;
  box-shadow: none !important;
  padding: 18px 0 !important;
}
body:not(.admin-body) main.order-page .order-submit-btn::after,
body:not(.admin-body) main.order-page .order-submit-btn:hover::after {
  display: none !important;
  width: 0 !important;
}
html body:not(.admin-body):not(:has(.hero)):not(:has(.hp-hero)):not(:has(.home-hero)) main.order-page .order-submit-btn:hover:not(:disabled):not([aria-disabled="true"]),
html body:not(.admin-body):not(:has(.hero)):not(:has(.hp-hero)):not(:has(.home-hero)) main.order-page .order-submit-btn:active,
html body:not(.admin-body):not(:has(.hero)):not(:has(.hp-hero)):not(:has(.home-hero)) main.order-page .order-submit-btn:focus {
  background: transparent !important;
  background-image: none !important;
  border-color: #20b873 !important;
  color: #111827 !important;
  transform: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* Light dropdowns for logged-in checkout phone and country controls. */
body:not(.admin-body) main.order-page .iti__dropdown-content,
body:not(.admin-body) main.order-page .iti__country-list {
  background: #ffffff !important;
  color: #111827 !important;
  border-color: #d7dee8 !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12) !important;
}
body:not(.admin-body) main.order-page .iti__country-list .iti__country {
  color: #111827 !important;
  background: #ffffff !important;
}
body:not(.admin-body) main.order-page .iti__country-list .iti__country:hover,
body:not(.admin-body) main.order-page .iti__country-list .iti__country--highlight {
  background: #f1f5f9 !important;
  color: #111827 !important;
}
body:not(.admin-body) main.order-page .iti__dial-code {
  color: #64748b !important;
}
body:not(.admin-body) main.order-page .iti__search-input {
  height: 36px !important;
  margin: 6px !important;
  width: calc(100% - 12px) !important;
  padding: 7px 9px !important;
  border: 1px solid #d7dee8 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  box-shadow: none !important;
}
body:not(.admin-body) main.order-page .iti__search-input::placeholder {
  color: #94a3b8 !important;
}
body:not(.admin-body) main.order-page .country-select .country-list .cosmic-country-search-item {
  height: auto !important;
  padding: 6px !important;
  background: #ffffff !important;
}
body:not(.admin-body) main.order-page .country-select .country-list .cosmic-country-search {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 36px !important;
  padding: 7px 9px !important;
  border: 1px solid #d7dee8 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  box-shadow: none !important;
}
body:not(.admin-body) main.order-page .country-select .country-list .cosmic-country-search::placeholder {
  color: #94a3b8 !important;
}


/* Final checkout dropdown layout: use the full control width and keep the search usable. */
main.order-page .phone-row .iti {
  position: relative !important;
  z-index: 30 !important;
  overflow: visible !important;
}
main.order-page .phone-row .iti__dropdown-content {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 8px !important;
  border: 1px solid #d7dee8 !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 22px 55px rgba(15, 23, 42, 0.18) !important;
  overflow: hidden !important;
  z-index: 2147483001 !important;
}
main.order-page .phone-row .iti__search-input {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid #d7dee8 !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  box-shadow: none !important;
}
main.order-page .phone-row .iti__search-input::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}
main.order-page .phone-row .iti__country-list {
  position: static !important;
  width: 100% !important;
  min-width: 0 !important;
  max-height: 250px !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}
main.order-page .phone-row .iti__country-list .iti__country {
  min-height: 38px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  color: #111827 !important;
  background: #ffffff !important;
}
main.order-page .phone-row .iti__country-list .iti__country:hover,
main.order-page .phone-row .iti__country-list .iti__country--highlight {
  color: #111827 !important;
  background: #f1f5f9 !important;
}
main.order-page .phone-row .iti__dial-code {
  color: #64748b !important;
}
main.order-page .country-select-wrap .country-select {
  z-index: 31 !important;
}
main.order-page .country-select-wrap .country-select .country-list {
  width: max(100%, 340px) !important;
  min-width: 100% !important;
  max-width: min(420px, 92vw) !important;
  max-height: 300px !important;
  padding: 8px !important;
  border: 1px solid #d7dee8 !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  color: #111827 !important;
  box-shadow: 0 22px 55px rgba(15, 23, 42, 0.18) !important;
  overflow-y: auto !important;
}
main.order-page .country-select-wrap .country-select .country-list .cosmic-country-search-item {
  box-sizing: border-box !important;
  padding: 6px !important;
  background: #ffffff !important;
}
main.order-page .country-select-wrap .country-select .country-list .cosmic-country-search {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid #d7dee8 !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  box-shadow: none !important;
}
main.order-page .country-select-wrap .country-select .country-list .country {
  min-height: 36px !important;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  color: #111827 !important;
  background: #ffffff !important;
}
main.order-page .country-select-wrap .country-select .country-list .country:hover,
main.order-page .country-select-wrap .country-select .country-list .country.highlight {
  color: #111827 !important;
  background: #f1f5f9 !important;
}


/* Desktop field sizing for account and checkout; mobile remains single-column. */
@media (min-width: 901px) {
  #account-auth-card.premium-account-auth {
    max-width: 720px !important;
  }
  #account-auth-card .account-auth-box {
    min-width: 360px !important;
  }
  #account-auth-card .account-auth-tab-panels,
  #account-auth-card .account-auth-tab-panels .premium-auth-form {
    width: 100% !important;
    max-width: 460px !important;
  }
  main.order-page .order-compact-form .order-phone-country-grid {
    grid-template-columns: repeat(2, minmax(280px, 1fr)) !important;
    gap: 16px !important;
  }
}

@media (max-width: 900px) {
  #account-auth-card.premium-account-auth {
    width: 100% !important;
    max-width: 100% !important;
  }
  #account-auth-card .account-auth-box,
  #account-auth-card .account-auth-tab-panels,
  #account-auth-card .account-auth-tab-panels .premium-auth-form {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  main.order-page .order-compact-form .order-phone-country-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
}


/* Light profile panel: match the Account registration and checkout controls. */
html body:not(.admin-body) .account-page #panel-profile .account-profile-form {
  max-width: 620px !important;
  padding: 20px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08) !important;
}
html body:not(.admin-body) .account-page #panel-profile .account-profile-form input,
html body:not(.admin-body) .account-page #panel-profile .account-profile-form select,
html body:not(.admin-body) .account-page #panel-profile .account-profile-form .iti,
html body:not(.admin-body) .account-page #panel-profile .account-profile-form .country-select,
html body:not(.admin-body) .account-page #panel-profile .account-profile-form .country-select.inside {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 42px !important;
  height: 42px !important;
  border: 1px solid #d7dee8 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  box-shadow: none !important;
}
html body:not(.admin-body) .account-page #panel-profile .account-profile-form input::placeholder {
  color: #64748b !important;
  opacity: 1 !important;
}
html body:not(.admin-body) .account-page #panel-profile .account-profile-form input:focus,
html body:not(.admin-body) .account-page #panel-profile .account-profile-form select:focus {
  outline: none !important;
  border-color: #50d38d !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(80, 211, 141, 0.14) !important;
}
html body:not(.admin-body) .account-page #panel-profile .account-profile-form .iti input,
html body:not(.admin-body) .account-page #panel-profile .account-profile-form .country-select > input {
  height: 40px !important;
  min-height: 40px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  box-shadow: none !important;
}
html body:not(.admin-body) .account-page #panel-profile .account-profile-form .iti__selected-flag,
html body:not(.admin-body) .account-page #panel-profile .account-profile-form .country-select .selected-flag,
html body:not(.admin-body) .account-page #panel-profile .account-profile-form .country-select .flag-dropdown {
  height: 40px !important;
  min-height: 40px !important;
  background: #f8fafc !important;
  border-right-color: #e2e8f0 !important;
  border-radius: 9px 0 0 9px !important;
}
html body:not(.admin-body) .account-page #panel-profile .account-profile-form > .btn-primary {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 160px !important;
  max-width: 100% !important;
  min-height: 42px !important;
  height: 42px !important;
  margin: 12px auto 0 !important;
  padding: 0 18px !important;
  border-radius: 10px !important;
  background: #20b873 !important;
  border-color: #20b873 !important;
  color: #07110c !important;
  font-size: .78rem !important;
  box-shadow: none !important;
}
html body:not(.admin-body) .account-page #panel-profile .account-profile-form > .btn-primary:hover,
html body:not(.admin-body) .account-page #panel-profile .account-profile-form > .btn-primary:focus {
  background: #20b873 !important;
  border-color: #20b873 !important;
  color: #07110c !important;
  transform: scale(1.035) !important;
  box-shadow: none !important;
}
@media (max-width: 640px) {
  html body:not(.admin-body) .account-page #panel-profile .account-profile-form {
    padding: 14px !important;
  }
  html body:not(.admin-body) .account-page #panel-profile .account-profile-form > .btn-primary {
    width: 150px !important;
  }
}


/* Unified button hover policy: homepage and header keep their branded hover styles. */
body:not(:has(.hero)):not(:has(.hp-hero)):not(:has(.home-hero)) :is(
  .btn,
  button.btn,
  a.btn,
  .primary-btn,
  .cosmic-main-btn,
  .cosmic-outline-btn,
  .order-submit-btn,
  .checkout-button,
  .cart-button,
  .reserve-submit,
  .checkout-submit,
  .customer-login-btn,
  .btn-auth-dark,
  .agent-btn,
  .filter-btn,
  .account-auth-tab,
  .res-step-btn,
  .product-actions .btn,
  .menu-card .btn,
  .menu-actions .btn,
  .home-product-card .btn,
  .card-actions .btn
):not(header *):not(.navbar *):not(.site-header *):not(.app-header *) {
  transition: transform .85s cubic-bezier(.22, 1, .36, 1) !important;
}

body:not(:has(.hero)):not(:has(.hp-hero)):not(:has(.home-hero)) :is(
  .btn,
  button.btn,
  a.btn,
  .primary-btn,
  .cosmic-main-btn,
  .cosmic-outline-btn,
  .order-submit-btn,
  .checkout-button,
  .cart-button,
  .reserve-submit,
  .checkout-submit,
  .customer-login-btn,
  .btn-auth-dark,
  .agent-btn,
  .filter-btn,
  .account-auth-tab,
  .res-step-btn,
  .product-actions .btn,
  .menu-card .btn,
  .menu-actions .btn,
  .home-product-card .btn,
  .card-actions .btn
):not(header *):not(.navbar *):not(.site-header *):not(.app-header *):hover:not(:disabled):not([aria-disabled="true"]) {
  transform: scale(1.035) !important;
  box-shadow: none !important;
  filter: none !important;
}