/* صفحه انتخاب شرکت — global (LoginLayout + App.razor)
   مطابق UI Kit → components/CompanySelect (Web/UI Design Afrandeh As Claude):
   زمینه تابع تم است (کرم در روشن، تیره در تیره) — نه زمینه‌ی تیره‌ی ثابت زیر کارت روشن —
   و کارت به‌اندازه‌ی کافی مات است که روی همان زمینه خوانا باشد. فقط توکن‌های --afr-*. */

.login-layout-root {
    min-height: 100vh;
    min-height: 100dvh;
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
    background: radial-gradient(circle at 50% 40%, var(--afr-surface) 0%, var(--afr-bg) 100%);
}

html[data-theme="dark"] .login-layout-root,
html.mud-theme-dark .login-layout-root,
.mud-theme-dark .login-layout-root {
    background: radial-gradient(circle at 50% 40%, var(--afr-surface-muted) 0%, var(--afr-bg) 100%);
}

.login-layout-content {
    position: relative;
    z-index: 2;
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: max(32px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(32px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
    box-sizing: border-box;
}

/* ── قاب: لوگو بالای یک کارت ─────────────────────────────── */
.company-page {
    position: relative;
    width: 100%;
    max-width: 420px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.company-page__logo {
    width: min(160px, 50vw);
    height: auto;
    object-fit: contain;
}

/* ربات افرنده (AfrMascot، UI Kit → components/Mascot): بیرون ستون صفحه، در RTL سمت چپ کارت، هم‌تراز پایین کارت.
   ستون ۴۲۰px می‌ماند؛ زیر ۹۰۰px خود AfrMascot ربات را پنهان می‌کند. */
.company-page__mascot {
    position: absolute;
    inset-inline-end: calc(100% + 24px);
    bottom: 0;
}

/* ── کارت ──────────────────────────────────────────────────── */
.company-card {
    position: relative;
    width: 100%;
    max-width: 420px;
    box-sizing: border-box;
    padding: 32px;
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(15px) saturate(1.5);
    -webkit-backdrop-filter: blur(15px) saturate(1.5);
    border: 1px solid var(--afr-border);
    border-radius: var(--afr-radius-xl, 20px);
    box-shadow: 0 0 40px 5px rgba(var(--afr-brand-primary-rgb), 0.14), 0 0 20px 2px rgba(var(--afr-brand-accent-rgb), 0.10);
    color: var(--afr-text);
    text-align: center;
}

html[data-theme="dark"] .company-card,
html.mud-theme-dark .company-card,
.mud-theme-dark .company-card {
    background: color-mix(in srgb, var(--afr-surface) 92%, transparent);
    border-color: rgba(255, 255, 255, 0.10);
    box-shadow: 0 16px 44px rgba(0, 0, 0, 0.45);
}

.company-card .company-card__help {
    position: absolute;
    top: 12px;
    inset-inline-end: 12px;
    color: var(--afr-text-muted);
}

.company-card .company-card__help:hover {
    background: var(--afr-nav-hover-bg);
    color: var(--afr-text);
}

.company-card__title {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.35;
    color: var(--afr-text);
}

.company-card__subtitle {
    margin: 6px 0 20px;
    font-size: 0.875rem;
    color: var(--afr-text-muted);
}

/* انتخاب فعلی — رنگ info با ۸٪، متن afr-text تا روی هر دو تم خوانا باشد (نه آبی روی آبی) */
.company-card__current {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    text-align: start;
    margin-bottom: 20px;
    padding: 12px 14px;
    border: 1px solid rgba(var(--afr-brand-info-rgb), 0.45);
    border-radius: var(--afr-radius-md);
    background: rgba(var(--afr-brand-info-rgb), 0.08);
    color: var(--afr-text);
    font-size: 0.875rem;
    line-height: 1.6;
    word-break: break-word;
}

.company-card__current .mud-icon-root {
    flex: none;
    margin-top: 2px;
    color: var(--afr-brand-info);
}

.company-card .company-card__alert {
    margin-bottom: 16px;
    text-align: start;
}

.company-card .company-card__progress {
    margin-bottom: 16px;
}

/* ── فیلدها: برچسب بالا و وسط‌چین، مقدار وسط‌چین ۶۰۰ ────────── */
.company-card__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 16px;
}

.company-card__field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    text-align: center;
    min-width: 0;
}

.company-card__field > label {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--afr-text-muted);
}

.company-card .company-card__input .mud-input-control,
.company-card .company-card__input.mud-input-control {
    margin: 0;
}

.company-card .company-card__input .mud-input.mud-input-outlined {
    min-height: 52px;
    background: rgba(0, 0, 0, 0.03);
    border-radius: var(--afr-radius-md);
}

html[data-theme="dark"] .company-card .company-card__input .mud-input.mud-input-outlined,
html.mud-theme-dark .company-card .company-card__input .mud-input.mud-input-outlined,
.mud-theme-dark .company-card .company-card__input .mud-input.mud-input-outlined {
    background: rgba(255, 255, 255, 0.04);
}

.company-card .company-card__input .mud-input-outlined-border {
    border-color: var(--afr-border-strong) !important; /* لبه‌ی فیلد ≥ 3:1 (afrandeh-a11y-fixes.css) */
    border-radius: var(--afr-radius-md) !important;
}

.company-card .company-card__input .mud-input:hover .mud-input-outlined-border {
    border-color: rgba(var(--afr-brand-primary-rgb), 0.55) !important;
}

.company-card .company-card__input .mud-input.mud-input-focused .mud-input-outlined-border {
    border-color: var(--afr-brand-primary) !important;
}

.company-card .company-card__input input,
.company-card .company-card__input .mud-select-input {
    color: var(--afr-text) !important;
    text-align: center;
    font-size: 1rem;
    font-weight: 600;
}

/* ── بازه‌ی سال مالی: کادر خط‌چین ───────────────────────────── */
.company-card__range {
    margin-top: 16px;
    padding: 12px;
    border: 1px dashed var(--afr-border);
    border-radius: var(--afr-radius-md);
    font-size: 0.8125rem;
    color: var(--afr-text-muted);
    word-break: break-word;
}

html[data-theme="dark"] .company-card__range,
html.mud-theme-dark .company-card__range,
.mud-theme-dark .company-card__range {
    border-color: rgba(255, 255, 255, 0.16);
}

/* ── تأیید: قرص گرادیانی صفحه‌ی ورود (مسی→قرمز در روشن، آبی→قرمز در تیره از خود توکن‌ها) ── */
.company-card .company-card__submit {
    gap: 8px;
    margin-top: 24px;
    min-height: var(--afr-touch-min, 44px);
    padding: 0.85rem 1rem;
    border-radius: var(--afr-radius-pill, 999px);
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--afr-brand-on-primary) !important;
    background: linear-gradient(90deg, var(--afr-fill-primary), var(--afr-fill-accent)) !important;
    box-shadow: none !important;
}

.company-card .company-card__submit:hover {
    filter: brightness(1.05);
}

.company-card .company-card__submit.mud-button-disabled {
    opacity: 0.65;
}

/* ── انصراف: پیوند متنی ─────────────────────────────────── */
.company-card__cancel {
    display: inline-block;
    margin-top: 14px;
    min-height: var(--afr-touch-min, 44px);
    padding: 6px 16px;
    border: 0;
    background: none;
    font: inherit;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--afr-tab-active-text);
    border-radius: var(--afr-radius-sm);
    cursor: pointer;
}

.company-card__cancel:hover,
.company-card__cancel:focus-visible {
    background: var(--afr-nav-hover-bg);
}

@media (max-width: 480px) {
    .company-card {
        padding: 24px 18px;
    }

    .company-card__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .login-layout-content {
        align-items: flex-start;
        padding-top: max(20px, env(safe-area-inset-top));
    }
}