/**
 * Frontend Styles for Riedmair Filial Manager
 */

/* Map container */
.rfm-map-container {
    margin-bottom: 30px;
}

.rfm-map {
    width: 100%;
    height: 500px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* Info window */
.rfm-info-window {
    padding: 10px;
    max-width: 250px;
    background-color: #ffffff;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.rfm-info-window h3 {
    margin: 0 0 8px;
    padding: 0;
    font-size: 18px;
    color: #8B4513;
    font-weight: 600;
}

.rfm-info-window p {
    margin: 0 0 8px;
    font-size: 14px;
    line-height: 1.4;
    color: #333;
}

.rfm-info-window .rfm-address {
    font-style: normal;
    margin-bottom: 5px;
}

.rfm-info-window .rfm-hours {
    font-size: 13px;
    color: #666;
}

/* Filiale details */
.rfm-filiale-details {
    margin-bottom: 30px;
}

.rfm-filiale-content {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-bottom: 30px;
}

.rfm-filiale-description {
    flex: 1 1 300px;
}

.rfm-filiale-info {
    flex: 1 1 300px;
}

.rfm-filiale-info h3 {
    margin-top: 0;
    color: #e74c3c;
    border-bottom: 2px solid #f0f0f0;
    padding-bottom: 8px;
    margin-bottom: 15px;
}

.rfm-filiale-address,
.rfm-filiale-contact,
.rfm-filiale-hours {
    margin-bottom: 20px;
}

.rfm-filiale-phone,
.rfm-filiale-email {
    margin: 5px 0;
}

.rfm-opening-hours {
    line-height: 1.6;
}

/* Filialen liste */
.rfm-filialen-liste {
    margin-bottom: 30px;
}

.rfm-filiale-item {
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f0f0f0;
}

.rfm-filiale-item:last-child {
    border-bottom: none;
}

.rfm-filiale-title {
    margin-top: 0;
    margin-bottom: 15px;
}

.rfm-filiale-title a {
    color: #e74c3c;
    text-decoration: none;
}

.rfm-filiale-title a:hover {
    text-decoration: underline;
}

.rfm-filiale-content {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.rfm-filiale-excerpt {
    flex: 1 1 100%;
    margin-bottom: 15px;
}

.rfm-filiale-info {
    flex: 1 1 300px;
}

.rfm-filiale-info > div {
    margin-bottom: 10px;
    line-height: 1.5;
}

.rfm-filiale-info strong {
    display: inline-block;
    min-width: 120px;
    color: #333;
}

.rfm-more-link {
    display: inline-block;
    margin-top: 10px;
    padding: 5px 15px;
    background-color: #e74c3c;
    color: #fff;
    text-decoration: none;
    border-radius: 3px;
    transition: background-color 0.2s;
}

.rfm-more-link:hover {
    background-color: #c0392b;
    color: #fff;
}

/* Error message */
.rfm-error {
    padding: 10px 15px;
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
    border-radius: 4px;
    margin-bottom: 20px;
}

/* Responsive styles */
@media (max-width: 768px) {
    .rfm-filiale-content {
        flex-direction: column;
    }
    
    .rfm-filiale-info {
        width: 100%;
    }
}

/* Store list with map */
.rfm-store-list-container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.rfm-store-list {
    flex: 1 1 300px;
    max-height: 500px;
    overflow-y: auto;
    padding: 10px;
    background-color: #f9f9f9;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.rfm-store-item {
    padding: 10px;
    border-bottom: 1px solid #eee;
    cursor: pointer;
    transition: background-color 0.2s;
}

.rfm-store-item:last-child {
    border-bottom: none;
}

.rfm-store-item:hover,
.rfm-store-item.active {
    background-color: #e74c3c;
    color: #fff;
}

.rfm-store-item h4 {
    margin: 0 0 5px;
    font-size: 16px;
}

.rfm-store-item p {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
}

.rfm-store-item:hover h4,
.rfm-store-item.active h4 {
    color: #fff;
}

.rfm-map-with-list {
    flex: 2 1 600px;
}