/* Uses the main website's turquoise, graphite and light background palette. */
@font-face {
    font-family: 'Yekan';
    src: url('../fonts/Kalameh/KalamehWebFaNum-Medium.woff') format('woff');
    font-weight: 700;
    font-display: swap;
}
.private-login-page {
    --private-brand: #00b0bc;
    --private-ink: #0d161f;
    --private-teal: #006b73;
    --primary-color: var(--private-teal);
    padding: 40px 16px;
    align-items: flex-start;
    background: radial-gradient(ellipse at 12% 5%, #00b0bc19, transparent 48%), radial-gradient(ellipse at 95% 95%, #00b0bc0c, transparent 48%), #f4f8fa;
    color: var(--private-ink);
}
.private-login-layout { width: 100%; max-width: 580px; }
.private-login-layout .login-container { max-width: none; margin-inline: auto; border: 1px solid #deeaed; border-top: 4px solid var(--private-brand); border-radius: 24px; box-shadow: 0 16px 56px #0d161f0d, 0 2px 6px #0d161f04; }
.private-login-layout .login-header { padding: 28px 36px 0; background: transparent; color: var(--private-ink); text-align: right; }
.private-brand-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 28px; }
.private-brand-link { display: inline-flex; border-radius: 4px; }
.private-brand-link img { width: 120px; height: 44px; object-fit: contain; }
.private-edition { display: inline-flex; align-items: center; gap: 8px; border: 1px solid #cce9eb; background: #f1fbfb; padding: 5px 13px; border-radius: 30px; font-size: .8rem; color: var(--private-teal); }
.private-edition strong { font-size: 1.15rem; }
.private-login-eyebrow { display: block; font-size: .8rem; color: var(--private-teal); margin-bottom: 8px; }
.private-login-layout .login-header h1 { font-size: 1.65rem; font-weight: 700; line-height: 1.5; margin: 0; letter-spacing: -.3px; }
.private-login-layout .login-header p { font-size: .88rem; line-height: 1.9; margin-top: 10px; color: #556773; opacity: 1; }
.private-login-layout .login-body { padding: 24px 36px 28px; }
.private-login-layout .form-floating { margin-bottom: 14px; }
.private-login-layout .form-floating > .form-control { border: 1px solid #d7e2e6; background: #fbfcfd; border-radius: 10px; min-height: 56px; }
.private-login-layout .form-floating > label { color: #556773; }
.private-login-layout .form-floating > .form-control:focus, .private-login-layout .otp-input:focus { border-color: var(--private-brand); background: #fff; box-shadow: 0 0 0 3px #00b0bc24; }
.private-login-layout .btn-primary { background: var(--private-brand); color: #07383c; border: 1px solid var(--private-brand); border-radius: 10px; min-height: 50px; font-weight: 700; box-shadow: 0 4px 10px #00b0bc15; }
.private-login-layout .btn-primary:hover, .private-login-layout .btn-primary:active { background: #009eaa; border-color: #009eaa; color: #052b2e; transform: none; box-shadow: 0 5px 16px #00b0bc24; }
.private-login-layout .btn-primary:disabled { background: #d5ecee; border-color: #d5ecee; color: #4b686b; opacity: 1; }
.private-login-layout .btn-outline-secondary { border-color: #ccdce0; color: #45616a; border-radius: 10px; }
.private-login-layout .btn-outline-secondary:hover { background: #eff7f7; color: #16454b; }
.private-login-layout .timer-badge { background: #eef9f9; color: var(--private-teal); }
.private-login-layout .timer-badge.expired { background: #fff3cd; color: #856404; }
.private-sale-guide { margin: 0 36px; padding: 24px 0 28px; border-top: 1px solid #e4edef; color: #344955; }
.private-sale-guide-label { display: block; color: #627680; font-size: .76rem; margin-bottom: 5px; }
.private-sale-guide h2 { font-size: 1.05rem; font-weight: 700; margin: 0 0 12px; color: var(--private-ink); }
.private-sale-entry-notes { padding-inline-start: 18px; margin: 0; font-size: .86rem; line-height: 1.95; }
.private-sale-entry-notes li + li { margin-top: 6px; }
.private-sale-entry-notes li::marker { color: var(--private-teal); }
.private-sale-guide-content { padding-top: 22px; }
.private-sale-guide h3 { font-size: .95rem; font-weight: 700; margin: 0 0 12px; color: var(--private-ink); }
.private-sale-car-list { display: grid; grid-template-columns: 1fr; gap: 0; padding: 0; margin: 0; list-style: none; }
.private-sale-car-list li { display: flex; align-items: center; gap: 12px; padding: 9px 0; font-size: .9rem; line-height: 1.8; }
.private-sale-car-list li + li { border-top: 1px solid #f0f4f5; }
.private-sale-car-list i { color: var(--private-teal); flex-shrink: 0; font-size: 1rem; }
.private-sale-circular { padding-top: 18px; }
.private-sale-circular p, .private-sale-support p { font-size: .85rem; line-height: 1.95; margin: 0; }
.private-sale-guide-button { display: flex; justify-content: center; align-items: center; gap: 8px; min-height: 46px; padding: 10px 20px; margin-top: 12px; border: 1px solid #afd7db; background: #f6fcfc; border-radius: 10px; color: var(--private-teal); text-decoration: none; font-weight: 700; }
.private-sale-guide-button:hover { background: #e6f6f7; border-color: var(--private-brand); color: #00575e; }
.private-login-layout a:focus-visible, .private-login-layout button:focus-visible { outline: 3px solid var(--private-teal); outline-offset: 3px; box-shadow: none; }
.private-sale-support { display: flex; gap: 10px; align-items: flex-start; margin-top: 20px; color: #61747f; }
.private-sale-support > i { color: var(--private-teal); font-size: 1.2rem; }
.private-sale-support a { display: inline-block; color: var(--private-teal); font-weight: 700; text-underline-offset: 4px; white-space: nowrap; }
@media (max-width: 576px) {
    .private-login-page { padding: 16px 12px; }
    .private-login-layout .login-container { border-radius: 18px; }
    .private-login-layout .login-header { padding: 22px 22px 0; }
    .private-brand-row { margin-bottom: 22px; }
    .private-login-layout .login-header h1 { font-size: 1.4rem; }
    .private-login-layout .login-body { padding: 22px; }
    .private-sale-guide { margin-inline: 22px; padding: 20px 0 24px; }
}
@media (prefers-reduced-motion: reduce) {
    .private-login-layout *, .private-login-layout *::before, .private-login-layout *::after { animation: none !important; transition: none !important; }
}
