/* ==========================================
   🎯 GLOBAL RESPONSIVE SYSTEM v1.0
   Single Source of Truth dla WSZYSTKICH kontenerów
   Ładowany NA KOŃCU - nadpisuje wszystkie inne CSS!
   ========================================== */

/* ==========================================
   📐 DESKTOP (domyślnie)
   Wartości z variables.css
   ========================================== */
/* Brak nadpisań - używamy wartości bazowych */

/* ==========================================
   📱 RESPONSIVE BREAKPOINTS
   Zgodne z navbar-unified.css - IDENTYCZNE wartości!
   ========================================== */

/* Tablet Landscape (1200px and below) */
@media (max-width: 1200px) {
    /* WSZYSTKIE kontenery główne - max-width zgodny z navbar */
    /* Wysoka specyficzność (html body) - wygrywa z wszystkimi innymi bez !important */
    html body .portal-page-container,
    html body .portal-front-page-container,
    html body .portal-offers-container,
    html body .company-base-container {
        max-width: 95%; /* Global Responsive Pattern - zgodne z navbar */
        padding: var(--container-padding); /* 20px */
    }
    
    /* GLOBALNY margin-top - wysoka specyficzność + ładowany NA KOŃCU = wygrywa */
    html body:not(.maintenance-active) .portal-page-container,
    html body:not(.maintenance-active) .portal-front-page-container,
    html body:not(.maintenance-active) .portal-offers-container,
    html body.page-template-dla-firm:not(.maintenance-active) .portal-front-page-container {
        margin-top: var(--page-margin-top-lg); /* 80px */
    }
}

/* Tablet (1024px and below) */
@media (max-width: 1024px) {
    html body .portal-page-container,
    html body .portal-front-page-container,
    html body .portal-offers-container,
    html body .company-base-container {
        max-width: 96%; /* Global Responsive Pattern - zgodne z navbar */
    }
}

/* Tablet Portrait (768px and below) */
@media (max-width: 768px) {
    html body .portal-page-container,
    html body .portal-front-page-container,
    html body .portal-offers-container,
    html body .company-base-container {
        max-width: 98%; /* Global Responsive Pattern - zgodne z navbar */
        padding: 10px; /* Mniejszy padding na mobile */
    }
    
    /* GLOBALNY margin-top */
    html body:not(.maintenance-active) .portal-page-container,
    html body:not(.maintenance-active) .portal-front-page-container,
    html body:not(.maintenance-active) .portal-offers-container,
    html body.page-template-dla-firm:not(.maintenance-active) .portal-front-page-container {
        margin-top: var(--page-margin-top-md); /* 65px */
    }
}

/* Mobile (480px and below) */
@media (max-width: 480px) {
    html body .portal-page-container,
    html body .portal-front-page-container,
    html body .portal-offers-container,
    html body .company-base-container {
        max-width: 100%; /* Global Responsive Pattern - pełna szerokość */
    }
    
    /* GLOBALNY margin-top */
    html body:not(.maintenance-active) .portal-page-container,
    html body:not(.maintenance-active) .portal-front-page-container,
    html body:not(.maintenance-active) .portal-offers-container,
    html body.page-template-dla-firm:not(.maintenance-active) .portal-front-page-container {
        margin-top: var(--page-margin-top-sm); /* 60px */
    }
}

/* Mobile Small (375px and below) */
@media (max-width: 375px) {
    /* GLOBALNY margin-top */
    html body:not(.maintenance-active) .portal-page-container,
    html body:not(.maintenance-active) .portal-front-page-container,
    html body:not(.maintenance-active) .portal-offers-container,
    html body.page-template-dla-firm:not(.maintenance-active) .portal-front-page-container {
        margin-top: var(--page-margin-top-xs); /* 55px */
    }
}

/* ==========================================
   📊 BENEFITS
   - 1 plik = spójność na wszystkich 24 stronach
   - Zmiana w 1 miejscu = zmiana wszędzie
   - Zero niekonsystencji navbar ↔ kontener ↔ margin-top
   - Wysoka specyficzność (html body) + ładowany NA KOŃCU = wygrywa BEZ !important
   - Czysty, maintainable CSS
   ========================================== */