/*
 * Exploro Theme Main Stylesheet
 * Version: 1.0.0
 */

/* ==========================================================================
   1. SETUP & GLOBALS
   ========================================================================== */
:root {
    /* Colors */
    --color-bg: #F9F9F9;
    --color-text: #222222;
    --color-text-light: #666;
    --color-primary: #0D5D56; /* Deep Emerald */
    --color-accent: #C57B57;  /* Terracotta */
    --color-rating: #D4AF37;  /* Golden Ochre */
    --color-border: #EAEAEA;
    --color-white: #FFFFFF;

    /* Typography */
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-heading: 'Playfair Display', "Georgia", "Times New Roman", serif;
    
    /* Spacing */
    --spacing-xs: 0.5rem;  /* 8px */
    --spacing-sm: 1rem;    /* 16px */
    --spacing-md: 1.5rem;  /* 24px */
    --spacing-lg: 2.5rem;  /* 40px */
    --spacing-xl: 4rem;    /* 64px */
    
    /* Misc */
    --border-radius: 8px;
    --transition-fast: all 0.2s ease-in-out;
}

*, *::before, *::after {
    box-sizing: border-box;
}

body {
    background-color: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.container {
    width: 100%;
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--spacing-md);
    padding-right: var(--spacing-md);
}

/* НОВЫЙ широкий контейнер */
.container-wide {
    width: 100%;
    max-width: 1440px; /* Делаем шире */
    margin: 0 auto;
    padding: 0 var(--spacing-md);
}
/* ... */
/* НОВЫЙ грид на 4 колонки */
.places-grid--four-cols {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: var(--spacing-md);
}
@media (min-width: 640px) {
    .places-grid--four-cols { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .places-grid--four-cols { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1400px) {
    .places-grid--four-cols { grid-template-columns: repeat(4, 1fr); }
}
/* Адаптация макета с сайдбаром */
.page-content-with-sidebar.layout-wide {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}
@media (min-width: 1024px) {
    .page-content-with-sidebar.layout-wide { flex-direction: row; }
    .page-content-with-sidebar.layout-wide .main-content-column { flex: 1; }
    .page-content-with-sidebar.layout-wide .sidebar { width: 340px; flex-shrink: 0; }
}

.container.narrow-container {
    max-width: 820px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    line-height: 1.2;
    margin: 0 0 var(--spacing-sm) 0;
    font-weight: 700;
}

h1 { font-size: 3rem; }
h2 { font-size: 2.25rem; }
h3 { font-size: 1.75rem; }

a {
    color: var(--color-primary);
    text-decoration: none;
    transition: var(--transition-fast);
}
a:hover {
    color: var(--color-accent);
}

img, video {
    max-width: 100%;
    height: auto;
    display: block;
}

hr.section-divider {
    border: 0;
    height: 1px;
    background-color: var(--color-border);
    margin: var(--spacing-xl) 0;
}

/* ==========================================================================
   2. HEADER & NAVIGATION
   ========================================================================== */
.site-header {
    background-color: var(--color-white);
    padding: var(--spacing-sm) 0;
    border-bottom: 1px solid var(--color-border);
}
.site-header__container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.site-branding .custom-logo { max-height: 50px; width: auto; }
.site-branding .site-title-link { font-family: var(--font-heading); font-size: 1.5rem; color: var(--color-text); }

.main-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: var(--spacing-md);
}
.main-navigation a {
    color: var(--color-text);
    font-weight: 500;
    padding-bottom: 5px;
    border-bottom: 2px solid transparent;
}
.main-navigation .current-menu-item a,
.main-navigation a:hover {
    color: var(--color-primary);
    border-bottom-color: var(--color-primary);
}

.header-actions {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}
.header-actions button, .header-actions a {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--color-text);
}
.header-actions svg { width: 24px; height: 24px; }
.header-actions a:hover, .header-actions button:hover {
    color: var(--color-primary);
}

/* Search Overlay */
.search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(13, 93, 86, 0.95); /* Semi-transparent Primary Color */
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}
.search-overlay.is-active {
    opacity: 1;
    visibility: visible;
}
.search-overlay__content {
    width: 90%;
    max-width: 700px;
    position: relative;
}
.search-overlay__content input[type="search"] {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 2px solid rgba(255,255,255,0.5);
    color: var(--color-white);
    font-size: 2.5rem;
    padding: var(--spacing-sm);
    text-align: center;
    font-family: var(--font-heading);
}
.search-overlay__content input[type="search"]:focus {
    outline: none;
    border-bottom-color: var(--color-white);
}
.search-overlay__content ::placeholder { color: rgba(255,255,255,0.4); }
.close-search {
    position: absolute;
    top: var(--spacing-lg);
    right: var(--spacing-lg);
    background: none;
    border: none;
    color: var(--color-white);
    font-size: 3rem;
    line-height: 1;
    cursor: pointer;
}
.search-overlay__results {
    color: var(--color-white);
    margin-top: var(--spacing-md);
    text-align: center;
}
.search-overlay__results h5 { color: rgba(255,255,255,0.7); }
.search-overlay__results ul { list-style: none; padding: 0; }
.search-overlay__results a { color: var(--color-white); font-size: 1.2rem; }


/* ==========================================================================
   3. CARDS (Place, City, Post)
   ========================================================================== */

.places-grid, .posts-grid, .cities-grid {
    display: grid;
    gap: var(--spacing-md);
    grid-template-columns: 1fr;
}
@media (min-width: 768px) {
    .places-grid--three-cols, .cities-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (min-width: 1024px) {
    .places-grid--three-cols, .cities-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}


/* Place Card */
.place-card {
    background: var(--color-white);
    border-radius: var(--border-radius);
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    transition: var(--transition-fast);
}
.place-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
}
.place-card__thumbnail {
    position: relative;
    height: 250px;
}
.place-card__thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.place-card__rating-badge {
    position: absolute;
    top: var(--spacing-sm);
    left: var(--spacing-sm);
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(5px);
    color: var(--color-white);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: 50px;
    font-size: 0.9rem;
    font-weight: bold;
}
.place-card__actions {
    position: absolute;
    top: var(--spacing-sm);
    right: var(--spacing-sm);
}
.place-card .button-bookmark {
    background: var(--color-white);
    color: var(--color-text-light);
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.place-card .button-bookmark.is-active, .place-card .button-bookmark:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
}
.place-card .button-bookmark.is-active svg { fill: var(--color-white); }
.place-card .button-bookmark svg { width: 20px; height: 20px; transition: var(--transition-fast); }

.place-card__content { padding: var(--spacing-md); }
.place-card__category a {
    font-size: 0.8rem;
    color: var(--color-accent);
    text-transform: uppercase;
    font-weight: 700;
}
.place-card__title { font-size: 1.25rem; margin-top: var(--spacing-xs); margin-bottom: var(--spacing-xs); }
.place-card__title a { color: var(--color-text); }
.place-card__title a:hover { color: var(--color-primary); }
.place-location { font-size: 0.9rem; color: var(--color-text-light); }

/* City Card */
.city-card {
    position: relative;
    display: block;
    height: 350px;
    border-radius: var(--border-radius);
    overflow: hidden;
    color: var(--color-white);
    transition: var(--transition-fast);
}
.city-card:hover { transform: scale(1.03); }
.city-card__background, .city-card__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.city-card__background img { width: 100%; height: 100%; object-fit: cover; }
.city-card__overlay {
    background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 50%);
}
.city-card__content {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: var(--spacing-md);
    z-index: 2;
    width: 100%;
}
.city-card__title { color: var(--color-white); font-size: 2rem; margin: 0; }
.city-card__meta { font-size: 1rem; opacity: 0.8; }

/* ==========================================================================
   4. TEMPLATE: SINGLE-PLACE.PHP SECTIONS
   ========================================================================== */

/* Hero Section */
.place-hero-section { position: relative; color: var(--color-white); }
.place-hero__gallery { height: 60vh; max-height: 800px; background-color: #333; }
.place-hero__gallery img { width: 100%; height: 100%; object-fit: cover; }
.place-hero-section::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.1) 100%);
    pointer-events: none;
}
.place-hero__content {
    position: absolute;
    bottom: var(--spacing-xl);
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    text-align: center;
}
.place-hero__title {
    color: var(--color-white);
    font-size: 4rem;
    text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}
.place-hero__meta-top a {
    color: var(--color-white);
    opacity: 0.9;
    border-bottom: 1px solid rgba(255,255,255,0.5);
}

/* Action Buttons */
.place-action-buttons {
    display: flex;
    gap: var(--spacing-sm);
    justify-content: center;
    margin-top: var(--spacing-md);
}
.place-action-buttons button {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: 0.8rem 1.5rem;
    background-color: rgba(255,255,255, 0.2);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 50px;
    color: var(--color-white);
    cursor: pointer;
    font-weight: 500;
    transition: var(--transition-fast);
}
.place-action-buttons button:hover, .place-action-buttons button.is-active {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}
.place-action-buttons button svg { width: 20px; height: 20px; }
.place-action-buttons button.is-active .bookmark-icon { fill: var(--color-white); }

/* Main content layout */
.entry-content-container {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xl);
    padding-top: var(--spacing-xl);
    padding-bottom: var(--spacing-xl);
}
@media(min-width: 1024px) {
    .entry-content-container {
        flex-direction: row;
        align-items: flex-start;
    }
    .main-content-column { flex: 3; }
    .place-sidebar { flex: 1; position: sticky; top: var(--spacing-lg); }
}

/* Smart Rating Block */
.smart-rating-block { background: var(--color-white); padding: var(--spacing-lg); border-radius: var(--border-radius); }
.smart-rating-block__layout { display: flex; flex-direction: column; gap: var(--spacing-lg); }
@media(min-width: 768px) { .smart-rating-block__layout { flex-direction: row; } }

.smart-rating-block__main-score {
    flex-basis: 200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: var(--color-primary);
    color: var(--color-white);
    border-radius: var(--border-radius);
    padding: var(--spacing-md);
    text-align: center;
}
.main-score__value { font-size: 4rem; font-weight: 900; line-height: 1; font-family: var(--font-heading); }
.main-score__label { font-size: 1.5rem; opacity: 0.7; }
.main-score__sublabel { font-size: 0.8rem; opacity: 0.6; margin-top: var(--spacing-xs); }

.smart-rating-block__breakdown {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-md);
}
@media(min-width: 768px) { .smart-rating-block__breakdown { grid-template-columns: repeat(2, 1fr); } }

.criterion-item__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--spacing-xs); }
.criterion-item__label { font-weight: 500; }
.criterion-item__score { font-size: 0.9rem; color: var(--color-text-light); }
.criterion-item__bar { width: 100%; height: 8px; background: var(--color-border); border-radius: 5px; overflow: hidden; }
.criterion-item__bar-inner { height: 100%; background: var(--color-rating); border-radius: 5px; }
.criterion-item__desc { font-size: 0.8rem; font-style: italic; color: var(--color-text-light); margin-top: var(--spacing-xs); }

/* Info Blocks */
.info-blocks-section { display: grid; gap: var(--spacing-md); }
.info-block { background: var(--color-white); padding: var(--spacing-md); border-radius: var(--border-radius); border-left: 5px solid; }
.info-block--historical_reference { border-color: var(--color-accent); }
.info-block--how_to_get { border-color: #4A90E2; }
.info-block--tourist_tip { border-color: var(--color-rating); }
.info-block--best_visit_time { border-color: #34A853; }
.info-block__title { font-size: 1.25rem; }

/* ==========================================================================
   5. REVIEWS (COMMENTS)
   ========================================================================== */
.reviews-area { padding-top: var(--spacing-xl); padding-bottom: var(--spacing-xl); }
.comment-list { list-style: none; margin: 0; padding: 0; }
.comment-list > li {
    background-color: var(--color-white);
    padding: var(--spacing-md);
    border-radius: var(--border-radius);
    margin-bottom: var(--spacing-md);
}
.comment-list .children { list-style: none; padding-left: var(--spacing-lg); margin-top: var(--spacing-md); }
.comment-list .children > li { background-color: var(--color-bg); }

.comment-body { display: flex; flex-direction: column; gap: var(--spacing-sm); }
.comment-meta { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: var(--spacing-sm); }
.comment-author { display: flex; align-items: center; gap: var(--spacing-sm); }
.comment-author .avatar { border-radius: 50%; }

.comment-rating .star { font-size: 1.2rem; color: var(--color-rating); }

.comment-form { background: var(--color-white); padding: var(--spacing-lg); border-radius: var(--border-radius); }
.comment-form input[type="text"], 
.comment-form input[type="email"],
.comment-form textarea {
    width: 100%;
    padding: var(--spacing-sm);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    background: var(--color-bg);
}
.comment-form input[type="submit"] {
    background: var(--color-primary);
    color: var(--color-white);
    border: none;
    padding: var(--spacing-sm) var(--spacing-lg);
    border-radius: 50px;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition-fast);
}
.comment-form input[type="submit"]:hover { background: var(--color-accent); }
.form-message { border: 1px solid; padding: var(--spacing-sm); margin-bottom: var(--spacing-md); border-radius: var(--border-radius); }
.form-message--success { border-color: #34A853; background-color: #E8F5E9; color: #1E8E3E; }
.form-message--error { border-color: #D93025; background-color: #FCE8E6; color: #A50E0E; }


/* Star rating in form */
.comment-form-rating { margin-bottom: var(--spacing-sm); }
.rating-stars { display: inline-flex; flex-direction: row-reverse; }
.rating-stars input { display: none; }
.rating-stars label { font-size: 2em; color: #ccc; cursor: pointer; padding: 0 0.1em; transition: color 0.2s; }
.rating-stars input:checked ~ label,
.rating-stars label:hover,
.rating-stars label:hover ~ label { color: var(--color-rating); }

/* ==========================================================================
   6. WIDGETS
   ========================================================================== */
.widget {
    background-color: var(--color-white);
    padding: var(--spacing-md);
    border-radius: var(--border-radius);
    margin-bottom: var(--spacing-md);
}
.widget-title {
    font-size: 1.2rem;
    padding-bottom: var(--spacing-sm);
    margin-bottom: var(--spacing-sm);
    border-bottom: 1px solid var(--color-border);
}

/* Filter Widget */
/* ====== НОВЫЙ ДИЗАЙН ВИДЖЕТА FILTER PLACES v2 ====== */
.exploro-filter-form {
    background-color: var(--color-bg); /* Более мягкий фон */
    padding: var(--spacing-sm);
    border-radius: var(--border-radius);
}
.filter-group {
    padding: var(--spacing-sm) 0;
    border-bottom: 1px solid var(--color-border);
}
.exploro-filter-form .filter-group:last-of-type {
    border-bottom: none;
}
.filter-group__title {
    font-family: var(--font-body); /* Более читаемый шрифт для заголовков фильтров */
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--color-text);
    letter-spacing: 0.5px;
    margin-bottom: var(--spacing-sm);
}

.spinner {
    margin: 20px auto;
    border: 4px solid rgba(255,255,255,0.3);
    border-radius: 50%;
    border-top-color: var(--color-white);
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
}
.search-results-dropdown .spinner {
    border-color: rgba(0,0,0,0.2);
    border-top-color: var(--color-primary);
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/* Списки с поиском */
.filter-list-wrapper {
    position: relative;
}
.filter-search-input {
    width: 100%;
    padding: 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    background-color: var(--color-white);
    margin-bottom: var(--spacing-sm);
}
.filter-list {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 200px;
    overflow-y: auto;
    padding-right: 5px; /* Место для скроллбара */
}
.filter-list li {
    margin-bottom: var(--spacing-xs);
}
.filter-list label {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 5px;
    border-radius: 4px;
}
.filter-list label:hover {
    background-color: var(--color-white);
}
.filter-list input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin-right: var(--spacing-sm);
}
.checkbox-label {
    font-weight: 500;
}

/* Ползунок рейтинга */
.rating-slider-label {
    display: block;
    cursor: pointer;
}
.rating-slider {
    width: 100%;
    margin-top: var(--spacing-sm);
}
.rating-slider-output {
    display: flex;
    align-items: center;
    font-weight: 700;
    color: var(--color-primary);
    margin-top: var(--spacing-xs);
    font-size: 1.1rem;

}

/* Кнопки */
.filter-buttons {
    display: flex;
    gap: var(--spacing-sm);
    margin-top: var(--spacing-md);
}
.filter-submit-btn {
    flex-grow: 1; /* Основная кнопка шире */
}
.filter-reset-btn {
    background: var(--color-white);
    color: var(--color-text-light);
    border: 1px solid var(--color-border);
    width: 44px;
    height: 44px;
    min-height: 44px; /* <--- ДОБАВЬТЕ ЭТУ СТРОКУ */
    flex-shrink: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
}
.filter-reset-btn:hover {
    background: var(--color-bg);
    color: var(--color-primary);
}

/* Сообщение "ничего не найдено" в AJAX-результатах */
.no-results-message {
    grid-column: 1 / -1; /* Растянуть на всю ширину грида */
    text-align: center;
    padding: var(--spacing-xl) 0;
}
.places-grid-container.is-loading {
    opacity: 0.5;
    transition: opacity 0.3s;
}

/* Улучшение архивного тулбара */
.archive-toolbar {
    padding: var(--spacing-sm) 0;
    margin-bottom: var(--spacing-md);
    border-bottom: 1px solid var(--color-border);
}
.archive-toolbar p {
    margin: 0;
    font-weight: 500;
}

/* ==========================================================================
   7. RESPONSIVE DESIGN
   ========================================================================== */
@media (max-width: 1024px) {
    h1 { font-size: 2.5rem; }
    h2 { font-size: 2rem; }
    .place-hero__title { font-size: 3rem; }
}

@media (max-width: 768px) {
    body { font-size: 15px; }
    h1 { font-size: 2rem; }
    h2 { font-size: 1.75rem; }
    .main-navigation { display: none; /* JS will handle mobile menu toggle */ }
    .place-hero-section { height: 70vh; }
    .place-hero__title { font-size: 2.25rem; }

    .smart-rating-block__breakdown { grid-template-columns: 1fr; }
}
/* Добавьте в main.min.css */
.exploro-map-marker {
    width: 32px;
    height: 48px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512' fill='%230D5D56'%3E%3Cpath d='M172.268 501.67C26.97 291.031 0 269.413 0 192 0 85.961 85.961 0 192 0s192 85.961 192 192c0 77.413-26.97 99.031-172.268 309.67a24 24 0 01-35.464 0zM192 272a80 80 0 100-160 80 80 0 000 160z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    cursor: pointer;
}
.map-popup {
    padding: 8px 12px;
    font-family: var(--font-body);
}

/* Front Page Hero */
.front-page-hero {
    position: relative;
    color: var(--color-white);
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--spacing-xl) 0;
}
.front-page-hero__background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #333; /* Fallback */
    /* Replace with a dynamic background image later */
    background-image: url('https://images.unsplash.com/photo-1502602898657-3e91760c0341?q=80&w=2070');
    background-size: cover;
    background-position: center;
    z-index: 1;
}
.front-page-hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    z-index: 2;
}
.front-page-hero__content {
    position: relative;
    z-index: 3;
}
.front-page-hero__title {
    font-size: 3.5rem;
    color: var(--color-white);
    text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}
.front-page-hero__subtitle {
    font-size: 1.25rem;
    margin-top: 0;
    margin-bottom: var(--spacing-lg);
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    opacity: 0.9;
}
.front-page-hero__search .search-form {
    max-width: 600px;
    margin: 0 auto;
    display: flex;
}
.front-page-hero__search input[type="search"] {
    flex-grow: 1;
    border-radius: 50px 0 0 50px;
    border: none;
    padding: 1.2rem;
    font-size: 1rem;
}
.front-page-hero__search input[type="submit"] {
    border-radius: 0 50px 50px 0;
    border: none;
    background: var(--color-primary);
    color: var(--color-white);
    font-weight: 700;
    padding: 0 2rem;
    cursor: pointer;
}
.front-page-hero__search input[type="submit"]:hover {
    background-color: var(--color-accent);
}

/* Front Page General Sections */
.front-page-section {
    padding-top: var(--spacing-xl);
    padding-bottom: var(--spacing-xl);
}
.front-page-section--tinted {
    background-color: var(--color-white);
}
.text-center {
    text-align: center;
}

/* Category Pills */
.category-pills {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--spacing-sm);
    margin-top: var(--spacing-md);
}
.category-pill {
    padding: var(--spacing-xs) var(--spacing-md);
    background-color: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 50px;
    color: var(--color-text);
    font-weight: 500;
    transition: var(--transition-fast);
}
.category-pill:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}

.header-user-actions .avatar { border-radius: 50%; width: 24px; height: 24px; }

.front-page-hero__search { position: relative; }
.search-results-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: var(--color-white);
    color: var(--color-text);
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    box-shadow: 0 10px 20px rgba(0,0,0,0.15);
    text-align: left;
    padding: var(--spacing-sm);
    display: none; /* JS will show it */
    z-index: 10;
}
.search-results-dropdown h5 {
    color: var(--color-text-light);
    font-size: 0.8rem;
    text-transform: uppercase;
    margin: var(--spacing-sm) 0 var(--spacing-xs) 0;
}
.search-results-dropdown ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.search-results-dropdown li a {
    display: block;
    padding: var(--spacing-xs);
    border-radius: 4px;
}
.search-results-dropdown li a:hover {
    background-color: var(--color-bg);
}

/* Новые гриды на главной */
.cities-grid-front {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md);
}
.places-grid-front {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md);
}
.posts-grid-front {
     display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: var(--spacing-md);
}
@media (min-width: 768px) {
    .cities-grid-front, .places-grid-front { grid-template-columns: repeat(3, 1fr); }
    .posts-grid-front { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .cities-grid-front, .places-grid-front { grid-template-columns: repeat(4, 1fr); }
    .posts-grid-front { grid-template-columns: repeat(4, 1fr); }
}

/* Изменение размера карточки города */
.cities-grid-front .city-card { height: 250px; } 

.section-footer-link {
    text-align: center;
    margin-top: var(--spacing-lg);
}
.button-primary {
    display: inline-block;
    background: var(--color-primary);
    color: var(--color-white);
    padding: var(--spacing-sm) var(--spacing-lg);
    border-radius: 50px;
    font-weight: 700;
}
.button-primary:hover {
    background: var(--color-accent);
    color: var(--color-white);
}

/* Новая карточка для статей */
.post-card-front {
    display: block;
    border-radius: var(--border-radius);
    overflow: hidden;
    background-color: var(--color-white);
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}
.post-card-front__thumbnail { height: 200px; }
.post-card-front__thumbnail img { width: 100%; height: 100%; object-fit: cover; }
.post-card-front__content { padding: var(--spacing-md); }
.post-card-front__link { color: var(--color-text); }
.post-card-front__link:hover .post-card-front__title { color: var(--color-primary); }
.post-card-front__category { font-size: 0.8rem; color: var(--color-accent); text-transform: uppercase; font-weight: 700; }
.post-card-front__title { font-size: 1.1rem; margin-top: 5px; line-height: 1.4; transition: var(--transition-fast); }

/* Алфавитный фильтр */
.alphabet-filter-container {
    padding-top: var(--spacing-md);
    padding-bottom: var(--spacing-md);
    border-bottom: 1px solid var(--color-border);
    margin-bottom: var(--spacing-lg);
}
.alphabet-filter {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 5px;
    list-style: none;
    padding: 0;
    margin: 0;
}
.alphabet-filter a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: var(--color-text);
    font-weight: 700;
}
.alphabet-filter a:hover {
    background-color: var(--color-bg);
    color: var(--color-primary);
}
.alphabet-filter a.is-active {
    background-color: var(--color-primary);
    color: var(--color-white);
}

/* Сетка стран */
.countries-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: var(--spacing-md);
}
@media (min-width: 768px) {
    .countries-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .countries-grid { grid-template-columns: repeat(3, 1fr); }
}

/* Карточка страны */
.country-card {
    position: relative;
    display: block;
    height: 300px;
    border-radius: var(--border-radius);
    overflow: hidden;
    color: var(--color-white);
}
.country-card__link { display: block; width: 100%; height: 100%; }
.country-card:hover .country-card__background img { transform: scale(1.05); }
.country-card__background, .country-card__overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.country-card__background img { width: 100%; height: 100%; object-fit: cover; transition: var(--transition-fast); }
.country-card__overlay { background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 60%); }
.country-card__content { position: absolute; bottom: 0; left: 0; padding: var(--spacing-md); z-index: 2; width: 100%; }
.country-card__title { color: var(--color-white); font-size: 2.5rem; margin: 0; text-shadow: 1px 1px 5px rgba(0,0,0,0.5); }
.country-card__meta { font-size: 1.1rem; opacity: 0.9; }

/* Фикс сайдбара и дизайна кнопок */
.page-content-with-sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}
@media (min-width: 1024px) {
    .page-content-with-sidebar { flex-direction: row; }
    .page-content-with-sidebar .main-content-column { flex: 1; }
    .page-content-with-sidebar .sidebar { width: 320px; flex-shrink: 0; }
}

.filter-group { margin-bottom: var(--spacing-md); }
.filter-group__title {
    font-size: 1rem;
    text-transform: uppercase;
    color: var(--color-text-light);
    margin-bottom: var(--spacing-sm);
    letter-spacing: 1px;
}
.filter-submit-btn, .filter-reset-btn {
    padding: 0 var(--spacing-sm);
    height: 44px;
    font-weight: 700;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    margin-top: var(--spacing-sm); /* Этот марджин можно убрать, если он уже есть у .filter-buttons */
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.filter-submit-btn {
    flex-grow: 1; 
    background-color: var(--color-primary);
    color: var(--color-white);
}
.filter-reset-btn {
    background: var(--color-white);
    color: var(--color-text-light);
    border: 1px solid var(--color-border);
    width: 44px;
    flex-shrink: 0;
}

.search-form .search-submit, .search-overlay .search-submit { display: none; }










/* ====== НОВЫЕ СТИЛИ для SINGLE-PLACE v2 ====== */

/* Удаление старой Hero-секции */
.place-hero-section { display: none; }

.place-single-v2 .container {
    max-width: 1100px;
}
.place-single-v2 .main-content-column {
    max-width: 820px;
    margin: 0 auto; /* Центрирование основного контента */
}

/* Блок №1-2: Шапка страницы места */
.place-header {
    padding-top: var(--spacing-lg);
    padding-bottom: var(--spacing-lg);
    text-align: center;
}
.place-title {
    font-size: 3.5rem;
    margin-top: var(--spacing-sm);
    margin-bottom: var(--spacing-xs);
}
.place-coordinates {
    font-family: monospace;
    color: var(--color-text-light);
    font-size: 0.9rem;
}

/* НОВЫЙ Блок №3: Обложка и Карта */
.place-cover-map-section {
    display: flex; /* Используем flex для большего контроля */
    justify-content: center;
    align-items: flex-start; /* Выравнивание по верху */
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
}
.place-cover {
    width: 650px;
    height: 450px;
    flex-shrink: 0; /* Не сжиматься */
    border-radius: var(--border-radius);
    overflow: hidden;
}
.place-map {
    flex-grow: 1; /* Занять оставшееся место */
    height: 450px; /* Та же высота, что и у обложки */
    border-radius: var(--border-radius);
    overflow: hidden;
}

.place-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Адаптивность для этого блока */
@media (max-width: 1200px) {
    .place-cover-map-section {
        flex-direction: column;
        align-items: center; /* Центрируем на меньших экранах */
        height: auto; /* Сбрасываем высоту */
    }
    .place-cover {
        width: 100%;
        max-width: 650px; /* Ограничим максимальную ширину */
        height: auto; /* Автоматическая высота */
        aspect-ratio: 650 / 450; /* Сохраняем пропорции */
    }
    .place-map {
        width: 100%;
        height: 400px; /* Фиксированная высота для карты на мобильных */
    }
}

/* Блок №5: Кнопки */
.place-actions-centered {
    padding-bottom: var(--spacing-lg);
}
.place-actions-centered .place-action-buttons {
    background-color: var(--color-bg);
    padding: var(--spacing-md);
    border-radius: var(--border-radius);
    justify-content: center;
}
.place-actions-centered .place-action-buttons button {
    /* Меняем стили с прозрачных на плотные */
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    color: var(--color-text);
}
.place-actions-centered .place-action-buttons button.is-active,
.place-actions-centered .place-action-buttons button:hover {
     background-color: var(--color-primary);
     color: var(--color-white);
     border-color: var(--color-primary);
}
.place-actions-centered .place-action-buttons button.is-active .bookmark-icon { fill: var(--color-white); }


/* Блоки рейтинга, контента, инфо-блоков получают отступы через секции/контейнеры */
.smart-rating-block {
    margin-bottom: var(--spacing-lg);
}
.entry-content {
    padding-bottom: var(--spacing-lg);
}


/* ====== НОВЫЕ СТИЛИ для ХЛЕБНЫХ КРОШЕК ====== */
.breadcrumbs {
    font-size: 0.9rem;
    color: var(--color-text-light);
}
.breadcrumbs ol {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.breadcrumbs li {
    display: inline-flex; /* Чтобы сепаратор был на одном уровне */
    align-items: center;
}
.breadcrumbs .separator {
    margin: 0 0.5em;
}
.breadcrumbs a {
    color: var(--color-text-light);
    border-bottom: 1px solid transparent;
}
.breadcrumbs a:hover {
    color: var(--color-primary);
    border-bottom-color: var(--color-primary);
}
.breadcrumbs li:last-child {
    color: var(--color-text); /* Последний элемент активный */
}

/* Дизайн страницы профиля */
.profile-layout-container {
    display: flex;
    gap: var(--spacing-lg);
    padding: var(--spacing-lg) 0;
    align-items: flex-start;
}
.profile-sidebar {
    width: 280px;
    flex-shrink: 0;
    text-align: center;
    background: var(--color-white);
    padding: var(--spacing-lg);
    border-radius: var(--border-radius);
    position: sticky;
    top: var(--spacing-md);
}
.profile-sidebar .avatar {
    border-radius: 50%;
    border: 5px solid var(--color-white);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    margin-bottom: var(--spacing-sm);
}
.profile-name { font-size: 1.5rem; }
.profile-bio { font-size: 0.9rem; color: var(--color-text-light); }
.edit-profile-button { display: block; margin-top: var(--spacing-md); }

.profile-content { flex-grow: 1; }
.profile-content-section {
    background-color: var(--color-white);
    padding: var(--spacing-lg);
    border-radius: var(--border-radius);
    margin-bottom: var(--spacing-lg);
}

/* Пилюли категорий на странице места */
.place-categories-pills {
    margin-top: var(--spacing-md);
    display: flex;
    justify-content: center;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
}

/* Стили для над-заголовка на странице места */
.place-super-title {
    margin-bottom: var(--spacing-sm);
    font-size: 1rem;
    font-weight: 500;
    color: var(--color-text-light);
    text-align: center;
}
.place-super-title a {
    color: var(--color-text-light);
}
.place-super-title a:hover {
    color: var(--color-primary);
}
.place-super-title .separator {
    margin: 0 0.5em;
    font-weight: normal;
}

/* Стили для фронтенд-загрузчика */
.frontend-uploader {
    border: 3px dashed var(--color-border);
    border-radius: var(--border-radius);
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: var(--spacing-lg);
    transition: var(--transition-fast);
    position: relative;
    background-color: var(--color-bg);
}
.frontend-uploader.is-dragover {
    border-color: var(--color-primary);
    background-color: #e6f6f5; /* Light primary color */
}

.uploader-icon {
    color: var(--color-text-light);
    margin-bottom: var(--spacing-sm);
}
.uploader-text {
    font-size: 1.1rem;
    font-weight: 500;
    margin: 0;
}
.uploader-subtext {
    color: var(--color-text-light);
    margin: var(--spacing-xs) 0;
}
.uploader-button {
    margin-top: var(--spacing-sm);
    background-color: transparent;
    border: 1px solid var(--color-border);
    color: var(--color-text);
    padding: 0.5rem 1rem;
    border-radius: 5px;
    cursor: pointer;
}

/* Прогресс-бар */
.uploader-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background-color: var(--color-border);
}
.uploader-progress-bar {
    width: 0%;
    height: 100%;
    background-color: var(--color-primary);
    transition: width 0.3s ease;
}

/* Обычный плейсхолдер, если админ не залогинен */
.post-thumbnail-placeholder {
    width: 100%;
    height: 100%;
    background-color: #f0f0f0;
    border-radius: var(--border-radius);
}

/* Админ-панель на странице места */
.admin-quick-links {
    margin-top: var(--spacing-md);
    display: flex;
    justify-content: center;
    gap: var(--spacing-md);
}
.admin-quick-links a {
    font-size: 2rem; /* Размер Emoji */
    text-decoration: none;
    transition: transform 0.2s ease;
}
.admin-quick-links a:hover {
    transform: scale(1.2);
}

.category-list-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--spacing-sm);
}
.category-list-item a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    color: var(--color-text);
    font-weight: 500;
    transition: var(--transition-fast);
}
.category-list-item a:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.07);
}
.category-list-item__count {
    background-color: var(--color-bg);
    padding: 3px 8px;
    border-radius: 20px;
    font-size: 0.8rem;
    color: var(--color-text-light);
}

.filter-categories-list-wrapper {
    position: relative;
}
.category-search-input {
    width: 100%;
    padding: 8px;
    border: 1px solid var(--color-border);
    border-radius: 4px;
    margin-bottom: var(--spacing-sm);
}
.filter-categories-list {
    max-height: 250px; /* Ограничиваем высоту */
    overflow-y: auto; /* Добавляем скролл */
    border: 1px solid var(--color-border);
    padding: var(--spacing-xs);
}
/* Стилизация скроллбара (опционально) */
.filter-categories-list::-webkit-scrollbar { width: 6px; }
.filter-categories-list::-webkit-scrollbar-track { background: #f1f1f1; }
.filter-categories-list::-webkit-scrollbar-thumb { background: #ccc; border-radius: 3px; }
.filter-categories-list::-webkit-scrollbar-thumb:hover { background: #999; }