/* ============================================================
   ORVON — dark luxury-fintech skin for OpenCart 4.1 default theme
   Loads AFTER bootstrap.css and the default stylesheet.css.
   Self-contained: no external fonts, no images, CSS only.
   ============================================================ */

/* ------------------------------------------------------------
   1. Tokens + Bootstrap 5 root variable remap
   ------------------------------------------------------------ */
:root {
  --orv-gold: #C8A66A;
  --orv-gold-light: #E7C78F;
  --orv-gold-deep: #A9863F;
  --orv-navy-0: #0B0F17;   /* page ground            */
  --orv-navy-1: #121826;   /* card / surface         */
  --orv-navy-2: #1E2433;   /* border / elevated      */
  --orv-navy-3: #2A3342;   /* strong border / hover  */
  --orv-ink:   #F6F7F9;    /* primary text           */
  --orv-ink-2: #A3A8B3;    /* secondary text         */
  --orv-ink-3: #6B7280;    /* tertiary text          */
  --orv-success: #3DBB6E;
  --orv-info:    #5B8DEF;
  --orv-warning: #E0A43C;
  --orv-danger:  #E05C5C;
  --orv-btn-ink: #14100a;  /* dark text on gold      */
  --orv-radius: 14px;
  --orv-radius-sm: 9px;
  --orv-grad-gold: linear-gradient(135deg, var(--orv-gold-light), var(--orv-gold));
  --orv-font: "Satoshi", -apple-system, "SF Pro Display", "Segoe UI", Roboto,
              "Helvetica Neue", Arial, sans-serif;

  /* Bootstrap 5.x global variables */
  --bs-body-bg: var(--orv-navy-0);
  --bs-body-color: var(--orv-ink);
  --bs-body-font-family: var(--orv-font);
  --bs-emphasis-color: var(--orv-ink);
  --bs-secondary-color: var(--orv-ink-2);
  --bs-secondary-bg: var(--orv-navy-1);
  --bs-tertiary-color: var(--orv-ink-3);
  --bs-tertiary-bg: var(--orv-navy-2);
  --bs-border-color: var(--orv-navy-2);
  --bs-border-color-translucent: rgba(42, 51, 66, .7);
  --bs-border-radius: var(--orv-radius-sm);
  --bs-border-radius-sm: 7px;
  --bs-border-radius-lg: var(--orv-radius);
  --bs-link-color: var(--orv-gold);
  --bs-link-hover-color: var(--orv-gold-light);
  --bs-link-color-rgb: 200, 166, 106;
  --bs-link-hover-color-rgb: 231, 199, 143;
  --bs-primary: var(--orv-gold);
  --bs-primary-rgb: 200, 166, 106;
  --bs-success: var(--orv-success);
  --bs-success-rgb: 61, 187, 110;
  --bs-info: var(--orv-info);
  --bs-info-rgb: 91, 141, 239;
  --bs-warning: var(--orv-warning);
  --bs-warning-rgb: 224, 164, 60;
  --bs-danger: var(--orv-danger);
  --bs-danger-rgb: 224, 92, 92;
  --bs-light: var(--orv-navy-1);
  --bs-light-rgb: 18, 24, 38;
  --bs-dark: var(--orv-navy-0);
  --bs-dark-rgb: 11, 15, 23;
  --bs-heading-color: var(--orv-ink);
  --bs-code-color: var(--orv-gold-light);

  color-scheme: dark; /* native widgets: scrollbars, date pickers, selects */
}

/* ------------------------------------------------------------
   2. Base / typography
   ------------------------------------------------------------ */
body {
  background: var(--orv-navy-0);
  color: var(--orv-ink);
  font-family: var(--orv-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  color: var(--orv-ink);
  font-weight: 700;
  letter-spacing: -0.01em;
  text-wrap: balance;
}
h1, .h1 { font-weight: 700; }
h5, .h5, h6, .h6 { font-weight: 600; letter-spacing: 0; }

a { color: var(--orv-gold); text-decoration: none; }
a:hover, a:focus { color: var(--orv-gold-light); }

hr { border-color: var(--orv-navy-2); opacity: 1; }

::selection { background: rgba(200, 166, 106, .32); color: var(--orv-ink); }
::placeholder { color: var(--orv-ink-3) !important; opacity: 1; }

mark { background: rgba(200, 166, 106, .25); color: var(--orv-ink); }

legend, .form-label, label {
  color: var(--orv-ink-2);
  font-weight: 600;
  font-size: .85rem;
}

/* small caps utility feel for tiny labels (price-tax, form-text, etc.) */
.price-tax,
.form-text,
figcaption,
.figure-caption {
  color: var(--orv-ink-3);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 600;
}

/* neutral text utilities that assume a light page */
.text-dark { color: var(--orv-ink) !important; }
.text-muted, .text-body-secondary { color: var(--orv-ink-2) !important; }
.text-black-50 { color: var(--orv-ink-2) !important; }
.bg-white, .bg-body { background-color: var(--orv-navy-1) !important; }
.bg-light { background-color: var(--orv-navy-1) !important; }
.bg-dark { background-color: var(--orv-navy-0) !important; }

/* ------------------------------------------------------------
   3. Top bar (#top) + header + logo
   ------------------------------------------------------------ */
#top {
  background: var(--orv-navy-0);
  border-bottom: 1px solid var(--orv-navy-2);
  padding: 8px 0;
  font-size: 12.5px;
}
#top a,
#top .dropdown-toggle {
  color: var(--orv-ink-2);
  text-decoration: none;
  font-weight: 500;
}
#top a:hover { color: var(--orv-gold-light); }
#top .list-inline { margin-bottom: 0; }
#top .fa-solid { color: var(--orv-gold); }

header {
  background: var(--orv-navy-0);
  border-bottom: 1px solid var(--orv-navy-2);
  padding: 18px 0 6px;
}
#logo { margin: 4px 0 10px; }
#logo h1 { margin: 0; font-size: 28px; letter-spacing: .02em; }
#logo a {
  color: var(--orv-ink);
  font-weight: 700;
  text-decoration: none;
}
#logo a:hover { color: var(--orv-gold-light); }
#logo img { max-height: 44px; width: auto; }

/* ------------------------------------------------------------
   4. Main menu (#menu — .navbar.bg-primary in default theme)
   ------------------------------------------------------------ */
#menu.navbar,
#menu {
  --bs-primary-rgb: 11, 15, 23;
  background: var(--orv-navy-0) !important;
  border: 0;
  border-bottom: 1px solid var(--orv-navy-2);
  border-radius: 0;
  padding-top: 2px;
  padding-bottom: 2px;
}
#menu .navbar-nav > .nav-item > .nav-link,
#menu .nav-link,
#menu .dropdown-item.nav-item,
#menu .navbar-nav > .nav-item > .dropdown-item {
  color: var(--orv-ink-2);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: .07em;
  text-transform: uppercase;
  padding: 14px 16px;
  background: transparent;
  border-radius: 0;
}
#menu .nav-link:hover,
#menu .nav-link:focus,
#menu .dropdown-item:hover,
#menu .nav-item > .dropdown-item:hover {
  color: var(--orv-gold-light);
  background: transparent;
  box-shadow: inset 0 -2px 0 var(--orv-gold);
}
#menu .navbar-toggler {
  color: var(--orv-gold);
  border: 1px solid var(--orv-navy-3);
  border-radius: var(--orv-radius-sm);
}
#menu .navbar-toggler:focus { box-shadow: 0 0 0 2px rgba(200, 166, 106, .35); }
#category {
  color: var(--orv-ink);
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
#menu .dropdown-inner { background: transparent; }
#menu .see-all,
#menu .dropdown-menu .see-all {
  color: var(--orv-gold);
  font-weight: 600;
}

/* ------------------------------------------------------------
   5. Dropdown menus (account, cart, categories, currency, language)
   ------------------------------------------------------------ */
.dropdown-menu {
  --bs-dropdown-bg: var(--orv-navy-1);
  --bs-dropdown-color: var(--orv-ink);
  --bs-dropdown-link-color: var(--orv-ink-2);
  --bs-dropdown-link-hover-color: var(--orv-ink);
  --bs-dropdown-link-hover-bg: var(--orv-navy-2);
  --bs-dropdown-link-active-color: var(--orv-btn-ink);
  --bs-dropdown-link-active-bg: var(--orv-gold);
  --bs-dropdown-border-color: var(--orv-navy-3);
  --bs-dropdown-divider-bg: var(--orv-navy-2);
  background: var(--orv-navy-1);
  border: 1px solid var(--orv-navy-3);
  border-radius: var(--orv-radius-sm);
  color: var(--orv-ink);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .55);
  padding: 6px;
}
.dropdown-menu .dropdown-item {
  color: var(--orv-ink-2);
  border-radius: 7px;
  font-weight: 500;
}
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
  color: var(--orv-ink);
  background: var(--orv-navy-2);
}
.dropdown-menu .dropdown-item.active,
.dropdown-menu .dropdown-item:active {
  color: var(--orv-btn-ink);
  background: var(--orv-grad-gold);
}
.dropdown-divider { border-color: var(--orv-navy-2); opacity: 1; }
.dropdown-header {
  color: var(--orv-ink-3);
  font-size: 11px;
  letter-spacing: .09em;
  text-transform: uppercase;
  font-weight: 700;
}

/* ------------------------------------------------------------
   6. Buttons
   ------------------------------------------------------------ */
.btn {
  --bs-btn-border-radius: var(--orv-radius-sm);
  border-radius: var(--orv-radius-sm);
  font-weight: 600;
  letter-spacing: .01em;
}
.btn:focus-visible { box-shadow: 0 0 0 2px var(--orv-navy-0), 0 0 0 4px var(--orv-gold-light); }

/* primary → gold gradient, dark text */
.btn-primary {
  --bs-btn-bg: var(--orv-gold);
  --bs-btn-border-color: transparent;
  --bs-btn-color: var(--orv-btn-ink);
  --bs-btn-hover-bg: var(--orv-gold-light);
  --bs-btn-hover-border-color: transparent;
  --bs-btn-hover-color: var(--orv-btn-ink);
  --bs-btn-active-bg: var(--orv-gold-deep);
  --bs-btn-active-border-color: transparent;
  --bs-btn-active-color: var(--orv-btn-ink);
  --bs-btn-disabled-bg: var(--orv-navy-3);
  --bs-btn-disabled-border-color: transparent;
  --bs-btn-disabled-color: var(--orv-ink-3);
  background: var(--orv-grad-gold);
  border-color: transparent;
  color: var(--orv-btn-ink);
}
.btn-primary:hover,
.btn-primary:focus {
  background: var(--orv-grad-gold);
  color: var(--orv-btn-ink);
  filter: brightness(1.07);
}
.btn-primary:active,
.btn-primary.active,
.btn-primary:first-child:active {
  background: linear-gradient(135deg, var(--orv-gold), var(--orv-gold-deep));
  color: var(--orv-btn-ink);
}
.btn-primary:disabled,
.btn-primary.disabled {
  background: var(--orv-navy-3);
  color: var(--orv-ink-3);
  filter: none;
}

/* outline-primary → gold ghost */
.btn-outline-primary {
  --bs-btn-color: var(--orv-gold);
  --bs-btn-border-color: var(--orv-gold);
  --bs-btn-hover-bg: rgba(200, 166, 106, .12);
  --bs-btn-hover-border-color: var(--orv-gold-light);
  --bs-btn-hover-color: var(--orv-gold-light);
  --bs-btn-active-bg: var(--orv-gold);
  --bs-btn-active-color: var(--orv-btn-ink);
  color: var(--orv-gold);
  border-color: var(--orv-gold);
  background: transparent;
}
.btn-outline-primary:hover {
  color: var(--orv-gold-light);
  border-color: var(--orv-gold-light);
  background: rgba(200, 166, 106, .12);
}

/* light / secondary / dark — used by the default theme for search,
   wishlist, compare, cart widget → dark ghost surfaces */
.btn-light,
.btn-secondary,
.btn-dark,
.btn-outline-secondary,
.btn-outline-dark,
.btn-outline-light {
  --bs-btn-bg: var(--orv-navy-1);
  --bs-btn-color: var(--orv-ink-2);
  --bs-btn-border-color: var(--orv-navy-3);
  --bs-btn-hover-bg: var(--orv-navy-2);
  --bs-btn-hover-color: var(--orv-gold-light);
  --bs-btn-hover-border-color: var(--orv-gold);
  --bs-btn-active-bg: var(--orv-navy-2);
  --bs-btn-active-color: var(--orv-gold-light);
  --bs-btn-active-border-color: var(--orv-gold);
  --bs-btn-disabled-bg: var(--orv-navy-1);
  --bs-btn-disabled-color: var(--orv-ink-3);
  --bs-btn-disabled-border-color: var(--orv-navy-2);
  background: var(--orv-navy-1);
  color: var(--orv-ink-2);
  border-color: var(--orv-navy-3);
}
.btn-light:hover, .btn-secondary:hover, .btn-dark:hover,
.btn-outline-secondary:hover, .btn-outline-dark:hover, .btn-outline-light:hover {
  background: var(--orv-navy-2);
  color: var(--orv-gold-light);
  border-color: var(--orv-gold);
}

.btn-success {
  --bs-btn-bg: var(--orv-success);
  --bs-btn-border-color: var(--orv-success);
  --bs-btn-color: #07130b;
  --bs-btn-hover-bg: #4cca7d;
  --bs-btn-hover-border-color: #4cca7d;
  --bs-btn-hover-color: #07130b;
}
.btn-danger {
  --bs-btn-bg: transparent;
  --bs-btn-color: var(--orv-danger);
  --bs-btn-border-color: rgba(224, 92, 92, .5);
  --bs-btn-hover-bg: rgba(224, 92, 92, .14);
  --bs-btn-hover-color: #ec8080;
  --bs-btn-hover-border-color: var(--orv-danger);
  background: transparent;
  color: var(--orv-danger);
  border-color: rgba(224, 92, 92, .5);
}
.btn-danger:hover { background: rgba(224, 92, 92, .14); color: #ec8080; }

.btn-link { color: var(--orv-gold); text-decoration: none; }
.btn-link:hover { color: var(--orv-gold-light); }

.btn-close {
  filter: invert(1) grayscale(100%) brightness(1.6);
}

/* ------------------------------------------------------------
   7. Forms — dark inputs, light text, gold focus
   ------------------------------------------------------------ */
.form-control,
.form-select,
textarea.form-control {
  background-color: var(--orv-navy-0);
  border: 1px solid var(--orv-navy-3);
  border-radius: var(--orv-radius-sm);
  color: var(--orv-ink);
  padding: 10px 14px;
}
.form-control:focus,
.form-select:focus,
textarea.form-control:focus {
  background-color: var(--orv-navy-0);
  border-color: var(--orv-gold);
  color: var(--orv-ink);
  box-shadow: 0 0 0 3px rgba(200, 166, 106, .18);
  outline: none;
}
.form-control:disabled,
.form-select:disabled {
  background-color: var(--orv-navy-1);
  color: var(--orv-ink-3);
  border-color: var(--orv-navy-2);
}
.form-select {
  /* Bootstrap caret rebuilt in muted ink */
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23A3A8B3' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
.input-group-text {
  background: var(--orv-navy-1);
  border: 1px solid var(--orv-navy-3);
  color: var(--orv-ink-2);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
  border-radius: var(--orv-radius-sm);
}
.form-control-lg { padding: 12px 16px; font-size: 15px; }

.form-check-input {
  background-color: var(--orv-navy-0);
  border-color: var(--orv-navy-3);
}
.form-check-input:checked {
  background-color: var(--orv-gold);
  border-color: var(--orv-gold);
}
.form-check-input:focus {
  border-color: var(--orv-gold);
  box-shadow: 0 0 0 3px rgba(200, 166, 106, .18);
}
.form-check-label { color: var(--orv-ink-2); font-weight: 500; }
.form-range::-webkit-slider-thumb { background: var(--orv-gold); }
.form-range::-moz-range-thumb { background: var(--orv-gold); }

/* validation */
.is-invalid, .form-control.is-invalid, .form-select.is-invalid {
  border-color: var(--orv-danger);
}
.invalid-feedback { color: var(--orv-danger); font-size: 12px; }
.valid-feedback { color: var(--orv-success); font-size: 12px; }
.required .form-label:after,
.required .col-form-label:after { color: var(--orv-danger); }

/* header search: merge input + gold button */
header .input-group .form-control {
  border-right: 0;
  border-radius: var(--orv-radius-sm) 0 0 var(--orv-radius-sm);
}
header .input-group .btn {
  border-radius: 0 var(--orv-radius-sm) var(--orv-radius-sm) 0;
  border: 1px solid var(--orv-navy-3);
  border-left: 0;
  background: var(--orv-navy-1);
  color: var(--orv-gold);
}
header .input-group .btn:hover { color: var(--orv-gold-light); background: var(--orv-navy-2); }
header .input-group:focus-within .btn { border-color: var(--orv-gold); }

/* cart widget button (btn-dark in default theme) */
#cart .btn,
#cart .btn-dark {
  background: var(--orv-navy-1);
  border: 1px solid var(--orv-navy-3);
  color: var(--orv-ink);
  font-weight: 600;
}
#cart .btn:hover { border-color: var(--orv-gold); color: var(--orv-gold-light); }
#cart .dropdown-menu { min-width: 340px; }
#cart .dropdown-menu li > p { color: var(--orv-ink-2); }

/* ------------------------------------------------------------
   8. Surfaces: cards, list-groups, modals, accordions, toasts
   ------------------------------------------------------------ */
.card {
  --bs-card-bg: var(--orv-navy-1);
  --bs-card-color: var(--orv-ink);
  --bs-card-border-color: var(--orv-navy-2);
  --bs-card-cap-bg: rgba(30, 36, 51, .55);
  --bs-card-cap-color: var(--orv-ink);
  --bs-card-border-radius: var(--orv-radius);
  --bs-card-inner-border-radius: calc(var(--orv-radius) - 1px);
  background: var(--orv-navy-1);
  border: 1px solid var(--orv-navy-2);
  border-radius: var(--orv-radius);
  color: var(--orv-ink);
}
.card-header {
  background: rgba(30, 36, 51, .55);
  border-bottom: 1px solid var(--orv-navy-2);
  color: var(--orv-ink);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.card-footer { background: rgba(30, 36, 51, .35); border-top: 1px solid var(--orv-navy-2); }
.card-title { color: var(--orv-ink); }
.card-body { color: var(--orv-ink-2); }

.list-group {
  --bs-list-group-bg: var(--orv-navy-1);
  --bs-list-group-color: var(--orv-ink-2);
  --bs-list-group-border-color: var(--orv-navy-2);
  --bs-list-group-action-color: var(--orv-ink-2);
  --bs-list-group-action-hover-color: var(--orv-ink);
  --bs-list-group-action-hover-bg: var(--orv-navy-2);
  --bs-list-group-action-active-bg: var(--orv-navy-2);
  --bs-list-group-action-active-color: var(--orv-gold-light);
  --bs-list-group-active-bg: transparent;
  --bs-list-group-active-border-color: var(--orv-navy-2);
  --bs-list-group-active-color: var(--orv-gold-light);
  --bs-list-group-disabled-bg: var(--orv-navy-1);
  --bs-list-group-disabled-color: var(--orv-ink-3);
  border-radius: var(--orv-radius-sm);
}
.list-group-item {
  background: var(--orv-navy-1);
  border-color: var(--orv-navy-2);
  color: var(--orv-ink-2);
}
.list-group-item-action:hover,
.list-group-item-action:focus {
  background: var(--orv-navy-2);
  color: var(--orv-ink);
}
.list-group-item.active {
  background: var(--orv-navy-2);
  border-color: var(--orv-navy-2);
  color: var(--orv-gold-light);
  box-shadow: inset 2px 0 0 var(--orv-gold);
  font-weight: 600;
}

.modal-content {
  --bs-modal-bg: var(--orv-navy-1);
  --bs-modal-color: var(--orv-ink);
  --bs-modal-border-color: var(--orv-navy-3);
  --bs-modal-header-border-color: var(--orv-navy-2);
  --bs-modal-footer-border-color: var(--orv-navy-2);
  background: var(--orv-navy-1);
  border: 1px solid var(--orv-navy-3);
  border-radius: var(--orv-radius);
  color: var(--orv-ink);
  box-shadow: 0 24px 80px rgba(0, 0, 0, .6);
}
.modal-header { border-bottom: 1px solid var(--orv-navy-2); }
.modal-footer { border-top: 1px solid var(--orv-navy-2); }
.modal-backdrop { --bs-backdrop-bg: #05070c; --bs-backdrop-opacity: .72; }

.accordion {
  --bs-accordion-bg: var(--orv-navy-1);
  --bs-accordion-color: var(--orv-ink-2);
  --bs-accordion-border-color: var(--orv-navy-2);
  --bs-accordion-btn-color: var(--orv-ink);
  --bs-accordion-btn-bg: var(--orv-navy-1);
  --bs-accordion-active-bg: var(--orv-navy-2);
  --bs-accordion-active-color: var(--orv-gold-light);
  --bs-accordion-btn-focus-box-shadow: 0 0 0 3px rgba(200, 166, 106, .18);
}
.accordion-button:not(.collapsed) { box-shadow: inset 0 -1px 0 var(--orv-navy-2); }

.toast, .popover {
  background: var(--orv-navy-1);
  border: 1px solid var(--orv-navy-3);
  color: var(--orv-ink);
}
.toast-header {
  background: rgba(30, 36, 51, .6);
  color: var(--orv-ink);
  border-bottom-color: var(--orv-navy-2);
}
.tooltip {
  --bs-tooltip-bg: var(--orv-navy-2);
  --bs-tooltip-color: var(--orv-ink);
}
.popover {
  --bs-popover-bg: var(--orv-navy-1);
  --bs-popover-border-color: var(--orv-navy-3);
  --bs-popover-body-color: var(--orv-ink-2);
  --bs-popover-header-bg: var(--orv-navy-2);
  --bs-popover-header-color: var(--orv-ink);
}

/* offcanvas (mobile menu in some builds) */
.offcanvas {
  --bs-offcanvas-bg: var(--orv-navy-0);
  --bs-offcanvas-color: var(--orv-ink);
  background: var(--orv-navy-0);
  color: var(--orv-ink);
  border-color: var(--orv-navy-2);
}

/* thumbnails / images */
.img-thumbnail {
  background: var(--orv-navy-1);
  border: 1px solid var(--orv-navy-2);
  border-radius: var(--orv-radius-sm);
  padding: 3px;
}

/* ------------------------------------------------------------
   9. Product thumb card (.product-thumb)
   ------------------------------------------------------------ */
.product-thumb {
  background: var(--orv-navy-1);
  border: 1px solid var(--orv-navy-2);
  border-radius: var(--orv-radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: auto;
  align-self: start;
  margin-bottom: 24px;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.product-thumb:hover {
  border-color: var(--orv-navy-3);
  transform: translateY(-2px);
  box-shadow: 0 16px 44px rgba(0, 0, 0, .45);
}
.product-thumb .image {
  background: var(--orv-navy-2);
  border-bottom: 1px solid var(--orv-navy-2);
  text-align: center;
}
.product-thumb .image a { display: block; }
.product-thumb .image img {
  width: 100%;
  height: auto;
  border-radius: 0;
  display: block;
}
.product-thumb .content {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 16px;
}
.oprop-card .oprop-desc { flex: 0 0 auto; }
.product-thumb h4 { margin: 0 0 6px; font-size: 16px; font-weight: 700; }
.product-thumb h4 a { color: var(--orv-ink); }
.product-thumb h4 a:hover { color: var(--orv-gold-light); }
.product-thumb .description p {
  color: var(--orv-ink-2);
  font-size: 12.5px;
  line-height: 1.55;
  margin-bottom: 10px;
}
.product-thumb .price {
  margin: 6px 0 10px;
  color: var(--orv-gold);
  font-weight: 700;
}
.product-thumb .price-new {
  color: var(--orv-gold);
  font-size: 21px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.product-thumb .price-old {
  color: var(--orv-ink-3);
  font-size: 13px;
  font-weight: 500;
  text-decoration: line-through;
  margin-left: 8px;
}
.product-thumb .price-tax { display: block; margin-top: 2px; }
.product-thumb .button {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--orv-navy-2);
}
.product-thumb .button button {
  border: 1px solid var(--orv-navy-3);
  background: transparent;
  color: var(--orv-ink-2);
  border-radius: var(--orv-radius-sm);
  padding: 9px 12px;
  cursor: pointer;
  transition: color .15s, border-color .15s, background .15s, filter .15s;
}
.product-thumb .button button:hover {
  color: var(--orv-gold-light);
  border-color: var(--orv-gold);
}
/* first button = add to cart → gold primary */
.product-thumb .button button:first-child {
  flex: 1;
  background: var(--orv-grad-gold);
  border-color: transparent;
  color: var(--orv-btn-ink);
  font-weight: 600;
}
.product-thumb .button button:first-child:hover { filter: brightness(1.07); color: var(--orv-btn-ink); }

/* ------------------------------------------------------------
   10. Product page: price, rating, tabs
   ------------------------------------------------------------ */
.price-new {
  color: var(--orv-gold);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
h2 .price-new { font-size: 30px; letter-spacing: -0.01em; }
.price-old {
  color: var(--orv-ink-3);
  text-decoration: line-through;
  font-weight: 500;
}

.rating { color: var(--orv-gold); }
.rating .fa-stack { width: 1.15em; height: 1.6em; line-height: 1.6em; font-size: 14px; }
.rating .fa-solid.fa-star { color: var(--orv-gold); }
.rating .fa-regular.fa-star { color: var(--orv-navy-3); }
.rating .fa-solid.fa-star + .fa-regular.fa-star { color: var(--orv-gold); }
.fa-stack .fa-stack-1x { text-shadow: none; }
.rating a { color: var(--orv-ink-2); font-size: 12.5px; }
.rating a:hover { color: var(--orv-gold-light); }

.nav-tabs {
  --bs-nav-tabs-border-color: var(--orv-navy-2);
  --bs-nav-tabs-link-active-bg: transparent;
  --bs-nav-tabs-link-active-color: var(--orv-gold-light);
  --bs-nav-tabs-link-active-border-color: transparent transparent var(--orv-gold);
  --bs-nav-tabs-link-hover-border-color: transparent transparent var(--orv-navy-3);
  --bs-nav-link-color: var(--orv-ink-2);
  --bs-nav-link-hover-color: var(--orv-ink);
  border-bottom: 1px solid var(--orv-navy-2);
}
.nav-tabs .nav-link {
  color: var(--orv-ink-2);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: .05em;
  text-transform: uppercase;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 12px 16px;
}
.nav-tabs .nav-link:hover { color: var(--orv-ink); border-color: var(--orv-navy-3); }
.nav-tabs .nav-link.active {
  color: var(--orv-gold-light);
  background: transparent;
  border-color: var(--orv-gold);
}
.tab-content { padding-top: 18px; color: var(--orv-ink-2); }

.nav-pills {
  --bs-nav-pills-link-active-bg: var(--orv-gold);
  --bs-nav-pills-link-active-color: var(--orv-btn-ink);
  --bs-nav-link-color: var(--orv-ink-2);
  --bs-nav-link-hover-color: var(--orv-ink);
}

/* product page misc */
#product-info h1 { font-size: 30px; margin-bottom: 10px; }
#product-info .list-unstyled li { color: var(--orv-ink-2); font-size: 13.5px; }
#product-info .list-unstyled li a { color: var(--orv-gold); }

/* ------------------------------------------------------------
   11. Breadcrumb — muted
   ------------------------------------------------------------ */
.breadcrumb {
  --bs-breadcrumb-divider-color: var(--orv-ink-3);
  --bs-breadcrumb-item-active-color: var(--orv-ink-2);
  background: transparent;
  padding: 14px 0 6px;
  margin-bottom: 12px;
  font-size: 12px;
  letter-spacing: .05em;
}
.breadcrumb-item a { color: var(--orv-ink-3); font-weight: 500; }
.breadcrumb-item a:hover { color: var(--orv-gold); }
.breadcrumb-item.active { color: var(--orv-ink-2); }
.breadcrumb-item + .breadcrumb-item::before { color: var(--orv-ink-3); }

/* ------------------------------------------------------------
   12. Tables — dark
   ------------------------------------------------------------ */
.table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--orv-ink);
  --bs-table-border-color: var(--orv-navy-2);
  --bs-table-striped-bg: rgba(30, 36, 51, .45);
  --bs-table-striped-color: var(--orv-ink);
  --bs-table-hover-bg: rgba(42, 51, 66, .45);
  --bs-table-hover-color: var(--orv-ink);
  --bs-table-active-bg: rgba(42, 51, 66, .6);
  color: var(--orv-ink);
  border-color: var(--orv-navy-2);
}
.table > :not(caption) > * > * {
  background-color: transparent;
  color: inherit;
  border-bottom-color: var(--orv-navy-2);
  box-shadow: none;
}
.table thead th,
.table thead td {
  color: var(--orv-ink-3);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--orv-navy-3);
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: rgba(30, 36, 51, .45);
  color: var(--orv-ink);
}
.table-hover > tbody > tr:hover > * {
  background-color: rgba(42, 51, 66, .45);
  color: var(--orv-ink);
}
.table-bordered > :not(caption) > * > * { border-color: var(--orv-navy-2); }
.table-light, .table-secondary {
  --bs-table-bg: var(--orv-navy-2);
  --bs-table-color: var(--orv-ink);
  color: var(--orv-ink);
}
.table a { color: var(--orv-gold); }

/* ------------------------------------------------------------
   13. Pagination
   ------------------------------------------------------------ */
.pagination {
  --bs-pagination-bg: var(--orv-navy-1);
  --bs-pagination-color: var(--orv-ink-2);
  --bs-pagination-border-color: var(--orv-navy-2);
  --bs-pagination-hover-bg: var(--orv-navy-2);
  --bs-pagination-hover-color: var(--orv-gold-light);
  --bs-pagination-hover-border-color: var(--orv-navy-3);
  --bs-pagination-focus-bg: var(--orv-navy-2);
  --bs-pagination-focus-color: var(--orv-gold-light);
  --bs-pagination-focus-box-shadow: 0 0 0 3px rgba(200, 166, 106, .18);
  --bs-pagination-active-bg: var(--orv-gold);
  --bs-pagination-active-border-color: var(--orv-gold);
  --bs-pagination-active-color: var(--orv-btn-ink);
  --bs-pagination-disabled-bg: var(--orv-navy-0);
  --bs-pagination-disabled-color: var(--orv-ink-3);
  --bs-pagination-disabled-border-color: var(--orv-navy-2);
  gap: 6px;
}
.page-link {
  background: var(--orv-navy-1);
  border: 1px solid var(--orv-navy-2);
  color: var(--orv-ink-2);
  border-radius: var(--orv-radius-sm) !important;
  font-weight: 600;
  min-width: 38px;
  text-align: center;
}
.page-link:hover { background: var(--orv-navy-2); color: var(--orv-gold-light); border-color: var(--orv-navy-3); }
.page-item.active .page-link {
  background: var(--orv-grad-gold);
  border-color: transparent;
  color: var(--orv-btn-ink);
}
.page-item.disabled .page-link {
  background: var(--orv-navy-0);
  color: var(--orv-ink-3);
  border-color: var(--orv-navy-2);
}

/* ------------------------------------------------------------
   14. Alerts
   ------------------------------------------------------------ */
.alert {
  border-radius: var(--orv-radius-sm);
  border: 1px solid;
  font-size: 13.5px;
}
.alert .fa-solid { margin-right: 4px; }
.alert-success {
  background: rgba(61, 187, 110, .08);
  border-color: rgba(61, 187, 110, .35);
  color: #7fd6a2;
}
.alert-info {
  background: rgba(91, 141, 239, .08);
  border-color: rgba(91, 141, 239, .35);
  color: #9db8f5;
}
.alert-warning {
  background: rgba(224, 164, 60, .08);
  border-color: rgba(224, 164, 60, .35);
  color: #ecc27c;
}
.alert-danger {
  background: rgba(224, 92, 92, .08);
  border-color: rgba(224, 92, 92, .35);
  color: #ee9c9c;
}
.alert .alert-link { color: var(--orv-gold-light); font-weight: 600; }
#alert {
  position: fixed;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  width: min(560px, calc(100vw - 32px));
}
#alert .alert { box-shadow: 0 14px 40px rgba(0, 0, 0, .5); backdrop-filter: blur(6px); }

/* ------------------------------------------------------------
   15. Badges + progress
   ------------------------------------------------------------ */
.badge {
  background: var(--orv-grad-gold);
  color: var(--orv-btn-ink);
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 4px 10px;
}
.badge.bg-primary { background: var(--orv-grad-gold) !important; color: var(--orv-btn-ink); }
.badge.bg-secondary, .badge.bg-light, .badge.bg-dark {
  background: var(--orv-navy-2) !important;
  color: var(--orv-ink-2);
}
.badge.bg-success { background: rgba(61, 187, 110, .16) !important; color: var(--orv-success); }
.badge.bg-warning { background: rgba(224, 164, 60, .16) !important; color: var(--orv-warning); }
.badge.bg-danger { background: rgba(224, 92, 92, .16) !important; color: var(--orv-danger); }
.badge.bg-info { background: rgba(91, 141, 239, .16) !important; color: var(--orv-info); }

.progress {
  background: var(--orv-navy-2);
  border-radius: 999px;
  height: 8px;
}
.progress-bar {
  background: linear-gradient(90deg, var(--orv-gold-deep), var(--orv-gold-light));
  border-radius: 999px;
}

/* ------------------------------------------------------------
   16. Footer
   ------------------------------------------------------------ */
footer {
  background: var(--orv-navy-0);
  border-top: 1px solid var(--orv-navy-2);
  margin-top: 48px;
  padding: 40px 0 24px;
  color: var(--orv-ink-2);
}
footer h5 {
  color: var(--orv-ink-3);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  margin-bottom: 14px;
}
footer ul.list-unstyled li { margin-bottom: 8px; }
footer a {
  color: var(--orv-ink-2);
  font-size: 13.5px;
  text-decoration: none;
}
footer a:hover { color: var(--orv-gold-light); }
footer hr { border-color: var(--orv-navy-2); margin: 26px 0 16px; }
footer p { color: var(--orv-ink-3); font-size: 12.5px; margin-bottom: 0; }

/* ------------------------------------------------------------
   17. Cookie bar / misc chrome
   ------------------------------------------------------------ */
#cookie, .cookie-bar, #cookie .modal-content {
  background: var(--orv-navy-1);
  color: var(--orv-ink-2);
  border-color: var(--orv-navy-3);
}

/* carousel (banners on home) */
.carousel-indicators [data-bs-target] { background-color: var(--orv-gold); }
.carousel-control-prev-icon,
.carousel-control-next-icon { filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .6)); }
.carousel-caption { color: var(--orv-ink); text-shadow: 0 2px 12px rgba(0, 0, 0, .7); }

/* magnific popup overlay (product gallery) */
.mfp-bg { background: #05070c; opacity: .85; }
.mfp-figure figure { background: var(--orv-navy-1); }

/* spinners */
.spinner-border, .spinner-grow { color: var(--orv-gold); }

/* scrollbars (webkit) — quiet, on-brand */
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: var(--orv-navy-0); }
::-webkit-scrollbar-thumb {
  background: var(--orv-navy-3);
  border-radius: 8px;
  border: 2px solid var(--orv-navy-0);
}
::-webkit-scrollbar-thumb:hover { background: var(--orv-gold-deep); }

/* focus ring, global */
:focus-visible { outline: 2px solid var(--orv-gold-light); outline-offset: 2px; }
.btn:focus-visible, .form-control:focus-visible, .form-select:focus-visible { outline: none; }

/* reduced motion */
@media (prefers-reduced-motion: reduce) {
  .product-thumb, .product-thumb:hover { transition: none; transform: none; }
}

/* language switcher: текст вместо отсутствующих флагов */
#form-language img, .dropdown [href*="language"] img { display: none; }

/* стоковый OpenCart резервирует 400-730px под контентом — убираем */
#content, #column-left, #column-right { padding-bottom: 40px !important; }

/* карточки как в мокапе: только кнопка View property, без иконок корзины */
.oprop-card .oprop-actions > *:not(.oprop-btn-view),
.oprop-card .button > form, .oprop-card .button > .btn-group { display: none !important; }
.oprop-card .oprop-btn-view { width: 100%; text-align: center; display: block; }

/* стоковый «липкий» футер OpenCart (position:absolute; bottom:-1px) перекрывал
   контент после уменьшения padding-bottom у #content — переводим футер в обычный поток */
footer, footer.orvon-footer.ofoot { position: static !important; bottom: auto !important; }

/* лендинг: карточки как в мокапе — без пина у локации */
.ohome-page .oprop-loc svg, .ohome-page .oprop-loc i { display: none; }

/* ===== мокапная шапка на всех страницах, sticky ===== */
.ohome-nav { background: #0B0F17; border-bottom: 1px solid #1E2433; position: fixed; top: 0; left: 0; right: 0; z-index: 1030; }
body.orvon { padding-top: 84px; }
.ohome-hero, .breadcrumb, #content { scroll-margin-top: 96px; }
@media (max-width: 900px) { body.orvon { padding-top: 70px; } }
.ohome-nav-wrap { max-width: 1160px; margin: 0 auto; padding: 18px 30px; display: flex; align-items: center; gap: 34px; }
.ohome-nav-logo { display: inline-flex; align-items: center; gap: 9px; color: #F6F7F9; font-size: 18px; text-decoration: none; }
.ohome-nav-links { display: flex; gap: 28px; }
.ohome-nav-links a { color: #A3A8B3; font-size: 14.5px; text-decoration: none; }
.ohome-nav-links a:hover { color: #F6F7F9; }
.ohome-nav-auth { margin-left: auto; display: flex; gap: 12px; align-items: center; }
.ohome-nav-langs { display: inline-flex; gap: 2px; margin-right: 4px; }
.ohome-nav-langs a { color: #6C7789; font-size: 12px; font-weight: 600; text-decoration: none; padding: 4px 5px; border-radius: 6px; }
.ohome-nav-langs a:hover { color: #E7C78F; }
.ohome-nav-cart { color: #A3A8B3; display: inline-flex; padding: 6px; border-radius: 8px; }
.ohome-nav-cart:hover { color: #E7C78F; }
.ohome-nav-login { color: #F6F7F9; border: 1px solid #2A3342; border-radius: 9px; padding: 10px 20px; font-size: 14px; font-weight: 600; text-decoration: none; }
.ohome-nav-login:hover { border-color: #C8A66A; color: #E7C78F; }
.ohome-nav-start { background: linear-gradient(135deg, #E7C78F, #C8A66A); color: #14100a; border-radius: 9px; padding: 11px 20px; font-size: 14px; font-weight: 600; text-decoration: none; }
@media (max-width: 900px) { .ohome-nav-links { display: none; } }

/* стандартную шапку OpenCart прячем на всех страницах */
.orvon-topbar, header.orvon-header, #menu, .orvon-menurow { display: none !important; }

/* карточка: нижний отступ кнопки как в мокапе (16px) */
.oprop-card .button.oprop-actions { margin-bottom: 15px; }

/* лендинг: контейнер 1160px как в мокапе */
.ohome-page .container { max-width: 1160px; }

/* сетка featured как в мокапе: узкие межколоночные отступы */
.ohome-page #content .row { --bs-gutter-x: 14px; --bs-gutter-y: 14px; }

/* ============ ORVON breadcrumbs (все страницы, перекрывает дефолт-шеврон) ============ */
.breadcrumb { display:flex !important; flex-wrap:wrap; align-items:center; gap:0; list-style:none;
  margin:0 0 22px !important; padding:9px 16px !important; background:#121826 !important;
  border:1px solid #1E2433 !important; border-radius:10px !important; font-size:13px; }
.breadcrumb > li.breadcrumb-item { text-shadow:none !important; padding:0 !important; position:static !important;
  white-space:nowrap; display:inline-flex; align-items:center; }
.breadcrumb > li.breadcrumb-item:after { display:none !important; content:none !important; }
.breadcrumb > li.breadcrumb-item > a { color:#A3A8B3 !important; text-decoration:none; }
.breadcrumb > li.breadcrumb-item > a:hover { color:#E7C78F !important; }
.breadcrumb > li.breadcrumb-item + li.breadcrumb-item::before { content:"\203A" !important; color:#6B7280;
  padding:0 9px !important; font-size:14px; }
.breadcrumb > li.breadcrumb-item:last-child > a { color:#F6F7F9 !important; font-weight:600; }
.breadcrumb i.fa-house, .breadcrumb i.fa-home { color:#C8A66A; }

/* ============ fix: Get Started hover — текст не выцветает ============ */
.ohome-nav-start:hover, .ohome-nav-start:focus,
.orvon-header-auth .ohome-nav-start:hover { color:#14100a !important; filter:brightness(1.05); text-decoration:none; }
.ohome-nav-login:hover, .ohome-nav-login:focus { color:#E7C78F !important; }

/* ============ ORVON burger + off-canvas drawer (tablet/mobile) ============ */
.ohome-burger { display:none; margin-left:auto; width:44px; height:44px; border:1px solid #1E2433; border-radius:10px;
  background:#121826; cursor:pointer; flex-direction:column; align-items:center; justify-content:center; gap:5px; }
.ohome-burger span { display:block; width:20px; height:2px; border-radius:2px; background:#F6F7F9; transition:transform .2s ease, opacity .2s ease; }
body.menu-open .ohome-burger span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
body.menu-open .ohome-burger span:nth-child(2){ opacity:0; }
body.menu-open .ohome-burger span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.ohome-backdrop { position:fixed; inset:0; background:rgba(4,7,12,.6); opacity:0; visibility:hidden; transition:opacity .25s ease; z-index:1040; }
body.menu-open .ohome-backdrop { opacity:1; visibility:visible; }
.ohome-drawer { position:fixed; top:0; right:0; height:100%; width:300px; max-width:85vw; z-index:1050;
  background:#0B0F17; border-left:1px solid #1E2433; box-shadow:-24px 0 60px rgba(0,0,0,.5);
  transform:translateX(100%); transition:transform .28s cubic-bezier(.4,0,.2,1);
  display:flex; flex-direction:column; padding:18px 20px; gap:6px; }
body.menu-open .ohome-drawer { transform:translateX(0); }
.ohome-drawer-head { display:flex; align-items:center; justify-content:space-between; padding-bottom:14px; border-bottom:1px solid #1E2433; margin-bottom:8px; }
.ohome-drawer-head .ohome-nav-logo { display:inline-flex; align-items:center; gap:9px; color:#F6F7F9; font-size:18px; }
.ohome-drawer-close { width:36px; height:36px; border:0; background:none; color:#A3A8B3; font-size:26px; line-height:1; cursor:pointer; border-radius:8px; }
.ohome-drawer-close:hover { color:#F6F7F9; background:#121826; }
.ohome-drawer-links { display:flex; flex-direction:column; }
.ohome-drawer-links a { color:#D7DAE0; text-decoration:none; font-size:16px; font-weight:500; padding:13px 6px; border-bottom:1px solid #141a26; }
.ohome-drawer-links a:hover { color:#E7C78F; }
.ohome-drawer-auth { display:flex; flex-direction:column; gap:10px; margin-top:16px; }
.ohome-drawer-auth .ohome-nav-login { text-align:center; color:#F6F7F9; border:1px solid #2A3342; border-radius:10px; padding:12px; font-weight:600; text-decoration:none; }
.ohome-drawer-auth .ohome-nav-start { text-align:center; background:linear-gradient(135deg,#E7C78F,#C8A66A); color:#14100a; border-radius:10px; padding:12px; font-weight:700; text-decoration:none; }
.ohome-drawer-auth .ohome-nav-start:hover { filter:brightness(1.05); color:#14100a; }
.ohome-drawer-langs { display:flex; gap:8px; margin-top:auto; padding-top:16px; border-top:1px solid #1E2433; }
.ohome-drawer-langs a { flex:1; text-align:center; color:#A3A8B3; text-decoration:none; font-size:13px; font-weight:600; padding:9px 0; border:1px solid #1E2433; border-radius:8px; }
.ohome-drawer-langs a.nav-lang-active { background:linear-gradient(135deg,#E7C78F,#C8A66A); color:#14100a; border-color:transparent; }

/* ---------- header responsive: burger takes over ≤900 ---------- */
@media (max-width: 900px) {
  .ohome-nav-wrap { padding:14px 18px; gap:14px; }
  .ohome-nav-links { display:none !important; }
  .ohome-nav-auth { display:none !important; }
  .ohome-burger { display:inline-flex; }
  .ohome-page .orvon-header, .ohome-page #search { }
}
@media (min-width: 901px) { .ohome-burger, .ohome-drawer, .ohome-backdrop { display:none !important; } }

/* ---------- home sections: tablet/mobile stacking ---------- */
@media (max-width: 900px) {
  .ohome-hero-grid { grid-template-columns:1fr !important; gap:26px; }
  .ohome-perks-grid { grid-template-columns:1fr 1fr !important; gap:22px 18px; }
  .ohome-steps { grid-template-columns:1fr 1fr !important; gap:14px; }
  .ohome-metrics { grid-template-columns:1fr 1fr !important; row-gap:22px; }
  .ohome-cta { flex-direction:column; align-items:stretch; gap:16px; }
  .ohome-cta-form { width:100%; }
  #content .row > .col, #content .row { }
  .oprop-card { }
}
@media (max-width: 560px) {
  .ohome-hero .container, .ohome-perks .container, .ohome-featured .container, .ohome-how .container { padding-left:18px; padding-right:18px; }
  .ohome-h1 { font-size:34px; line-height:1.08; }
  .ohome-perks-grid { grid-template-columns:1fr !important; }
  .ohome-steps { grid-template-columns:1fr !important; }
  .ohome-metrics { grid-template-columns:1fr 1fr !important; }
  .ohome-section-head { flex-wrap:wrap; gap:6px; }
  .oprop-card, .product-thumb.oprop-card { }
  .ofoot-grid { grid-template-columns:1fr 1fr !important; }
}
@media (max-width: 400px) {
  .ofoot-grid { grid-template-columns:1fr !important; }
}

/* ============================================================
   ORVON — skin for stock account/* pages (orders, wishlist,
   edit, password, address, newsletter, order info, downloads…)
   Applies to any page whose wrapper id starts with "account-".
   ============================================================ */
div[id^="account-"].container { max-width: 1160px; padding-bottom: 48px; }
div[id^="account-"] h1, div[id^="account-"] h2, div[id^="account-"] h3 { color: #F6F7F9; font-weight: 700; }
div[id^="account-"] h1 { font-size: 28px; margin: 6px 0 18px; }
div[id^="account-"] h2 { font-size: 18px; margin: 18px 0 10px; }
div[id^="account-"] p { color: #A3A8B3; }
div[id^="account-"] legend {
  color: #C8A66A; font-size: 12px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  border-bottom: 1px solid #1E2433; padding-bottom: 9px; margin-bottom: 16px; }
div[id^="account-"] label, div[id^="account-"] .col-form-label, div[id^="account-"] .form-label { color: #A3A8B3; }

/* tables */
div[id^="account-"] .table {
  --bs-table-bg: transparent; --bs-table-color: #F6F7F9; --bs-table-border-color: #1E2433;
  --bs-table-striped-bg: #151B2B; --bs-table-striped-color: #F6F7F9;
  --bs-table-hover-bg: #171E2E; --bs-table-hover-color: #F6F7F9;
  color: #F6F7F9; border-color: #1E2433; margin-bottom: 0; }
div[id^="account-"] .table td, div[id^="account-"] .table th { border-color: #1E2433; padding: 12px 14px; vertical-align: middle; }
div[id^="account-"] .table thead td, div[id^="account-"] .table thead th {
  color: #6B7280; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; background: #10151F; }
div[id^="account-"] .table a { color: #C8A66A; text-decoration: none; font-weight: 600; }
div[id^="account-"] .table a:hover { color: #E7C78F; }
div[id^="account-"] .table-responsive, div[id^="account-"] .table-bordered {
  background: #121826; border: 1px solid #1E2433 !important; border-radius: 12px; overflow: hidden; }
div[id^="account-"] .table-responsive .table-bordered { border: 0 !important; border-radius: 0; }
div[id^="account-"] .img-thumbnail { background: #0B0F17; border-color: #1E2433; border-radius: 8px; }

/* buttons */
div[id^="account-"] .btn { border-radius: 9px; font-weight: 600; }
div[id^="account-"] .btn-primary {
  background: linear-gradient(135deg, #E7C78F, #C8A66A) !important; border: 0 !important; color: #14100a !important; font-weight: 700; }
div[id^="account-"] .btn-primary:hover { filter: brightness(1.06); color: #14100a !important; }
div[id^="account-"] .btn-info {
  background: #1E2433 !important; border: 1px solid #2A3342 !important; color: #C8A66A !important; }
div[id^="account-"] .btn-info:hover { border-color: #C8A66A !important; color: #E7C78F !important; background: #1E2433 !important; }
div[id^="account-"] .btn-danger {
  background: transparent !important; border: 1px solid #E05C5C !important; color: #E05C5C !important; }
div[id^="account-"] .btn-danger:hover { background: rgba(224,92,92,.12) !important; color: #E05C5C !important; }
div[id^="account-"] .btn-light, div[id^="account-"] .btn-secondary, div[id^="account-"] .btn-default {
  background: transparent !important; border: 1px solid #2A3342 !important; color: #F6F7F9 !important; }
div[id^="account-"] .btn-light:hover, div[id^="account-"] .btn-secondary:hover, div[id^="account-"] .btn-default:hover {
  border-color: #C8A66A !important; color: #E7C78F !important; }

/* forms */
div[id^="account-"] .form-control, div[id^="account-"] .form-select {
  background: #0B0F17; border: 1.5px solid #2A3342; color: #F6F7F9; border-radius: 10px; min-height: 44px;
  transition: border-color .15s ease, box-shadow .15s ease; }
div[id^="account-"] .form-control::placeholder { color: #6B7280; }
div[id^="account-"] .form-control:focus, div[id^="account-"] .form-select:focus {
  background: #0B0F17; color: #F6F7F9; border-color: #C8A66A; box-shadow: 0 0 0 3px rgba(200,166,106,.18); }
div[id^="account-"] .form-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23A3A8B3'%3E%3Cpath d='M8 11 3 6h10z'/%3E%3C/svg%3E"); }
div[id^="account-"] .form-check-input { background-color: #0B0F17; border-color: #2A3342; }
div[id^="account-"] .form-check-input:checked { background-color: #C8A66A; border-color: #C8A66A; }
div[id^="account-"] .input-group-text { background: #121826; border-color: #2A3342; color: #A3A8B3; }
div[id^="account-"] .invalid-feedback { color: #E05C5C; }

/* pagination */
div[id^="account-"] .pagination .page-link { background: #121826; border-color: #1E2433; color: #A3A8B3; }
div[id^="account-"] .pagination .page-link:hover { color: #E7C78F; background: #1E2433; }
div[id^="account-"] .pagination .page-item.active .page-link {
  background: linear-gradient(135deg, #E7C78F, #C8A66A); border-color: transparent; color: #14100a; font-weight: 700; }

/* alerts */
div[id^="account-"] .alert-success { background: rgba(61,187,110,.09); border-color: rgba(61,187,110,.38); color: #F6F7F9; }
div[id^="account-"] .alert-danger { background: rgba(224,92,92,.10); border-color: rgba(224,92,92,.4); color: #F6F7F9; }
div[id^="account-"] .alert-warning { background: rgba(224,164,60,.10); border-color: rgba(224,164,60,.4); color: #F6F7F9; }

/* misc */
div[id^="account-"] .list-group-item { background: #121826; border-color: #1E2433; color: #A3A8B3; }
div[id^="account-"] .card { background: #121826; border-color: #1E2433; color: #F6F7F9; border-radius: 12px; }
div[id^="account-"] .card-header { background: #10151F; border-color: #1E2433; color: #F6F7F9; font-weight: 600; }

/* ============================================================
   ORVON — mobile/tablet polish (account area)
   ============================================================ */
/* account menu: horizontal scrollable bar on phones (column_left is visible on all sizes now) */
@media (max-width: 767.98px) {
  #column-left { width: 100%; flex: 0 0 100%; max-width: 100%; margin-bottom: 6px; }
  #column-left .oaccm { position: static; flex-direction: row; overflow-x: auto; padding: 8px; gap: 4px;
    scrollbar-width: none; }
  #column-left .oaccm::-webkit-scrollbar { display: none; }
  #column-left .oaccm a { white-space: nowrap; flex: none; padding: 8px 11px; }
  #column-left .oaccm .oaccm-foot { margin: 0; padding: 0; border: 0; display: inline-flex; }
}
@media (max-width: 767.98px) {
  #column-left .oaccm { margin-bottom: 8px; }
  div[id^="account-"] h1 { margin-top: 0; }
}

/* ============================================================
   ORVON — direct investing widget (replaces the cart)
   ============================================================ */
.oinv { margin: 18px 0 6px; }
.oinv-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.oinv-now { font-size: 30px; font-weight: 700; color: #F6F7F9; letter-spacing: -.02em; }
.oinv-unit { font-size: 13px; color: #6B7280; }
.oinv-grown { margin-left: auto; font-size: 12.5px; font-weight: 700; color: #3DBB6E;
  background: rgba(61,187,110,.12); border-radius: 999px; padding: 3px 11px; cursor: help; }
.oinv-chips { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 12px; }
.oinv-chip { border: 1px solid #2A3342; background: #121826; color: #A3A8B3; border-radius: 999px;
  padding: 7px 15px; font-size: 13px; font-weight: 600; cursor: pointer; transition: .15s; }
.oinv-chip:hover { border-color: #C8A66A; color: #E7C78F; }
.oinv-chip.is-on { background: linear-gradient(135deg,#E7C78F,#C8A66A); border-color: transparent; color: #14100a; }
.oinv-qtyrow { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-bottom: 14px; }
.oinv-step { width: 38px; height: 42px; border: 1px solid #2A3342; background: #121826; color: #F6F7F9;
  border-radius: 9px; font-size: 19px; line-height: 1; cursor: pointer; }
.oinv-step:hover { border-color: #C8A66A; color: #E7C78F; }
.oinv-qtyrow input { width: 96px; height: 42px; text-align: center; font-size: 16px; font-weight: 700;
  color: #F6F7F9; background: #0B0F17; border: 1.5px solid #2A3342; border-radius: 9px; outline: none;
  -moz-appearance: textfield; }
.oinv-qtyrow input::-webkit-outer-spin-button,
.oinv-qtyrow input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.oinv-qtyrow input:focus { border-color: #C8A66A; box-shadow: 0 0 0 3px rgba(200,166,106,.18); }
.oinv-word { font-size: 13px; color: #6B7280; }
.oinv-total { margin-left: auto; font-size: 20px; font-weight: 700; color: #E7C78F; font-variant-numeric: tabular-nums; }
.oinv-go { width: 100%; border: 0; cursor: pointer; padding: 15px 22px; border-radius: 11px;
  font-size: 15.5px; font-weight: 700; color: #14100a;
  background: linear-gradient(135deg,#E7C78F,#C8A66A); transition: filter .15s ease; }
.oinv-go:hover { filter: brightness(1.06); }
.oinv-go:disabled { opacity: .6; cursor: default; }
.oinv-meta { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  margin-top: 10px; font-size: 12px; color: #6B7280; line-height: 1.5; }
.oinv-meta b { color: #A3A8B3; }
.oinv-soldout { padding: 16px; text-align: center; border: 1px dashed #2A3342; border-radius: 11px;
  color: #6B7280; font-size: 14px; }
.oinv-msg { margin-top: 11px; font-size: 13.5px; min-height: 18px; line-height: 1.5; }
.oinv-msg.is-ok { color: #3DBB6E; }
.oinv-msg.is-err { color: #E05C5C; }
@media (max-width: 520px) {
  .oinv-total { margin-left: 0; width: 100%; }
}

/* currency switcher — same visual language as the EN/RU/LV pills */
.ohome-nav-curs { display: inline-flex; align-items: center; gap: 2px; margin-right: 4px; }
.ohome-nav-curs a { font-size: 13px; font-weight: 700; color: #6B7280; text-decoration: none;
  padding: 3px 8px; border-radius: 6px; line-height: 1; transition: color .15s, background .15s; }
.ohome-nav-curs a:hover { color: #F6F7F9; }
.ohome-nav-curs a.nav-cur-active { color: #C8A66A; background: rgba(200,166,106,.12); }
.owl-msg { width: 100%; font-size: 12.5px; margin-top: 8px; line-height: 1.5; }
.oinv-yield { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-top: 12px; padding-top: 12px; border-top: 1px solid #1E2433; font-size: 13px; color: #A3A8B3; }
.oinv-yield b { color: #3DBB6E; font-size: 15px; font-variant-numeric: tabular-nums; }