/* =========================================================
   MIR-JAS — MOJE KONTO / LOGOWANIE + REJESTRACJA
   0.8.6 — CSS ściśle ograniczony do głównego formularza Woo.

   WAŻNE:
   BeTheme posiada własny #mfn-header-login z klasą .woocommerce.
   Dlatego NIE stylujemy już globalnie `.woocommerce`, `form.login`,
   `.u-column1` itd. Wszystkie reguły formularzy są zakotwiczone
   w #customer_login, który istnieje wyłącznie w głównej treści
   strony Moje konto.
   ========================================================= */

body.woocommerce-account {
    --mj-primary: #066B89;
    --mj-primary-dark: #04566F;
    --mj-text: #393838;
    --mj-muted: #73777F;
    --mj-bg: #FFFFFF;
    --mj-soft: #F5F5F5;
    --mj-soft-blue: #EEF6F8;
    --mj-border: #E2E5E7;
    --mj-radius: 16px;
}

/* =========================================================
   GŁÓWNA TREŚĆ — NIGDY MODAL BETHEME
   ========================================================= */

body.woocommerce-account:not(.logged-in) #Content,
body.woocommerce-account:not(.logged-in) #Content .section.the_content,
body.woocommerce-account:not(.logged-in) #Content .section_wrapper,
body.woocommerce-account:not(.logged-in) #Content .the_content_wrapper {
    overflow: visible !important;
}

/* Wrapper Woo tylko wtedy, gdy zawiera właściwy #customer_login. */
body.woocommerce-account:not(.logged-in) #Content .woocommerce:has(#customer_login) {
    box-sizing: border-box !important;
    width: min(1180px, calc(100% - 48px)) !important;
    max-width: 1180px !important;
    margin: 52px auto 76px !important;
    padding: 0 !important;
    clear: both !important;
}

/* =========================================================
   DWIE KARTY
   ========================================================= */

body.woocommerce-account:not(.logged-in) #customer_login {
    display: grid !important;
    grid-template-columns: minmax(340px, .85fr) minmax(500px, 1.15fr) !important;
    align-items: start !important;
    gap: 28px !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    clear: both !important;
}

body.woocommerce-account:not(.logged-in) #customer_login::before,
body.woocommerce-account:not(.logged-in) #customer_login::after {
    display: none !important;
    content: none !important;
}

body.woocommerce-account:not(.logged-in) #customer_login > .u-column1,
body.woocommerce-account:not(.logged-in) #customer_login > .u-column2 {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    float: none !important;
    clear: none !important;

    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 32px !important;

    background: var(--mj-soft) !important;
    border: 1px solid var(--mj-border) !important;
    border-radius: var(--mj-radius) !important;
    box-shadow: none !important;
}

body.woocommerce-account:not(.logged-in) #customer_login > .u-column1 {
    grid-column: 1 !important;
}

body.woocommerce-account:not(.logged-in) #customer_login > .u-column2 {
    grid-column: 2 !important;
}

/* =========================================================
   TYPOGRAFIA
   ========================================================= */

body.woocommerce-account:not(.logged-in) #customer_login h2 {
    margin: 0 0 24px !important;
    color: var(--mj-text) !important;
    font-size: 30px !important;
    line-height: 1.15 !important;
    font-weight: 700 !important;
    text-align: left !important;
}

body.woocommerce-account:not(.logged-in) #customer_login label {
    display: block !important;
    margin: 0 0 7px !important;
    color: var(--mj-text) !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .required {
    color: var(--mj-primary) !important;
}

/* =========================================================
   FORMY / POLA
   ========================================================= */

body.woocommerce-account:not(.logged-in) #customer_login form.login,
body.woocommerce-account:not(.logged-in) #customer_login form.register {
    position: static !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .form-row {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    float: none !important;
    clear: both !important;
}

body.woocommerce-account:not(.logged-in) #customer_login input.input-text,
body.woocommerce-account:not(.logged-in) #customer_login input[type="email"],
body.woocommerce-account:not(.logged-in) #customer_login input[type="password"],
body.woocommerce-account:not(.logged-in) #customer_login input[type="date"],
body.woocommerce-account:not(.logged-in) #customer_login input[type="text"] {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 50px !important;
    margin: 0 !important;
    padding: 11px 14px !important;

    color: var(--mj-text) !important;
    background: #FFFFFF !important;
    border: 1px solid #D4DADD !important;
    border-radius: 10px !important;
    box-shadow: none !important;

    font-size: 15px !important;
    line-height: 1.3 !important;
    transition: border-color .2s ease, box-shadow .2s ease !important;
}

body.woocommerce-account:not(.logged-in) #customer_login input:focus {
    outline: none !important;
    border-color: var(--mj-primary) !important;
    box-shadow: 0 0 0 3px rgba(6,107,137,.12) !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .clear {
    display: none !important;
}

/* =========================================================
   PRZYCISKI
   ========================================================= */

body.woocommerce-account:not(.logged-in) #customer_login button.button,
body.woocommerce-account:not(.logged-in) #customer_login .woocommerce-button.button {
    width: 100% !important;
    min-height: 50px !important;
    margin: 4px 0 0 !important;
    padding: 12px 20px !important;

    background: var(--mj-primary) !important;
    color: #FFFFFF !important;
    border: 2px solid var(--mj-primary) !important;
    border-radius: 10px !important;
    box-shadow: none !important;

    font-size: 15px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease !important;
}

@media (hover:hover) and (pointer:fine) {
    body.woocommerce-account:not(.logged-in) #customer_login button.button:hover,
    body.woocommerce-account:not(.logged-in) #customer_login .woocommerce-button.button:hover {
        background: #FFFFFF !important;
        color: var(--mj-primary) !important;
        border-color: var(--mj-primary) !important;
    }
}

body.woocommerce-account:not(.logged-in) #customer_login .lost_password {
    margin: 14px 0 0 !important;
    text-align: center !important;
}

body.woocommerce-account:not(.logged-in) #customer_login a {
    color: var(--mj-primary);
}

/* =========================================================
   INTRO REJESTRACJI
   ========================================================= */

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-register-intro {
    width: 100% !important;
    margin: -4px 0 22px !important;
    padding: 0 !important;
    text-align: left !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-register-kicker {
    display: block !important;
    margin: 0 0 5px !important;
    color: var(--mj-text) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-align: left !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-register-copy {
    display: block !important;
    margin: 0 !important;
    color: var(--mj-muted) !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    text-align: left !important;
}

/* =========================================================
   WYBÓR: INDYWIDUALNE / FIRMA
   ========================================================= */

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode {
    width: 100% !important;
    margin: 0 0 24px !important;
    padding: 0 !important;
    border: 0 !important;
    text-align: left !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode legend {
    width: 100% !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    color: var(--mj-text) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-align: left !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 10px !important;
    width: 100% !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode-option {
    position: relative !important;
    display: block !important;
    margin: 0 !important;
    cursor: pointer !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode-option > input {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode-card {
    display: flex !important;
    box-sizing: border-box !important;
    min-height: 108px !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 16px 17px !important;

    background: #FFFFFF !important;
    border: 2px solid transparent !important;
    border-radius: 12px !important;
    transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode-title {
    color: var(--mj-text) !important;
    font-size: 15px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode-desc {
    margin-top: 6px !important;
    color: var(--mj-muted) !important;
    font-size: 12.5px !important;
    line-height: 1.45 !important;
    font-weight: 400 !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode-option > input:checked + .mirjas-account-mode-card {
    background: var(--mj-soft-blue) !important;
    border-color: var(--mj-primary) !important;
    box-shadow: 0 0 0 1px var(--mj-primary) !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode-option > input:focus-visible + .mirjas-account-mode-card {
    outline: 3px solid rgba(6,107,137,.18) !important;
    outline-offset: 2px !important;
}

/* =========================================================
   DANE OSOBOWE / FIRMA
   ========================================================= */

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-person-fields {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-person-fields > .form-row,
body.woocommerce-account:not(.logged-in) #customer_login .mirjas-person-fields > .mirjas-form-row {
    grid-column: 1 / -1 !important;
    width: 100% !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-company-fields {
    display: none;
    width: 100% !important;
    margin: 6px 0 18px !important;
    padding: 20px 20px 2px !important;
    box-sizing: border-box !important;
    background: var(--mj-soft-blue) !important;
    border: 1px solid #D7E8ED !important;
    border-radius: 12px !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-company-fields.is-visible {
    display: block !important;
}

/* Przełączanie bez JS — brak ryzyka pętli DOM / crashy. */
body.woocommerce-account:not(.logged-in) #customer_login form.register:has(input[name="mirjas_account_mode"][value="company"]:checked) .mirjas-company-fields {
    display: block !important;
}

body.woocommerce-account:not(.logged-in) #customer_login form.register:has(input[name="mirjas_account_mode"][value="individual"]:checked) .mirjas-company-fields {
    display: none !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-company-fields-title {
    margin: 0 0 16px !important;
    color: var(--mj-text) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .mirjas-field-help {
    display: block !important;
    margin-top: 6px !important;
    color: var(--mj-muted) !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
}

/* =========================================================
   KOMUNIKATY W GŁÓWNEJ TREŚCI
   ========================================================= */

body.woocommerce-account:not(.logged-in) #Content .woocommerce-notices-wrapper .woocommerce-error,
body.woocommerce-account:not(.logged-in) #Content .woocommerce-notices-wrapper .woocommerce-message,
body.woocommerce-account:not(.logged-in) #Content .woocommerce-notices-wrapper .woocommerce-info {
    border-radius: 12px !important;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 960px) {
    body.woocommerce-account:not(.logged-in) #Content .woocommerce:has(#customer_login) {
        width: min(720px, calc(100% - 32px)) !important;
        margin-top: 34px !important;
    }

    body.woocommerce-account:not(.logged-in) #customer_login {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    body.woocommerce-account:not(.logged-in) #customer_login > .u-column1,
    body.woocommerce-account:not(.logged-in) #customer_login > .u-column2 {
        grid-column: 1 !important;
    }
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {
    body.woocommerce-account:not(.logged-in) #Content .woocommerce:has(#customer_login) {
        width: calc(100% - 24px) !important;
        margin-top: 22px !important;
        margin-bottom: 48px !important;
    }

    body.woocommerce-account:not(.logged-in) #customer_login > .u-column1,
    body.woocommerce-account:not(.logged-in) #customer_login > .u-column2 {
        padding: 22px !important;
        border-radius: 14px !important;
    }

    body.woocommerce-account:not(.logged-in) #customer_login h2 {
        margin-bottom: 20px !important;
        font-size: 25px !important;
    }

    body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode-grid {
        grid-template-columns: 1fr !important;
    }

    body.woocommerce-account:not(.logged-in) #customer_login .mirjas-account-mode-card {
        min-height: auto !important;
    }
}

/* =========================================================
   0.9.7 — upgrade konta indywidualnego do firmowego
   Bez JS: natywne <details> + zwykły POST.
   ========================================================= */

body.woocommerce-account .mirjas-upgrade-company {
    margin: 18px 0 4px;
    overflow: hidden;
    background: #F5F5F5;
    border: 1px solid #E3E5E7;
    border-radius: 16px;
}

body.woocommerce-account .mirjas-upgrade-company > summary {
    display: flex;
    align-items: center;
    min-height: 54px;
    padding: 14px 18px;
    color: #393838;
    font-size: 14px;
    line-height: 1.3;
    font-weight: 700;
    cursor: pointer;
    list-style: none;
}

body.woocommerce-account .mirjas-upgrade-company > summary::-webkit-details-marker {
    display: none;
}

body.woocommerce-account .mirjas-upgrade-company > summary::after {
    content: "+";
    margin-left: auto;
    color: #066B89;
    font-size: 22px;
    font-weight: 500;
}

body.woocommerce-account .mirjas-upgrade-company[open] > summary::after {
    content: "−";
}

body.woocommerce-account .mirjas-upgrade-company-body {
    padding: 0 18px 18px;
}

body.woocommerce-account .mirjas-upgrade-company-body > p {
    margin: 0 0 16px;
    color: #6B7075;
    font-size: 13px;
    line-height: 1.5;
}

body.woocommerce-account .mirjas-upgrade-company-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

body.woocommerce-account .mirjas-upgrade-company-form p {
    margin: 0;
}

body.woocommerce-account .mirjas-upgrade-company-form label {
    display: block;
    margin: 0 0 6px;
    color: #393838;
    font-size: 12.5px;
    font-weight: 700;
}

body.woocommerce-account .mirjas-upgrade-company-form input {
    box-sizing: border-box;
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 9px 12px;
    background: #FFFFFF;
    border: 1px solid #D9DDE0;
    border-radius: 10px;
}

body.woocommerce-account .mirjas-upgrade-company-form .mirjas-primary-button {
    grid-column: 1 / -1;
    width: fit-content !important;
    margin-top: 2px !important;
}

@media (max-width: 680px) {
    body.woocommerce-account .mirjas-upgrade-company-form {
        grid-template-columns: 1fr;
    }

    body.woocommerce-account .mirjas-upgrade-company-form .mirjas-primary-button {
        width: 100% !important;
    }
}