/**
 * ATIKASS Form — Responsive Breakpoints
 */

/* ── Loading screen override — must be in the LAST CSS file ── */
.atkf-page-loader { display: none !important; }

/* ═══ Tablet (≤1100px) ═══════════════════════ */
@media (max-width: 1100px) {
    .atkf-layout { grid-template-columns: 260px 1fr; }
    .atkf-sidebar-right { display: none; }
    .atkf-form-center { padding-bottom: 80px; }

    .atkf-mobile-cta {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 50;
        background: var(--atkf-white);
        border-top: 1px solid var(--atkf-border);
        box-shadow: 0 -4px 20px rgba(26,27,58,0.08);
        padding: 10px 16px;
        padding-bottom: max(10px, env(safe-area-inset-bottom));
    }
    .atkf-mobile-cta__inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        max-width: 600px;
        margin: 0 auto;
    }
    .atkf-mobile-cta__text { display: flex; flex-direction: column; }
    .atkf-mobile-cta__text strong { font-size: 0.85rem; color: var(--atkf-text); }
    .atkf-mobile-cta__text span   { font-size: 0.7rem; color: var(--atkf-text-muted); }

    .atkf-btn--cta-mobile {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 10px 20px;
        background: var(--atkf-gradient) !important;
        color: #fff !important;
        font-family: inherit;
        font-size: 0.88rem;
        font-weight: 700;
        border: none;
        border-radius: var(--atkf-radius-sm);
        cursor: pointer;
        text-decoration: none !important;
        transition: var(--atkf-transition);
        white-space: nowrap;
    }
    .atkf-btn--cta-mobile:hover,
    .atkf-btn--cta-mobile:focus,
    .atkf-btn--cta-mobile:active,
    .atkf-btn--cta-mobile:visited {
        color: #fff !important;
        text-decoration: none !important;
    }
    .atkf-btn--cta-mobile:hover {
        box-shadow: 0 4px 16px rgba(108,60,224,0.3);
    }
}

/* ═══ Mobile (≤768px) ════════════════════════ */
@media (max-width: 768px) {
    .atkf-layout {
        display: flex;
        flex-direction: column;
        min-height: auto;
    }
    .atkf-sidebar-left  { display: none; }
    .atkf-sidebar-right { display: none; }

    /* Show mobile elements */
    .atkf-topbar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 16px;
        background: var(--atkf-white);
        border-bottom: 1px solid var(--atkf-border);
        position: sticky;
        top: 0;
        z-index: 50;
    }
    .atkf-topbar__logo {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 1.05rem;
        font-weight: 800;
        color: var(--atkf-primary);
    }
    .atkf-topbar__phone {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: var(--atkf-primary-bg);
        color: var(--atkf-primary);
        text-decoration: none;
        transition: var(--atkf-transition);
    }
    .atkf-topbar__phone:hover,
    .atkf-topbar__phone:focus,
    .atkf-topbar__phone:active { background: var(--atkf-primary) !important; color: #fff !important; }
    .atkf-topbar__phone:visited { color: var(--atkf-primary) !important; }

    /* Mobile stepper */
    .atkf-mobile-stepper {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 14px 16px;
        background: var(--atkf-white);
        border-bottom: 1px solid var(--atkf-border);
    }
    .atkf-mobile-stepper__bar {
        flex: 1;
        height: 6px;
        background: var(--atkf-border);
        border-radius: 3px;
        overflow: hidden;
    }
    .atkf-mobile-stepper__fill {
        height: 100%;
        width: 25%;
        background: var(--atkf-gradient);
        border-radius: 3px;
        transition: width 0.4s var(--atkf-ease);
    }
    .atkf-mobile-stepper__text {
        font-size: 0.72rem;
        font-weight: 600;
        color: var(--atkf-text-muted);
        white-space: nowrap;
    }

    /* Form */
    .atkf-form-center { padding: 16px 16px 100px; }
    .atkf-form-card {
        border-radius: var(--atkf-radius-lg);
        padding: 24px 20px 20px;
        box-shadow: var(--atkf-shadow-sm);
    }
    .atkf-step__title    { font-size: 1.2rem; }
    .atkf-step__subtitle { font-size: 0.82rem; margin-bottom: 20px; }
    .atkf-insurance-grid { grid-template-columns: 1fr; gap: 8px; }
    .atkf-profile-choice { grid-template-columns: 1fr; gap: 10px; }
    .atkf-profile-card__inner { padding: 18px 16px; }
    .atkf-profile-card__icon  { width: 48px; height: 48px; }
    .atkf-profile-card__icon svg { width: 28px; height: 28px; }
    .atkf-form-row       { grid-template-columns: 1fr; gap: 0; }
    .atkf-step__actions   { margin-top: 24px; }
    .atkf-btn             { padding: 12px 20px; font-size: 0.88rem; }
    .atkf-btn--submit     { min-width: unset; flex: 1; }

    /* Mobile CTA */
    .atkf-mobile-cta {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 50;
        background: var(--atkf-white);
        border-top: 1px solid var(--atkf-border);
        box-shadow: 0 -4px 20px rgba(26,27,58,0.08);
        padding: 10px 16px;
        padding-bottom: max(10px, env(safe-area-inset-bottom));
    }
    .atkf-mobile-cta__inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }
    .atkf-mobile-cta__text { display: flex; flex-direction: column; }
    .atkf-mobile-cta__text strong { font-size: 0.85rem; color: var(--atkf-text); }
    .atkf-mobile-cta__text span   { font-size: 0.7rem; color: var(--atkf-text-muted); }

    .atkf-btn--cta-mobile {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 10px 20px;
        background: var(--atkf-gradient) !important;
        color: #fff !important;
        font-family: inherit;
        font-size: 0.88rem;
        font-weight: 700;
        border: none;
        border-radius: var(--atkf-radius-sm);
        cursor: pointer;
        text-decoration: none !important;
        transition: var(--atkf-transition);
        white-space: nowrap;
    }
    .atkf-btn--cta-mobile:hover,
    .atkf-btn--cta-mobile:focus,
    .atkf-btn--cta-mobile:active,
    .atkf-btn--cta-mobile:visited {
        color: #fff !important;
        text-decoration: none !important;
    }
    .atkf-btn--cta-mobile:hover { box-shadow: 0 4px 16px rgba(108,60,224,0.3); }

    .atkf-overlay__card { padding: 32px 24px; }
}

/* ═══ Small phones (≤400px) ══════════════════ */
@media (max-width: 400px) {
    .atkf-form-center { padding: 12px 10px 100px; }
    .atkf-form-card   { padding: 20px 16px 16px; }
    .atkf-step__title { font-size: 1.1rem; }
    .atkf-insurance-card { padding: 10px 12px; }
    .atkf-insurance-card__name { font-size: 0.76rem; }
    .atkf-profile-card__inner { padding: 14px 14px; gap: 12px; }
    .atkf-profile-card__icon  { width: 42px; height: 42px; }
    .atkf-profile-card__icon svg { width: 24px; height: 24px; }
    .atkf-phone-prefix { padding: 0 8px; font-size: 0.82rem; }
}
