/* Prosty, jasny panel boczny z overlayem */
:root { --zr-bg: #fff; --zr-fg: #333; --zr-muted:#666; --zr-overlay: rgba(0,0,0,.35); }

.zr-no-scroll { overflow: hidden; }

.zr-overlay {
    position: fixed; inset: 0; background: transparent; opacity: 0; visibility: hidden;
    transition: opacity .2s ease; z-index: 1040;
}
.zr-overlay.is-open { background: var(--zr-overlay); opacity: 1; visibility: visible; }

/* Panel 560px z prawej (100% na mobile) */
.zr-modal {
    position: fixed; top: 0; right: 0; height: 100vh; width: 100%; max-width: 560px;
    background: var(--zr-bg); color: var(--zr-fg); box-shadow: -2px 0 16px rgba(0,0,0,.2);
    transform: translateX(100%); transition: transform .25s ease; z-index: 1050;
    display: flex; flex-direction: column;
}
.zr-modal.is-open { transform: translateX(0); }

@media (min-width: 768px) {
    .zr-modal { width: 560px; }
}

.zr-modal__header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 16px; border-bottom: 1px solid #eee;
}
.zr-modal__title { margin: 0; font-size: 1.1rem; }
.zr-modal__close {
    border: 0; background: transparent; cursor: pointer; padding: 6px;
}
.zr-modal__content {
    padding: 16px; overflow: auto; height: calc(100vh - 56px);
}

/* Karty i typografia */
.zr-section__title { margin: 0 0 8px; font-size: 1rem; }
.zr-muted { color: var(--zr-muted); }
.zr-richtext p { margin: 0 0 8px; }
.zr-richtext ul { margin: 8px 0 8px 20px; }

.zr-card {
    border: 1px solid #eee; border-radius: 8px; margin: 12px 0; overflow: hidden; background: #fff;
}
.zr-card__heading { display: flex; gap: 8px; align-items: center; padding: 10px 12px; background:#fafafa; border-bottom:1px solid #eee; }
.zr-card__body { padding: 10px 12px; }
.zr-link { text-decoration: underline; }
.zr-loading, .zr-error { color: var(--zr-muted); }

/* Grupka przycisków (dziedziczy style motywu Presty dla .btn) */
.zr-buttons { display: flex; gap: 8px; flex-wrap: wrap; }

/* Stylowanie treści safety */
.zr-safety-content p {
    margin-bottom: 0.8rem;   /* odstęp między akapitami */
    line-height: 1.5;        /* większa czytelność */
    color: #333;             /* ciemnoszary tekst */
}

.zr-safety-content strong {
    font-weight: 600;
    color: #000;             /* mocniej odróżnione pogrubienia */
}

.zr-safety-content ul {
    margin: 0.5rem 0 0.5rem 1.2rem;
    padding: 0;
}

.zr-safety-content li {
    margin-bottom: 0.4rem;
}

/* Kontener na przyciski */
.zr-buttons {
    display: flex;
    flex-direction: column; /* jeden pod drugim */
    align-items: flex-start; /* do lewej */
    gap: 0.5rem; /* odstęp między przyciskami */
    margin: 1rem 0;
}

/* Styl przycisku */
.zr-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 1rem;
    border: 1px solid #ccc;
    border-radius: 8px;   /* zaokrąglone rogi */
    background: #fff;
    color: #333;
    font-size: 0.95rem;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s;
    text-decoration: none;
    width: 100%;
}

@media (min-width: 768px) {
    .zr-btn { max-width: 360px; }
}

.zr-btn:hover {
    background: #fafafa;
    border-color: #8376d3;
    text-decoration: none;
}

/* Ikonka */
.zr-btn i.material-icons {
    font-size: 18px;
    margin-right: 0.5rem;
    color: #666;
}


/* Legal block under buttons */
.zr-legal { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #eee; }
.zr-legal__title { display:flex; align-items:center; font-size:1rem; margin:.75rem 0 .5rem; }
.zr-legal__title .material-icons { font-size:20px; margin-right:.4rem; color:#666; }
.zr-legal__list { margin:.25rem 0 .75rem 1.25rem; padding:0; }
.zr-legal__list li { margin:.35rem 0; }
.zr-badges { display:flex; flex-wrap:wrap; gap:.5rem; margin-left:0; }
.zr-badge { display:inline-block; border:1px solid #ccc; border-radius:8px; padding:.25rem .6rem; font-size:1rem; background:#fff; }
.zr-legal__contact { margin:.5rem 0; }
.zr-legal__footnote { font-size:.8rem; color:#666; margin-top:.5rem; }
@media (max-width:576px){ .zr-legal__list { margin-left:1rem; } }

.zr-badges {
    list-style: none;     /* usuwa znaczniki */
    padding-left: 0;      /* wyrównuje do lewej */
    margin: 0;            /* opcjonalnie zeruje margines */
}

.zr-badges li::marker {
    content: none;        /* dodatkowa gwarancja, że marker znika */
}