/* ============================================
   ZRZUTKI - Master Override Styles
   Nadrzędne style zapewniające spójność
   ============================================ */

/* === WYMUSZENIE BAZOWEGO FONT-SIZE NA HTML === */
/* Motyw WP może nadpisać html font-size na wartość < 16px, psując rem */
html {
    font-size: 16px !important;
}

/* === CSS RESET DLA WTYCZKI === */
/* Wymuszone style niezależne od motywu WordPress */

.zrzutki-fullscreen-view,
.zrzutki-fullscreen-view *,
.zrzutki-fullscreen-view *::before,
.zrzutki-fullscreen-view *::after,
.zrzutka-content-tile,
.zrzutka-content-tile *,
.zrzutka-modal,
.zrzutka-modal *,
.announcement-card,
.announcement-card * {
    box-sizing: border-box !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* === ZMIENNE CSS Z WYMUSZENIEM === */
.zrzutki-fullscreen-view,
.zrzutka-content-tile,
.zrzutka-modal,
body.zrzutki-fullscreen-view {
    --color-bg: #FAFAFA !important;
    --color-surface: #FFFFFF !important;
    --color-surface-elevated: #FFFFFF !important;
    --color-surface-subtle: #F5F5F5 !important;
    --color-text-primary: #1A1A1A !important;
    --color-text-secondary: #666666 !important;
    --color-text-tertiary: #999999 !important;
    --color-text-inverse: #FFFFFF !important;
    --color-accent: #0066FF !important;
    --color-accent-hover: #0052CC !important;
    --color-accent-light: #E6F0FF !important;
    --color-accent-subtle: #F0F6FF !important;
    --color-success: #00C853 !important;
    --color-success-bg: #E8F9F0 !important;
    --color-warning: #FF9500 !important;
    --color-warning-bg: #FFF8E6 !important;
    --color-error: #FF3B30 !important;
    --color-error-bg: #FFEBEA !important;
    --color-border: rgba(0, 0, 0, 0.08) !important;
    --color-border-strong: rgba(0, 0, 0, 0.12) !important;
    --color-divider: rgba(0, 0, 0, 0.06) !important;
}

/* === ZMIENNE TYPOGRAFICZNE Z WYMUSZENIEM === */
/* Izolacja typografii od motywu WordPress */
.zrzutki-fullscreen-view,
.zrzutka-content-tile,
.zrzutka-modal,
body.zrzutki-fullscreen-view {
    /* Font family */
    --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", system-ui, sans-serif !important;
    /* Skala typograficzna — INCREASED (min 16px), px zamiast rem */
    --text-xs: 16px !important;
    --text-sm: 17px !important;
    --text-base: 18px !important;
    --text-md: 20px !important;
    --text-lg: 23px !important;
    --text-xl: 26px !important;
    --text-2xl: 32px !important;
    --text-3xl: 38px !important;
    /* Interlinie */
    --leading-tight: 1.25 !important;
    --leading-snug: 1.4 !important;
    --leading-normal: 1.55 !important;
    --leading-relaxed: 1.7 !important;
    /* Letter-spacing */
    --tracking-tight: -0.02em !important;
    --tracking-normal: 0 !important;
    --tracking-wide: 0.025em !important;
    --tracking-wider: 0.04em !important;
    /* Bazowe wartości typograficzne */
    font-family: var(--font-sans) !important;
    font-size: var(--text-base) !important;
    line-height: var(--leading-normal) !important;
}

/* Wymuszenie font-family na wszystkich elementach wewnątrz kontenerów */
.zrzutki-fullscreen-view *,
.zrzutka-content-tile *,
.zrzutka-modal * {
    font-family: var(--font-sans) !important;
}

/* Reset typografii elementów HTML — blokada dziedziczenia z motywu WP */
.zrzutki-fullscreen-view :is(p, h1, h2, h3, h4, h5, h6, span, a, label, li, input, textarea, select),
.zrzutka-content-tile :is(p, h1, h2, h3, h4, h5, h6, span, a, label, li, input, textarea, select),
.zrzutka-modal :is(p, h1, h2, h3, h4, h5, h6, span, a, label, li, input, textarea, select) {
    font-family: var(--font-sans) !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    color: inherit !important;
}

/* === PRZYCISKI - WYMUSZONE STYLE === */
/* Primary Button - niebieski z białym tekstem */
.zrzutki-fullscreen-view .btn--primary,
.zrzutka-content-tile .btn--primary,
.zrzutka-modal .btn--primary,
.announcement-card .btn--primary,
.form-shell .btn--primary,
.app-shell .btn--primary,
button.btn--primary,
a.btn--primary,
.btn.btn--primary {
    background: #0066FF !important;
    background-color: #0066FF !important;
    color: #FFFFFF !important;
    border: none !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.zrzutki-fullscreen-view .btn--primary:hover,
.zrzutka-content-tile .btn--primary:hover,
.zrzutka-modal .btn--primary:hover,
.announcement-card .btn--primary:hover,
.form-shell .btn--primary:hover,
.app-shell .btn--primary:hover,
button.btn--primary:hover,
a.btn--primary:hover,
.btn.btn--primary:hover {
    background: #0052CC !important;
    background-color: #0052CC !important;
    color: #FFFFFF !important;
}

/* Secondary Button */
.zrzutki-fullscreen-view .btn--secondary,
.zrzutka-content-tile .btn--secondary,
.zrzutka-modal .btn--secondary,
.form-shell .btn--secondary,
.app-shell .btn--secondary,
button.btn--secondary,
a.btn--secondary,
.btn.btn--secondary {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    color: #1A1A1A !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.zrzutki-fullscreen-view .btn--secondary:hover,
.zrzutka-content-tile .btn--secondary:hover,
.zrzutka-modal .btn--secondary:hover,
.form-shell .btn--secondary:hover,
.app-shell .btn--secondary:hover,
button.btn--secondary:hover,
a.btn--secondary:hover,
.btn.btn--secondary:hover {
    background: #F5F5F5 !important;
    background-color: #F5F5F5 !important;
    color: #1A1A1A !important;
}

/* Ghost Button */
.zrzutki-fullscreen-view .btn--ghost,
.zrzutka-content-tile .btn--ghost,
.zrzutka-modal .btn--ghost,
.form-shell .btn--ghost,
.app-shell .btn--ghost,
button.btn--ghost,
a.btn--ghost,
.btn.btn--ghost {
    background: transparent !important;
    background-color: transparent !important;
    color: #0066FF !important;
    border: none !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.zrzutki-fullscreen-view .btn--ghost:hover,
.zrzutka-content-tile .btn--ghost:hover,
.zrzutka-modal .btn--ghost:hover,
.form-shell .btn--ghost:hover,
.app-shell .btn--ghost:hover,
button.btn--ghost:hover,
a.btn--ghost:hover,
.btn.btn--ghost:hover {
    background: #F0F6FF !important;
    background-color: #F0F6FF !important;
    color: #0066FF !important;
}

/* Danger Button */
.btn--danger,
button.btn--danger,
a.btn--danger {
    background: #FF3B30 !important;
    background-color: #FF3B30 !important;
    color: #FFFFFF !important;
    border: none !important;
}

/* Wspólne style przycisków */
.zrzutki-fullscreen-view .btn,
.zrzutka-content-tile .btn,
.zrzutka-modal .btn,
.form-shell .btn,
.app-shell .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    height: 48px !important;
    padding: 0 20px !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    letter-spacing: -0.02em !important;
    border-radius: 16px !important;
    transition: all 150ms cubic-bezier(0.16, 1, 0.3, 1) !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    text-decoration: none !important;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", system-ui, sans-serif !important;
}

/* Ukrywanie przycisków formularza (specificity 0,4,0 — bezwzględnie nadpisuje .form-shell .btn) */
.form-shell .form-footer .btn.form-btn-hidden { display: none !important; }

/* === FAB (Floating Action Button) === */
.fab,
.fab--extended,
a.fab,
button.fab {
    background: #0066FF !important;
    background-color: #0066FF !important;
    color: #FFFFFF !important;
    border: none !important;
    box-shadow: 0 4px 20px rgba(0, 102, 255, 0.35) !important;
}

.fab:hover,
.fab--extended:hover,
a.fab:hover,
button.fab:hover {
    background: #0052CC !important;
    background-color: #0052CC !important;
    color: #FFFFFF !important;
    box-shadow: 0 6px 28px rgba(0, 102, 255, 0.45) !important;
}

/* === FONTY - ZWIĘKSZONE ROZMIARY === */

/* Nagłówek z logo */
.nav-bar__brand-text {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #1A1A1A !important;
    letter-spacing: -0.02em !important;
}

/* Tytuły ogłoszeń na liście */
.announcement-card__title,
.zrzutki-fullscreen-view .announcement-card__title {
    font-size: 21px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    color: #1A1A1A !important;
    margin: 0 !important;
}

/* Opis/excerpt ogłoszenia */
.announcement-card__excerpt,
.zrzutki-fullscreen-view .announcement-card__excerpt {
    font-size: 17px !important;
    line-height: 1.65 !important;
    color: #666666 !important;
}

/* Autor ogłoszenia */
.announcement-card__author-name,
.zrzutki-fullscreen-view .announcement-card__author-name {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #1A1A1A !important;
}

/* Data ogłoszenia */
.announcement-card__date,
.zrzutki-fullscreen-view .announcement-card__date {
    font-size: 16px !important;
    color: #999999 !important;
}

/* Statystyki */
.stat-item__value {
    font-size: 32px !important;
    font-weight: 700 !important;
    color: #0066FF !important;
}

.stat-item__label {
    font-size: 16px !important;
    color: #999999 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
}

/* Filtry */
.filter-chip {
    font-size: 16px !important;
    font-weight: 500 !important;
    height: 44px !important;
    padding: 0 20px !important;
}

.filter-chip--active {
    background: #0066FF !important;
    background-color: #0066FF !important;
    color: #FFFFFF !important;
    border-color: #0066FF !important;
}

/* === BADGE - ETYKIETY KATEGORII === */
.badge,
.announcement-card__badge {
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: 0.025em !important;
    text-transform: uppercase !important;
    padding: 0 12px !important;
    height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    border-radius: 8px !important;
}

.badge--primary {
    background: #E6F0FF !important;
    background-color: #E6F0FF !important;
    color: #0066FF !important;
}

.badge--warning {
    background: #FFF8E6 !important;
    background-color: #FFF8E6 !important;
    color: #FF9500 !important;
}

.badge--success {
    background: #E8F9F0 !important;
    background-color: #E8F9F0 !important;
    color: #00C853 !important;
}

.badge--error {
    background: #FFEBEA !important;
    background-color: #FFEBEA !important;
    color: #FF3B30 !important;
}

/* === FULLSCREEN VIEW - NATIVE APP FEEL === */
.zrzutki-fullscreen-view:not(body) {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99990 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #FAFAFA !important;
    overflow: hidden !important;
    isolation: isolate !important;
}

body.zrzutki-fullscreen-view {
    overflow: hidden !important;
    background: #FAFAFA !important;
}

/* App Shell */
.app-shell,
.zrzutki-fullscreen-view .app-shell {
    position: fixed !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    background: #FAFAFA !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
}

/* Form Shell */
.form-shell,
.zrzutki-fullscreen-view .form-shell {
    position: fixed !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    background: #FAFAFA !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
}

/* Content Area - scrollable */
.content-area,
.zrzutki-fullscreen-view .content-area {
    flex: 1 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
}

/* Nav Bar */
.nav-bar,
.zrzutki-fullscreen-view .nav-bar {
    position: sticky !important;
    top: 0 !important;
    z-index: 200 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 64px !important;
    padding: 12px 16px !important;
    background: rgba(250, 250, 250, 0.85) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}

.modal--with-nav .modal__header {
    top: auto;
}

/* === MODAL STYLES === */
.zrzutka-modal-overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    background: rgba(0, 0, 0, 0.85) !important;
    backdrop-filter: blur(5px) !important;
    -webkit-backdrop-filter: blur(5px) !important;
}

.zrzutka-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 100000 !important;
    background: #FFFFFF !important;
    overflow: hidden !important;
}

/* === KAFELEK W TREŚCI (EMBED) === */
.zrzutka-content-tile,
.announcement-card--compact {
    background: #FFFFFF !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08) !important;
    margin: 24px 0 !important;
}

.zrzutka-content-tile {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", system-ui, sans-serif !important;
    font-size: var(--text-base, 18px) !important;
    line-height: var(--leading-relaxed, 1.7) !important;
}

.zrzutka-content-tile .announcement-card__title,
.announcement-card--compact .announcement-card__title {
    font-size: clamp(22px, 1.4vw + 18px, 28px) !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    color: #1A1A1A !important;
}

.zrzutka-content-tile .announcement-card__excerpt,
.announcement-card--compact .announcement-card__excerpt {
    font-size: 15px !important;
    line-height: 1.55 !important;
    color: #666666 !important;
}

/* Przycisk odświeżania */
.zrzutka-content-tile .zrzutka-tile-refresh {
    background: transparent !important;
    color: var(--color-accent, #0066FF) !important;
}

.zrzutka-content-tile .zrzutka-tile-refresh:hover {
    background: var(--color-accent-subtle, #F0F6FF) !important;
    color: var(--color-accent, #0066FF) !important;
}

/* === ANNOUNCEMENT CARD === */
.announcement-card {
    display: flex !important;
    flex-direction: column !important;
    background: #FFFFFF !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
    transition: transform 150ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 150ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.announcement-card:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08) !important;
}

.announcement-card__image {
    position: relative !important;
    aspect-ratio: 16 / 9 !important;
    background: #F5F5F5 !important;
    overflow: hidden !important;
    width: 100% !important;
    margin: 0 !important;
}

.announcement-card__image img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    object-fit: cover !important;
    display: block !important;
    background: transparent !important;
}

.announcement-card__badge {
    right: var(--space-3, 12px) !important;
    left: auto !important;
}

.zrzutka-content-tile .announcement-card__image,
.zrzutka-content-tile .announcement-card__image picture,
.zrzutka-content-tile .announcement-card__image img {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.zrzutka-content-tile .announcement-card__image picture,
.zrzutka-content-tile .announcement-card__image img {
    inset: 0 !important;
    object-fit: cover !important;
    display: block !important;
    background: transparent !important;
}

.announcement-card__body {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 14px 18px 16px !important;
}

.announcement-card__goal {
    border-top: 1px solid #E5E7EB !important;
    padding-top: 12px !important;
    margin-top: 4px !important;
}

.zrzutka-content-tile .announcement-card__meta {
    border-top: none !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.zrzutka-content-tile .announcement-card__actions {
    display: flex !important;
    flex-direction: row !important;
    gap: 0 !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    margin-top: 8px !important;
    padding-top: 12px !important;
    border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
}

.zrzutka-content-tile .announcement-card__actions .btn {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", system-ui, sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: var(--tracking-tight, -0.02em) !important;
}

.zrzutka-content-tile .announcement-card__actions .btn--primary {
    align-self: center !important;
    min-width: auto !important;
    flex: 1 1 0% !important;
    text-align: center !important;
}

/* Embedded tile: kompaktowe meta (autor / data) */
.zrzutka-content-tile .announcement-card__author-name {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1A1A1A !important;
}

.zrzutka-content-tile .announcement-card__date,
.zrzutka-content-tile .announcement-card__date-value {
    font-size: 14px !important;
}

.zrzutka-content-tile .announcement-card__date-value {
    font-weight: 600 !important;
    color: #1A1A1A !important;
}

.zrzutka-content-tile .announcement-card__author-label,
.zrzutka-content-tile .announcement-card__date-label {
    font-size: 11px !important;
    color: #999999 !important;
    letter-spacing: 0.05em !important;
}

/* Embedded tile: kompaktowe linki akcji (ZOBACZ / KOLEJNE / DODAJ) */
.zrzutka-content-tile .announcement-card__action-link {
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    padding: 6px 8px !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
    gap: 6px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    justify-content: center !important;
}

.zrzutka-content-tile .announcement-card__actions--links .announcement-card__action-link + .announcement-card__action-link {
    padding-left: 8px !important;
    margin-left: 0 !important;
    border-left: 1px solid rgba(0, 0, 0, 0.08) !important;
}

.zrzutka-content-tile .announcement-card__action-icon {
    width: 16px !important;
    height: 16px !important;
}

@media (max-width: 480px) {
    .zrzutka-content-tile .announcement-card__action-link {
        font-size: 12px !important;
        padding: 6px 4px !important;
        gap: 4px !important;
    }

    .zrzutka-content-tile .announcement-card__actions--links .announcement-card__action-link + .announcement-card__action-link {
        padding-left: 4px !important;
    }

    .zrzutka-content-tile .announcement-card__action-icon {
        width: 14px !important;
        height: 14px !important;
    }
}

.zrzutka-content-tile .announcement-card__actions .zrzutka-tile-refresh {
    align-self: flex-end !important;
    margin-right: var(--space-3, 12px) !important;
    padding-inline: var(--space-4, 16px) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: var(--space-2, 8px) !important;
}

.zrzutka-content-tile .announcement-card__actions .zrzutka-tile-refresh svg {
    width: 18px !important;
    height: 18px !important;
}

.announcement-card__link {
    color: inherit !important;
    text-decoration: none !important;
}

.announcement-card__link:hover {
    color: inherit !important;
    text-decoration: none !important;
}

/* === KOMUNIKAT DLA NIEZALOGOWANYCH === */
.zrzutki-login-notice,
.login-required-message {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99990 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    background: #FFFFFF !important;
    padding: 24px !important;
    text-align: center !important;
}

.zrzutki-login-notice h2,
.login-required-message h2 {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #1A1A1A !important;
    margin-bottom: 16px !important;
}

.zrzutki-login-notice p,
.login-required-message p {
    font-size: 16px !important;
    color: #666666 !important;
    line-height: 1.6 !important;
    max-width: 400px !important;
    margin-bottom: 24px !important;
}

/* === EMPTY STATE === */
.announcement-card--empty,
.empty-state {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 48px 24px !important;
    background: #FFFFFF !important;
    border-radius: 20px !important;
}

.announcement-card--empty h3,
.empty-state__title {
    font-size: 20px !important;
    font-weight: 600 !important;
    color: #1A1A1A !important;
    margin-bottom: 8px !important;
}

.announcement-card--empty p,
.empty-state__description {
    font-size: 16px !important;
    color: #666666 !important;
    margin-bottom: 24px !important;
}

/* === FORM STYLES === */
.form-field__input,
.zrzutki-fullscreen-view input[type="text"],
.zrzutki-fullscreen-view input[type="email"],
.zrzutki-fullscreen-view input[type="url"],
.zrzutki-fullscreen-view input[type="number"],
.zrzutki-fullscreen-view textarea,
.zrzutki-fullscreen-view select {
    font-size: 18px !important;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", system-ui, sans-serif !important;
    color: #1A1A1A !important;
    background: #FFFFFF !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    border-radius: 16px !important;
    padding: 12px 16px !important;
    transition: border-color 150ms ease-out, box-shadow 150ms ease-out !important;
}

.form-field__input:focus,
.zrzutki-fullscreen-view input:focus,
.zrzutki-fullscreen-view textarea:focus,
.zrzutki-fullscreen-view select:focus {
    outline: none !important;
    border-color: #0066FF !important;
    box-shadow: 0 0 0 3px #E6F0FF !important;
}

.form-field__input--error,
.zrzutki-fullscreen-view .form-field__input--error {
    border-color: #FF3B30 !important;
    box-shadow: 0 0 0 3px #FFEBEA !important;
}

.form-field__label {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #666666 !important;
    margin-bottom: 8px !important;
}

/* === RESPONSIVE === */
@media (min-width: 640px) {
    .announcements-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }

    .nav-bar__brand-text {
        font-size: 30px !important;
    }
}

@media (min-width: 1024px) {
    .announcements-grid {
        grid-template-columns: repeat(3, 1fr) !important;
        max-width: 1200px !important;
        margin: 0 auto !important;
    }

    .nav-bar__brand-text {
        font-size: 32px !important;
    }
}

/* === UKRYCIE ELEMENTÓW WORDPRESS === */
body.zrzutki-fullscreen-view #wpadminbar,
body.zrzutki-fullscreen-view header:not(.nav-bar):not(.form-header),
body.zrzutki-fullscreen-view footer:not(.form-footer),
body.zrzutki-fullscreen-view .site-header,
body.zrzutki-fullscreen-view .site-footer,
body.zrzutki-fullscreen-view .wp-site-blocks > header,
body.zrzutki-fullscreen-view .wp-site-blocks > footer {
    display: none !important;
}

/* === ANIMACJE === */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(16px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInScale {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.announcement-card {
    animation: fadeInUp 400ms cubic-bezier(0.16, 1, 0.3, 1) !important;
    animation-fill-mode: both !important;
}

.announcement-card:nth-child(1) { animation-delay: 50ms !important; }
.announcement-card:nth-child(2) { animation-delay: 100ms !important; }
.announcement-card:nth-child(3) { animation-delay: 150ms !important; }
.announcement-card:nth-child(4) { animation-delay: 200ms !important; }
.announcement-card:nth-child(5) { animation-delay: 250ms !important; }
.announcement-card:nth-child(6) { animation-delay: 300ms !important; }

/* === MODAL W KONTEKŚCIE AJAX (wewnątrz .zrzutki-modal-overlay) === */
.zrzutki-modal-overlay .modal {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-width: 100vw !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    background: var(--color-bg, #FAFAFA) !important;
    border-radius: 0 !important;
    z-index: 100000 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    animation: modalSlideUp 300ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}

@keyframes modalSlideUp {
    from {
        opacity: 0;
        transform: translateY(100%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Modal jest flex-column z overflow:hidden — sticky nie działa (brak scroll-ancestora).
   Zamiast tego polegamy na flex: nav-bar / header / footer dostają flex: 0 0 auto
   i są naturalnie widoczne na górze i dole, body bierze flex: 1 1 auto z min-height: 0. */
.zrzutki-modal-overlay .modal .nav-bar {
    position: relative !important;
    top: auto !important;
    z-index: 100 !important;
    background: rgba(250, 250, 250, 0.95) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid var(--color-divider, rgba(0,0,0,0.06)) !important;
}

.zrzutki-modal-overlay .modal .modal__header {
    position: relative !important;
    top: auto !important;
    z-index: 99 !important;
    background: rgba(250, 250, 250, 0.95) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
}

.zrzutki-modal-overlay .modal .modal__body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
}

.zrzutki-modal-overlay .modal .nav-bar,
.zrzutki-modal-overlay .modal .modal__header,
.zrzutki-modal-overlay .modal .modal__footer {
    flex: 0 0 auto !important;
}

.zrzutki-modal-overlay .modal .modal__footer {
    position: relative !important;
    bottom: auto !important;
    background: rgba(250, 250, 250, 0.98) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-top: 1px solid var(--color-divider, rgba(0,0,0,0.06)) !important;
    z-index: 98 !important;
}

/* Style dla przycisków udostępniania w modalu AJAX */
.zrzutki-modal-overlay .share-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: var(--space-2, 8px) !important;
    padding-top: var(--space-3, 12px) !important;
    border-top: 1px solid var(--color-divider, rgba(0,0,0,0.06)) !important;
}

.zrzutki-modal-overlay .share-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: var(--space-2, 8px) !important;
    height: 40px !important;
    padding: 0 var(--space-3, 12px) !important;
    background: var(--color-surface-subtle, #F5F5F5) !important;
    border: 1px solid var(--color-border, rgba(0,0,0,0.08)) !important;
    border-radius: 9999px !important;
    font-size: var(--text-sm, 17px) !important;
    font-weight: 500 !important;
    color: var(--color-text-secondary, #666) !important;
    cursor: pointer !important;
    transition: all 200ms ease !important;
}

.zrzutki-modal-overlay .share-btn:hover {
    background: var(--color-surface, #FFFFFF) !important;
    border-color: var(--color-border-strong, rgba(0,0,0,0.12)) !important;
    color: var(--color-text-primary, #1A1A1A) !important;
}

.zrzutki-modal-overlay .share-btn--facebook {
    background: #1877f2 !important;
    border-color: #1877f2 !important;
    color: white !important;
}

.zrzutki-modal-overlay .share-btn--twitter {
    background: #000 !important;
    border-color: #000 !important;
    color: white !important;
}

.zrzutki-modal-overlay .share-btn--whatsapp {
    background: #25d366 !important;
    border-color: #25d366 !important;
    color: white !important;
}

/* Responsywność dla modala w desktop */
@media (min-width: 640px) {
    .zrzutki-modal-overlay .modal {
        inset: auto !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: calc(100% - 32px) !important;
        max-width: 560px !important;
        height: auto !important;
        max-height: calc(100vh - 32px) !important;
        border-radius: 16px !important;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
        animation: modalFadeInScale 300ms cubic-bezier(0.16, 1, 0.3, 1) !important;
    }

    @keyframes modalFadeInScale {
        from {
            opacity: 0;
            transform: translate(-50%, -50%) scale(0.95);
        }
        to {
            opacity: 1;
            transform: translate(-50%, -50%) scale(1);
        }
    }

    .zrzutki-modal-overlay .modal .modal__header {
        top: 0 !important;
        border-radius: 16px 16px 0 0 !important;
    }

    .zrzutki-modal-overlay .modal .modal__footer {
        border-radius: 0 0 16px 16px !important;
    }
}

@media (min-width: 1024px) {
    .zrzutki-modal-overlay .modal {
        max-width: 680px !important;
    }
}

/* === CLOSE BUTTON (X) — IN HERO IMAGE TOP-RIGHT === */
.detail-hero {
    position: relative !important;
}

.modal__close--hero {
    position: absolute !important;
    top: calc(12px + var(--safe-area-top, 0px)) !important;
    right: 12px !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(0, 0, 0, 0.55) !important;
    color: #fff !important;
    border-radius: 9999px !important;
    z-index: 10 !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35) !important;
    transition: background 200ms ease, transform 200ms ease !important;
    text-decoration: none !important;
}

.modal__close--hero:hover {
    background: rgba(0, 0, 0, 0.75) !important;
    transform: scale(1.05) !important;
}

.modal__close--hero svg {
    width: 22px !important;
    height: 22px !important;
    color: #fff !important;
    stroke: #fff !important;
}

.modal__title--visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* === FOOTER (CTA + share) — natywny flex (nie sticky, bo modal ma overflow:hidden) === */
.zrzutki-modal-overlay .modal .modal__footer--floating {
    position: relative !important;
    z-index: 5 !important;
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08) !important;
    padding: 12px 16px !important;
    padding-bottom: calc(12px + var(--safe-area-bottom, 0px)) !important;
}

.zrzutki-modal-overlay .modal .modal__footer--floating .modal__footer-actions {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    margin-bottom: 8px !important;
}

.btn--floating-cta {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 480px !important;
    min-height: 52px !important;
    padding: 14px 24px !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    border-radius: 9999px !important;
    text-decoration: none !important;
    box-shadow: 0 6px 20px rgba(0, 102, 255, 0.25) !important;
}

@media (min-width: 640px) {
    .modal__close--hero {
        top: 16px !important;
        right: 16px !important;
    }
}

/* ===================================================================
   RADICAL ISOLATED DETAIL MODAL  —  prefix `.zd-`
   Wyizolowany template AJAX-modala (templates/pojedyncza-modal.php).
   CSS Grid 3 wierszy (auto/1fr/auto) gwarantuje zawsze widoczny footer.
   Wszystko hex + !important — brak zależności od var() i klas motywu.
   =================================================================== */

/* SHELL — kontener pełnoekranowy / wycentrowany na desktopie */
.zrzutki-modal-overlay .zd-shell,
html body .zrzutki-modal-overlay .zd-shell {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #FAFAFA !important;
    color: #1A1A1A !important;
    z-index: 100000 !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    grid-template-columns: 100% !important;
    overflow: hidden !important;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", system-ui, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    box-sizing: border-box !important;
    transform: none !important;
    animation: zdSlideUp 320ms cubic-bezier(0.16, 1, 0.3, 1) both !important;
}

.zrzutki-modal-overlay .zd-shell *,
.zrzutki-modal-overlay .zd-shell *::before,
.zrzutki-modal-overlay .zd-shell *::after {
    box-sizing: border-box !important;
    font-family: inherit !important;
}

@keyframes zdSlideUp {
    from { opacity: 0; transform: translateY(40px); }
    to   { opacity: 1; transform: translateY(0); }
}

@media (min-width: 640px) {
    .zrzutki-modal-overlay .zd-shell,
    html body .zrzutki-modal-overlay .zd-shell {
        inset: auto !important;
        top: 50% !important;
        left: 50% !important;
        right: auto !important;
        bottom: auto !important;
        width: calc(100% - 32px) !important;
        max-width: 600px !important;
        height: auto !important;
        max-height: calc(100vh - 32px) !important;
        border-radius: 16px !important;
        box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25) !important;
        animation: zdFadeScale 280ms cubic-bezier(0.16, 1, 0.3, 1) both !important;
    }

    @keyframes zdFadeScale {
        from { opacity: 0; transform: translate(-50%, -50%) scale(0.96); }
        to   { opacity: 1; transform: translate(-50%, -50%) scale(1); }
    }
}

@media (min-width: 1024px) {
    .zrzutki-modal-overlay .zd-shell,
    html body .zrzutki-modal-overlay .zd-shell {
        max-width: 720px !important;
    }
}

/* HERO (row 1) */
.zrzutki-modal-overlay .zd-hero {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 4 / 3 !important;
    overflow: hidden !important;
    background: #f0f0f0 !important;
    margin: 0 !important;
    padding: 0 !important;
}
.zrzutki-modal-overlay .zd-hero img,
.zrzutki-modal-overlay .zd-hero .zd-hero__img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    margin: 0 !important;
    border: 0 !important;
}
.zrzutki-modal-overlay .zd-hero__placeholder {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #bbb !important;
    background: #f0f0f0 !important;
}
.zrzutki-modal-overlay .zd-badge {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    padding: 6px 12px !important;
    background: rgba(0,102,255,0.95) !important;
    color: #fff !important;
    border-radius: 9999px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
    z-index: 2 !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}
.zrzutki-modal-overlay .zd-badge--warning { background: rgba(255,149,0,0.95) !important; }
.zrzutki-modal-overlay .zd-close {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(0,0,0,0.6) !important;
    color: #fff !important;
    border-radius: 9999px !important;
    text-decoration: none !important;
    z-index: 3 !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.35) !important;
    transition: background 200ms ease, transform 200ms ease !important;
    border: 0 !important;
    cursor: pointer !important;
}
.zrzutki-modal-overlay .zd-close:hover {
    background: rgba(0,0,0,0.8) !important;
    transform: scale(1.05) !important;
}
.zrzutki-modal-overlay .zd-close svg { color: #fff !important; stroke: #fff !important; }

@media (min-width: 640px) {
    .zrzutki-modal-overlay .zd-hero {
        border-radius: 16px 16px 0 0 !important;
    }
}

/* BODY (row 2) — scrollowalne; min-height: 0 jest WYMAGANE w gridzie */
.zrzutki-modal-overlay .zd-body {
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 20px !important;
    background: #FAFAFA !important;
}
.zrzutki-modal-overlay .zd-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    color: #1A1A1A !important;
    letter-spacing: -0.01em !important;
}
.zrzutki-modal-overlay .zd-author {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 0 20px !important;
}
.zrzutki-modal-overlay .zd-author__avatar {
    width: 44px !important;
    height: 44px !important;
    flex: 0 0 44px !important;
    border-radius: 50% !important;
    background: #0066FF !important;
    color: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 600 !important;
    font-size: 16px !important;
}
.zrzutki-modal-overlay .zd-author__name { font-weight: 600 !important; color: #1A1A1A !important; font-size: 16px !important; line-height: 1.3 !important; }
.zrzutki-modal-overlay .zd-author__meta { font-size: 13px !important; color: #666 !important; line-height: 1.4 !important; margin-top: 2px !important; }
.zrzutki-modal-overlay .zd-goal {
    background: linear-gradient(135deg, #E6F0FF, #F0F6FF) !important;
    border-radius: 12px !important;
    padding: 16px !important;
    margin: 0 0 12px !important;
}
.zrzutki-modal-overlay .zd-goal__label { font-size: 13px !important; color: #666 !important; margin-bottom: 4px !important; text-transform: uppercase !important; letter-spacing: 0.04em !important; font-weight: 500 !important; }
.zrzutki-modal-overlay .zd-goal__amount { font-size: 24px !important; font-weight: 700 !important; color: #0066FF !important; line-height: 1.2 !important; }
.zrzutki-modal-overlay .zd-info {
    background: #F5F5F5 !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
    margin: 0 0 12px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}
.zrzutki-modal-overlay .zd-info__label { font-size: 13px !important; color: #666 !important; }
.zrzutki-modal-overlay .zd-info__value { font-weight: 600 !important; color: #1A1A1A !important; font-size: 15px !important; }
.zrzutki-modal-overlay .zd-notice { padding: 12px 16px !important; border-radius: 12px !important; margin: 0 0 16px !important; font-size: 14px !important; line-height: 1.5 !important; }
.zrzutki-modal-overlay .zd-notice--error { background: #FFEBEA !important; color: #991b1b !important; }
.zrzutki-modal-overlay .zd-notice--warning { background: #FFF8E6 !important; color: #92400e !important; }
.zrzutki-modal-overlay .zd-desc { margin: 16px 0 0 !important; }
.zrzutki-modal-overlay .zd-desc__label { font-size: 12px !important; color: #666 !important; margin: 0 0 8px !important; text-transform: uppercase !important; letter-spacing: 0.05em !important; font-weight: 600 !important; }
.zrzutki-modal-overlay .zd-desc__text { font-size: 16px !important; line-height: 1.6 !important; color: #333 !important; }
.zrzutki-modal-overlay .zd-desc__text p { margin: 0 0 12px !important; }
.zrzutki-modal-overlay .zd-desc__text p:last-child { margin-bottom: 0 !important; }
.zrzutki-modal-overlay .zd-desc__text a { color: #0066FF !important; text-decoration: underline !important; }

/* FOOTER (row 3) — ZAWSZE widoczny dzięki gridowi auto/1fr/auto */
.zrzutki-modal-overlay .zd-footer,
html body .zrzutki-modal-overlay .zd-footer {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px)) !important;
    background: #ffffff !important;
    border-top: 1px solid rgba(0,0,0,0.08) !important;
    box-shadow: 0 -4px 16px rgba(0,0,0,0.06) !important;
    z-index: 10 !important;
    position: relative !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    margin: 0 !important;
}

@media (min-width: 640px) {
    .zrzutki-modal-overlay .zd-footer,
    html body .zrzutki-modal-overlay .zd-footer {
        border-radius: 0 0 16px 16px !important;
    }
}

.zrzutki-modal-overlay .zd-cta,
html body .zrzutki-modal-overlay .zd-cta {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    width: 100% !important;
    min-height: 52px !important;
    padding: 14px 24px !important;
    background: #0066FF !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 9999px !important;
    text-decoration: none !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    box-shadow: 0 6px 20px rgba(0,102,255,0.3) !important;
    transition: background 200ms ease, transform 100ms ease !important;
    cursor: pointer !important;
    visibility: visible !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
}
.zrzutki-modal-overlay .zd-cta:hover { background: #0052CC !important; color: #ffffff !important; }
.zrzutki-modal-overlay .zd-cta:active { transform: scale(0.98) !important; }
.zrzutki-modal-overlay .zd-cta svg { flex-shrink: 0 !important; color: #ffffff !important; stroke: #ffffff !important; }
.zrzutki-modal-overlay .zd-cta--secondary { background: #F0F0F0 !important; color: #1A1A1A !important; box-shadow: none !important; }
.zrzutki-modal-overlay .zd-cta--secondary:hover { background: #E5E5E5 !important; color: #1A1A1A !important; }

.zrzutki-modal-overlay .zd-share {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}
.zrzutki-modal-overlay .zd-share-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    height: 36px !important;
    padding: 0 14px !important;
    background: #F5F5F5 !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    border-radius: 9999px !important;
    color: #666 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 150ms ease !important;
}
.zrzutki-modal-overlay .zd-share-btn:hover { transform: translateY(-1px) !important; }
.zrzutki-modal-overlay .zd-share-btn--facebook { background: #1877f2 !important; color: #fff !important; border-color: #1877f2 !important; }
.zrzutki-modal-overlay .zd-share-btn--twitter  { background: #000000 !important; color: #fff !important; border-color: #000 !important; }
.zrzutki-modal-overlay .zd-share-btn--whatsapp { background: #25d366 !important; color: #fff !important; border-color: #25d366 !important; }
.zrzutki-modal-overlay .zd-share-btn svg { flex-shrink: 0 !important; }