/* ==========================================================================
   ONE PAGE CHECKOUT — PLUGIN ISLE
   ========================================================================== */

body#module-pi_onepagecheckoutpro-checkout {
    --pi-opc-blue: #006CFF;
    --pi-opc-blue-light: #64a1f4;
    --pi-opc-text: #292929;
    --pi-opc-muted: #687386;
    --pi-opc-bg: #FBFAF8;
    --pi-opc-border: #e4e8ee;

    background: #fff;
}


/* ================================================================
   GŁÓWNY CONTAINER
   ================================================================ */

body#module-pi_onepagecheckoutpro-checkout
.columns-container.container {
    width: 100% !important;
    max-width: 1440px !important;

    margin: 0 auto !important;
    padding-left: 32px !important;
    padding-right: 32px !important;
}


body#module-pi_onepagecheckoutpro-checkout
#center-column {
    width: 100% !important;
    max-width: none !important;
}


/* ================================================================
   TYTUŁ STRONY
   ================================================================ */

body#module-pi_onepagecheckoutpro-checkout
.page-header h1,
body#module-pi_onepagecheckoutpro-checkout
.page-header .h1 {
    margin: 30px 0 42px !important;

    font-family: 'Syne', sans-serif !important;
    font-size: clamp(42px, 5vw, 68px) !important;
    font-weight: 500 !important;
    line-height: .95 !important;
    letter-spacing: -2px !important;

    color: var(--pi-opc-text) !important;
}


/* ================================================================
   DWIE KOLUMNY
   ================================================================ */

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-row {
    display: grid !important;

    grid-template-columns:
        minmax(0, 2fr)
        minmax(360px, .95fr) !important;

    gap: 28px !important;

    align-items: start !important;
}


body#module-pi_onepagecheckoutpro-checkout
.pi-opc-row > .pi-opc-col {
    width: 100% !important;
    max-width: none !important;

    padding: 0 !important;
}


/* wyłącz bootstrapową szerokość */
body#module-pi_onepagecheckoutpro-checkout
.pi-opc-row > .col-md-8,

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-row > .col-md-4 {
    width: 100% !important;
    max-width: none !important;

    flex: none !important;
}

/* ================================================================
   SEKCJE
   ================================================================ */

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-section {
    width: 100% !important;

    margin: 0 0 24px !important;
    padding: 28px 30px !important;

    background: #fff !important;

    border-radius: 24px !important;

    box-shadow: 0 10px 28px rgba(25, 42, 70, .14) !important;
}


/* tytuły: Customer Info / Delivery Address itd. */

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-section-title {
    margin: 0 0 24px !important;
    padding: 0 0 18px !important;

    font-family: 'Syne', sans-serif !important;
    font-size: 22px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;

    color: var(--pi-opc-text) !important;

    border-bottom: 1px solid var(--pi-opc-border) !important;
}

/* ================================================================
   WYBRANY ADRES
   ================================================================ */

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-confirmed-address {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;

    gap: 24px !important;

    margin: 0 !important;
    padding: 20px 22px !important;

    background: var(--pi-opc-bg) !important;

    border: 1px solid var(--pi-opc-border) !important;
    border-radius: 16px !important;

    color: var(--pi-opc-text) !important;
}


/* przycisk Edytuj */

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-confirmed-address button,
body#module-pi_onepagecheckoutpro-checkout
.pi-opc-confirmed-address a {
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    color: var(--pi-opc-blue) !important;
    background: transparent !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    font-family: 'Inter', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;

    text-decoration: underline !important;
    text-underline-offset: 4px !important;
}


body#module-pi_onepagecheckoutpro-checkout
.pi-opc-confirmed-address button::before,
body#module-pi_onepagecheckoutpro-checkout
.pi-opc-confirmed-address button::after,
body#module-pi_onepagecheckoutpro-checkout
.pi-opc-confirmed-address a::before,
body#module-pi_onepagecheckoutpro-checkout
.pi-opc-confirmed-address a::after {
    content: none !important;
    display: none !important;
}

/* ================================================================
   INPUTY
   ================================================================ */

body#module-pi_onepagecheckoutpro-checkout
input.form-control,

body#module-pi_onepagecheckoutpro-checkout
select.form-control,

body#module-pi_onepagecheckoutpro-checkout
select.form-select,

body#module-pi_onepagecheckoutpro-checkout
textarea.form-control {
    min-height: 54px !important;

    padding: 12px 16px !important;

    font-family: 'Inter', sans-serif !important;
    font-size: 15px !important;

    color: var(--pi-opc-text) !important;

    background: #fff !important;

    border: 1px solid #d9dee6 !important;
    border-radius: 16px !important;

    box-shadow: none !important;
}


body#module-pi_onepagecheckoutpro-checkout
textarea.form-control {
    min-height: 120px !important;
}


body#module-pi_onepagecheckoutpro-checkout
input.form-control:focus,

body#module-pi_onepagecheckoutpro-checkout
select.form-control:focus,

body#module-pi_onepagecheckoutpro-checkout
select.form-select:focus,

body#module-pi_onepagecheckoutpro-checkout
textarea.form-control:focus {
    border-color: var(--pi-opc-blue) !important;

    box-shadow:
        0 0 0 3px rgba(8, 108, 255, .10) !important;

    outline: none !important;
}

body#module-pi_onepagecheckoutpro-checkout
input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;

    border-radius: 5px !important;

    accent-color: var(--pi-opc-blue);
}

/* ================================================================
   PRAWA KOLUMNA
   ================================================================ */

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-row > .col-md-4 {
    position: sticky !important;
    top: 120px !important;

    align-self: start !important;
}


/* wszystkie sekcje w prawej kolumnie */
body#module-pi_onepagecheckoutpro-checkout
.pi-opc-row > .col-md-4
.pi-opc-section {
    border-radius: 24px !important;

    box-shadow:
        0 10px 30px rgba(25, 42, 70, .06) !important;
}


/* zdjęcia produktów */
body#module-pi_onepagecheckoutpro-checkout
.pi-opc-row > .col-md-4 img {
    border-radius: 12px !important;
}

/* ==========================================================================
   ONE PAGE CHECKOUT — UKRYJ ZMIANĘ ILOŚCI
   ========================================================================== */

/* ILOŚCI PRODUKTÓW — OFF */

body#module-pi_onepagecheckoutpro-checkout
#pi-opc-cart-section
.input-group,

body#module-pi_onepagecheckoutpro-checkout
#pi-opc-cart-section
.bootstrap-touchspin,

body#module-pi_onepagecheckoutpro-checkout
#pi-opc-cart-section
.product-quantity {
    display: none !important;
}


/* KOD RABATOWY — ON */

body#module-pi_onepagecheckoutpro-checkout
#pi-opc-voucher-section
.input-group {
    display: flex !important;
    width: 100% !important;
}


body#module-pi_onepagecheckoutpro-checkout
.pi-opc-row > .col-md-4
button[data-action="increase-product-quantity"],

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-row > .col-md-4
button[data-action="decrease-product-quantity"] {
    display: none !important;
}

@media (max-width: 991.98px) {

    body#module-pi_onepagecheckoutpro-checkout
    .columns-container.container {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }


    body#module-pi_onepagecheckoutpro-checkout
    .pi-opc-row {
        display: flex !important;
        flex-direction: column !important;

        gap: 18px !important;
    }


    body#module-pi_onepagecheckoutpro-checkout
    .pi-opc-row > .col-md-4 {
        position: static !important;
    }


    body#module-pi_onepagecheckoutpro-checkout
    .pi-opc-section {
        padding: 22px 18px !important;

        border-radius: 18px !important;
    }


    body#module-pi_onepagecheckoutpro-checkout
    .page-header h1 {
        margin-bottom: 28px !important;

        font-size: 42px !important;
    }
}



.pi-opc-customer-bar {
    background-color: #FBFAF8 !important;
}

/* ==========================================================================
   ONE PAGE CHECKOUT — KOD RABATOWY COMPACT
   ========================================================================== */

body#module-pi_onepagecheckoutpro-checkout
#pi-opc-voucher-section
.input-group {
    display: flex !important;
    align-items: stretch !important;

    width: 100% !important;

    gap: 8px !important;
}


/* INPUT */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-voucher-input {
    flex: 1 1 auto !important;

    min-width: 0 !important;

    height: 44px !important;
    min-height: 44px !important;

    padding: 8px 14px !important;

    font-family: 'Inter', sans-serif !important;
    font-size: 14px !important;
    line-height: 1.2 !important;

    background: #fff !important;

    border: 1px solid #d9dee6 !important;
    border-radius: 16px !important;

    box-shadow: none !important;
}


/* ZASTOSUJ */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-apply-voucher {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 auto !important;

    width: auto !important;
    min-width: 120px !important;

    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;

    margin: 0 !important;
    padding: 0 22px !important;

    font-family: 'Inter', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    color: #fff !important;

    background: #086cff !important;

    border: 1px solid #086cff !important;
    border-radius: 999px !important;

    box-shadow: none !important;

    transform: none !important;
}


/* usuń globalną strzałkę/kółko z buttonów */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-apply-voucher::before,
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-apply-voucher::after {
    content: none !important;
    display: none !important;
}


/* hover */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-apply-voucher:hover {
    color: #fff !important;

    background: #005acb !important;
    border-color: #005acb !important;

    transform: none !important;
}

/* CHECKOUT — sticky "Złóż zamówienie" */

body#module-pi_onepagecheckoutpro-checkout
#pi-opc-sticky-place-order {
    background: #006CFF !important;
    background-color: #006CFF !important;

    border-color: #006CFF !important;

    color: #fff !important;

    opacity: 1 !important;
    filter: none !important;

    box-shadow: none !important;
}

body#module-pi_onepagecheckoutpro-checkout 
#pi-opc-guest-bar {
    border-radius: 16px !important;
}


.pi-opc-section {
    border: none !important;
    box-shadow: 0 10px 28px rgba(25, 42, 70, .14) !important;
}

.pi-opc-address-panel {
  border-radius: 16px !important;
  border: none !important;
}

/* CHECKOUT — "Kupuję jako firma" */

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-business-toggle-wrap {
    margin-top: 18px !important;
    margin-bottom: 18px !important;
}

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-business-toggle-wrap .form-check {
    display: flex !important;
    align-items: center !important;

    gap: 10px !important;

    margin: 0 !important;
    padding: 0 !important;
}

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-business-toggle-wrap .form-check-input {
    flex: 0 0 20px !important;

    width: 20px !important;
    height: 20px !important;

    margin: 0 !important;
}

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-business-toggle-wrap .form-check-label {
    margin: 0 !important;

    font-size: 16px !important;
    line-height: 1.3 !important;
}

body#module-pi_onepagecheckoutpro-checkout
.pi-opc-address-form-close {
    background-color: #fff !important;
    color: #006CFF !important;
}


body#module-pi_onepagecheckoutpro-checkout
.pi-opc-signin-prompt {
    margin: 0 !important;
    padding-top: 15px !important;
}

body#authentication #login-form > .buttons-wrapper {
    margin-top: 24px !important;
}

body#authentication #login-form > .buttons-wrapper > a.btn-basic {
    background-color: #fff !important;
    color: #006CFF !important;
}

/* ================================================================
   REJESTRACJA — POLE HASŁA
   ================================================================ */

#customer-form .password-field {
    display: flex !important;
    align-items: stretch !important;
    flex-wrap: nowrap !important;

    width: 100% !important;
}


/* INPUT */
#customer-form .password-field #field-password {
    flex: 1 1 auto !important;

    width: 1% !important;
    min-width: 0 !important;

    height: 48px !important;
    min-height: 48px !important;

    padding: 10px 14px !important;

    border: 1px solid #d9dee6 !important;
    border-right: 0 !important;
    border-radius: 12px 0 0 12px !important;

    box-shadow: none !important;
}


/* BUTTON OKA */
#customer-form
.password-field
button[data-ps-action="toggle-password"] {
    position: relative !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 48px !important;

    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;

    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;

    margin: 0 !important;
    padding: 0 !important;

    background-color: #fff !important;

    /* oko */
    background-image:
        url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.5 12C4.7 8.6 7.9 6.5 12 6.5C16.1 6.5 19.3 8.6 21.5 12C19.3 15.4 16.1 17.5 12 17.5C7.9 17.5 4.7 15.4 2.5 12Z' stroke='%23086CFF' stroke-width='1.7'/%3E%3Ccircle cx='12' cy='12' r='2.7' stroke='%23086CFF' stroke-width='1.7'/%3E%3C/svg%3E") !important;

    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 22px 22px !important;

    border: 1px solid #d9dee6 !important;
    border-left: 0 !important;
    border-radius: 0 12px 12px 0 !important;

    color: transparent !important;

    box-shadow: none !important;
    transform: none !important;

    cursor: pointer !important;
}


/* usuń globalną strzałkę z buttonów */
#customer-form
.password-field
button[data-ps-action="toggle-password"]::before,
#customer-form
.password-field
button[data-ps-action="toggle-password"]::after {
    content: none !important;
    display: none !important;
}




/* ================================================================
   REJESTRACJA — POLA FORMULARZA
   ================================================================ */

#customer-form input.form-control {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    height: 48px !important;
    min-height: 48px !important;

    padding: 10px 14px !important;

    font-family: 'Inter', sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.3 !important;

    color: #292929 !important;
    background: #fff !important;

    border: 1px solid #d9dee6 !important;
    border-radius: 16px !important;

    outline: none !important;
    box-shadow: none !important;
}


/* focus */
#customer-form input.form-control:focus {
    border-color: #086cff !important;
    box-shadow: 0 0 0 3px rgba(8, 108, 255, .10) !important;
}


/* LABEL */
#customer-form label.form-label {
    display: block !important;

    margin: 0 0 7px !important;

    font-family: 'Inter', sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;

    color: #292929 !important;
}


/* ODSTĘP POMIĘDZY POLAMI */
#customer-form > section > .mb-3 {
    margin-bottom: 18px !important;
}


/* "Opcjonalnie" */
#customer-form span.form-text {
    display: block !important;

    margin-top: 5px !important;

    font-size: 13px !important;
    line-height: 1.3 !important;

    color: #777 !important;
}

#customer-form .mb-3:last-of-type {
    margin-top: 24px !important;
}

/* ukryj nazwę / inicjały użytkownika */
#header #_desktop_ps_customersignin #userMenuButton .header-block__title {
    display: none !important;
}

/* usuń bootstrapową strzałkę dropdown */
#header #_desktop_ps_customersignin #userMenuButton::after {
    content: none !important;
    display: none !important;
}

body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-guest-submit {
    margin-top: 15px !important;
}

/* ==========================================================================
   CHECKOUT — LOGOWANIE: SMUKLEJSZE POLA
   ========================================================================== */

body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-login-pane
input.form-control {
    height: 48px !important;
    min-height: 48px !important;

    padding: 9px 14px !important;

    font-size: 15px !important;

    border-radius: 12px !important;
}


/* ==========================================================================
   HASŁO — OKO WEWNĄTRZ INPUTA
   ========================================================================== */

body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-login-pane
.password-field {
    position: relative !important;

    display: block !important;

    width: 100% !important;
}


/* miejsce na ikonę po prawej */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-login-pane
#field-login_password {
    width: 100% !important;

    padding-right: 56px !important;

    border-radius: 12px !important;
}


/* przycisk oka */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-login-pane
button[data-ps-action="toggle-password"] {
    position: absolute !important;

    top: 50% !important;
    right: 8px !important;

    z-index: 5 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;

    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #086cff !important;

    background: transparent !important;
    background-image: none !important;

    border: 0 !important;
    border-radius: 50% !important;

    box-shadow: none !important;

    transform: translateY(-50%) !important;

    cursor: pointer !important;
}


/* wywalamy globalną strzałkę / kółko z buttonów */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-login-pane
button[data-ps-action="toggle-password"]::after {
    content: none !important;
    display: none !important;
}


/* własna ikona oka */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-login-pane
button[data-ps-action="toggle-password"]::before {
    content: "visibility" !important;

    display: block !important;

    width: auto !important;
    height: auto !important;

    margin: 0 !important;

    background: none !important;

    font-family: "Material Icons" !important;
    font-size: 22px !important;
    font-weight: normal !important;
    line-height: 1 !important;

    color: #086cff !important;

    flex: none !important;
}


/* hover */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-login-pane
button[data-ps-action="toggle-password"]:hover {
    background: #f2f7ff !important;

    transform: translateY(-50%) !important;
}

/* ================================================================
   CHECKOUT — REJESTRACJA: HASŁO + POTWIERDZENIE HASŁA
   ================================================================ */

body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-register-pane
.password-field {
    position: relative !important;

    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
}


/* OBA INPUTY */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-register-pane
#field-reg_password,

body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-register-pane
#field-reg_password_confirm {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    height: 48px !important;
    min-height: 48px !important;

    padding: 9px 52px 9px 14px !important;

    border-radius: 12px !important;

    flex: none !important;
}


/* BUTTON OKA — OBA POLA */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-register-pane
.password-field
button[data-ps-action="toggle-password"] {
    position: absolute !important;

    top: 50% !important;
    right: 8px !important;

    z-index: 5 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;

    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    background-image: none !important;

    border: 0 !important;
    border-radius: 50% !important;

    box-shadow: none !important;

    transform: translateY(-50%) !important;

    cursor: pointer !important;
}


/* usuń globalną strzałkę */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-register-pane
.password-field
button[data-ps-action="toggle-password"]::after {
    content: none !important;
    display: none !important;
}


/* własne oko */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-register-pane
.password-field
button[data-ps-action="toggle-password"]::before {
    content: "visibility" !important;

    display: block !important;

    width: auto !important;
    height: auto !important;

    margin: 0 !important;

    background: none !important;

    font-family: "Material Icons" !important;
    font-size: 22px !important;
    font-weight: normal !important;
    line-height: 1 !important;

    color: #086cff !important;

    flex: none !important;
}


/* hover */
body#module-pi_onepagecheckoutpro-checkout
#pi-opc-il-register-pane
.password-field
button[data-ps-action="toggle-password"]:hover {
    background: #f2f7ff !important;

    transform: translateY(-50%) !important;
}

#pi-opc-il-register-submit {
    margin-top: 15px !important;
}

.pi-opc-customer-bar--logged {
    border-radius: 16px !important;
}

.pi-opc-address-card.pi-opc-selected {
    border-radius: 16px !important;
}

.pi-opc-delete-address-card {
    background: none;
    border: none;
    cursor: pointer;
    text-decoration: underline;
    padding: 0;
    flex-shrink: 0;
    color: red;
    font-size: .85rem;
}

#pi-opc-voucher-message {
    border-radius: 16px !important;
}

.pi-opc-row-total td {
    border-top: none !important;
}

.pi-opc-payment-label {
    border-radius: 16px !important;
}

.pi-opc-payment-additional-info {
    border-radius: 16px !important;
}

.pi-opc-payment-extra {
    border-radius: 16px !important;
}

.alert-success {
    border-radius: 16px !important;
}

.order-confirmation__details {
    border-radius: 16px !important;
    margin-bottom: 20px !important;
}

.order-confirmation__account-transformation {
    border-radius: 16px !important;
}

.order-confirmation__account-transformation input[name="password"] {
    border-radius: 16px !important;
}

.order-confirmation__account-transformation form .buttons-wrapper--end {
    margin-top: 20px !important;
}