/* ===========================================
   Verzeichnisscript 2.0 - Custom Styles
   =========================================== */

/* Placeholder Styling */
input.form-control::placeholder,
textarea.form-control::placeholder {
    color: rgba(151, 149, 149, 0.75) !important;
    padding: 5px;
}

/* ===========================================
   Mobile Responsive Styles
   =========================================== */

/* Mobile Header - Logo und Suche untereinander */
@media (max-width: 767.98px) {
    header .row > div {
        width: 100% !important;
        flex: 0 0 100%;
        max-width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }

    header .input-group {
        justify-content: center;
    }
}

/* Touch-freundliche Buttons (min 44x44px fuer Fingerbreite) */
@media (max-width: 991.98px) {
    .btn {
        padding: 12px 20px;
        min-height: 44px;
    }

    .nav-link {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
}

/* iOS Zoom bei Fokus verhindern - Font-Size muss >= 16px sein */
@media (max-width: 575.98px) {
    .form-control,
    .form-select,
    textarea {
        font-size: 16px !important;
    }

    /* Kleinere Ueberschriften auf Mobile */
    h1 { font-size: 1.5rem; }
    h2 { font-size: 1.25rem; }
    h3 { font-size: 1.1rem; }

    /* Mehr Abstand bei Formularen */
    .mb-3 {
        margin-bottom: 1.25rem !important;
    }

    /* Container Padding reduzieren */
    .container {
        padding-left: 15px;
        padding-right: 15px;
    }
}

/* Navigation Mobile - bessere Trennlinien */
@media (max-width: 767.98px) {
    .nav.flex-column .nav-link {
        padding: 0.75rem 0;
        border-bottom: 1px solid #eee;
    }

    .nav.flex-column .nav-link:last-child {
        border-bottom: none;
    }

    /* Sidebar bekommt Abstand nach unten */
    .col-12.col-md-3 {
        margin-bottom: 1.5rem;
    }
}

/* Tabellen responsive */
.table-responsive {
    margin-bottom: 1rem;
}

@media (max-width: 575.98px) {
    .table {
        font-size: 0.875rem;
    }

    .table td, .table th {
        padding: 0.5rem;
    }
}

/* Pagination Mobile - Wrap erlauben */
.pagination {
    flex-wrap: wrap;
    gap: 0.25rem;
}

@media (max-width: 575.98px) {
    .pagination .page-link {
        padding: 0.5rem 0.75rem;
        font-size: 0.875rem;
    }
}

/* Admin Tabellen */
.admin-table {
    width: 100%;
}

@media (max-width: 767.98px) {
    .admin-table td {
        display: block;
        width: 100%;
        padding: 0.5rem;
    }
}