/* =====================================================================
   Kaisers Gartenbau – Mobile-Optimierung
   ===================================================================== */

@media (max-width: 991px) {
    .navbar.header .container { padding: 0 16px; }
    .navbar.header .navbar-brand img,
    .navbar.header .navbar-brand .logo {
        max-height: 36px;
    }

    .panel_s > .panel-body,
    .panel-default > .panel-body,
    .panel > .panel-body {
        padding: 18px;
    }
}


/* ---- Tablet & Phone (≤ 768px) -------------------------------------- */
@media (max-width: 768px) {
    body {
        font-size: 15px;
    }

    .navbar.header {
        min-height: 56px;
    }

    .navbar.header .navbar-toggle {
        border: 1px solid var(--kg-border);
        border-radius: var(--kg-radius-sm);
        margin-top: 12px;
        margin-bottom: 12px;
        padding: 8px 10px;
    }

    .navbar.header .navbar-toggle .icon-bar {
        background: var(--kg-text-primary);
    }

    /* Mobile-Menu: Kollabierte Liste sauber */
    .navbar.header .navbar-collapse {
        background: var(--kg-bg-card);
        border-top: 1px solid var(--kg-border);
        box-shadow: var(--kg-shadow-md);
        padding: 8px 12px;
        margin: 0 -16px;
    }

    .navbar.header .navbar-nav {
        margin: 0;
    }

    .navbar.header .navbar-nav > li > a {
        padding: 14px 12px;
        border-radius: var(--kg-radius-sm);
        font-size: 16px;
    }

    .navbar.header .navbar-nav > li.active > a::after {
        display: none;
    }

    .navbar.header .navbar-nav > li.active > a {
        background: var(--kg-green-50);
        color: var(--kg-green-700);
    }

    /* Profil-Dropdown auf Mobile als Inline-Liste */
    .navbar.header .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 4px;
        background: var(--kg-bg-subtle);
        box-shadow: none;
    }

    .content {
        padding-top: 16px;
        padding-left: 4px;
        padding-right: 4px;
    }

    /* Header-Widget rechts (Hallo Name + Datum + Wetter) */
    .kg-header-greeting {
        display: none !important;
    }

    /* Sub-Menü in Mobile: Zeilenweise stapeln */
    .navigation-button-container {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    .navigation-button-container .btn {
        margin-right: 0;
        width: 100%;
        text-align: left;
    }

    /* Tabellen → Cards auf Mobile */
    .table-responsive {
        border: none !important;
        margin-bottom: 0;
    }

    /* Kompaktere Panel-Bodies */
    .panel_s > .panel-body,
    .panel > .panel-body {
        padding: 16px;
    }

    .panel_s > .panel-heading,
    .panel > .panel-heading {
        padding: 14px 16px;
        font-size: 15px;
    }

    /* Buttons werden full-width-fähig */
    .btn-block-mobile {
        display: block;
        width: 100%;
    }

    /* Modal nimmt mehr Platz */
    .modal-dialog {
        margin: 16px;
    }
    .modal-body { padding: 18px; }

    /* Headings kleiner */
    h1, .h1 { font-size: 26px; }
    h2, .h2 { font-size: 22px; }
    h3, .h3 { font-size: 19px; }
    h4, .h4 { font-size: 17px; }

    /* DataTable-Suche füllt die Breite */
    .dataTables_wrapper .dataTables_filter {
        float: none;
        text-align: left;
    }
    .dataTables_wrapper .dataTables_filter input {
        width: 100%;
        margin-left: 0;
        margin-top: 4px;
    }
    .dataTables_wrapper .dataTables_length {
        float: none;
    }
    .dataTables_wrapper .dataTables_paginate {
        float: none;
        text-align: center;
        margin-top: 12px;
    }
}


/* ---- Phone (≤ 480px) -------------------------------------------- */
@media (max-width: 480px) {
    .panel_s > .panel-body,
    .panel > .panel-body {
        padding: 14px;
    }

    /* Status-Labels kompakter */
    .label, .badge {
        font-size: 11px;
        padding: 3px 9px;
    }
}
