/**
 * Customer account area (2026-10):
 *  - public pages: login, registration, password (.mh-auth-page)
 *  - logged-in shell: navigation | title + content (#main.mh-acc, customer/page.tpl)
 *  - dashboard, orders, addresses, forms, tables, order detail
 * Loaded on every page by _partials/stylesheets.tpl (everything is scoped). Bump ?v=.
 */

.mh-auth-page,
.mh-acc {
  --a-navy: #0c193a;
  --a-orange: #e65021;
  --a-orange-dark: #cf4419;
  --a-green: #1f9d55;
  --a-green-soft: #ecf8f1;
  --a-line: #e6e9ef;
  --a-line-2: #d5dae3;
  --a-text: #475266;
  --a-muted: #7d8799;
  --a-soft: #f5f7fa;
  color: var(--a-text);
}

/* ================================================================== */
/* Forms (login, registration, identity, address…)                    */
/* ================================================================== */
.mh-auth-page .form-group,
.mh-acc .form-group {
  margin: 0 0 16px;
}

.mh-auth-page label,
.mh-acc .form-group > label,
.mh-acc .form-group > .label {
  display: block;
  margin: 0 0 6px;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--a-navy);
}

.mh-auth-page label.required::after,
.mh-acc label.required::after {
  content: ' *';
  color: var(--a-orange);
}

.mh-auth-page label small,
.mh-acc label small {
  font-weight: 500;
  color: var(--a-muted) !important;
}

.mh-auth-page .form-control,
.mh-auth-page .custom-select,
.mh-acc .form-control,
.mh-acc .custom-select {
  height: 48px;
  padding: 0 14px;
  font-size: 15px;
  color: var(--a-navy);
  background-color: #fff;
  border: 1px solid var(--a-line-2) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.mh-auth-page textarea.form-control,
.mh-acc textarea.form-control {
  height: auto;
  min-height: 110px;
  padding: 12px 14px;
}

.mh-auth-page .form-control:focus,
.mh-auth-page .custom-select:focus,
.mh-acc .form-control:focus,
.mh-acc .custom-select:focus {
  border-color: var(--a-navy) !important;
  box-shadow: 0 0 0 3px rgba(12, 25, 58, 0.08) !important;
}

.mh-auth-page .form-control.is-invalid,
.mh-acc .form-control.is-invalid {
  border-color: #d93025 !important;
}

.mh-auth-page .invalid-feedback,
.mh-acc .invalid-feedback,
.mh-auth-page .help-block,
.mh-acc .help-block {
  font-size: 12.5px;
  color: #d93025;
}

.mh-auth-page .form-text,
.mh-acc .form-text,
.mh-auth-page .text-muted,
.mh-acc .text-muted {
  font-size: 12.5px;
  color: var(--a-muted) !important;
}

/* Password field + show button */
.mh-auth-page .input-group,
.mh-acc .input-group {
  flex-wrap: nowrap;
}

.mh-auth-page .input-group .form-control,
.mh-acc .input-group .form-control {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.mh-auth-page .input-group-append .btn,
.mh-acc .input-group-append .btn {
  height: 48px;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 700;
  text-transform: none;
  color: var(--a-navy) !important;
  background: var(--a-soft) !important;
  border: 1px solid var(--a-line-2) !important;
  border-left: 0 !important;
  border-radius: 0 12px 12px 0 !important;
  box-shadow: none !important;
}

/* Radios / checkboxes */
.mh-auth-page .custom-control,
.mh-acc .custom-control {
  min-height: 22px;
  padding-left: 30px;
}

.mh-auth-page .custom-control-label,
.mh-acc .custom-control-label {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  color: var(--a-text);
}

.mh-auth-page .custom-control-label::before,
.mh-acc .custom-control-label::before {
  top: 1px;
  left: -30px;
  width: 20px;
  height: 20px;
  background: #fff;
  border: 1.5px solid var(--a-line-2);
}

.mh-auth-page .custom-control-label::after,
.mh-acc .custom-control-label::after {
  top: 1px;
  left: -30px;
  width: 20px;
  height: 20px;
}

.mh-auth-page .custom-checkbox .custom-control-label::before,
.mh-acc .custom-checkbox .custom-control-label::before {
  border-radius: 6px;
}

.mh-auth-page .custom-control-input:checked ~ .custom-control-label::before,
.mh-acc .custom-control-input:checked ~ .custom-control-label::before {
  background: var(--a-navy);
  border-color: var(--a-navy);
}

.mh-auth-page .custom-control-inline,
.mh-acc .custom-control-inline {
  margin-right: 22px;
}

/* Buttons */
.mh-form__submit,
.mh-auth-page .form-control-submit,
.mh-acc .form-control-submit,
.mh-acc .form-footer .btn-primary {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  min-width: 200px;
  height: 52px !important;
  margin: 4px 0 0;
  padding: 0 26px !important;
  font-family: inherit;
  font-size: 16px !important;
  font-weight: 800 !important;
  text-transform: none !important;
  color: #fff !important;
  background: var(--a-orange) !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 10px 22px rgba(230, 80, 33, 0.25) !important;
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.mh-form__submit:hover,
.mh-auth-page .form-control-submit:hover,
.mh-acc .form-control-submit:hover {
  background: var(--a-orange-dark) !important;
}

.mh-auth-page .form-footer,
.mh-acc .form-footer {
  margin: 8px 0 0;
  padding: 0;
  text-align: left;
  border: 0;
}

.mh-acc .btn-outline-primary,
.mh-acc .btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 46px;
  padding: 0 18px;
  font-size: 14.5px;
  font-weight: 700;
  text-transform: none;
  color: var(--a-navy) !important;
  background: #fff !important;
  border: 1px solid var(--a-line-2) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

.mh-acc .btn-outline-primary:hover,
.mh-acc .btn-secondary:hover {
  background: var(--a-soft) !important;
  border-color: var(--a-navy) !important;
}

.mh-acc .btn-outline-primary svg {
  width: 18px;
  height: 18px;
}

/* Errors / notifications */
.mh-form__errors,
.mh-auth-page .alert-danger,
.mh-acc .alert-danger {
  margin: 0 0 16px;
  padding: 12px 14px;
  font-size: 14px;
  list-style: none;
  color: #a1251b;
  background: #fdecea;
  border: 0;
  border-radius: 12px;
}

.mh-acc .alert-success,
.mh-auth-page .alert-success {
  padding: 12px 14px;
  font-size: 14px;
  color: #136c3a;
  background: var(--a-green-soft);
  border: 0;
  border-radius: 12px;
}

.mh-acc .alert-info,
.mh-auth-page .alert-info {
  padding: 12px 14px;
  font-size: 14px;
  color: var(--a-navy);
  background: #eef3fb;
  border: 0;
  border-radius: 12px;
}

/* ================================================================== */
/* Public pages: login / registration / password                     */
/* ================================================================== */
#main.mh-auth-page {
  padding: 32px 0 56px;
}

.mh-auth {
  display: grid;
  grid-template-columns: minmax(0, 520px) minmax(0, 420px);
  justify-content: center;
  gap: 32px;
  align-items: start;
}

.mh-auth--wide {
  grid-template-columns: minmax(0, 680px) minmax(0, 380px);
}

.mh-auth--single {
  grid-template-columns: minmax(0, 520px);
}

.mh-auth__card {
  padding: 36px;
  background: #fff;
  border: 1px solid var(--a-line);
  border-radius: 24px;
  box-shadow: 0 1px 2px rgba(12, 25, 58, 0.04), 0 14px 40px rgba(12, 25, 58, 0.08);
}

.mh-auth-page .mh-auth__title {
  margin: 0 0 6px !important;
  padding: 0 !important;
  font-size: 30px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em;
  text-align: left !important;
  text-transform: none !important;
  color: var(--a-navy) !important;
  background: none !important;
  border: 0 !important;
}

.mh-auth-page .mh-auth__title::after {
  content: none !important;
}

.mh-auth__sub {
  margin: 0 0 26px;
  font-size: 15px;
  line-height: 1.55;
  color: var(--a-muted);
}

.mh-auth__sub a {
  font-weight: 700;
  color: var(--a-orange) !important;
}

.mh-auth .mh-form .form-control-submit,
.mh-auth .mh-form__submit {
  width: 100%;
}

.mh-form__forgot {
  margin: -6px 0 18px;
  text-align: right;
}

.mh-form__forgot a {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--a-navy) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.mh-auth__social {
  display: flex;
  justify-content: center;
  margin: 18px 0 0;
}

.mh-auth__social:empty {
  display: none;
}

.mh-auth__social > * {
  margin: 0 !important;
}

.mh-auth__alt {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  margin: 26px 0 0;
  padding: 22px 0 0;
  text-align: center;
  border-top: 1px solid var(--a-line);
}

.mh-auth__alt > span {
  font-size: 14px;
  color: var(--a-muted);
}

.mh-auth__alt-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  font-size: 15px;
  font-weight: 800;
  color: var(--a-navy) !important;
  background: #fff;
  border: 1px solid var(--a-line-2);
  border-radius: 14px;
  text-decoration: none !important;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.mh-auth__alt-btn:hover {
  background: var(--a-soft);
  border-color: var(--a-navy);
}

.mh-auth__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 22px 0 0;
  font-size: 14px;
  font-weight: 700;
  color: var(--a-navy) !important;
}

/* The theme centres forms with auto margins */
.mh-auth form,
.mh-acc #content form {
  width: 100%;
  max-width: none;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.mh-auth-page .form-group > .label,
.mh-acc .form-group > .label {
  display: block;
  margin: 0 0 8px !important;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--a-navy);
}

/* Benefits panel */
.mh-auth__side {
  position: sticky;
  top: 24px;
  padding: 32px;
  color: rgba(255, 255, 255, 0.85);
  background: var(--a-navy);
  border-radius: 24px;
}

.mh-auth__side-title {
  margin: 0 0 20px;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.3;
  color: #fff;
}

.mh-auth__perks {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mh-auth__perks li {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  color: #fff;
}

.mh-auth__perks li span {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  color: #ff9b6e;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 12px;
}

.mh-auth__help {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 26px 0 0;
  padding: 20px 0 0;
  font-size: 13.5px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.mh-auth__help a {
  font-size: 18px;
  font-weight: 800;
  color: #fff !important;
}

/* Registration: two columns of fields where it fits */
.mh-auth--wide .register-form .form-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 16px;
}

.mh-auth--wide .register-form .form-fields > * {
  grid-column: 1 / -1;
}

.mh-auth--wide .register-form .form-fields > .form-group:has(input[name='firstname']),
.mh-auth--wide .register-form .form-fields > .form-group:has(input[name='lastname']) {
  grid-column: auto;
}

/* ================================================================== */
/* Logged-in shell: navigation | title + content                      */
/* ================================================================== */
#main.mh-acc {
  display: grid;
  grid-template-columns: 290px minmax(0, 1fr);
  grid-template-areas:
    'nav head'
    'nav content';
  column-gap: 36px;
  align-items: start;
  margin: 0 0 56px !important;
  padding: 28px 0 0;
}

#main.mh-acc > .page-header {
  grid-area: head;
  margin: 0 0 20px;
  padding: 0;
  background: none;
  border: 0;
}

#main.mh-acc > .page-header h1 {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 30px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em;
  text-align: left !important;
  text-transform: none !important;
  color: var(--a-navy) !important;
  background: none !important;
  border: 0 !important;
}

#main.mh-acc > .page-header h1::after {
  content: none !important;
}

#main.mh-acc > #content {
  grid-area: content;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
}

.mh-acc__nav {
  grid-area: nav;
  grid-row: 1 / span 2;
  position: sticky;
  top: 16px;
  padding: 18px;
  background: #fff;
  border: 1px solid var(--a-line);
  border-radius: 20px;
}

.mh-acc__who {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 14px;
  padding: 0 4px 16px;
  border-bottom: 1px solid var(--a-line);
}

.mh-acc__avatar {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  font-size: 16px;
  font-weight: 800;
  text-transform: uppercase;
  color: #fff;
  background: var(--a-navy);
  border-radius: 50%;
}

.mh-acc__name {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.mh-acc__name strong {
  overflow: hidden;
  font-size: 15px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--a-navy);
}

.mh-acc__name small {
  overflow: hidden;
  font-size: 12.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--a-muted);
}

.mh-acc__links {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mh-acc__links a,
.mh-acc__mods a,
.mh-acc__logout {
  display: flex !important;
  align-items: center;
  gap: 12px;
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--a-text) !important;
  background: none;
  border-radius: 12px;
  text-decoration: none !important;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.mh-acc__links a svg,
.mh-acc__logout svg {
  flex: 0 0 auto;
  color: var(--a-muted);
}

.mh-acc__links a:hover,
.mh-acc__mods a:hover {
  color: var(--a-navy) !important;
  background: var(--a-soft);
}

.mh-acc__links a.is-active {
  color: var(--a-navy) !important;
  background: var(--a-soft);
  box-shadow: inset 3px 0 0 var(--a-orange);
}

.mh-acc__links a.is-active svg {
  color: var(--a-orange);
}

/* Module links (rendered as <a class="col-…"><span class="link-item"><i>…</i>Label</span></a>) */
.mh-acc__mods {
  display: flex;
  flex-direction: column;
  margin: 6px 0 0;
  padding: 6px 0 0;
  border-top: 1px solid var(--a-line);
}

.mh-acc__mods:empty {
  display: none;
}

.mh-acc__mods .link-item {
  display: flex !important;
  align-items: center;
  gap: 12px;
  margin: 0 !important;
  padding: 0 !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  text-transform: none !important;
  color: inherit !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

.mh-acc__mods .link-item > span,
.mh-acc__mods i,
.mh-acc__mods .material-icons {
  display: none !important;
}

.mh-acc__mods .link-item svg,
.mh-acc__mods .link-item img {
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
}

.mh-acc__mods a::before {
  content: '';
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  background: var(--a-muted);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center / 16px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center / 16px no-repeat;
}

.mh-acc__logout {
  margin: 6px 0 0 !important;
  border-top: 1px solid var(--a-line);
  border-radius: 0 0 12px 12px;
}

.mh-acc__logout:hover {
  color: #d93025 !important;
  background: #fdecea;
}

/* ================================================================== */
/* Dashboard                                                          */
/* ================================================================== */
.mh-acc__intro {
  margin: -8px 0 22px;
  font-size: 15px;
  color: var(--a-muted);
}

.mh-acc-card {
  margin: 0 0 20px;
  padding: 22px 24px;
  background: #fff;
  border: 1px solid var(--a-line);
  border-radius: 20px;
}

.mh-acc-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 12px;
}

.mh-acc .mh-acc-card__title {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  text-transform: none !important;
  color: var(--a-navy) !important;
}

.mh-acc .mh-acc-card__title::after {
  content: none !important;
}

.mh-acc-card__link {
  font-size: 14px;
  font-weight: 700;
  color: var(--a-orange) !important;
}

.mh-acc-empty {
  margin: 0;
  padding: 22px;
  font-size: 14.5px;
  text-align: center;
  color: var(--a-text);
  background: var(--a-soft);
  border-radius: 14px;
}

.mh-acc-empty a {
  font-weight: 700;
  color: var(--a-orange) !important;
}

/* Orders list (dashboard + history) */
.mh-orders {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mh-order {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 16px;
  align-items: center;
  padding: 14px 0;
  border-top: 1px solid var(--a-line);
}

.mh-order:first-child {
  border-top: 0;
}

.mh-order__main {
  display: flex;
  flex-direction: column;
  min-width: 0;
  color: inherit !important;
  text-decoration: none !important;
}

.mh-order__ref {
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: var(--a-navy);
}

.mh-order__main:hover .mh-order__ref {
  color: var(--a-orange);
}

.mh-order__date {
  font-size: 13px;
  color: var(--a-muted);
}

.mh-order__status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 30px;
  padding: 0 12px;
  font-size: 12.5px;
  font-weight: 700;
  white-space: nowrap;
  color: var(--a-navy);
  background: var(--a-soft);
  border-radius: 999px;
}

.mh-order__status::before {
  content: '';
  width: 8px;
  height: 8px;
  background: var(--st, var(--a-muted));
  border-radius: 50%;
}

.mh-order__total {
  min-width: 110px;
  font-size: 16px;
  font-weight: 800;
  text-align: right;
  white-space: nowrap;
  color: var(--a-navy);
}

.mh-orders--full .mh-order {
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  padding: 18px 22px;
  background: #fff;
  border: 1px solid var(--a-line);
  border-radius: 16px;
}

.mh-orders--full .mh-order + .mh-order {
  margin-top: 10px;
}

.mh-order__actions {
  display: flex;
  gap: 8px;
}

.mh-order__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 38px;
  padding: 0 12px;
  font-size: 13.5px;
  font-weight: 700;
  white-space: nowrap;
  color: var(--a-navy) !important;
  background: #fff;
  border: 1px solid var(--a-line-2);
  border-radius: 10px;
  text-decoration: none !important;
}

.mh-order__btn:hover {
  background: var(--a-soft);
  border-color: var(--a-navy);
}

.mh-order__btn--main {
  color: #fff !important;
  background: var(--a-navy);
  border-color: var(--a-navy);
}

.mh-order__btn--main:hover {
  background: #1d2b4f;
}

/* Tiles */
.mh-tiles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 14px;
}

.mh-tile,
.mh-tiles--mods > a {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  min-height: 0;
  margin: 0 !important;
  padding: 20px !important;
  color: var(--a-text) !important;
  background: #fff;
  border: 1px solid var(--a-line);
  border-radius: 18px;
  text-decoration: none !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.mh-tile:hover,
.mh-tiles--mods > a:hover {
  border-color: var(--a-line-2);
  box-shadow: 0 10px 26px rgba(12, 25, 58, 0.08);
  transform: translateY(-1px);
}

.mh-tile__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  margin: 0 0 8px;
  color: var(--a-navy);
  background: var(--a-soft);
  border-radius: 14px;
}

.mh-tile strong {
  font-size: 15.5px;
  font-weight: 800;
  color: var(--a-navy);
}

.mh-tile small {
  font-size: 13px;
  line-height: 1.45;
  color: var(--a-muted);
}

/* Module tiles: their own markup (.link-item + icon) */
.mh-tiles--mods:empty {
  display: none;
}

.mh-tiles--mods .link-item {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 15.5px !important;
  font-weight: 800 !important;
  text-align: left !important;
  text-transform: none !important;
  color: var(--a-navy) !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

.mh-tiles--mods .link-item > span,
.mh-tiles--mods .link-item > i,
.mh-tiles--mods .link-item > svg,
.mh-tiles--mods .link-item > img {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 46px !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 11px;
  font-size: 0 !important;
  color: var(--a-navy) !important;
  background: var(--a-soft);
  border-radius: 14px;
}

.mh-tiles--mods .link-item svg {
  width: 24px !important;
  height: 24px !important;
}

/* ================================================================== */
/* Other account pages (standard PrestaShop markup)                    */
/* ================================================================== */
.mh-acc #content > h6,
.mh-acc #content > p:first-child {
  margin: -8px 0 18px;
  font-size: 15px;
  font-weight: 400;
  color: var(--a-muted);
}

/* Forms in a card (identity, address) */
.mh-acc #customer-form,
.mh-acc .address-form,
.mh-acc form.js-address-form {
  max-width: 760px !important;
  padding: 26px;
  background: #fff;
  border: 1px solid var(--a-line);
  border-radius: 20px;
}

/* Tables (credit slips, vouchers, returns, order detail) */
.mh-acc .table {
  width: 100%;
  margin: 0 0 20px;
  overflow: hidden;
  font-size: 14px;
  background: #fff;
  border: 1px solid var(--a-line) !important;
  border-collapse: separate !important;
  border-spacing: 0;
  border-radius: 16px;
}

.mh-acc .table th,
.mh-acc .table td {
  padding: 13px 16px !important;
  vertical-align: middle !important;
  color: var(--a-text);
  border: 0 !important;
  border-top: 1px solid var(--a-line) !important;
  background: none !important;
}

.mh-acc .table thead th {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--a-muted);
  background: var(--a-soft) !important;
  border-top: 0 !important;
}

.mh-acc .table tbody th {
  font-weight: 800;
  color: var(--a-navy);
}

.mh-acc .badge {
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 700;
  border-radius: 999px;
}

/* Addresses */
.mh-acc .address {
  display: flex;
  flex-direction: column;
  height: 100%;
  margin: 0;
  padding: 22px;
  background: #fff;
  border: 1px solid var(--a-line);
  border-radius: 18px;
}

.mh-acc .address-header {
  margin: 0 0 10px !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  text-transform: none !important;
  color: var(--a-navy) !important;
}

.mh-acc .address-body address {
  margin: 0;
  font-size: 14px;
  font-style: normal;
  line-height: 1.6;
  color: var(--a-text);
}

.mh-acc .address-footer {
  display: flex;
  gap: 16px;
  margin: auto 0 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--a-line);
}

.mh-acc .address-footer a {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--a-navy) !important;
}

.mh-acc .address-footer a[data-link-action='delete-address'] {
  color: #d93025 !important;
}

.mh-acc .addresses-footer {
  margin: 8px 0 0;
}

/* Order detail boxes */
.mh-acc .box,
.mh-acc #order-infos,
.mh-acc #order-history,
.mh-acc .addresses .card,
.mh-acc .order-message-form,
.mh-acc #delivery-address,
.mh-acc #invoice-address {
  margin: 0 0 16px;
  padding: 20px 22px;
  background: #fff;
  border: 1px solid var(--a-line);
  border-radius: 18px;
  box-shadow: none;
}

.mh-acc .box h3,
.mh-acc .box .h3,
.mh-acc #content h3,
.mh-acc #content .h3 {
  margin: 0 0 12px !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  text-transform: none !important;
  color: var(--a-navy) !important;
}

/* ================================================================== */
/* Responsive                                                         */
/* ================================================================== */
@media (max-width: 1199.98px) {
  .mh-tiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mh-orders--full .mh-order {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .mh-orders--full .mh-order__actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 991.98px) {
  .mh-auth,
  .mh-auth--wide {
    grid-template-columns: minmax(0, 1fr);
  }

  .mh-auth__side {
    position: static;
  }

  #main.mh-acc {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      'head'
      'nav'
      'content';
    padding-top: 18px;
  }

  .mh-acc__nav {
    grid-row: auto;
    position: static;
    margin: 0 0 20px;
    padding: 12px;
  }

  .mh-acc__who {
    display: none;
  }

  .mh-acc__links {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .mh-acc__links a {
    flex: 0 0 auto !important;
    white-space: nowrap;
  }

  .mh-acc__links a.is-active {
    box-shadow: inset 0 -3px 0 var(--a-orange);
  }

  .mh-acc__mods,
  .mh-acc__logout {
    display: none !important;
  }

  body#my-account .mh-acc__nav {
    display: none;
  }
}

@media (max-width: 575.98px) {
  #main.mh-auth-page {
    padding: 16px 0 40px;
  }

  .mh-auth__card {
    padding: 24px 18px;
    border-radius: 20px;
  }

  .mh-auth-page .mh-auth__title,
  #main.mh-acc > .page-header h1 {
    font-size: 25px !important;
  }

  .mh-auth__side {
    padding: 24px 20px;
  }

  .mh-auth--wide .register-form .form-fields {
    grid-template-columns: minmax(0, 1fr);
  }

  .mh-tiles {
    grid-template-columns: minmax(0, 1fr);
  }

  .mh-order {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .mh-order__status {
    grid-row: 2;
    justify-self: start;
  }

  .mh-orders--full .mh-order {
    padding: 16px;
  }

  .mh-order__actions {
    flex-wrap: wrap;
  }

  .mh-acc #customer-form,
  .mh-acc form.js-address-form {
    padding: 18px;
  }
}