/*
 * escolas.css
 * Estilos para o plugin "Uniformes por Escola".
 * Sobrescreve os estilos inline do plugin (wp_head)
 * aplicando o design system do tema.
 *
 * Carregado apenas quando a taxonomia 'escola' existe (condicional em enqueue.php).
 */

/* ══════════════════════════════════════════════════════
   SHORTCODE [selecionar_escola]
   ══════════════════════════════════════════════════════ */
.upe-escola-grid {
    padding: 2rem;
    background: var(--bg);
}
.upe-instrucao {
    font-family: 'Nunito', sans-serif;
    font-size: 1.1rem; font-weight: 800;
    color: var(--ink); text-align: center;
    letter-spacing: -.02em; margin-bottom: 2rem;
}
.upe-cards {
    display: flex; flex-wrap: wrap; gap: 1.25rem;
    justify-content: center; margin: 0 auto;
    max-width: 960px;
}

/* Card de escola — reutiliza o visual do .product-card */
.upe-card {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    width: 160px; padding: 1.5rem 1rem;
    background: var(--card);
    border-radius: var(--r-card-tl) var(--r-card) var(--r-card) var(--r-card);
    box-shadow: var(--shadow-card);
    text-decoration: none;
    color: var(--ink);
    font-family: 'Nunito', sans-serif; font-weight: 800;
    font-size: .88rem; letter-spacing: -.01em;
    text-align: center;
    transition: transform .22s, box-shadow .22s;
    border: none; /* remove borda genérica do plugin */
}
.upe-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-hover);
    color: var(--ink);
}
.upe-card img {
    max-width: 90px; max-height: 72px;
    object-fit: contain; margin-bottom: 1rem;
}

/* Círculo de iniciais quando não há logo */
.upe-card-sem-logo {
    width: 64px; height: 64px; border-radius: 50%;
    background: var(--blue); color: white;
    font-family: 'Nunito', sans-serif; font-size: 1.4rem; font-weight: 900;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 1rem; text-transform: uppercase;
    box-shadow: 0 4px 0 var(--blue-dark);
}

/* ══════════════════════════════════════════════════════
   BANNER "Mostrando produtos de: [Escola]"
   gerado por woocommerce_before_main_content
   ══════════════════════════════════════════════════════ */
.upe-banner-escola {
    display: flex; align-items: center; flex-wrap: wrap; gap: .5rem;
    background: var(--surface-low);
    border-left: 4px solid var(--blue);
    border-radius: 0 .75rem .75rem 0;
    padding: .75rem 1.25rem;
    margin-bottom: 1.5rem;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: .875rem; font-weight: 500;
    color: var(--ink);
    max-width: 1280px; margin-left: auto; margin-right: auto;
}
.upe-banner-escola strong {
    font-weight: 700; color: var(--blue-dark);
}
.upe-banner-escola a {
    color: var(--blue); text-decoration: none; font-weight: 700;
    padding: .15rem .6rem; border-radius: var(--r-pill);
    transition: background .18s;
}
.upe-banner-escola a:hover {
    background: rgba(27,111,216,.1);
}

/* ══════════════════════════════════════════════════════
   PÁGINA DE ARQUIVO DE ESCOLA (/escola/nome)
   Renderizado por inc/escolas.php
   ══════════════════════════════════════════════════════ */
.escola-archive-header {
    display: flex; flex-direction: column; align-items: center;
    text-align: center; padding: 2.5rem 2rem 1.5rem;
    max-width: 1280px; margin: 0 auto;
}
.escola-archive-logo {
    max-height: 100px; max-width: 200px;
    object-fit: contain; margin-bottom: 1rem;
    filter: drop-shadow(0 4px 12px rgba(27,111,216,.15));
}
.escola-archive-initials {
    width: 80px; height: 80px; border-radius: 50%;
    background: var(--blue); color: white;
    font-family: 'Nunito', sans-serif; font-size: 1.8rem; font-weight: 900;
    display: flex; align-items: center; justify-content: center;
    text-transform: uppercase; margin-bottom: 1rem;
    box-shadow: 0 5px 0 var(--blue-dark);
}
.escola-archive-title {
    font-family: 'Nunito', sans-serif; font-weight: 900;
    font-size: 2rem; color: var(--ink); letter-spacing: -.03em;
    margin-bottom: .5rem;
}
.escola-archive-desc {
    font-size: .95rem; color: var(--ink-muted);
    font-weight: 500; max-width: 480px;
}

/* ══════════════════════════════════════════════════════
   RESPONSIVO
   ══════════════════════════════════════════════════════ */
@media ( max-width: 640px ) {
    .upe-card { width: 140px; }
    .upe-banner-escola { flex-direction: column; align-items: flex-start; gap: .25rem; }
}
