/* ============================================================================
   pages.css — Estilos de páginas secundarias:
   - Página genérica (políticas, etc.)
   - Archivo del blog + filtros + paginación
   - Resultados de búsqueda
   - Artículo single del blog
   - Libro de reclamaciones
   - Documentos
   - Listado de profesores (archivo)
   - Perfil individual de profesor
   ============================================================================ */

/* -------- Search form (en search.php) -------- */
.search-form {
    display: flex;
    gap: var(--space-3);
    margin-bottom: var(--space-8);
    max-width: 600px;
}

.search-form input[type="search"] {
    flex: 1;
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: var(--fs-base);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.search-form input[type="search"]:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(0, 74, 173, 0.15);
}

@media (max-width: 540px) {
    .search-form {
        flex-direction: column;
    }
}

/* -------- Generic page (page.php) -------- */
.generic-page__header {
    margin-bottom: var(--space-6);
    padding-bottom: var(--space-5);
    border-bottom: 1px solid var(--color-border);
}

.generic-page__title {
    color: var(--color-primary);
    margin-bottom: var(--space-2);
}

.generic-page__content p {
    margin-bottom: var(--space-4);
}

.generic-page__content h2,
.generic-page__content h3,
.generic-page__content h4 {
    color: var(--color-primary);
    margin-top: var(--space-6);
    margin-bottom: var(--space-3);
}

.generic-page__content ul,
.generic-page__content ol {
    padding-left: var(--space-6);
    margin-bottom: var(--space-4);
}

.generic-page__content ul { list-style: disc; }
.generic-page__content ol { list-style: decimal; }

.generic-page__content li {
    margin-bottom: var(--space-2);
}

/* -------- Blog archive -------- */
.blog-archive__header {
    text-align: center;
    margin-bottom: var(--space-8);
}

.blog-archive__title {
    color: var(--color-primary);
    margin-bottom: var(--space-3);
}

.blog-archive__subtitle {
    color: var(--color-text-muted);
    max-width: 60ch;
    margin: 0 auto;
}

.blog-archive__filters {
    background: var(--color-bg-alt);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
    margin-bottom: var(--space-8);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.blog-archive__filter-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-3);
}

.blog-archive__filter-label {
    font-weight: var(--fw-bold);
    color: var(--color-text);
    font-size: var(--fs-sm);
}

.blog-archive__filter-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.blog-archive__filter-list a {
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-full);
    font-size: var(--fs-xs);
    font-weight: var(--fw-semibold);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    text-decoration: none;
    transition: background-color var(--transition-fast), color var(--transition-fast);
}

.blog-archive__filter-list a:hover,
.blog-archive__filter-list a.is-active {
    background: var(--color-primary);
    color: #ffffff;
    border-color: var(--color-primary);
    text-decoration: none;
}

.blog-archive__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
    margin-bottom: var(--space-8);
}

@media (max-width: 900px) { .blog-archive__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .blog-archive__grid { grid-template-columns: 1fr; } }

.post-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: transform var(--transition-fast), box-shadow var(--transition-fast);
}

.post-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.post-card__link {
    display: block;
    color: inherit;
    text-decoration: none;
}

.post-card__link:hover {
    text-decoration: none;
}

.post-card__image {
    aspect-ratio: 16 / 9;
    border-radius: 0;
}

.post-card__placeholder {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
}

.post-card__body {
    padding: var(--space-5);
}

.post-card__category {
    display: inline-block;
    padding: var(--space-1) var(--space-3);
    background: var(--color-accent-red);
    color: #ffffff;
    font-size: var(--fs-xs);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: var(--radius-full);
    margin-bottom: var(--space-3);
}

.post-card__title {
    color: var(--color-primary);
    font-size: var(--fs-lg);
    margin-bottom: var(--space-3);
    line-height: var(--lh-tight);
}

.post-card__excerpt {
    color: var(--color-text-muted);
    font-size: var(--fs-sm);
    margin-bottom: var(--space-4);
}

.post-card__meta {
    color: var(--color-text-muted);
    font-size: var(--fs-xs);
}

/* Paginación WP nativa */
.blog-archive__pagination .page-numbers,
.profesores-archive__pagination .page-numbers {
    display: flex;
    justify-content: center;
    gap: var(--space-2);
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
}

.blog-archive__pagination .page-numbers li,
.profesores-archive__pagination .page-numbers li {
    list-style: none;
}

.blog-archive__pagination a,
.blog-archive__pagination span,
.profesores-archive__pagination a,
.profesores-archive__pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    color: var(--color-text);
    font-weight: var(--fw-semibold);
    font-size: var(--fs-sm);
    text-decoration: none;
    transition: background-color var(--transition-fast), color var(--transition-fast);
}

.blog-archive__pagination a:hover,
.profesores-archive__pagination a:hover {
    background: var(--color-primary);
    color: #ffffff;
    border-color: var(--color-primary);
    text-decoration: none;
}

.blog-archive__pagination .current,
.profesores-archive__pagination .current {
    background: var(--color-primary);
    color: #ffffff;
    border-color: var(--color-primary);
}

.blog-archive__empty {
    text-align: center;
    color: var(--color-text-muted);
    padding: var(--space-10) 0;
}

/* -------- Single post -------- */
.single-post__header {
    padding: var(--space-10) 0 var(--space-6);
    text-align: center;
    border-bottom: 1px solid var(--color-border);
}

.single-post__categories {
    display: flex;
    gap: var(--space-2);
    justify-content: center;
    margin-bottom: var(--space-4);
    flex-wrap: wrap;
}

.single-post__category {
    padding: var(--space-1) var(--space-3);
    background: var(--color-accent-red);
    color: #ffffff;
    font-size: var(--fs-xs);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: var(--radius-full);
    text-decoration: none;
}

.single-post__category:hover {
    background: #b00610;
    color: #ffffff;
    text-decoration: none;
}

.single-post__title {
    color: var(--color-primary);
    margin-bottom: var(--space-4);
    font-size: clamp(var(--fs-2xl), 4vw, var(--fs-4xl));
    max-width: 20ch;
    margin-left: auto;
    margin-right: auto;
}

.single-post__meta {
    display: inline-flex;
    gap: var(--space-2);
    color: var(--color-text-muted);
    font-size: var(--fs-sm);
}

.single-post__featured {
    margin: 0 auto var(--space-8);
    max-width: 1200px;
}

.single-post__featured-image {
    aspect-ratio: 16 / 9;
    border-radius: 0;
}

.single-post__content {
    padding: var(--space-4) 0 var(--space-8);
    font-size: var(--fs-md);
    line-height: var(--lh-relaxed);
}

/* Defensa: ocultar bloques de autor que Gutenberg o plugins SEO inyectan
   en el contenido del post. El colegio no firma posts individualmente. */
.single-post__content .wp-block-post-author,
.single-post__content .wp-block-post-author-name,
.single-post__content .wp-block-post-author-biography,
.single-post__content .wp-block-post-author-avatar,
.single-post__content .wp-block-post-author-email,
.single-post__content .byline,
.single-post__content .author.vcard,
.single-post__content .post-author,
.single-post__content .author-info,
.single-post__content .author-bio,
.single-post__content .entry-meta .author,
.single-post .author-box,
.single-post .rank-math-author,
.single-post .yoast-author-box {
    display: none !important;
}

.single-post__content p {
    margin-bottom: var(--space-5);
}

.single-post__content h2,
.single-post__content h3,
.single-post__content h4 {
    color: var(--color-primary);
    margin-top: var(--space-8);
    margin-bottom: var(--space-3);
}

.single-post__content ul,
.single-post__content ol {
    padding-left: var(--space-6);
    margin-bottom: var(--space-5);
}

.single-post__content ul { list-style: disc; }
.single-post__content ol { list-style: decimal; }

.single-post__content li {
    margin-bottom: var(--space-2);
}

.single-post__content blockquote {
    border-left: 4px solid var(--color-accent-gold);
    padding: var(--space-4) var(--space-5);
    margin: var(--space-6) 0;
    background: var(--color-bg-alt);
    font-style: italic;
    color: var(--color-text-muted);
    border-radius: var(--radius-md);
}

.single-post__content img {
    border-radius: var(--radius-md);
    margin: var(--space-5) 0;
}

.single-post__tags {
    margin-top: var(--space-8);
    padding-top: var(--space-5);
    border-top: 1px solid var(--color-border);
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.single-post__tags-label {
    font-weight: var(--fw-bold);
    color: var(--color-text);
}

.single-post__tags-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.single-post__tags-list a {
    padding: var(--space-1) var(--space-3);
    background: rgba(194, 151, 92, 0.12);
    border: 1px solid var(--color-accent-gold);
    border-radius: var(--radius-full);
    font-size: var(--fs-xs);
    font-weight: var(--fw-semibold);
    color: var(--color-accent-gold);
    text-decoration: none;
}

.single-post__tags-list a:hover {
    background: var(--color-accent-gold);
    color: #ffffff;
    border-color: var(--color-accent-gold);
    text-decoration: none;
}

.single-post__nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
    padding: var(--space-8) 0;
    border-top: 1px solid var(--color-border);
}

.single-post__nav-link {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-4);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    color: inherit;
    text-decoration: none;
    transition: background-color var(--transition-fast);
}

.single-post__nav-link:hover {
    background: var(--color-bg-alt);
    text-decoration: none;
}

.single-post__nav-link--next {
    text-align: right;
    grid-column: 2;
}

.single-post__nav-label {
    color: var(--color-text-muted);
    font-size: var(--fs-xs);
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.single-post__nav-title {
    color: var(--color-primary);
    font-weight: var(--fw-semibold);
    font-size: var(--fs-sm);
}

@media (max-width: 600px) {
    .single-post__nav {
        grid-template-columns: 1fr;
    }
    .single-post__nav-link--next {
        grid-column: 1;
        text-align: left;
    }
}

/* -------- Libro de reclamaciones -------- */
.reclamaciones-page__header {
    display: flex;
    align-items: center;
    gap: var(--space-5);
    margin-bottom: var(--space-6);
    padding-bottom: var(--space-5);
    border-bottom: 3px solid var(--color-accent-red);
}

.reclamaciones-page__badge {
    width: 96px;
    height: auto;
    flex-shrink: 0;
    filter: drop-shadow(0 4px 8px rgba(227, 9, 20, 0.25));
}

.reclamaciones-page__title {
    color: var(--color-accent-red);
    margin: 0;
    font-size: clamp(var(--fs-2xl), 4vw, var(--fs-4xl));
    line-height: var(--lh-tight);
}

@media (max-width: 540px) {
    .reclamaciones-page__header {
        flex-direction: column;
        text-align: center;
        gap: var(--space-3);
    }
    .reclamaciones-page__badge {
        width: 72px;
    }
}

.reclamaciones-page__intro {
    margin-bottom: var(--space-8);
    font-size: var(--fs-md);
    line-height: var(--lh-relaxed);
    color: var(--color-text-muted);
}

.reclamaciones-page__intro p {
    margin-bottom: var(--space-4);
}

.reclamaciones-page__form {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    box-shadow: var(--shadow-md);
}

.reclamaciones-page__notice {
    text-align: center;
    padding: var(--space-5);
    background: var(--color-bg-alt);
    border-radius: var(--radius-md);
    color: var(--color-text-muted);
    font-size: var(--fs-sm);
}

/* -------- Documentos -------- */
.documentos-page__header {
    text-align: center;
    margin-bottom: var(--space-8);
}

.documentos-page__title {
    color: var(--color-primary);
    margin-bottom: var(--space-3);
}

.documentos-page__intro {
    color: var(--color-text-muted);
    max-width: 60ch;
    margin: 0 auto;
}

.documentos-page__list {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    margin-bottom: var(--space-8);
}

.documento-item {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-4) var(--space-5);
    transition: box-shadow var(--transition-fast), transform var(--transition-fast);
}

.documento-item:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.documento-item__icon {
    font-size: 32px;
    flex-shrink: 0;
}

.documento-item__body {
    flex: 1;
}

.documento-item__title {
    font-size: var(--fs-md);
    color: var(--color-primary);
    margin: 0 0 var(--space-1);
}

.documento-item__desc {
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    margin: 0;
}

.documento-item__actions {
    display: flex;
    gap: var(--space-2);
    flex-shrink: 0;
}

.documento-item__cta {
    font-size: var(--fs-sm);
    padding: var(--space-2) var(--space-4);
}

.documento-item__cta--disabled {
    display: inline-flex;
    align-items: center;
    border-radius: var(--radius-md);
    border: 1px dashed var(--color-border);
    color: var(--color-text-muted);
    font-style: italic;
    cursor: not-allowed;
    opacity: 0.7;
}

.documentos-page__empty {
    text-align: center;
    color: var(--color-text-muted);
    padding: var(--space-10) var(--space-5);
    background: var(--color-bg-alt);
    border-radius: var(--radius-md);
    border: 1px dashed var(--color-border);
}

.documentos-page__note {
    text-align: center;
    color: var(--color-text-muted);
}

@media (max-width: 600px) {
    .documento-item {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-3);
    }
    .documento-item__actions {
        width: 100%;
        flex-direction: column;
        gap: var(--space-2);
    }
    .documento-item__cta {
        width: 100%;
        text-align: center;
    }
}

/* -------- Profesor card (grid del archive) --------
   Los estilos base de .profesor-card y .profesor-card__{link,placeholder}
   viven en cards.css, que se carga siempre. Aquí solo los overrides del
   grid del archivo de profesores. */

/* Imagen más alta (aspect 4/5 vertical) — cards más prominentes */
.profesor-card__image {
    aspect-ratio: 4 / 5;
    border-radius: 0;
    margin: 0;
    overflow: hidden;
}

.profesor-card__image img {
    transition: transform 500ms ease;
}

.profesor-card:hover .profesor-card__image img {
    transform: scale(1.05);
}

.profesor-card__name {
    font-size: var(--fs-lg);
    color: var(--color-primary);
    margin: 0 0 var(--space-2);
    padding: 0 var(--space-4);
    padding-top: var(--space-4);
    text-transform: none;
    letter-spacing: 0;
    line-height: var(--lh-tight);
}

.profesor-card__excerpt {
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    line-height: var(--lh-normal);
    padding: 0 var(--space-4);
    padding-bottom: var(--space-4);
    margin: 0;
}

/* -------- Profesores archive -------- */
.profesores-archive__header {
    text-align: center;
    margin-bottom: var(--space-8);
}

.profesores-archive__title {
    color: var(--color-primary);
    margin-bottom: var(--space-3);
}

.profesores-archive__intro {
    color: var(--color-text-muted);
    max-width: 60ch;
    margin: 0 auto;
}

.profesores-archive__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-5);
    margin-bottom: var(--space-8);
}

@media (max-width: 1000px) { .profesores-archive__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px)  { .profesores-archive__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .profesores-archive__grid { grid-template-columns: 1fr; } }

.profesores-archive__empty {
    text-align: center;
    color: var(--color-text-muted);
    padding: var(--space-10) 0;
}

/* -------- Profesor individual -------- */
.profesor-page__breadcrumb {
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    margin-bottom: var(--space-5);
}

.profesor-page__breadcrumb a {
    color: var(--color-primary);
    text-decoration: none;
}

.profesor-page__breadcrumb a:hover {
    text-decoration: underline;
}

.profesor-page__header {
    margin-bottom: var(--space-6);
    padding-bottom: var(--space-4);
    border-bottom: 1px solid var(--color-border);
}

.profesor-page__name {
    color: var(--color-primary);
    margin: 0;
}

.profesor-page__body {
    line-height: var(--lh-relaxed);
}

.profesor-page__body::after {
    content: '';
    display: block;
    clear: both;
}

.profesor-page__photo {
    float: left;
    width: 260px;
    margin: 0 var(--space-5) var(--space-4) 0;
    aspect-ratio: 3 / 4;
    border-radius: var(--radius-lg);
    shape-outside: inset(0 round var(--radius-lg));
    background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
    box-shadow: var(--shadow-md);
}

.profesor-page__photo--placeholder {
    float: left;
    width: 260px;
    margin: 0 var(--space-5) var(--space-4) 0;
    aspect-ratio: 3 / 4;
    background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
    border-radius: var(--radius-lg);
}

.profesor-page__content p {
    margin-bottom: var(--space-4);
    font-size: var(--fs-base);
    line-height: var(--lh-relaxed);
}

.profesor-page__footer {
    margin-top: var(--space-8);
    padding-top: var(--space-5);
    border-top: 1px solid var(--color-border);
}

@media (max-width: 640px) {
    .profesor-page__photo,
    .profesor-page__photo--placeholder {
        float: none;
        width: 100%;
        max-width: 320px;
        margin: 0 auto var(--space-5);
        display: block;
    }
}