/* ── Cluster méret: small (< 10) ── */
.marker-cluster-small {
    background-color: rgba(242, 34, 59, 0.20);
}
.marker-cluster-small div {
    background-color: rgba(242, 34, 59, 0.90);
    color: #fff;
}

/* ── Cluster méret: medium (10–99) ── */
.marker-cluster-medium {
    background-color: rgba(180, 18, 38, 0.22);
}
.marker-cluster-medium div {
    background-color: rgba(180, 18, 38, 0.92);
    color: #fff;
}

/* ── Cluster méret: large (100+) ── */
.marker-cluster-large {
    background-color: rgba(110, 8, 22, 0.25);
}
.marker-cluster-large div {
    background-color: rgba(110, 8, 22, 0.95);
    color: #fff;
}

/* ── Dark mode ── */
html[data-bs-theme="dark"] .marker-cluster-small {
    background-color: rgba(242, 34, 59, 0.22);
}
html[data-bs-theme="dark"] .marker-cluster-small div {
    background-color: rgba(242, 34, 59, 0.95);
    color: #fff;
}

html[data-bs-theme="dark"] .marker-cluster-medium {
    background-color: rgba(180, 18, 38, 0.25);
}
html[data-bs-theme="dark"] .marker-cluster-medium div {
    background-color: rgba(180, 18, 38, 0.95);
    color: #fff;
}

html[data-bs-theme="dark"] .marker-cluster-large {
    background-color: rgba(110, 8, 22, 0.28);
}
html[data-bs-theme="dark"] .marker-cluster-large div {
    background-color: rgba(110, 8, 22, 0.98);
    color: #fff;
}

/* IE 6-8 fallback colors */
.leaflet-oldie .marker-cluster-small {
    background-color: rgb(242, 34, 59);
}
.leaflet-oldie .marker-cluster-small div {
    background-color: rgb(200, 20, 42);
}
.leaflet-oldie .marker-cluster-medium {
    background-color: rgb(180, 18, 38);
}
.leaflet-oldie .marker-cluster-medium div {
    background-color: rgb(145, 12, 28);
}
.leaflet-oldie .marker-cluster-large {
    background-color: rgb(130, 10, 24);
}
.leaflet-oldie .marker-cluster-large div {
    background-color: rgb(110, 8, 22);
}

/* ── Base styles ── */
.marker-cluster {
    background-clip: padding-box;
    border-radius: 20px;
}

.marker-cluster div {
    width: 30px;
    height: 30px;
    margin-left: 5px;
    margin-top: 5px;
    text-align: center;
    border-radius: 15px;
    font: 12px "Helvetica Neue", Arial, Helvetica, sans-serif;
}

.marker-cluster span {
    line-height: 30px;
}