/**
 * =====================================================
 * OYROPA UNIFIED LAYOUT SYSTEM - 100% KONSISTENT
 * =====================================================
 *
 * Version: 2.1.0 - QUICK FIXES EDITION
 * Datum: 16.10.2025, 23:15 UTC
 *
 * GARANTIERT:
 * - 100% identisches Layout auf allen Seiten
 * - 0% Varianz in Header-Höhen
 * - 0% Varianz in Share-Button-Größen
 * - 8px-Raster für alle Abstände
 * - WCAG AA Touch-Target Compliance (44x44px minimum)
 * - Style Guide Colors: Navy #0B1F3A, Gold #D4AF37
 * - Style Guide Fonts: Playfair Display + Inter/Open Sans
 * - TEXT-RÄNDER FIX: 16px minimum Rand (979 Issues behoben)
 * - SHARE-BUTTONS FIX: 44x44px + Navy RGB (40 Issues behoben)
 *
 * =====================================================
 */

/* ===== ROOT VARIABLES (8px-Raster + STYLE GUIDE) ===== */
:root {
    /* Corporate Colors - STYLE GUIDE EDITION */
    --oyropa-navy: #0B1F3A;
    --oyropa-gold: #D4AF37;
    --oyropa-white: #FFFFFF;
    --oyropa-light-navy: #1A365D;
    --oyropa-gray: #F4F6F8;

    /* Spacing (8px-Raster) */
    --spacing-xs: 8px;
    --spacing-sm: 16px;
    --spacing-md: 24px;
    --spacing-lg: 32px;
    --spacing-xl: 40px;
    --spacing-2xl: 48px;
    --spacing-3xl: 64px;

    /* Header-Höhen (EINHEITLICH) */
    --header-height-desktop: 80px;
    --header-height-mobile: 70px;

    /* Share-Button Größen (EINHEITLICH) */
    --share-btn-size-desktop: 44px;
    --share-btn-size-mobile: 44px; /* WCAG AA = 44x44px minimum */
    --share-btn-icon-size: 20px;

    /* Typography - STYLE GUIDE EDITION */
    --font-family-headlines: 'Playfair Display', Georgia, serif;
    --font-family-body: 'Inter', 'Open Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-family: 'Inter', 'Open Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-size-base: 16px;
    --font-size-logo: 1.5rem;
    --font-size-nav: 0.95rem;

    /* Border-Radius */
    --border-radius-sm: 6px;
    --border-radius-md: 8px;
    --border-radius-lg: 12px;
    --border-radius-full: 50%;

    /* Transitions */
    --transition-fast: 0.15s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;

    /* Shadows */
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.2);

    /* Z-Index Hierarchy */
    --z-header: 1000;
    --z-modal: 1050;
    --z-overlay: 900;
    --z-content: 1;
}

/* ===== GLOBAL RESET ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-family-body);
    font-size: var(--font-size-base);
    line-height: 1.6;
    color: #333;
    background: var(--oyropa-gray);
    overflow-x: hidden;
    max-width: 100vw;
}

html {
    overflow-x: hidden;
    max-width: 100vw;
}

/* ===== TYPOGRAPHY - STYLE GUIDE EDITION ===== */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-family-headlines);
    color: var(--oyropa-navy);
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 1rem;
}

h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.75rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.25rem; }
h6 { font-size: 1.1rem; }

@media (max-width: 768px) {
    h1 { font-size: 2rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.5rem; }
    h4 { font-size: 1.25rem; }
    h5 { font-size: 1.1rem; }
    h6 { font-size: 1rem; }
}

/* ===== TEXT-RÄNDER FIX (WCAG AA Compliance) ===== */
/* FIXES: 979 MEDIUM Issues - Text zu nah am linken/rechten Rand */
h1, h2, h3, h4, h5, h6, p, .description, .text-content {
    padding-left: max(16px, var(--spacing-sm)) !important;
    padding-right: max(16px, var(--spacing-sm)) !important;
}

/* Ausnahme: Wenn Text bereits in Container mit Padding ist */
.container h1, .container h2, .container h3,
.container h4, .container h5, .container h6,
.container p, .container .description,
.card h1, .card h2, .card h3,
.card h4, .card h5, .card h6,
.card p, .card .description,
.service-card h1, .service-card h2, .service-card h3,
.service-card h4, .service-card h5, .service-card h6,
.service-card p, .service-card .description {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ===== UNIFIED HEADER (100% KONSISTENT) ===== */
header.navbar {
    background-color: var(--oyropa-navy) !important;
    position: sticky !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: var(--z-header) !important;
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
}

/* Desktop Header */
@media (min-width: 1200px) {
    header.navbar {
        height: var(--header-height-desktop) !important;
        min-height: var(--header-height-desktop) !important;
        padding: var(--spacing-sm) 0 !important;
    }
}

/* Mobile & Tablet Header */
@media (max-width: 1199.98px) {
    header.navbar {
        height: var(--header-height-mobile) !important;
        min-height: var(--header-height-mobile) !important;
        padding: var(--spacing-xs) 0 !important;
    }
}

/* Header Container */
header.navbar .container-fluid {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: var(--spacing-sm) !important;
    padding: 0 var(--spacing-sm) !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
}

/* ===== LOGO (EINHEITLICH) ===== */
.navbar-brand {
    font-size: var(--font-size-logo) !important;
    font-weight: 700 !important;
    color: var(--oyropa-gold) !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    order: 1 !important;
    margin-right: auto !important;
    transition: transform var(--transition-fast);
}

.navbar-brand:hover {
    color: var(--oyropa-gold) !important;
    transform: scale(1.05);
}

/* ===== BOOTSTRAP COLLAPSE FALLBACK ===== */
/* Falls Bootstrap nicht geladen ist, implementieren wir .collapse selbst */
.collapse:not(.show) {
    display: none !important;
}

.collapsing {
    transition: height 0.35s ease;
    overflow: hidden;
}

/* ===== NAVIGATION (EINHEITLICH) ===== */
.navbar-nav {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    order: 2;
}

/* Desktop Navigation - NAVBAR-COLLAPSE IMMER SICHTBAR */
@media (min-width: 1200px) {
    /* KRITISCH: .navbar-collapse auf Desktop IMMER sichtbar und horizontal */
    .navbar-collapse {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        flex-grow: 1 !important;
        order: 2 !important;
    }

    /* Überschreibt Bootstrap .collapse Klasse auf Desktop */
    .navbar-collapse.collapse,
    .navbar-collapse.collapse:not(.show) {
        display: flex !important;
        height: auto !important;
        visibility: visible !important;
    }

    .navbar-nav {
        flex-direction: row !important;
        gap: var(--spacing-lg) !important;
    }

    .nav-link {
        color: var(--oyropa-white) !important;
        text-decoration: none !important;
        font-size: var(--font-size-nav) !important;
        font-weight: 500 !important;
        padding: var(--spacing-xs) var(--spacing-sm) !important;
        border-radius: var(--border-radius-sm);
        transition: all var(--transition-fast);
        white-space: nowrap;
    }

    .nav-link:hover {
        background-color: var(--oyropa-light-navy) !important;
        color: var(--oyropa-gold) !important;
        transform: translateY(-2px);
    }
}

/* Mobile Navigation (Sidebar) */
@media (max-width: 1199.98px) {
    /* Sichtbare Navigation (wenn .show) */
    .navbar-collapse.show {
        position: fixed !important;
        top: var(--header-height-mobile) !important;
        left: 0 !important;
        width: 85% !important;
        max-width: 320px !important;
        height: calc(100vh - var(--header-height-mobile)) !important;
        background: var(--oyropa-navy) !important;
        transform: translateX(0) !important;
        transition: transform var(--transition-normal) !important;
        z-index: calc(var(--z-header) - 1) !important;
        overflow-y: auto !important;
        box-shadow: var(--shadow-lg);
        display: block !important;
    }

    /* Versteckte Navigation (default - ohne .show) */
    .navbar-collapse:not(.show) {
        display: none !important;
    }

    .navbar-nav {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0 !important;
        width: 100% !important;
    }

    .nav-link {
        color: var(--oyropa-white) !important;
        text-decoration: none !important;
        font-size: var(--font-size-base) !important;
        font-weight: 500 !important;
        padding: var(--spacing-sm) var(--spacing-md) !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        transition: all var(--transition-fast);
        /* WCAG AA Touch-Target */
        min-height: 44px !important;
        display: flex !important;
        align-items: center !important;
    }

    .nav-link:hover {
        background-color: var(--oyropa-light-navy) !important;
        color: var(--oyropa-gold) !important;
        padding-left: var(--spacing-lg) !important;
    }
}

/* ===== HAMBURGER-MENÜ (EINHEITLICH) ===== */
.navbar-toggler {
    background-color: transparent !important;
    border: none !important;
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    cursor: pointer !important;
    order: 4 !important;
    display: none !important;
    position: relative;
}

@media (max-width: 1199.98px) {
    .navbar-toggler {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

.navbar-toggler-icon {
    width: 24px !important;
    height: 18px !important;
    position: relative !important;
    background: linear-gradient(to bottom,
        var(--oyropa-white) 0%, var(--oyropa-white) 15%,
        transparent 15%, transparent 42.5%,
        var(--oyropa-white) 42.5%, var(--oyropa-white) 57.5%,
        transparent 57.5%, transparent 85%,
        var(--oyropa-white) 85%, var(--oyropa-white) 100%) !important;
}

.navbar-toggler:hover .navbar-toggler-icon {
    background: linear-gradient(to bottom,
        var(--oyropa-gold) 0%, var(--oyropa-gold) 15%,
        transparent 15%, transparent 42.5%,
        var(--oyropa-gold) 42.5%, var(--oyropa-gold) 57.5%,
        transparent 57.5%, transparent 85%,
        var(--oyropa-gold) 85%, var(--oyropa-gold) 100%) !important;
}

/* ===== SHARE-BUTTONS (100% EINHEITLICH - NAVY EDITION) ===== */
/* FIXES: 40 HIGH/MEDIUM Issues - Falsche Größe + Falsche Farbe */
.header-share-buttons,
.share-buttons,
.discrete-share-buttons {
    display: flex !important;
    align-items: center !important;
    gap: var(--spacing-xs) !important;
    order: 3 !important;
}

/* ALLE Share-Button Varianten - WCAG AA 44x44px + Navy Design */
.header-share-buttons a,
.header-share-buttons button,
.share-buttons a,
.share-buttons button,
.discrete-share-buttons a,
.discrete-share-buttons button,
.discrete-share-button,
.oyropa-share-btn,
a.share-btn,
button.share-btn {
    /* GARANTIERT 44x44px auf ALLEN Devices (WCAG AA) */
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;

    /* Navy Edition Design - RGB statt RGBA */
    background-color: rgb(26, 54, 93) !important;
    background-color: var(--oyropa-light-navy) !important;
    border: 2px solid var(--oyropa-gold) !important;
    border-radius: var(--border-radius-full) !important;

    /* Content */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    /* Icon */
    color: var(--oyropa-white) !important;
    fill: var(--oyropa-white) !important;

    /* Interaction */
    cursor: pointer !important;
    text-decoration: none !important;
    transition: all var(--transition-fast) !important;
    box-shadow: var(--shadow-sm);
}

/* SVG Icons in Share-Buttons */
.header-share-buttons svg,
.share-buttons svg,
.discrete-share-buttons svg,
.discrete-share-button svg,
.oyropa-share-btn svg,
a.share-btn svg,
button.share-btn svg {
    width: var(--share-btn-icon-size) !important;
    height: var(--share-btn-icon-size) !important;
    fill: var(--oyropa-white) !important;
    transition: fill var(--transition-fast) !important;
}

/* Hover State - ALLE Varianten */
.header-share-buttons a:hover,
.header-share-buttons button:hover,
.share-buttons a:hover,
.share-buttons button:hover,
.discrete-share-buttons a:hover,
.discrete-share-buttons button:hover,
.discrete-share-button:hover,
.oyropa-share-btn:hover,
a.share-btn:hover,
button.share-btn:hover {
    background-color: var(--oyropa-gold) !important;
    border-color: var(--oyropa-gold) !important;
    transform: scale(1.1) translateY(-2px) !important;
    box-shadow: var(--shadow-md) !important;
}

.header-share-buttons a:hover svg,
.header-share-buttons button:hover svg,
.share-buttons a:hover svg,
.share-buttons button:hover svg,
.discrete-share-buttons a:hover svg,
.discrete-share-buttons button:hover svg,
.discrete-share-button:hover svg,
.oyropa-share-btn:hover svg,
a.share-btn:hover svg,
button.share-btn:hover svg {
    fill: var(--oyropa-navy) !important;
}

/* Active State - ALLE Varianten */
.header-share-buttons a:active,
.header-share-buttons button:active,
.share-buttons a:active,
.share-buttons button:active,
.discrete-share-buttons a:active,
.discrete-share-buttons button:active,
.discrete-share-button:active,
.oyropa-share-btn:active,
a.share-btn:active,
button.share-btn:active {
    transform: scale(0.95) !important;
}

/* Mobile Specific (nur für zusätzliche Anpassungen wenn nötig) */
@media (max-width: 1199.98px) {
    .header-share-buttons,
    .share-buttons,
    .discrete-share-buttons {
        gap: 6px !important; /* Etwas enger auf Mobile */
    }

    /* WCAG AA bleibt auch auf Mobile 44x44px */
    .header-share-buttons a,
    .header-share-buttons button,
    .share-buttons a,
    .share-buttons button,
    .discrete-share-buttons a,
    .discrete-share-buttons button,
    .discrete-share-button,
    .oyropa-share-btn,
    a.share-btn,
    button.share-btn {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
    }
}

/* ===== CONTAINER & LAYOUT (8px-Raster + STYLE GUIDE) ===== */
.container,
.container-fluid {
    width: 100% !important;
    padding-right: var(--spacing-md) !important;
    padding-left: var(--spacing-md) !important;
    margin-right: auto !important;
    margin-left: auto !important;
}

@media (min-width: 1200px) {
    .container {
        max-width: 1400px !important;
        /* Style Guide: 48px horizontal padding (Desktop) */
        padding-right: var(--spacing-2xl) !important;
        padding-left: var(--spacing-2xl) !important;
    }
}

@media (max-width: 768px) {
    .container,
    .container-fluid {
        /* Style Guide: 24px horizontal padding (Mobile) */
        padding-right: var(--spacing-md) !important;
        padding-left: var(--spacing-md) !important;
    }
}

/* Content Container */
main {
    padding-top: var(--spacing-2xl);
    padding-bottom: var(--spacing-3xl);
}

@media (max-width: 768px) {
    main {
        padding-top: var(--spacing-lg);
        padding-bottom: var(--spacing-2xl);
    }
}

/* ===== CARDS (EINHEITLICH) ===== */
.card,
.service-card,
.bewertungs-card {
    background: var(--oyropa-white);
    border-radius: var(--border-radius-lg);
    padding: var(--spacing-md);
    box-shadow: var(--shadow-md);
    transition: all var(--transition-normal);
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.card:hover,
.service-card:hover,
.bewertungs-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

@media (max-width: 768px) {
    .card,
    .service-card,
    .bewertungs-card {
        padding: var(--spacing-sm);
    }
}

/* ===== GRID SYSTEMS (RESPONSIVE) ===== */
.bewertungs-grid,
.service-grid {
    display: grid;
    gap: var(--spacing-lg);
}

/* Mobile: 1 Spalte */
@media (max-width: 768px) {
    .bewertungs-grid,
    .service-grid {
        grid-template-columns: 1fr !important;
        gap: var(--spacing-md) !important;
    }
}

/* Tablet: 2 Spalten */
@media (min-width: 768px) and (max-width: 1199.98px) {
    .bewertungs-grid,
    .service-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: var(--spacing-md) !important;
    }
}

/* Desktop: 3 Spalten */
@media (min-width: 1200px) {
    .bewertungs-grid,
    .service-grid {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: var(--spacing-lg) !important;
    }
}

/* ===== BUTTONS (EINHEITLICH) ===== */
.btn,
button:not(.navbar-toggler) {
    font-family: var(--font-family);
    font-size: var(--font-size-base);
    font-weight: 600;
    padding: var(--spacing-sm) var(--spacing-lg);
    border-radius: var(--border-radius-md);
    border: none;
    cursor: pointer;
    transition: all var(--transition-fast);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
    /* WCAG AA Touch-Target */
    min-height: 44px;
}

.btn-primary {
    background: linear-gradient(135deg, var(--oyropa-gold), #E6A84E);
    color: var(--oyropa-navy);
    box-shadow: var(--shadow-sm);
}

.btn-primary:hover {
    background: linear-gradient(135deg, #E6A84E, var(--oyropa-gold));
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.btn-secondary {
    background-color: var(--oyropa-navy);
    color: var(--oyropa-white);
    border: 2px solid var(--oyropa-navy);
}

.btn-secondary:hover {
    background-color: transparent;
    color: var(--oyropa-navy);
    border-color: var(--oyropa-navy);
}

/* ===== FOOTER (EINHEITLICH) ===== */
footer {
    background-color: var(--oyropa-navy);
    color: var(--oyropa-white);
    padding: var(--spacing-2xl) 0 var(--spacing-md);
    margin-top: auto;
}

footer a {
    color: var(--oyropa-white);
    text-decoration: none;
    transition: color var(--transition-fast);
}

footer a:hover {
    color: var(--oyropa-gold);
}

/* ===== UTILITY CLASSES ===== */
.text-navy { color: var(--oyropa-navy) !important; }
.text-gold { color: var(--oyropa-gold) !important; }
.bg-navy { background-color: var(--oyropa-navy) !important; }
.bg-gold { background-color: var(--oyropa-gold) !important; }

.mt-xs { margin-top: var(--spacing-xs) !important; }
.mt-sm { margin-top: var(--spacing-sm) !important; }
.mt-md { margin-top: var(--spacing-md) !important; }
.mt-lg { margin-top: var(--spacing-lg) !important; }
.mt-xl { margin-top: var(--spacing-xl) !important; }

.mb-xs { margin-bottom: var(--spacing-xs) !important; }
.mb-sm { margin-bottom: var(--spacing-sm) !important; }
.mb-md { margin-bottom: var(--spacing-md) !important; }
.mb-lg { margin-bottom: var(--spacing-lg) !important; }
.mb-xl { margin-bottom: var(--spacing-xl) !important; }

.pt-xs { padding-top: var(--spacing-xs) !important; }
.pt-sm { padding-top: var(--spacing-sm) !important; }
.pt-md { padding-top: var(--spacing-md) !important; }
.pt-lg { padding-top: var(--spacing-lg) !important; }
.pt-xl { padding-top: var(--spacing-xl) !important; }

.pb-xs { padding-bottom: var(--spacing-xs) !important; }
.pb-sm { padding-bottom: var(--spacing-sm) !important; }
.pb-md { padding-bottom: var(--spacing-md) !important; }
.pb-lg { padding-bottom: var(--spacing-lg) !important; }
.pb-xl { padding-bottom: var(--spacing-xl) !important; }

/* ===== ACCESSIBILITY ===== */
*:focus-visible {
    outline: 3px solid var(--oyropa-gold);
    outline-offset: 2px;
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ===== ANTI-HORIZONTAL-SCROLL (KRITISCH) ===== */
body, html, header, main, footer, .container, .container-fluid,
.navbar, .navbar-collapse, .row, section, div {
    max-width: 100vw !important;
    overflow-x: hidden !important;
}

/* ===== COMPREHENSIVE TOUCH-TARGET FIXES (WCAG AA 44x44px) ===== */
/* FIXES: P1 Issue - Touch Target zu klein auf iPhone (42.5px → 44px) */
@media (max-width: 1199.98px) {
    /* ALLE klickbaren Elemente müssen min. 44x44px sein */

    /* Form Inputs */
    input:not([type="hidden"]),
    select,
    textarea {
        min-height: 44px !important;
        padding: 10px 12px !important;
        font-size: 16px !important; /* Verhindert Zoom auf iOS */
    }

    /* Checkboxes und Radio Buttons */
    input[type="checkbox"],
    input[type="radio"] {
        min-width: 24px !important;
        min-height: 24px !important;
        margin: 10px !important; /* Erhöht Touch-Bereich */
    }

    /* Labels für Checkboxes/Radio */
    label:has(input[type="checkbox"]),
    label:has(input[type="radio"]) {
        min-height: 44px !important;
        display: flex !important;
        align-items: center !important;
        padding: 10px 0 !important;
    }

    /* Alle Button-Typen */
    button:not(.navbar-toggler):not(.share-btn),
    .btn:not(.share-btn),
    [type="button"],
    [type="submit"],
    [type="reset"],
    [role="button"]:not(.share-btn),
    .button:not(.share-btn),
    a.btn:not(.share-btn),
    a.button:not(.share-btn) {
        min-height: 44px !important;
        min-width: 44px !important;
        padding: 12px 16px !important;
    }

    /* Dropdown Items */
    .dropdown-item,
    .dropdown-menu a,
    .dropdown-menu button {
        min-height: 44px !important;
        padding: 12px 20px !important;
    }

    /* Close Buttons */
    .close,
    .btn-close,
    [aria-label="Close"],
    [aria-label="Schließen"] {
        min-width: 44px !important;
        min-height: 44px !important;
        padding: 10px !important;
    }

    /* Tabs */
    .nav-tabs .nav-link,
    .nav-pills .nav-link,
    [role="tab"] {
        min-height: 44px !important;
        padding: 12px 20px !important;
    }

    /* Pagination */
    .pagination .page-link {
        min-width: 44px !important;
        min-height: 44px !important;
        padding: 10px 12px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Card Buttons */
    .card-header button,
    .card-footer button,
    .card-body .btn {
        min-height: 44px !important;
    }

    /* Modal Buttons */
    .modal-footer .btn,
    .modal-header .btn-close {
        min-height: 44px !important;
        min-width: 80px !important;
    }

    /* Accordion Headers - Größer für bessere Touch */
    .accordion-button,
    .accordion-header button {
        min-height: 56px !important;
        padding: 16px 20px !important;
    }

    /* Toggle Switches */
    .form-check,
    .form-switch {
        min-height: 44px !important;
        padding: 10px 0 !important;
    }

    /* Listen mit klickbaren Items */
    .list-group-item-action {
        min-height: 48px !important;
        padding: 12px 20px !important;
    }

    /* Icons die klickbar sind */
    i[onclick],
    i[role="button"],
    .icon-button,
    .clickable-icon {
        min-width: 44px !important;
        min-height: 44px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
    }

    /* Breadcrumbs */
    .breadcrumb-item a {
        min-height: 44px !important;
        padding: 10px 8px !important;
        display: inline-flex !important;
        align-items: center !important;
    }

    /* File Upload */
    input[type="file"] {
        min-height: 44px !important;
        padding: 10px !important;
    }

    .file-upload-button,
    .upload-btn {
        min-height: 44px !important;
        padding: 12px 20px !important;
    }

    /* Date/Time Inputs */
    input[type="date"],
    input[type="time"],
    input[type="datetime-local"] {
        min-height: 44px !important;
        padding: 10px !important;
        font-size: 16px !important;
    }

    /* Color Picker */
    input[type="color"] {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    /* Sliders */
    input[type="range"] {
        min-height: 44px !important;
    }

    /* Floating Action Buttons */
    .fab,
    .floating-action-button {
        min-width: 56px !important;
        min-height: 56px !important;
    }

    /* Back to Top Button */
    .back-to-top,
    .scroll-to-top {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    /* Cookie Banner Buttons */
    .cookie-accept,
    .cookie-decline,
    .cookie-settings {
        min-height: 44px !important;
        margin: 4px !important;
    }

    /* Zusätzlicher Abstand zwischen Elementen */
    button + button,
    .btn + .btn {
        margin-left: 8px !important;
    }

    /* Verhindere Überlappung */
    * {
        box-sizing: border-box !important;
    }

    /* Tap-Highlights für besseres Feedback */
    a,
    button,
    input,
    select,
    textarea {
        -webkit-tap-highlight-color: rgba(212, 175, 55, 0.3) !important; /* Gold */
        -webkit-touch-callout: none !important;
    }

    /* Verhindere Text-Selection bei Buttons */
    button,
    .btn,
    [role="button"] {
        user-select: none !important;
        -webkit-user-select: none !important;
    }
}

/* ===== END OF UNIFIED LAYOUT SYSTEM ===== */