/* ===== Base Alert ===== */
.alert {
  --bs-alert-bg: transparent;
  --bs-alert-padding-x: 1rem;
  --bs-alert-padding-y: 1rem;
  --bs-alert-margin-bottom: 1rem;
  --bs-alert-color: inherit;
  --bs-alert-border-color: transparent;
  --bs-alert-border: 1px solid var(--bs-alert-border-color);
  --bs-alert-border-radius: 0.375rem;

  position: relative;
  padding: var(--bs-alert-padding-y) var(--bs-alert-padding-x);
  margin-bottom: 0;
  color: var(--bs-alert-color);
  background-color: var(--bs-alert-bg);
  border: var(--bs-alert-border);
  border-radius: var(--bs-alert-border-radius);
}

/* ===== Alert Heading ===== */
.alert-heading {
  color: inherit;
}

/* ===== Alert Link ===== */
.alert-link {
  font-weight: 700;
}

/* ===== Alert Dismissible ===== */
.alert-dismissible {
  padding-right: 3rem;
}

.alert-dismissible .btn-close {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  padding: 1.25rem 1rem;
}

/* ===== Color Variants ===== */
.alert-primary {
  --bs-alert-color: #084298;
  --bs-alert-bg: #cfe2ff;
  --bs-alert-border-color: #b6d4fe;
}
.alert-primary .alert-link {
  color: #06357a;
}

.alert-secondary {
  --bs-alert-color: #41464b;
  --bs-alert-bg: #e2e3e5;
  --bs-alert-border-color: #d3d6d8;
}
.alert-secondary .alert-link {
  color: #34383c;
}

.alert-success {
  --bs-alert-color: #0f5132;
  --bs-alert-bg: #d1e7dd;
  --bs-alert-border-color: #badbcc;
}
.alert-success .alert-link {
  color: #0c4128;
}

.alert-info {
  --bs-alert-color: #055160;
  --bs-alert-bg: #cff4fc;
  --bs-alert-border-color: #b6effb;
}
.alert-info .alert-link {
  color: #04414d;
}

.alert-warning {
  --bs-alert-color: #664d03;
  --bs-alert-bg: #fff3cd;
  --bs-alert-border-color: #ffecb5;
}
.alert-warning .alert-link {
  color: #523e02;
}

.alert-danger {
  --bs-alert-color: #842029;
  --bs-alert-bg: #f8d7da;
  --bs-alert-border-color: #f5c2c7;
}
.alert-danger .alert-link {
  color: #6a1a21;
}

.alert-light {
  --bs-alert-color: #636464;
  --bs-alert-bg: #fefefe;
  --bs-alert-border-color: #fdfdfe;
}
.alert-light .alert-link {
  color: #4f5050;
}

.alert-dark {
  --bs-alert-color: #141619;
  --bs-alert-bg: #d3d3d4;
  --bs-alert-border-color: #bcbebf;
}
.alert-dark .alert-link {
  color: #101214;
}

.hidden {
    display: none;
}
.vat-check {
    margin-bottom: 20px;
}
.text-left {
    text-align: left;
}
.text-center {
    text-align: center;
}
.recovery-password {
    width: 400px;
    max-width: 100%;
    margin: 40px auto;
}
.recovery-password .maq-eyebrow {
    padding-top: 40px;
}
.recovery-password  input {
    margin: 10px 0;
}
#password-error {
    color: #dc3545;
    display: none;
    margin-top: 8px;
}

/* =========================================================
   MAQ PARTS – LOGIN PAGE
   Extends the .maq-register-page design system
   ========================================================= */

/* The login page reuses every .maq-register-page rule.
   Only page-specific tweaks are defined below. */

.maq-login-page .maq-sidebar h1 {
    font-size: 44px !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    letter-spacing: -1.7px;
}

.maq-login-page .maq-intro {
    max-width: 375px;
}

/* ---- Loyalty block in the sidebar ---- */

.maq-login-page .maq-loyalty-block {
    border-top: 1px solid var(--maq-line);
    margin-top: 28px;
    padding-top: 22px;
}

.maq-login-page .maq-loyalty-block h3 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    font-size: 14px !important;
    font-weight: 750;
    color: var(--maq-ink);
}

.maq-login-page .maq-loyalty-block h3::before {
    content: "★";
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 5px;
    background: #fff2dd;
    border: 1px solid #f4dfba;
    color: #bc7000;
    font-size: 11px;
}

.maq-loyalty-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 6px;
}

.maq-loyalty-list li {
    position: relative;
    padding-left: 18px;
    color: var(--maq-muted);
    font-size: 12px;
    line-height: 1.5;
}

.maq-loyalty-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--maq-orange);
    font-weight: 800;
    font-size: 11px;
}

/* ---- Login form: remember me + forgot password row ---- */

.maq-login-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 4px 0 6px;
    flex-wrap: wrap;
}

.maq-login-options .maq-consent-inline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px !important;
    font-weight: 500;
    color: var(--maq-ink);
    line-height: 1.2;
}

.maq-login-options .maq-consent-inline input {
    margin: 0;
    accent-color: var(--maq-orange);
}

.maq-forgot-link {
    color: #cf7b00 !important;
    font-size: 11px;
    font-weight: 600;
    text-decoration: none !important;
    transition: color .2s ease;
}

.maq-forgot-link:hover {
    color: var(--maq-orange-dark) !important;
    text-decoration: underline !important;
}

/* ---- Submit button icon alignment ---- */

.maq-login-page .maq-submit i {
    margin-right: 6px;
    font-size: 12px;
}

/* ---- Fine print under button ---- */

.maq-login-page .maq-fine-print {
    max-width: 300px;
    margin: 12px auto 0;
}

/* ---- Responsive ---- */

@media (max-width: 680px) {
    .maq-login-page .maq-sidebar h1 {
        font-size: 32px !important;
    }

    .maq-login-page .maq-loyalty-block {
        margin-top: 16px;
        padding-top: 16px;
    }

    .maq-login-options {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
}

@media (max-width: 380px) {
    .maq-login-page .maq-sidebar h1 {
        font-size: 29px !important;
    }
}

/* MAQ PARTS – registration page matching the supplied reference */
.maq-register-page,
.maq-register-page * { box-sizing: border-box; }

.maq-register-page {
    --maq-ink: #152b3c;
    --maq-muted: #687c8b;
    --maq-orange: #ef951a;
    --maq-orange-dark: #d9820c;
    --maq-line: #dce4e8;
    background: #f4f6f7;
    color: var(--maq-ink);
    min-height: 100vh;
    padding: 0 24px 55px;
    font: 13px/1.5 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.maq-demo-strip {
    margin: 0 -24px 0;
    padding: 7px 15px;
    text-align: center;
    color: #7d5927;
    background: #fff7e8;
    border-top: 1px solid #f0e2c6;
    border-bottom: 1px solid #f0e2c6;
    font-size: 11px;
}

.maq-register-layout {
    max-width: 1160px;
    margin: 44px auto 60px;
    display: grid;
    grid-template-columns: .82fr 1.18fr;
    gap: 75px;
    align-items: start;
}

.maq-sidebar { position: sticky; top: 28px; padding-top: 20px; }
.maq-eyebrow {
    display: block; color: #b76a00; font-size: 10px; font-weight: 800;
    letter-spacing: 1.8px; text-transform: uppercase; margin-bottom: 14px;
}
.maq-sidebar h1 {
    max-width: 390px; margin: 0 0 17px; color: var(--maq-ink);
    font-size: 43px; line-height: 1.1; letter-spacing: -1.8px; font-weight: 850;
}
.maq-intro { max-width: 365px; color: var(--maq-muted); font-size: 13px; line-height: 1.65; }

.maq-benefits { display: grid; gap: 17px; margin: 28px 0; }
.maq-benefit { display: flex; align-items: flex-start; gap: 13px; }
.maq-benefit-icon {
    flex: 0 0 37px; width: 37px; height: 37px; display: grid; place-items: center;
    color: #bc7000; background: #fff2dd; border: 1px solid #f4dfba; border-radius: 8px;
}
.maq-benefit b { display: block; font-size: 12px; font-weight: 750; }
.maq-benefit p { margin: 3px 0 0; color: var(--maq-muted); font-size: 11px; }

.maq-journey { border-top: 1px solid var(--maq-line); margin-top: 30px; padding-top: 23px; }
.maq-journey h3 { margin: 0 0 16px; font-size: 13px; font-weight: 800; }
.maq-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.maq-step { min-width: 0; color: var(--maq-muted); font-size: 10px; }
.maq-step i {
    display: grid; place-items: center; width: 24px; height: 24px; margin-bottom: 8px;
    border: 1px solid #cbd6dc; border-radius: 50%; background: #fff;
    color: var(--maq-ink); font-size: 10px; font-style: normal;
}
.maq-step:first-child i { background: var(--maq-ink); color: #fff; border-color: var(--maq-ink); }
.maq-step b { display: block; color: var(--maq-ink); font-size: 10px; margin-bottom: 2px; }
.maq-step span { display: block; }

.maq-form-card {
    min-width: 0; background: #fff; border: 1px solid var(--maq-line);
    border-radius: 15px; padding: 28px 32px;
    box-shadow: 0 12px 38px rgba(22,57,77,.04);
}
.maq-form-card > h2 { margin: 0; color: var(--maq-ink); font-size: 21px; font-weight: 850; letter-spacing: -.5px; }
.maq-subtitle { color: var(--maq-muted); font-size: 11px; margin: 5px 0 20px; }

.maq-type-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 23px; }
.maq-type-option {
    position: relative; display: flex; align-items: center; gap: 9px; min-height: 39px;
    padding: 8px 11px; border: 1px solid var(--maq-line); border-radius: 7px;
    color: var(--maq-ink); font-size: 11px; font-weight: 650; cursor: pointer;
}
.maq-type-option input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.maq-radio-visual { width: 13px; height: 13px; flex: 0 0 13px; border: 1px solid #adbdc6; border-radius: 50%; }
.maq-type-option.active { border-color: var(--maq-orange); background: #fff8ed; box-shadow: 0 0 0 1px var(--maq-orange); }
.maq-type-option.active .maq-radio-visual { border: 4px solid var(--maq-orange); }

.maq-form-section { padding: 0 0 20px; margin: 0 0 20px; border-bottom: 1px solid #e9eef0; }
.maq-form-section h3 {
    display: flex; align-items: center; gap: 8px; margin: 0 0 16px;
    color: var(--maq-ink); font-size: 12px; font-weight: 800;
}
.maq-form-section h3 > span {
    display: grid; place-items: center; width: 21px; height: 21px;
    border-radius: 5px; background: #edf2f4; color: #607789; font-size: 10px;
}
.maq-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px 14px; }
.maq-full { grid-column: 1 / -1; }
.maq-field { min-width: 0; margin: 0 0 12px; }
.maq-form .control-label {
    display: block; margin: 0 0 5px; color: var(--maq-ink);
    font-size: 10px; line-height: 1.4; font-weight: 700;
}
.maq-form .form-control {
    width: 100%; height: 38px; padding: 8px 10px; border: 1px solid #cfdbe2;
    border-radius: 6px; background: #fff; color: var(--maq-ink);
    box-shadow: none; font-size: 11px; transition: border-color .2s, box-shadow .2s;
}
.maq-form .form-control::placeholder { color: #9aa8b1; }
.maq-form .form-control:focus {
    border-color: var(--maq-orange); outline: 0;
    box-shadow: 0 0 0 2px rgba(239,149,26,.12);
}
.maq-form textarea.form-control { height: auto; min-height: 75px; }
.maq-form .help-block { color: #b8322a; font-size: 10px; margin: 4px 0 0; }
.maq-form .has-error .form-control { border-color: #d77b74; }

.maq-form .select2-container { width: 100% !important; }
.maq-form .select2-container--krajee .select2-selection,
.maq-form .select2-container--default .select2-selection {
    min-height: 38px; border: 1px solid #cfdbe2; border-radius: 6px; box-shadow: none;
}
.maq-form .select2-container--krajee .select2-selection--single .select2-selection__rendered,
.maq-form .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 26px;
  padding-left: 10px;
  color: var(--maq-ink);
  font-size: 13px;
}
.maq-form .select2-container--krajee .select2-selection--single .select2-selection__arrow,
.maq-form .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; }
.maq-form .select2-container--open .select2-selection { border-color: var(--maq-orange) !important; }
.select2-dropdown { border-color: var(--maq-line); font-size: 11px; }

.maq-check-row { margin: 1px 0 12px; }
.maq-check-row label, .maq-extra-fields label { color: var(--maq-ink); font-size: 10px; font-weight: 500; }
.maq-check-row input, .maq-extra-fields input[type=checkbox], .maq-extra-fields input[type=radio] { accent-color: var(--maq-orange); }
.maq-hint { margin: 5px 0 0; color: var(--maq-muted); font-size: 9px; line-height: 1.5; }
.maq-extra-fields { display: none; }

.maq-password-note { margin: 0 0 15px; padding: 10px 12px; border-radius: 7px; background: #f2f7f8; color: #577080; font-size: 10px; }
.maq-password-note b, .maq-password-note span { display: block; }
.maq-password-note b { color: var(--maq-ink); margin-bottom: 2px; }

.maq-consents { display: grid; gap: 9px; margin: 0 0 17px; }
.maq-consent { display: flex; align-items: flex-start; gap: 8px; color: var(--maq-ink); font-size: 10px; line-height: 1.55; font-weight: 500; }
.maq-consent input { flex: 0 0 13px; width: 13px; height: 13px; margin: 2px 0 0; accent-color: var(--maq-orange); }
.maq-consent em { color: #cf7b00; font-style: normal; }
.maq-consent small { display: block; color: var(--maq-muted); font-size: 9px; }
.maq-form .g-recaptcha { margin: 12px 0 16px; }

.maq-submit {
    display: block; width: 100%; min-height: 40px; padding: 10px 15px;
    border: 0; border-radius: 6px; background: var(--maq-orange);
    color: #182c39; font-size: 11px; font-weight: 800; cursor: pointer;
    box-shadow: 0 2px 0 var(--maq-orange-dark); transition: background .2s, transform .2s;
}
.maq-submit:hover { background: #f5a52f; transform: translateY(-1px); }
.maq-submit:active { transform: translateY(1px); box-shadow: none; }
.maq-fine-print { margin: 12px 0 0; text-align: center; color: var(--maq-muted); font-size: 9px; }

.maq-error-summary { margin-bottom: 15px; padding: 10px 12px; border: 1px solid #efc2bf; border-radius: 7px; background: #fff4f3; color: #a62823; font-size: 11px; }
.maq-error-summary ul { margin: 5px 0 0; padding-left: 18px; }
.maq-form .form-group { min-width: 0; }
.maq-form .form-group > .help-block:empty { display: none; }

@media (max-width: 900px) {
    .maq-register-layout { grid-template-columns: .75fr 1.25fr; gap: 30px; }
    .maq-sidebar h1 { font-size: 35px; }
    .maq-form-card { padding: 25px 22px; }
}
@media (max-width: 680px) {
    .maq-register-page { padding: 0 14px 35px; }
    .maq-demo-strip { margin: 0 -14px; }
    .maq-register-layout { display: flex; flex-direction: column; gap: 22px; margin: 25px auto 35px; }
    .maq-sidebar { position: static; width: 100%; padding: 0 5px; }
    .maq-sidebar h1 { font-size: 32px; margin-bottom: 9px; }
    .maq-intro { font-size: 12px; margin-bottom: 10px; }
    .maq-benefits { display: none; }
    .maq-journey { border: 0; margin-top: 17px; padding-top: 0; }
    .maq-journey h3 { display: none; }
    .maq-form-card { width: 100%; padding: 23px 18px; border-radius: 12px; }
    .maq-form-card > h2 { font-size: 20px; }
    .maq-grid { grid-template-columns: 1fr; gap: 9px; }
    .maq-full { grid-column: auto; }
}
@media (max-width: 380px) {
    .maq-register-page { padding-right: 9px; padding-left: 9px; }
    .maq-demo-strip { margin-right: -9px; margin-left: -9px; }
    .maq-form-card { padding: 20px 14px; }
    .maq-sidebar h1 { font-size: 29px; }
    .maq-steps { gap: 6px; }
}





/* ================================
   MAQ PARTS HEADER
================================ */

.maq-header {
    width: 100%;
    height: 84px;
    background: #f4f6f7;
    border-bottom: 1px solid #dce4e8;
    position: relative;
    z-index: 1000;
}

.maq-header-inner {
    max-width: 1320px;
    height: 100%;
    margin: 0 auto;
    padding: 0 48px;

    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* LOGO */

.maq-header-logo {
    display: flex;
    align-items: center;
}

.maq-brand {
    display: inline-block;
    color: #152b3c !important;
    text-decoration: none !important;
    font-size: 26px;
    font-weight: 850;
    letter-spacing: -1.3px;
    line-height: 1;
}

.maq-brand span {
    color: #ef951a;
}

/* NAVIGATION */

.maq-header-nav {
    display: flex;
    align-items: center;
    gap: 26px;
}

.maq-catalog-link {
    color: #152b3c !important;
    text-decoration: none !important;
    font-size: 13px;
    font-weight: 500;
    transition: color .2s ease;
}

.maq-catalog-link:hover {
    color: #ef951a !important;
}

.maq-language {
    color: #152b3c;
    font-size: 12px;
    font-weight: 600;
    cursor: default;
}

/* LOGIN BUTTON */

.maq-login-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    min-width: 88px;
    height: 42px;
    padding: 0 16px;

    background: #fff;
    border: 1px solid #dce4e8;
    border-radius: 7px;

    color: #152b3c !important;
    text-decoration: none !important;
    font-size: 13px;
    font-weight: 600;

    transition: all .2s ease;
}

.maq-login-btn:hover {
    background: #fff8ed;
    border-color: #ef951a;
    color: #152b3c !important;
}

.maq-login-arrow {
    font-size: 16px;
    line-height: 1;
    transition: transform .2s ease;
}

.maq-login-btn:hover .maq-login-arrow {
    transform: translateX(3px);
}

/* RESPONSIVE */

@media (max-width: 768px) {
    .maq-header {
        height: 70px;
    }

    .maq-header-inner {
        padding: 0 20px;
    }

    .maq-brand {
        font-size: 23px;
    }

    .maq-header-nav {
        gap: 15px;
    }

    .maq-catalog-link {
        display: none;
    }
}

@media (max-width: 380px) {
    .maq-header-inner {
        padding: 0 13px;
    }

    .maq-header-nav {
        gap: 12px;
    }
}




/* MAQ PARTS – unified typography */

body,
body button,
body input,
body select,
body textarea {
    font-family: 'Inter', Arial, sans-serif !important;
    font-optical-sizing: auto;
}

/* Header */
.maq-header,
.maq-header * {
    font-family: 'Inter', Arial, sans-serif !important;
}

.maq-brand {
    font-family: 'Inter', Arial, sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: -1.5px !important;
    font-size: 25px !important;
}

.maq-catalog-link,
.maq-language,
.maq-login-btn {
    font-family: 'Inter', Arial, sans-serif !important;
    font-weight: 500 !important;
}

/* Registration page */
.maq-register-page,
.maq-register-page * {
    font-family: 'Inter', Arial, sans-serif !important;
}

.maq-sidebar h1 {
    font-weight: 800 !important;
    letter-spacing: -1.7px;
}

.maq-form-card h2 {
    font-weight: 750 !important;
    letter-spacing: -0.7px;
}

.maq-form-section h3,
.maq-form .control-label {
    font-weight: 650 !important;
}

.maq-benefit b,
.maq-step b {
    font-weight: 700 !important;
}



/* MAQ PARTS – improved typography sizes */

.maq-header .maq-brand {
    font-size: 26px !important;
}

.maq-header .maq-catalog-link,
.maq-header .maq-login-btn {
    font-size: 13px !important;
}

.maq-header .maq-language {
    font-size: 12px !important;
}

/* Left column */

.maq-sidebar .maq-eyebrow {
    font-size: 11px !important;
}

.maq-sidebar h1 {
    font-size: 44px !important;
    line-height: 1.12 !important;
}

.maq-sidebar .maq-intro {
    font-size: 15px !important;
    line-height: 1.6 !important;
}

.maq-benefit b {
    font-size: 14px !important;
}

.maq-benefit p {
    font-size: 13px !important;
}

.maq-journey h3 {
    font-size: 14px !important;
}

.maq-step b {
    font-size: 12px !important;
}

.maq-step span {
    font-size: 11px !important;
}

/* Registration card */

.maq-form-card > h2 {
    font-size: 23px !important;
}

.maq-subtitle {
    font-size: 13px !important;
}

.maq-type-option {
    font-size: 13px !important;
}

.maq-form-section h3 {
    font-size: 14px !important;
}

.maq-form .control-label {
    font-size: 12px !important;
}

.maq-form .form-control,
.maq-form .select2-container {
    font-size: 13px !important;
}

.maq-form .form-control::placeholder {
    font-size: 12px !important;
}

.maq-hint {
    font-size: 11px !important;
}

.maq-password-note {
    font-size: 12px !important;
}

.maq-consent {
    font-size: 11px !important;
}

.maq-submit {
    font-size: 14px !important;
}

.maq-fine-print {
    font-size: 11px !important;
}

@media (max-width: 680px) {
    .maq-sidebar h1 {
        font-size: 34px !important;
    }

    .maq-form-card > h2 {
        font-size: 21px !important;
    }
}
