/* ========================================
   MOBILE OPTIMIZATIONS - iPhone 13 Pro
   VERSION: 2024-12-19 - RADIKALE LÖSUNG
   ======================================== */

/* WICHTIG: Exakt die gleichen Styles wie Desktop-Version */
/* Nur Layout-Optimierungen, keine Farbänderungen */
/* Dark Mode wurde komplett deaktiviert */

/* RADIKALE LÖSUNG: Alle CSS-basierten Header-Korrekturen entfernt - wird durch JavaScript ersetzt */

/* ULTRA-SPEZIFISCHE REGEL: Alle Verzugszinsentabellen explizit ausschließen */
.card .table-responsive .table.table-sm thead th,
.card .table.table-sm thead th,
.table.table-sm thead th {
    font-size: inherit !important;
}

.card .table-responsive .table.table-sm thead th::after,
.card .table.table-sm thead th::after,
.table.table-sm thead th::after {
    content: none !important;
}

.card .table-responsive .table.table-sm thead th::before,
.card .table.table-sm thead th::before,
.table.table-sm thead th::before {
    content: none !important;
}

/* Tablet-Version - Gleiche Einstellungen wie Handy */
@media (min-width: 768px) and (max-width: 1024px) {
    /* Gleiche Header-Anpassungen wie Handy */
    .abrechnung-liste-container {
        padding-top: 60px !important;
    }
    
    .liste-header {
        margin-top: 10px !important;
    }
    
    .header-content {
        padding-top: 5px !important;
    }
    
    .page-header, .content-header, .section-header {
        margin-top: 10px !important;
    }
    
    /* Gleiche Tabellen-Header-Korrekturen wie Handy - NUR für Abrechnungsliste */
    /* ENTFERNT: Alle CSS-basierten Header-Korrekturen werden durch JavaScript ersetzt */
    
    /* Gleiche Spalten-Sichtbarkeit wie Handy - NUR für Abrechnungsliste */
    .abrechnung-liste-container .col-notizen,
    .abrechnung-liste-container .col-aufgaben,
    .abrechnung-liste-container .table-modern th.col-notizen,
    .abrechnung-liste-container .table-modern th.col-aufgaben,
    .abrechnung-liste-container .table-modern td.col-notizen,
    .abrechnung-liste-container .table-modern td.col-aufgaben,
    /* Aktionen ist jetzt Spalte 1, Notizen ist Spalte 2, Aufgaben ist Spalte 3 */
    .abrechnung-liste-container .table-modern thead th:nth-child(2),
    .abrechnung-liste-container .table-modern thead th:nth-child(3),
    .abrechnung-liste-container .table-modern tbody td:nth-child(2),
    .abrechnung-liste-container .table-modern tbody td:nth-child(3),
    .abrechnung-liste-container .table-modern tfoot td:nth-child(2),
    .abrechnung-liste-container .table-modern tfoot td:nth-child(3) {
        display: table-cell !important;
        visibility: visible !important;
        opacity: 1 !important;
        min-width: 70px !important;
        width: 70px !important;
        max-width: 70px !important;
        overflow: visible !important;
        white-space: nowrap !important;
        position: relative !important;
        z-index: 10 !important;
        border: none !important;
        border-right: none !important;
        border-left: none !important;
        border-top: none !important;
        border-bottom: none !important;
    }
}

/* Querformat - iPhone 13 Pro im Querformat (430px-900px) */
@media (min-width: 431px) and (max-width: 900px) and (max-height: 430px) {
    /* Header-Bereich anpassen - Navbar verdeckt Header auch im Querformat */
    .abrechnung-liste-container {
        padding-top: 60px !important; /* Reduzierter Platz für Navbar */
    }
    
    .liste-header {
        margin-top: 10px !important; /* Reduzierter Abstand */
    }
    
    .header-content {
        padding-top: 5px !important; /* Reduzierter Abstand */
    }
    
    /* Navbar-Höhe kompensieren */
    .main-content {
        padding-top: 60px !important; /* Reduzierter Platz für Navbar */
    }
    
    .page-header, .content-header, .section-header {
        margin-top: 10px !important;
    }
    
    /* Gleiche Tabellen-Header-Korrekturen wie Handy - NUR für Abrechnungsliste */
    /* ENTFERNT: Alle CSS-basierten Header-Korrekturen werden durch JavaScript ersetzt */
    
    /* Gleiche Spalten-Sichtbarkeit wie Handy - NUR für Abrechnungsliste */
    .abrechnung-liste-container .col-notizen,
    .abrechnung-liste-container .col-aufgaben,
    .abrechnung-liste-container .table-modern th.col-notizen,
    .abrechnung-liste-container .table-modern th.col-aufgaben,
    .abrechnung-liste-container .table-modern td.col-notizen,
    .abrechnung-liste-container .table-modern td.col-aufgaben,
    /* Aktionen ist jetzt Spalte 1, Notizen ist Spalte 2, Aufgaben ist Spalte 3 */
    .abrechnung-liste-container .table-modern thead th:nth-child(2),
    .abrechnung-liste-container .table-modern thead th:nth-child(3),
    .abrechnung-liste-container .table-modern tbody td:nth-child(2),
    .abrechnung-liste-container .table-modern tbody td:nth-child(3),
    .abrechnung-liste-container .table-modern tfoot td:nth-child(2),
    .abrechnung-liste-container .table-modern tfoot td:nth-child(3) {
        display: table-cell !important;
        visibility: visible !important;
        opacity: 1 !important;
        min-width: 70px !important;
        width: 70px !important;
        max-width: 70px !important;
        overflow: visible !important;
        white-space: nowrap !important;
        position: relative !important;
        z-index: 10 !important;
        border: none !important;
        border-right: none !important;
        border-left: none !important;
        border-top: none !important;
        border-bottom: none !important;
    }
}

/* Handy-Version - iPhone 13 Pro (max-width: 430px) */
@media (max-width: 430px) {
    /* Header-Bereich anpassen - Navbar verdeckt Header */
    .abrechnung-liste-container {
        padding-top: 60px !important; /* Reduzierter Platz für Navbar */
    }
    
    .liste-header {
        margin-top: 10px !important; /* Reduzierter Abstand */
    }
    
    .header-content {
        padding-top: 5px !important; /* Reduzierter Abstand */
    }
    
    /* Navbar-Höhe kompensieren */
    .main-content {
        padding-top: 60px !important; /* Reduzierter Platz für Navbar */
    }
    
    .page-header, .content-header, .section-header {
        margin-top: 10px !important;
    }
    
    /* Gleiche Tabellen-Header-Korrekturen wie Handy - NUR für Abrechnungsliste */
    /* ENTFERNT: Alle CSS-basierten Header-Korrekturen werden durch JavaScript ersetzt */
    
    /* Gleiche Spalten-Sichtbarkeit wie Handy - NUR für Abrechnungsliste */
    .abrechnung-liste-container .col-notizen,
    .abrechnung-liste-container .col-aufgaben,
    .abrechnung-liste-container .table-modern th.col-notizen,
    .abrechnung-liste-container .table-modern th.col-aufgaben,
    .abrechnung-liste-container .table-modern td.col-notizen,
    .abrechnung-liste-container .table-modern td.col-aufgaben,
    /* Aktionen ist jetzt Spalte 1, Notizen ist Spalte 2, Aufgaben ist Spalte 3 */
    .abrechnung-liste-container .table-modern thead th:nth-child(2),
    .abrechnung-liste-container .table-modern thead th:nth-child(3),
    .abrechnung-liste-container .table-modern tbody td:nth-child(2),
    .abrechnung-liste-container .table-modern tbody td:nth-child(3),
    .abrechnung-liste-container .table-modern tfoot td:nth-child(2),
    .abrechnung-liste-container .table-modern tfoot td:nth-child(3) {
        display: table-cell !important;
        visibility: visible !important;
        opacity: 1 !important;
        min-width: 70px !important;
        width: 70px !important;
        max-width: 70px !important;
        overflow: visible !important;
        white-space: nowrap !important;
        position: relative !important;
        z-index: 10 !important;
        border: none !important;
        border-right: none !important;
        border-left: none !important;
        border-top: none !important;
        border-bottom: none !important;
    }
}

/* Touch-Optimierungen für alle mobilen Geräte */
@media (max-width: 1024px) {
    /* Touch-Targets vergrößern */
    .btn {
        min-height: 44px !important;
        min-width: 44px !important;
        padding: 12px 16px !important;
    }
    
    .btn-sm {
        min-height: 36px !important;
        min-width: 36px !important;
        padding: 8px 12px !important;
    }
    
    /* Scroll-Verhalten optimieren */
    .table-responsive {
        -webkit-overflow-scrolling: touch !important;
        overflow-x: auto !important;
    }
    
    /* Lesbarkeit verbessern */
    .table th, .table td {
        padding: 12px 8px !important;
        font-size: 14px !important;
        line-height: 1.4 !important;
    }
    
    /* Formulare optimieren */
    .form-control {
        font-size: 16px !important; /* Verhindert Zoom auf iOS */
        padding: 12px !important;
        border-radius: 8px !important;
    }
    
    .form-label {
        font-size: 14px !important;
        font-weight: 600 !important;
        margin-bottom: 8px !important;
    }
    
    /* Checkboxen und Radio-Buttons vergrößern */
    .form-check-input {
        width: 20px !important;
        height: 20px !important;
    }
    
    .form-check-label {
        font-size: 14px !important;
        padding-left: 8px !important;
    }
    
    /* Alerts optimieren */
    .alert {
        padding: 16px !important;
        margin-bottom: 16px !important;
        border-radius: 8px !important;
    }
    
    /* Badges optimieren */
    .badge {
        font-size: 12px !important;
        padding: 6px 10px !important;
    }
    
    /* Progress Bars optimieren */
    .progress {
        height: 12px !important;
        border-radius: 6px !important;
    }
    
    /* Spinner optimieren */
    .spinner-border {
        width: 24px !important;
        height: 24px !important;
    }
    
    /* Tooltips optimieren */
    .tooltip {
        font-size: 12px !important;
    }
    
    /* Dropdowns optimieren */
    .dropdown-menu {
        border-radius: 8px !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
    }
    
    .dropdown-item {
        padding: 12px 16px !important;
        font-size: 14px !important;
    }
    
    /* Pagination optimieren */
    .pagination {
        justify-content: center !important;
    }
    
    .page-link {
        padding: 12px 16px !important;
        font-size: 14px !important;
        border-radius: 6px !important;
        margin: 0 2px !important;
    }
    
    /* Breadcrumbs optimieren */
    .breadcrumb {
        font-size: 14px !important;
        padding: 12px 0 !important;
    }
    
    .breadcrumb-item {
        padding: 0 4px !important;
    }
    
    /* Accordions optimieren */
    .accordion-button {
        padding: 16px !important;
        font-size: 14px !important;
    }
    
    .accordion-body {
        padding: 16px !important;
    }
    
    /* Carousels optimieren */
    .carousel-control-prev,
    .carousel-control-next {
        width: 50px !important;
        height: 50px !important;
    }
    
    /* Safe Area Support für iPhone */
    .container-fluid {
        padding-left: max(15px, env(safe-area-inset-left)) !important;
        padding-right: max(15px, env(safe-area-inset-right)) !important;
    }
    
    /* Performance-Optimierungen */
    * {
        -webkit-tap-highlight-color: transparent !important;
    }
    
    .table {
        will-change: transform !important;
    }
}

/* Login/Registration Cards - Vollbild auf kleinen Displays */
@media (max-width: 430px) {
    .login-card, .registration-card {
        margin: 0 !important;
        border-radius: 0 !important;
        min-height: 100vh !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }
    
    .login-card .card-body, .registration-card .card-body {
        padding: 2rem !important;
    }
    
    /* Zusätzlich: Alle Card-Elemente auf kleinen Displays optimieren */
    .card {
        margin: 0 !important;
        border-radius: 0 !important;
    }
    
    .card-body {
        padding: 1.5rem !important;
    }
    
    /* Spezifische Regeln für Login/Registration Seiten */
    .container.mt-5 .card {
        min-height: 100vh !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }
    
    .container.mt-5 .card-body {
        padding: 2rem !important;
        flex: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }
    
    /* ULTRA-SPEZIFISCHE REGEL: Login/2FA/Registration Vollbild */
    /* Login und 2FA (mit .container.mt-5) */
    body .container.mt-5 .row .col-md-6 .card {
        margin: 0 !important;
        border-radius: 0 !important;
        min-height: 100vh !important;
        height: 100vh !important;
        width: 100vw !important;
        max-width: 100vw !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        z-index: 1000 !important;
    }
    
    body .container.mt-5 .row .col-md-6 .card-header {
        border-radius: 0 !important;
        flex-shrink: 0 !important;
    }
    
    body .container.mt-5 .row .col-md-6 .card-body {
        padding: 2rem !important;
        flex: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }
    
    body .container.mt-5 .row .col-md-6 .card-footer {
        border-radius: 0 !important;
        flex-shrink: 0 !important;
    }
    
    /* Registrierung (ohne .container.mt-5) */
    body .row.justify-content-center .col-md-6.col-lg-4 .card {
        margin: 0 !important;
        border-radius: 0 !important;
        min-height: 100vh !important;
        height: 100vh !important;
        width: 100vw !important;
        max-width: 100vw !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        z-index: 1000 !important;
    }
    
    body .row.justify-content-center .col-md-6.col-lg-4 .card-header {
        border-radius: 0 !important;
        flex-shrink: 0 !important;
    }
    
    body .row.justify-content-center .col-md-6.col-lg-4 .card-body {
        padding: 2rem !important;
        flex: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }
    
    body .row.justify-content-center .col-md-6.col-lg-4 .card-footer {
        border-radius: 0 !important;
        flex-shrink: 0 !important;
    }
}

/* Exakt die gleichen Styles wie Desktop-Version - Keine Farbänderungen */
/* Alle Farb-Überschreibungen entfernt - Desktop-Styles werden verwendet */

/* Button-Styles entfernt - Django-Blau wird verwendet */

/* DARK MODE SUPPORT - DEAKTIVIERT */
/* Alle Dark Mode Regeln wurden entfernt */