/* Love Studios NYC - sign in / register page (inc/ls-signin.php). Form styles follow the sign-in pop-up (css/ls-header.css). */
.lss { padding: 56px 0 96px; background: #f6f6f4; color: var(--lsh-ink); }
.lss * { box-sizing: border-box; }
.lss-grid { display: grid; grid-template-columns: minmax(0, 520px) minmax(0, 1fr); gap: 40px; align-items: stretch; }
.lss-card { padding: 40px 40px 32px; border: 1px solid var(--lsh-line); border-radius: 28px; background: #fff; box-shadow: 0 20px 60px rgba(0,0,0,.06); }
.lss-eyebrow { margin: 0 0 8px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--lsh-accent); }
.lss-h1 { margin: 0 0 10px; font-family: var(--lsh-display); font-size: clamp(32px, 4vw, 44px); font-weight: 700; letter-spacing: -.03em; line-height: 1.05; color: var(--lsh-ink); }
.lss-sub { margin: 0 0 24px; font-size: 16px; line-height: 1.55; color: var(--lsh-muted); }
.lss-alert { margin: 0 0 16px; padding: 12px 16px; border-radius: 14px; font-size: 15px; line-height: 1.45; }
.lss-alert.is-error { background: #fbe9e7; color: #8a2a16; }
.lss-alert.is-ok { background: #e7f1ea; color: #1e5e37; }
.lss-alert a { color: inherit; text-decoration: underline; }
.lss-form { margin: 0 !important; padding: 0 !important; width: auto !important; float: none !important; }
.lss-card .lss-form { padding: 0 !important; }
.lss-help { margin: 22px 0 0; font-size: 14px; color: #6b6b67; }
.lss-help a { color: var(--lsh-ink); text-decoration: underline; text-underline-offset: 3px; }
.lss-side { position: relative; min-height: 560px; border-radius: 28px; overflow: hidden; background: #2a2a28; }
.lss-side img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lss-side:after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.72) 100%); }
.lss-side-text { position: absolute; left: 36px; right: 36px; bottom: 34px; z-index: 1; color: #fff; }
.lss-side-k { margin: 0 0 8px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #f1d9c5; }
.lss-side-h { margin: 0 0 16px; font-family: var(--lsh-display); font-size: clamp(26px, 2.6vw, 36px); font-weight: 700; line-height: 1.1; letter-spacing: -.02em; }
.lss-side ul { margin: 0; padding: 0; list-style: none; }
.lss-side li { position: relative; margin: 0 0 8px; padding-left: 26px; font-size: 16px; color: #f4f4f2; }
.lss-side li:before { content: ''; position: absolute; left: 2px; top: 6px; width: 12px; height: 7px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); }
/* Register form extras */
.lss-card .account-type label { padding: 12px 14px !important; border: 1px solid #d6d6d2 !important; border-radius: 12px !important; }
.lss-card .tab-content select, .lss-card .tab-content textarea { min-height: 52px; border: 1px solid #d6d6d2 !important; border-radius: 12px !important; }
.lss-card .tab-content p { font-size: 14px; color: #3d3d3a; }
.lss-card .tab-content input[type=submit] { display: block; width: 100% !important; height: 54px !important; margin: 10px 0 0 !important; border: 0 !important; border-radius: 999px !important; background: #111 !important; color: #fff !important; font-size: 16px !important; font-weight: 600 !important; cursor: pointer; }
.lss-card .tab-content input[type=submit]:hover { background: #333 !important; }
body.ls-signin-page #titlebar { display: none !important; }
@media (max-width: 960px) {
    .lss-grid { grid-template-columns: minmax(0, 1fr); }
    .lss-side { order: -1; min-height: 220px; }
    .lss-side ul { display: none; }
}
@media (max-width: 600px) {
    .lss { padding: 20px 0 64px; }
    .lss-card { padding: 26px 20px 22px; border-radius: 22px; }
    .lss-side { min-height: 170px; border-radius: 22px; }
    .lss-side-text { left: 20px; right: 20px; bottom: 18px; }
    .lss-side-h { margin: 0; font-size: 22px; }
}

/* ---------- Sign in / Register pop-up, new design ---------- */
/* Log in | Register as a two-part switch */
.lss-card .tabs-nav {
    display: flex !important; gap: 4px; margin: 0 0 22px !important; padding: 4px !important; border: 0 !important;
    border-radius: 999px; background: #f1f1ee; list-style: none;
}
.lss-card .tabs-nav li { flex: 1 1 0; float: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }
.lss-card .tabs-nav li a {
    display: flex !important; align-items: center; justify-content: center; height: 42px; margin: 0 !important; padding: 0 !important;
    border: 0 !important; border-radius: 999px; background: transparent; color: #5a5a5a !important; font-size: 15px !important; font-weight: 600 !important;
}
.lss-card .tabs-nav li a::after, .lss-card .tabs-nav li a::before { display: none !important; }
.lss-card .tabs-nav li.active a { background: #fff !important; color: #111 !important; box-shadow: 0 2px 8px rgba(0,0,0,.08); }
.lss-card .tabs-container { border: 0 !important; }
.lss-card .tab-content { padding: 0 !important; border: 0 !important; background: transparent !important; }
/* Fields */
.lss-card .form-row { margin: 0 0 12px !important; padding: 0 !important; }
.lss-card .form-row label { position: relative; display: block; margin: 0 !important; }
.lss-card .form-row label > i { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); margin: 0 !important; font-size: 15px; color: #8a8a86; z-index: 1; }
.lss-card input.input-text, .lss-card input[type=email], .lss-card input[type=password], .lss-card input[type=text] {
    height: 52px !important; margin: 0 !important; padding: 0 16px 0 44px !important; border: 1px solid #d6d6d2 !important; border-radius: 12px !important;
    background: #fff !important; box-shadow: none !important; font-size: 16px !important; color: #111 !important; box-sizing: border-box; width: 100%;
}
.lss-card input.input-text:focus, .lss-card input[type=password]:focus { border-color: #111 !important; box-shadow: 0 0 0 3px rgba(0,0,0,.08) !important; outline: none; }
.lss-card .lost_password { display: block; margin: 4px 0 18px !important; }
.lss-card .lost_password a, .lss-card .checkboxes a { color: #111 !important; font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
/* Main button */
.lss-card input[type=submit].button, .lss-card .button.border {
    display: block; width: 100% !important; height: 54px !important; margin: 6px 0 0 !important; padding: 0 24px !important;
    border: 0 !important; border-radius: 999px !important; background: #111 !important; color: #fff !important;
    font-size: 16px !important; font-weight: 600 !important; line-height: 54px !important; box-shadow: none !important; cursor: pointer;
}
.lss-card input[type=submit].button:hover { background: #333 !important; }
/* Checkboxes */
.lss-card .checkboxes { margin: 12px 0 0 !important; font-size: 14px; color: #3d3d3a; }
.lss-card .checkboxes label { display: inline-flex !important; align-items: center; gap: 10px; padding: 0 !important; font-size: 14px !important; color: #3d3d3a !important; }
.lss-card .checkboxes input[type=checkbox] + label::before { border-radius: 6px !important; border-color: #cfcfcc !important; }
.lss-card .checkboxes input[type=checkbox]:checked + label::before { background: #111 !important; border-color: #111 !important; }
.lss-card .notification { border-radius: 12px !important; }
.lss-card .account-type { display: flex; gap: 8px; margin: 0 0 14px; }
.lss-card .checkboxes label { display: inline !important; padding: 0 !important; margin: 0 !important; vertical-align: middle; }
.lss-card .checkboxes label::before, .lss-card .checkboxes label::after { display: none !important; }
.lss-card .checkboxes { display: flex; align-items: center; flex-wrap: wrap; }


/* Remember me: a plain, visible checkbox */
.lss .lss-form .checkboxes input[type=checkbox] { display: inline-block !important; position: static !important; width: 18px !important; height: 18px !important; margin: 0 8px 0 0 !important; opacity: 1 !important; visibility: visible !important; clip: auto !important; -webkit-appearance: checkbox !important; appearance: auto !important; accent-color: #111; vertical-align: middle; }
.lss .lss-form .checkboxes label:before, .lss .lss-form .checkboxes label:after { display: none !important; content: none !important; }