/* 
 * Josjis Theme - Archive & Search Pages
 * Styles specific to archive and search result pages.
 * Base layout styles (.latest-*, .josjis-pagination-*) are inherited from home-layout.css.
 * 
 * @package Josjis
 */

/* ==========================================================================
   ARCHIVE / SEARCH HEADER
   ========================================================================== */

.archive-section,
.search-section {
    margin-top: 0px;
}

.archive-description {
    font-size: 14px;
    color: var(--color-text-secondary);
    line-height: 1.6;
    margin-top: 8px;
    max-width: 600px;
}

.archive-title span {
    color: var(--color-primary);
}

/* ==========================================================================
   NO RESULTS
   ========================================================================== */

.archive-no-results {
    text-align: center;
    padding: 60px 20px;
    color: var(--color-text-secondary);
}

.archive-no-results h2 {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 8px;
}

.archive-no-results p {
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 28px;
}

.search-form-fallback {
    max-width: 450px;
    margin: 0 auto;
}

.search-form-fallback .search-form {
    display: flex;
    gap: 8px;
}

.search-form-fallback .search-field {
    flex: 1;
    padding: 10px 16px;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    font-size: 14px;
    background: var(--color-surface);
    color: var(--color-text);
}

.search-form-fallback .search-submit {
    padding: 10px 20px;
    background: var(--color-primary);
    color: #ffffff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background var(--transition-fast);
}

.search-form-fallback .search-submit:hover {
    opacity: 0.9;
}

/* ==========================================================================
   RESPONSIVE — MOBILE
   ========================================================================== */

@media (max-width: 768px) {
    .archive-section,
    .search-section {
        margin-top: -15px;
    }

    .archive-no-results {
        padding: 40px 16px;
    }

    .search-form-fallback .search-form {
        flex-direction: column;
    }
}