.custom-map-wrapper {
    position: relative;
    width: 100%;
}

.leaflet-control-attribution {
    display: none !important;
}

.map-filters {
    max-width: 1370px;
    margin: 0 auto;
    display: flex;
    gap: 12px;
    margin-bottom: 28px;
    flex-wrap: wrap;
}

.map-filter-select {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
    min-width: 200px;
}

.map-filter-select label {
    font-weight: 600;
}

.map-filter-select select {
    width: 100%;
    padding: 12px 24px;
    border: 2px solid #726DE3;
    border-radius: 999px;
    font-weight: 600;
    color: #726DE3;
    background-color: #fff;
    cursor: pointer;
    transition: all 0.2s ease;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='8' viewBox='0 0 16 8' fill='none'%3E%3Cpath d='M0.996733 -6.55003e-07C1.26186 0.000232759 1.51604 0.105743 1.7034 0.293333L6.81807 5.408C6.97284 5.56281 7.15659 5.68562 7.35883 5.7694C7.56106 5.85319 7.77783 5.89631 7.99673 5.89631C8.21564 5.89631 8.4324 5.85319 8.63464 5.7694C8.83688 5.68562 9.02063 5.56281 9.1754 5.408L14.2867 0.3C14.4753 0.117842 14.7279 0.0170474 14.9901 0.0193259C15.2523 0.0216043 15.5031 0.126773 15.6886 0.312181C15.874 0.49759 15.9791 0.748402 15.9814 1.0106C15.9837 1.2728 15.8829 1.5254 15.7007 1.714L10.5934 6.822C9.90522 7.50882 8.97267 7.89456 8.0004 7.89456C7.02813 7.89456 6.09557 7.50882 5.4074 6.822L0.292733 1.70733C0.152988 1.56768 0.0577411 1.38976 0.0190124 1.19603C-0.0197182 1.0023 -0.000194585 0.801438 0.0751171 0.618792C0.15043 0.436145 0.278156 0.2799 0.442179 0.169771C0.606201 0.0596433 0.79917 0.000567535 0.996733 -6.55003e-07Z' fill='%23000000'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 24px center;
    padding-right: 48px;
}

.map-filter-select select:hover {
    background-color: #E3E7FC;
}

.map-filter-select select:focus {
    outline: none;
    background-color: #E3E7FC;
}

.custom-map {
    width: 100%;
    overflow: hidden;
    border: 3px solid #8D8FED;
    border-radius: 56px;
}

.country-fill {
    stroke: #7B68EE;
    stroke-width: 3;
    fill: #E8DEFF;
    fill-opacity: 0.15;
}

.region-boundaries {
    stroke: #7B68EE;
    stroke-width: 2;
    fill: none;
    opacity: 0.8;
}

.leaflet-top .leaflet-control {
    margin-top: 30px !important;
}

.leaflet-left .leaflet-control {
    margin-left: 30px !important;
}

.leaflet-control-zoom {
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
    background: transparent !important;
}

.leaflet-control-zoom a {
    width: 44px !important;
    height: 44px !important;
    line-height: 1.65 !important;
    font-size: 24px !important;
    font-weight: 400 !important;
    color: #000 !important;
    background: #ADB4F4 !important;
    border-radius: 50% !important;
    transition: all 0.2s ease;
    margin-bottom: 8px !important;
    box-shadow: 0 2px 8px rgba(114, 109, 227, 0.2) !important;
}

.leaflet-control-zoom a:hover {
    background: #726DE3 !important;
    color: white !important;
}

.leaflet-control-zoom a.leaflet-disabled {
    opacity: 0.5 !important;
}

.leaflet-control-zoom a span {
    line-height: 1.65 !important;
}

.leaflet-control-zoom-in {
    border-bottom: 2px solid #726DE3 !important;
}

.leaflet-control-zoom-out {
    margin-top: 0 !important;
}

.leaflet-bar a {
    border-bottom: none !important;
}

.custom-marker {
    cursor: pointer;
    transition: all 0.2s ease;
}

.custom-marker:hover {
    transform: scale(1.15);
}

.custom-marker svg {
    filter: drop-shadow(0 2px 4px rgba(123, 104, 238, 0.4));
}

.custom-cluster-icon {
    background-color: #4169E1;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: bold;
    border: 4px solid white;
    box-shadow: 0 2px 8px rgba(65, 105, 225, 0.5);
    cursor: pointer;
    transition: all 0.2s ease;
}

.custom-cluster-icon:hover {
    transform: scale(1.1);
    box-shadow: 0 3px 12px rgba(65, 105, 225, 0.7);
}

.custom-cluster-icon span {
    font-size: 16px;
    line-height: 1;
}

.marker-cluster-small,
.marker-cluster-medium,
.marker-cluster-large {
    background-color: transparent !important;
}

.marker-cluster-small div,
.marker-cluster-medium div,
.marker-cluster-large div {
    background-color: transparent !important;
}

.odbornik-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.odbornik-modal-overlay.active {
    opacity: 1;
    visibility: visible;
}

.odbornik-modal {
    background: #E3E7FC;
    border: 2px solid #ADB4F4;
    border-radius: 32px;
    max-width: 400px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    position: relative;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    transform: scale(0.9);
    transition: transform 0.3s ease;
    overflow: hidden;
}

.odbornik-modal-overlay.active .odbornik-modal {
    transform: scale(1);
}

.odbornik-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.5rem 1.5rem 1rem;
    background: #E3E7FC;
    flex-shrink: 0;
}

.odbornik-modal-header.scrolled {
    border-bottom: 2px solid #ADB4F4;
}

.odbornik-modal-header span {
    font-size: 0.875rem;
    font-weight: 600;
    color: #3C3679;
}

.odbornik-modal-close {
    cursor: pointer;
    transition: transform 0.2s ease;
}

.odbornik-modal-close:hover {
    transform: rotate(90deg);
}

.odbornik-modal-content {
    flex: 1;
    overflow-y: auto;
    padding: 0 1.5rem 1.5rem;
}

.odbornik-modal-top {
    margin-bottom: 1.5rem;
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
}

.odbornik-avatar {
    padding: 1.25rem;
    border-radius: 16px;
    border: 2px solid #ADB4F4;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.odbornik-avatar svg {
    width: 32px;
    height: 32px;
    color: #7B68EE;
}

.odbornik-info {
    flex: 1;
}

.odbornik-name {
    line-height: 24px;
}

.odbornik-name span {
    color: #3C3679;
    font-weight: 600;
}

.odbornik-field {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #ADB4F4;
    font-size: 0.875rem;
    gap: 1rem;
}

.odbornik-field:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.odbornik-field-info {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
}

.odbornik-field-info strong {
    color: #3C3679;
    font-weight: 600;
}

.odbornik-field-info span {
    line-height: 20px;
}

.odbornik-field-url {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    color: #000;
    text-decoration: none;
}

.odbornik-field-url span {
    text-decoration: underline;
}

.odbornik-field-url svg {
    flex-shrink: 0;
}

.odbornik-field-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    cursor: pointer;
}

.odbornik-field-icon:hover {
    opacity: 0.7;
}

.odbornik-field-icon svg {
    width: 16px;
    height: 16px;
}

.odbornik-field-actions {
    display: flex;
    gap: 0.75rem;
    flex-shrink: 0;
}

.odbornik-contact-icon {
    background: #ADB4F4;
    border-radius: 999px;
    text-decoration: none;
}

.odbornik-recenzie {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 0.5rem;
}

.odbornik-recenzia {
    padding: 1.5rem;
    border: 2px solid #ADB4F4;
    border-radius: 24px;
}

.recenzia-header {
    display: flex;
    justify-content: space-between;
    padding-bottom: 1rem;
    border-bottom: 2px solid #ADB4F4;
}

.recenzia-stars {
    margin: 1rem 0;
    display: flex;
    gap: 0.25rem;
}

.recenzia-text {
    font-size: 12px;
    line-height: 18px;
}

.custom-map.loading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 40px;
    height: 40px;
    border: 3px solid #f3f3f3;
    border-top: 3px solid #7B68EE;
    border-radius: 50%;
    animation: custom-map-spin 1s linear infinite;
}

@keyframes custom-map-spin {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

@media (max-width: 768px) {
    .map-filters {
        flex-direction: column;
    }
    
    .map-filter-select {
        min-width: 100%;
    }
    
    .odbornik-modal {
        max-width: 100%;
        margin: 0;
        max-height: 85vh;
    }
}