/* ==========================================================================
   MeczRealu - strona logowania /signin w stylu X.com (templates/sign.tpl).
   Tylko pod .mr-x-sign - formularz _sign_form.tpl uzywa tez landing page.
   Ciemny motyw domyslnie, jasny: html[data-mr-theme="light"].
   ========================================================================== */
.mr-x-sign{--sx-fg:#e7e9ea;--sx-dim:#71767b;--sx-line:#333639;--sx-bg:#000;--sx-card:#000;--sx-btn:#eff3f4;--sx-btn-fg:#0f1419;--sx-blue:#0053cb;--sx-link:#4c8dff}
html[data-mr-theme="light"] .mr-x-sign{--sx-fg:#0f1419;--sx-dim:#536471;--sx-line:#cfd9de;--sx-bg:#fff;--sx-card:#fff;--sx-btn:#0f1419;--sx-btn-fg:#fff;--sx-link:#0053cb}
body:has(.mr-x-sign){background:var(--sx-bg, #000)}
.mr-x-sign{display:flex;justify-content:center;align-items:flex-start;padding:40px 16px 48px;min-height:calc(100vh - 40px);box-sizing:border-box;font-family:var(--mrx-font, inherit)}
.mr-x-sign *,.mr-x-sign *::before,.mr-x-sign *::after{box-sizing:border-box}
.mr-x-sign-card{width:100%;max-width:600px;padding:20px 80px 48px;border:1px solid #2f3336;border-radius:16px;background:var(--sx-card);color:var(--sx-fg)}
html[data-mr-theme="light"] .mr-x-sign-card{border-color:#eff3f4}
.mr-x-sign-logo{display:flex;justify-content:center;margin:0 0 8px}
.mr-x-sign-logo .mr-brand-logo{display:block;width:74px;height:33px;overflow:hidden}
html[data-mr-theme="light"] .mr-x-sign-logo .mr-brand-image{filter:url(#mrLogoInkSign)}

/* formularz */
.mr-x-sign .fr_auth_form{background:transparent !important;border:0 !important;box-shadow:none !important;padding:0 !important;margin:0 !important;max-width:none !important;width:100% !important;border-radius:0 !important}
.mr-x-sign .fr_auth_form .text-center.mt-4,.mr-x-sign .fr_auth_form .text-center.my-4{text-align:left !important;margin:20px 0 28px !important}
.mr-x-sign .fr_welcome_title{font-size:31px !important;line-height:36px !important;font-weight:800 !important;letter-spacing:-.3px;color:var(--sx-fg) !important}
.mr-x-sign .fr_welcome_field{position:relative;margin:0 0 20px !important}
.mr-x-sign .fr_welcome_field.mb-2{margin-bottom:12px !important}
.mr-x-sign .fr_welcome_field > svg.position-absolute{display:none !important}
.mr-x-sign .fr_welcome_field input,
.mr-x-sign .fr_welcome_field select,
.mr-x-sign .fr_welcome_field textarea{width:100% !important;height:58px !important;padding:0 12px !important;border:1px solid var(--sx-line) !important;border-radius:4px !important;background:transparent !important;color:var(--sx-fg) !important;font-size:17px !important;line-height:24px !important;box-shadow:none !important;outline:0 !important;transition:border-color .15s,box-shadow .15s}
.mr-x-sign .fr_welcome_field textarea{height:auto !important;min-height:96px;padding:14px 12px !important}
.mr-x-sign .fr_welcome_field input::placeholder,.mr-x-sign .fr_welcome_field textarea::placeholder{color:var(--sx-dim) !important;opacity:1}
.mr-x-sign .fr_welcome_field input:focus,.mr-x-sign .fr_welcome_field select:focus,.mr-x-sign .fr_welcome_field textarea:focus{border-color:var(--sx-blue) !important;box-shadow:0 0 0 1px var(--sx-blue) !important}
.mr-x-sign .fr_welcome_field input:-webkit-autofill{-webkit-text-fill-color:var(--sx-fg);transition:background-color 9999s ease-out 0s}
/* pokaz/ukryj haslo - po prawej, jak na X */
.mr-x-sign .js_toggle-password{display:flex !important;align-items:center;justify-content:center;width:48px;height:58px;color:var(--sx-dim)}
.mr-x-sign .js_toggle-password svg{width:20px !important;height:20px !important;position:static !important}
.mr-x-sign .js_toggle-password:hover{color:var(--sx-fg)}
.mr-x-sign .fr_welcome_field input[type="password"],.mr-x-sign .fr_welcome_field input[name="password"]{padding-right:52px !important}

/* zapamietaj + nie pamietasz hasla */
.mr-x-sign .form-check{display:flex;align-items:center;gap:8px;padding-left:0;margin:0}
.mr-x-sign .form-check-input{float:none;margin:0 !important;width:18px;height:18px;border:2px solid var(--sx-dim);border-radius:4px;background-color:transparent}
.mr-x-sign .form-check-input:checked{background-color:var(--sx-blue);border-color:var(--sx-blue)}
.mr-x-sign .form-check-label{color:var(--sx-fg);font-size:15px}
.mr-x-sign a[href$="/reset"]{color:var(--sx-link) !important;font-size:15px;text-decoration:none !important}
.mr-x-sign a[href$="/reset"]:hover{text-decoration:underline !important}

/* przyciski: jasna pigulka jak "Dalej" na X */
.mr-x-sign .fr_welcome_btn,.mr-x-sign button[type="submit"]{height:40px !important;padding:0 16px !important;border:0 !important;border-radius:9999px !important;background:var(--sx-btn) !important;color:var(--sx-btn-fg) !important;font-size:15px !important;font-weight:700 !important;line-height:40px !important;box-shadow:none !important;transition:filter .15s}
.mr-x-sign .fr_welcome_btn:hover,.mr-x-sign button[type="submit"]:hover{filter:brightness(.9)}
.mr-x-sign .fr_auth_form .mt-4:has(> .fr_welcome_btn){margin-top:28px !important}

/* przelacznik logowanie / rejestracja */
.mr-x-sign .fr_welcome_switch{margin-top:40px !important;text-align:left !important;color:var(--sx-dim) !important;font-size:15px}
.mr-x-sign .fr_welcome_switch a{color:var(--sx-link) !important;text-decoration:none !important;border:0 !important}
.mr-x-sign .fr_welcome_switch a:hover{text-decoration:underline !important}

/* komunikat bledu */
.mr-x-sign .alert{border-radius:12px;font-size:14px}

/* logowanie spolecznosciowe, jesli wlaczone */
.mr-x-sign .fr_auth_form .btn-social,.mr-x-sign .fr_auth_form [class*="social"] .btn{border-radius:9999px !important}

@media (max-width:640px){
  .mr-x-sign{padding:16px 0 32px;align-items:flex-start}
  .mr-x-sign-card{border:0;border-radius:0;padding:12px 24px 40px;max-width:none}
  .mr-x-sign .fr_welcome_title{font-size:26px !important;line-height:30px !important}
}
