/* MacherTV Responsive Enhancements — 100% Mobile First */

/* ── Safe area (notch, home indicator) ── */
.mtv-dashboard-content { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
.mtv-bottom-nav { padding-bottom: max(0.5rem, env(safe-area-inset-bottom)); }
.mtv-navbar { padding-left: max(1rem, env(safe-area-inset-left)); padding-right: max(1rem, env(safe-area-inset-right)); }
.mtv-topbar { padding-left: max(1rem, env(safe-area-inset-left)); padding-right: max(1rem, env(safe-area-inset-right)); }

/* ── Navbar: touch-friendly toggler ── */
.mtv-navbar .navbar-toggler { min-width: 44px; min-height: 44px; padding: 0.5rem; display: inline-flex; align-items: center; justify-content: center; }

/* ── Offcanvas: nav items 48px on mobile ── */
@media (max-width: 991.98px) {
    .mtv-offcanvas-link { min-height: 48px; padding: 0.75rem 0.5rem; }
    .mtv-offcanvas-sub .mtv-offcanvas-link { min-height: 44px; padding-left: 1.25rem; }
    .mtv-offcanvas-toggle { min-height: 48px; padding: 0.75rem 0.5rem; }
}
/* ── Alerts: dismiss button touch target ── */
.mtv-alert .btn-close { min-width: 44px; min-height: 44px; padding: 0.5rem; }
/* ── Auth: password toggle touch target ── */
@media (max-width: 991.98px) {
    .auth-card .mtv-password-toggle { min-width: 44px; min-height: 44px; padding: 0.5rem; display: inline-flex; align-items: center; justify-content: center; }
}

/* ── Auth: mobile-first padding & safe area ── */
.auth-wrapper {
    padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
}
@media (max-width: 575.98px) {
    .auth-card { padding: 1.5rem 1.25rem; }
    .auth-card h2 { font-size: 1.35rem; }
}
@media (max-width: 767.98px) {
    .mtv-cta-section--dark { padding: var(--space-6) 0; }
    .mtv-cta-section-title { font-size: 1.35rem; }
    .mtv-hero-title-custom { font-size: 1.5rem; }
}
@media (max-width: 575.98px) {
    .mtv-hero-title-custom { font-size: 1.35rem; }
    .mtv-hero-lead-custom { font-size: 1rem; }
}

/* ── Konfigurator: Safe-Area + Touch-Targets ── */
.cfg-topbar {
    padding-left: max(1rem, env(safe-area-inset-left));
    padding-right: max(1rem, env(safe-area-inset-right));
}
@media (max-width: 991.98px) {
    .cfg-topbar__close,
    .cfg-topbar__help { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 0.5rem; }
}
/* Footer links: touch-friendly on mobile */
@media (max-width: 991.98px) {
    .mtv-footer a:not(.btn) { min-height: 44px; display: inline-flex; align-items: center; }
    .mtv-footer li a { padding: 0.25rem 0; }
}
.mtv-back-link { min-height: 44px; display: inline-flex; align-items: center; }

/* ── Global touch targets (44px minimum) ── */
@media (max-width: 991.98px) {
    .btn:not(.btn-sm):not(.btn-lg) { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
    .btn-sm { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 0.5rem 0.75rem; }
    .mtv-empty-state .btn { min-height: 44px; padding: 0.6rem 1.25rem; }
    .mtv-content-card-header .btn-sm { min-height: 44px; min-width: 44px; }
    .form-control, .form-select { min-height: 44px; }
    .form-check-input { width: 1.25em; height: 1.25em; margin-top: 0.15em; }
    .form-check-label { min-height: 44px; display: inline-flex; align-items: center; padding-left: 0.5rem; }
    .mtv-sidebar-link { min-height: 48px; padding: 0.75rem 1rem; display: flex; align-items: center; }
    .mtv-bottom-nav-item { min-height: 48px; padding: 0.5rem 0.25rem; flex-direction: column; justify-content: center; gap: 0.2rem; }
    .dropdown-item { min-height: 44px; display: flex; align-items: center; }
    a.d-flex[href]:not(.btn) { min-height: 44px; }
}

/* Mobile: Stack analytics charts vertically */
@media (max-width: 767.98px) {
    .mtv-content-card-body .d-flex.align-items-end { height: 100px !important; }
    .mtv-content-card-body .table-responsive { font-size: 0.8rem; }

    /* Newsletter popup: full-screen on mobile */
    .modal-dialog { margin: 0; max-width: 100%; min-height: 100vh; }
    .modal-content { border-radius: 0; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; }

    /* Touch targets: min 44px (reinforced) */
    .btn, .btn-sm { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
    .form-check-input { width: 1.25em; height: 1.25em; }

    /* CRM tabs become stacked on mobile */
    .nav-tabs { flex-direction: column; border-bottom: none; }
    .nav-tabs .nav-link { border: 1px solid var(--mtv-border-light, #dee2e6); border-radius: var(--mtv-radius-sm, 0.375rem); margin-bottom: 0.25rem; }
    .nav-tabs .nav-link.active { background: var(--mtv-color-primary-50, #EFF6FF); }
}

/* Tablet adjustments */
@media (min-width: 768px) and (max-width: 1023.98px) {
    .mtv-content-card-body .d-flex.align-items-end { height: 120px !important; }
}

/* KPI cards responsive */
@media (max-width: 575.98px) {
    .col-6.col-md-3 .fs-4, .col-6.col-md-4 .fs-5 { font-size: 1.1rem !important; }
}

/* Empty state CTA: always touch-friendly */
.mtv-empty-state-cta { min-height: 44px; padding: 0.6rem 1.25rem; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; border-radius: var(--mtv-radius, 8px); }

/* List and table rows: easier tap on mobile */
@media (max-width: 991.98px) {
    .list-group-item-action { min-height: 44px; display: flex; align-items: center; }
    .table tbody tr { cursor: default; }
    .table tbody tr .btn-sm { min-height: 44px; min-width: 44px; }
}
/* Content card: consistent mobile padding */
@media (max-width: 767.98px) {
    .mtv-content-card-header { padding: 0.75rem 1rem; }
    .mtv-content-card-body { padding: 1rem; min-block-size: 0; }
}

/* ── Utility Classes (replace inline styles) ── */
.mtv-text-2xs { font-size: 0.7rem; }
.mtv-text-xs { font-size: 0.75rem; }
.mtv-text-sm { font-size: 0.82rem; }
.mtv-text-base { font-size: 1rem; }
.mtv-text-primary { color: var(--mtv-primary); }
.mtv-text-accent { color: var(--mtv-accent); }
.mtv-text-muted { color: var(--mtv-text-muted); }
.mtv-max-640 { max-width: 640px; margin-inline: auto; }
.mtv-max-720 { max-width: 720px; margin-inline: auto; }
.mtv-max-960 { max-width: 960px; margin-inline: auto; }
.bg-primary-subtle { background: var(--mtv-bg-primary-subtle); }
.bg-primary-hover { background: var(--mtv-bg-primary-hover); }
.mtv-focus-ring:focus-visible { box-shadow: var(--mtv-focus-ring); outline: none; }

/* ── Tab Navigation ── */
.mtv-tabs-nav {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--mtv-border-light, #E8ECF4);
    margin-bottom: 1rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.mtv-tabs-nav::-webkit-scrollbar { display: none; }
.mtv-tabs-btn {
    padding: .625rem 1rem;
    font-size: .875rem;
    font-weight: 500;
    color: var(--mtv-text-muted, #64748B);
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    white-space: nowrap;
    cursor: pointer;
    transition: color .2s, border-color .2s;
}
.mtv-tabs-btn:hover { color: var(--mtv-text-dark, #0F172A); }
.mtv-tabs-btn--active {
    color: var(--mtv-primary, #233DFF);
    border-bottom-color: var(--mtv-primary, #233DFF);
    font-weight: 600;
}
@media (max-width: 767.98px) {
    .mtv-tabs-btn { padding: .5rem .75rem; font-size: .8rem; }
    .mtv-tabs-nav {
        mask-image: linear-gradient(to right, black 90%, transparent 100%);
        -webkit-mask-image: linear-gradient(to right, black 90%, transparent 100%);
    }
}

/* ── Mobile Card-Transformation ── */
@media (max-width: 767.98px) {
    .mtv-table-cards thead { display: none; }
    .mtv-table-cards tbody tr {
        display: block;
        background: var(--mtv-bg-card, #fff);
        border: 1px solid var(--mtv-border-light, #E8ECF4);
        border-radius: var(--mtv-radius, 8px);
        padding: .75rem 1rem;
        margin-bottom: .5rem;
        box-shadow: var(--mtv-shadow-sm);
    }
    .mtv-table-cards tbody td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: .25rem 0;
        border: none;
        font-size: .875rem;
    }
    .mtv-table-cards tbody td::before {
        content: attr(data-label);
        font-weight: 600;
        font-size: .75rem;
        color: var(--mtv-text-muted);
        text-transform: uppercase;
        letter-spacing: .3px;
        flex-shrink: 0;
        margin-right: .75rem;
    }
    .mtv-table-cards tbody td:first-child { font-weight: 600; }
    .mtv-table-cards tbody td:last-child { border-bottom: none; }
}

/* ── Skeleton Loader ── */
.mtv-skeleton {
    background: linear-gradient(90deg, var(--mtv-gray-100, #F3F4F6) 25%, var(--mtv-gray-200, #E5E7EB) 50%, var(--mtv-gray-100, #F3F4F6) 75%);
    background-size: 200% 100%;
    animation: mtv-skeleton-pulse 1.5s ease-in-out infinite;
    border-radius: var(--mtv-radius-sm, 4px);
}
.mtv-skeleton--text { height: 1rem; width: 60%; margin-bottom: .5rem; }
.mtv-skeleton--text-sm { height: .75rem; width: 40%; margin-bottom: .375rem; }
.mtv-skeleton--card { height: 80px; border-radius: var(--mtv-radius, 8px); margin-bottom: .5rem; }
.mtv-skeleton--stat { height: 52px; border-radius: var(--mtv-radius, 8px); }
.mtv-skeleton--row { height: 44px; margin-bottom: .25rem; border-radius: var(--mtv-radius-sm, 4px); }
.mtv-skeleton--circle { width: 40px; height: 40px; border-radius: 50%; }

@keyframes mtv-skeleton-pulse {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

[data-theme="dark"] .mtv-skeleton {
    background: linear-gradient(90deg, var(--mtv-gray-800, #1F2937) 25%, var(--mtv-gray-700, #374151) 50%, var(--mtv-gray-800, #1F2937) 75%);
    background-size: 200% 100%;
}

/* ── Empty State (responsive) ── */
.mtv-empty-state {
    text-align: center;
    padding: 2rem 1rem;
    color: var(--mtv-text-muted);
}
.mtv-empty-state-icon {
    font-size: 2.5rem;
    margin-bottom: .75rem;
    opacity: .4;
}
.mtv-empty-state-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--mtv-text-dark);
    margin-bottom: .25rem;
}
.mtv-empty-state-text {
    font-size: .875rem;
    margin-bottom: 1rem;
}

/* ── Sticky Table Headers ── */
@media (min-width: 768px) {
    .mtv-table-sticky thead th {
        position: sticky;
        top: 0;
        background: var(--mtv-bg-white, #fff);
        z-index: 10;
        box-shadow: 0 1px 0 var(--mtv-border-light, #E8ECF4);
    }
    [data-theme="dark"] .mtv-table-sticky thead th {
        background: var(--mtv-bg-dark, #1e293b);
    }
}

/* Print styles */
@media print {
    .mtv-navbar, .mtv-sidebar, .mtv-cookie-banner, .mtv-bottom-nav, .btn, form { display: none !important; }
    .mtv-content-card { break-inside: avoid; box-shadow: none; border: 1px solid #ddd; }
}