/* Jerseyniho OTP login — brand: blue #046bd2 + near-black #111, clean/sharp */ .jny-login{max-width:430px;margin:0 auto;font-family:"Rubik","Heebo",Arial,sans-serif;direction:rtl} .jny-login-tabs{display:flex;border-bottom:2px solid #eef0f2;margin:0 0 22px} .jny-tab{flex:1;background:none;border:0;padding:13px 8px;font-family:inherit;font-size:15.5px;font-weight:700;color:#94a3b8;cursor:pointer;position:relative;transition:color .15s} .jny-tab.active{color:#111} .jny-tab.active::after{content:"";position:absolute;inset-inline:0;bottom:-2px;height:2px;background:#046bd2} .jny-tab:hover{color:#475569} .jny-login .form-row{margin:0 0 16px;display:block} .jny-login label{display:block;font-size:13.5px;font-weight:600;color:#334155;margin:0 0 6px} .jny-login .required{color:#dc2626} .jny-login input.input-text,.jny-otp-field input{width:100%;padding:12px 13px;border:1.5px solid #dfe3e8;border-radius:8px;font-family:inherit;font-size:15px;background:#fff;transition:border-color .15s,box-shadow .15s;box-sizing:border-box} .jny-login input.input-text:focus,.jny-otp-field input:focus{outline:0;border-color:#046bd2;box-shadow:0 0 0 3px rgba(4,107,210,.12)} .jny-btn{width:100%;background:#046bd2;color:#fff;border:0;border-radius:8px;padding:14px;font-family:inherit;font-size:15.5px;font-weight:700;cursor:pointer;transition:background .15s} .jny-btn:hover{background:#045cb4} .jny-btn:disabled{opacity:.6;cursor:default} .jny-login-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px} .jny-login-row .jny-btn{width:auto;flex:1;min-width:150px} .jny-remember{display:flex;align-items:center;gap:7px;font-weight:500;color:#475569;margin:0} .jny-remember input{width:auto;margin:0} .jny-lost{margin:14px 0 0;text-align:center} .jny-lost a,.jny-otp-back a,.jny-otp-resend a{color:#046bd2;text-decoration:none;font-size:14px;font-weight:600} .jny-lost a:hover,.jny-otp-resend a:hover{text-decoration:underline} /* method toggle email/sms */ .jny-otp-method{display:flex;gap:8px;background:#f1f5f9;padding:5px;border-radius:10px;margin:0 0 18px} .jny-otp-method label{flex:1;margin:0;text-align:center;padding:10px;border-radius:7px;cursor:pointer;font-weight:600;color:#475569;transition:.15s} .jny-otp-method label.active{background:#fff;color:#046bd2;box-shadow:0 1px 3px rgba(15,23,42,.1)} .jny-otp-method input{display:none} .jny-otp-field{margin:0 0 16px} .jny-otp-verify-text{text-align:center;font-size:15px;color:#334155;font-weight:600;margin:0 0 16px} /* 6 digit boxes */ .jny-otp-digits{display:flex;gap:8px;justify-content:center;margin:0 0 14px} .jny-digit{width:46px;height:54px;text-align:center;font-size:22px;font-weight:700;border:1.5px solid #dfe3e8;border-radius:8px;background:#fff;color:#111;font-family:inherit} .jny-digit:focus{outline:0;border-color:#046bd2;box-shadow:0 0 0 3px rgba(4,107,210,.12)} .jny-digit.jny-digit-err{border-color:#dc2626;background:#fff5f5;color:#dc2626;animation:jny-otp-shake .3s} .jny-digit.jny-digit-err:focus{box-shadow:0 0 0 3px rgba(220,38,38,.14)} @keyframes jny-otp-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}} .jny-otp-timer{text-align:center;color:#94a3b8;font-size:13px;margin:0 0 12px;min-height:18px} .jny-otp-resend{text-align:center;margin:14px 0 0} .jny-otp-back{text-align:center;margin:12px 0 0} .jny-otp-msg{text-align:center;font-size:14px;margin:12px 0 0;min-height:18px} .jny-otp-msg.err{color:#dc2626} .jny-otp-msg.ok{color:#16a34a} @media(max-width:480px){ .jny-digit{width:42px;height:50px;font-size:20px} .jny-login-row{flex-direction:column;align-items:stretch} .jny-login-row .jny-btn{width:100%} } /* ===== lost-password / reset-password — same card language as the login ===== */ .woocommerce-account .woocommerce-ResetPassword{max-width:430px;margin:0 auto;font-family:"Rubik","Heebo",Arial,sans-serif;direction:rtl} .woocommerce-account .woocommerce-ResetPassword > p:first-of-type{text-align:center;color:#475569;font-size:14.5px;line-height:1.6;margin:0 0 22px} .woocommerce-account .woocommerce-ResetPassword .form-row{margin:0 0 16px;display:block} .woocommerce-account .woocommerce-ResetPassword label{display:block;font-size:13.5px;font-weight:600;color:#334155;margin:0 0 6px} .woocommerce-account .woocommerce-ResetPassword .input-text, .woocommerce-account .woocommerce-ResetPassword input[type=text], .woocommerce-account .woocommerce-ResetPassword input[type=password]{width:100%;padding:12px 13px;border:1.5px solid #dfe3e8;border-radius:8px;font-family:inherit;font-size:15px;box-sizing:border-box;background:#fff} .woocommerce-account .woocommerce-ResetPassword .input-text:focus, .woocommerce-account .woocommerce-ResetPassword input:focus{outline:0;border-color:#046bd2;box-shadow:0 0 0 3px rgba(4,107,210,.12)} .woocommerce-account .woocommerce-ResetPassword .button, .woocommerce-account .woocommerce-ResetPassword button[type=submit]{width:100%;background:#046bd2;color:#fff;border:0;border-radius:8px;padding:14px;font-family:inherit;font-size:15.5px;font-weight:700;cursor:pointer;transition:background .15s} .woocommerce-account .woocommerce-ResetPassword .button:hover, .woocommerce-account .woocommerce-ResetPassword button[type=submit]:hover{background:#045cb4} /* hide the password-strength meter noise, keep it clean */ .woocommerce-account .woocommerce-ResetPassword .woocommerce-password-strength{border-radius:8px;font-weight:600;margin-top:8px} /* ============================================================ jerseyniho - LOGGED-OUT my-account auth screens ONLY (v1.6.1) Fix: the inherited dashboard grid (.woocommerce{display:grid; 240px 1fr}) was squishing the login/lost-password form into the empty 240px nav track. This file is enqueued ONLY when logged out, and every rule is hooked on body.woocommerce-account:not(.logged-in) so it can never touch the logged-in dashboard. No :has(), RTL safe. Designed by UI/UX council 2026-06-29. ============================================================ */ /* 1) UN-GRID (the load-bearing fix). Specificity (0,3,1) beats the dashboard rule (0,2,0) with no !important, order-independent. */ body.woocommerce-account:not(.logged-in) .woocommerce{ display:block; grid-template-columns:none; gap:0; max-width:none; margin:0; padding:8px 16px 64px; } /* 2) PAGE HEADING "החשבון שלי" (an h1.e-heading-base, the new Elementor heading). Center it over the card so it reads as the card title. Scoped to #main so footer/header headings are untouched. */ body.woocommerce-account:not(.logged-in) #main h1.e-heading-base{ text-align:center; color:#111; font-weight:800; letter-spacing:-.01em; line-height:1.2; margin:0 0 6px; } /* 3) THE AUTH CARD: one shared shell for OTP login + password login (both inside .jny-login) and lost-password (.woocommerce-ResetPassword). NOTE: form.woocommerce-form-login lives INSIDE .jny-login, so it is intentionally NOT styled here (would create a card-in-card). */ body.woocommerce-account:not(.logged-in) .jny-login, body.woocommerce-account:not(.logged-in) .woocommerce-ResetPassword{ box-sizing:border-box; width:100%; max-width:480px; margin:18px auto 64px; direction:rtl; background:#fff; border:1px solid #eef0f2; border-radius:16px; padding:34px 32px 30px; box-shadow:0 1px 2px rgba(17,17,17,.04), 0 14px 34px -14px rgba(4,107,210,.18); } /* 4) Tab rail flush to the top of the card. */ body.woocommerce-account:not(.logged-in) .jny-login-tabs{ margin-top:2px; margin-bottom:24px; } /* 5) LOST-PASSWORD intro paragraph: center and mute as helper text. */ body.woocommerce-account:not(.logged-in) .woocommerce-ResetPassword > p:not(.woocommerce-form-row):not(.form-row){ margin:0 0 24px; color:#334155; font-size:14px; line-height:1.6; text-align:center; } /* 6) Reset submit full-width to match the .jny-btn rhythm. */ body.woocommerce-account:not(.logged-in) .woocommerce-ResetPassword .woocommerce-Button, body.woocommerce-account:not(.logged-in) .woocommerce-ResetPassword button[type="submit"]{ width:100%; } /* 7) NOTICES (failed login / reset-sent) render outside the card. Constrain to the card width and center. */ body.woocommerce-account:not(.logged-in) .woocommerce-notices-wrapper, body.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-error, body.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-message, body.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-info{ max-width:480px; margin-inline:auto; } /* 8) Premium micro-touches. */ body.woocommerce-account:not(.logged-in) .jny-login input[type=checkbox], body.woocommerce-account:not(.logged-in) .jny-login input[type=radio], body.woocommerce-account:not(.logged-in) .woocommerce-ResetPassword input[type=checkbox]{ accent-color:#046bd2; } body.woocommerce-account:not(.logged-in) .jny-btn:active, body.woocommerce-account:not(.logged-in) .woocommerce-ResetPassword button[type="submit"]:active, body.woocommerce-account:not(.logged-in) .woocommerce-ResetPassword .button:active{ transform:translateY(1px); } /* 9) MOBILE (<=480px): keep the card but lighter; never kiss edges. */ @media (max-width:480px){ body.woocommerce-account:not(.logged-in) .woocommerce{ padding:4px 14px 48px; } body.woocommerce-account:not(.logged-in) .jny-login, body.woocommerce-account:not(.logged-in) .woocommerce-ResetPassword{ max-width:100%; margin:14px auto 40px; padding:24px 18px; border-radius:14px; box-shadow:0 10px 26px -16px rgba(4,107,210,.20); } body.woocommerce-account:not(.logged-in) #main h1.e-heading-base{ margin-bottom:4px; } body.woocommerce-account:not(.logged-in) .woocommerce-notices-wrapper, body.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-error, body.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-message, body.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-info{ max-width:100%; } } /* 11) PASSWORD TAB POLISH (logged-out only). a) WooCommerce core gives form.login a default border+padding+radius; inside our card that read as a card-in-card. Strip it so only the outer auth card shows. The .jny-login wrapper already pads the form. b) Astra paints a background on the tab