/**
 * COMAE — complementos do casco público (cards sw-module / sw-school-*).
 */

.sw-comae {
    padding-bottom: 36px;
}

.sw-comae-intro {
    margin-bottom: 22px;
}

.sw-comae-intro .sw-school-prose {
    text-align: justify;
    hyphens: auto;
}

.sw-comae-intro .sw-school-prose p {
    margin: 0 0 14px;
}

.sw-comae-intro .sw-school-prose p:last-child {
    margin-bottom: 0;
}

.sw-comae-panel {
    margin-top: 18px;
}

.sw-comae-panel-lead {
    margin: 0 0 4px;
}

.sw-comae-tel {
    font-weight: 700;
    color: var(--brand-700, #0c7a8c) !important;
    text-decoration: none !important;
    white-space: nowrap;
}

.sw-comae-tel:hover {
    text-decoration: underline !important;
}

/* painéis de ações em largura total no grid da página */
.sw-comae .sw-school-card--wide {
    width: 100%;
}

html[data-theme="dark"] .sw-comae-tel {
    color: #9ef0fb !important;
}

/* ------------------------------------------------------------
   Galeria de presidentes (modal) — light / dark
   ------------------------------------------------------------ */

body.sw-public .modal .modal-dialog.sw-comae-gallery-dialog {
    max-width: min(920px, calc(100vw - 24px));
}

/* header padrão dos modais COMAE (ícone + título + X compactos) */
body.sw-public .modal .sw-comae-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    min-height: 0;
}

body.sw-public .modal .sw-comae-modal-header .modal-title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 0;
    margin: 0;
    padding: 0;
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -.02em;
}

body.sw-public .modal .sw-comae-modal-header .modal-title > i {
    flex-shrink: 0;
    width: 1.35rem;
    height: 1.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .95rem;
    line-height: 1;
    color: var(--brand-600, #0f9cb3);
    background: color-mix(in srgb, var(--brand-600, #0f9cb3) 12%, transparent);
    border-radius: 8px;
    padding: 0;
    box-sizing: border-box;
}

body.sw-public .modal .sw-comae-modal-header .modal-title > span {
    min-width: 0;
}

body.sw-public .modal .sw-comae-modal-header .close {
    position: static;
    float: none;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 8px;
    opacity: .75;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--sm-text, #1c2b30);
    text-shadow: none;
    background: transparent;
}

body.sw-public .modal .sw-comae-modal-header .close:hover,
body.sw-public .modal .sw-comae-modal-header .close:focus {
    opacity: 1;
    background: color-mix(in srgb, var(--brand-600, #0f9cb3) 10%, transparent);
    outline: none;
}

html[data-theme="dark"] body.sw-public .modal .sw-comae-modal-header .modal-title > i {
    color: #9ef0fb;
    background: rgba(64, 200, 219, .14);
}

html[data-theme="dark"] body.sw-public .modal .sw-comae-modal-header .close {
    color: #e6f2f4;
}

html[data-theme="dark"] body.sw-public .modal .sw-comae-modal-header .close:hover,
html[data-theme="dark"] body.sw-public .modal .sw-comae-modal-header .close:focus {
    background: rgba(64, 200, 219, .12);
}

/* ------------------------------------------------------------
   Áreas documentais nos modais (Legislações, Plenária, SME)
   ------------------------------------------------------------ */

.sw-comae-doc-areas {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.sw-comae-doc-areas--split {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

@media (min-width: 576px) {
    .sw-comae-doc-areas--split {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
    }
}

.sw-comae-doc-area {
    border-radius: 12px;
    border: 1px solid var(--sm-border, #dbe7ea);
    background: var(--sm-surface-2, #f4fafb);
    padding: 16px;
    min-width: 0;
}

.sw-comae-doc-area-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 14px;
    padding: 0 0 12px;
    border-bottom: 1px solid var(--sm-border, #dbe7ea);
}

.sw-comae-doc-area-head > i {
    flex-shrink: 0;
    width: 1.85rem;
    height: 1.85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    color: var(--brand-600, #0f9cb3);
    background: color-mix(in srgb, var(--brand-600, #0f9cb3) 12%, transparent);
    border-radius: 8px;
}

.sw-comae-doc-area-title {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -.01em;
    color: var(--brand-900, #063e48);
}

.sw-comae-doc-links {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.sw-comae-doc-links--row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

@media (min-width: 480px) {
    .sw-comae-doc-links--row {
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    }
}

.sw-comae-doc-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 48px;
    padding: 12px 14px;
    border-radius: 10px;
    border: 1px solid color-mix(in srgb, var(--brand-600, #0f9cb3) 22%, var(--sm-border, #dbe7ea));
    background: var(--sm-surface, #fff);
    color: var(--brand-800, #085f6d) !important;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.35;
    text-decoration: none !important;
    text-align: left;
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.sw-comae-doc-btn > i:first-child {
    flex-shrink: 0;
    color: var(--brand-600, #0f9cb3);
    width: 1.2em;
    font-size: 1.05em;
    text-align: center;
}

.sw-comae-doc-btn > span {
    flex: 1;
    min-width: 0;
}

.sw-comae-doc-btn-ext {
    flex-shrink: 0;
    font-size: .85em;
    opacity: .55;
}

.sw-comae-doc-btn:hover,
.sw-comae-doc-btn:focus {
    background: color-mix(in srgb, var(--brand-600, #0f9cb3) 10%, #fff);
    border-color: var(--brand-600, #0f9cb3);
    color: var(--brand-900, #063e48) !important;
    box-shadow: 0 4px 14px rgba(6, 62, 72, .08);
    outline: none;
}

.sw-comae-doc-btn:hover .sw-comae-doc-btn-ext,
.sw-comae-doc-btn:focus .sw-comae-doc-btn-ext {
    opacity: 1;
}

.sw-comae-doc-list {
    margin: 0;
    padding: 0 0 0 1.1rem;
    color: var(--sm-text, #1c2b30);
    font-size: 0.9rem;
    line-height: 1.5;
}

.sw-comae-doc-list li + li {
    margin-top: 6px;
}

/* dark — áreas documentais */
html[data-theme="dark"] .sw-comae-doc-area {
    background: rgba(12, 42, 50, .72);
    border-color: rgba(64, 200, 219, .14);
}

html[data-theme="dark"] .sw-comae-doc-area-head {
    border-bottom-color: rgba(64, 200, 219, .12);
}

html[data-theme="dark"] .sw-comae-doc-area-head > i {
    color: #9ef0fb;
    background: rgba(64, 200, 219, .14);
}

html[data-theme="dark"] .sw-comae-doc-area-title {
    color: #e6f2f4;
}

html[data-theme="dark"] .sw-comae-doc-btn {
    background: rgba(8, 32, 38, .9);
    border-color: rgba(64, 200, 219, .18);
    color: #c7eef5 !important;
}

html[data-theme="dark"] .sw-comae-doc-btn > i:first-child {
    color: #9ef0fb;
}

html[data-theme="dark"] .sw-comae-doc-btn:hover,
html[data-theme="dark"] .sw-comae-doc-btn:focus {
    background: rgba(64, 200, 219, .12);
    border-color: rgba(64, 200, 219, .4);
    color: #e6f2f4 !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
}

html[data-theme="dark"] .sw-comae-doc-list {
    color: rgba(230, 242, 244, .88);
}

.sw-comae-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.sw-comae-gallery-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    border-radius: 12px;
    border: 1px solid var(--sm-border, #dbe7ea);
    background: var(--sm-surface-2, #f4fafb);
    overflow: hidden;
    color: var(--sm-text, #1c2b30);
}

.sw-comae-gallery-photo {
    aspect-ratio: 3 / 4;
    max-height: 220px;
    background: rgba(6, 62, 72, .06);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.sw-comae-gallery-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

.sw-comae-gallery-photo.is-empty {
    background: linear-gradient(
        160deg,
        rgba(12, 122, 140, .12),
        rgba(6, 62, 72, .06)
    );
}

.sw-comae-gallery-placeholder {
    font-size: 2.4rem;
    color: var(--brand-500, #14a3b8);
    opacity: .55;
}

.sw-comae-gallery-meta {
    padding: 12px 12px 14px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sw-comae-gallery-name {
    margin: 0;
    font-size: 0.92rem;
    font-weight: 800;
    line-height: 1.3;
    color: var(--brand-900, #063e48);
}

.sw-comae-gallery-role {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--brand-600, #0c7a8c);
}

.sw-comae-gallery-terms {
    margin: 6px 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.sw-comae-gallery-terms li {
    font-size: 0.78rem;
    line-height: 1.35;
    color: var(--sm-muted, #5a7076);
}

/* Dark mode */
html[data-theme="dark"] .sw-comae-gallery-card {
    background: rgba(12, 42, 50, .72);
    border-color: rgba(64, 200, 219, .14);
    color: var(--sm-text, #e6f2f4);
}

html[data-theme="dark"] .sw-comae-gallery-photo {
    background: rgba(4, 28, 34, .55);
}

html[data-theme="dark"] .sw-comae-gallery-photo.is-empty {
    background: linear-gradient(
        160deg,
        rgba(64, 200, 219, .12),
        rgba(4, 28, 34, .55)
    );
}

html[data-theme="dark"] .sw-comae-gallery-placeholder {
    color: #7adcec;
    opacity: .65;
}

html[data-theme="dark"] .sw-comae-gallery-name {
    color: #e6f2f4;
}

html[data-theme="dark"] .sw-comae-gallery-role {
    color: #9ef0fb;
}

html[data-theme="dark"] .sw-comae-gallery-terms li {
    color: rgba(230, 242, 244, .72);
}

@media (max-width: 767.98px) {
    .sw-comae-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .sw-comae-gallery-photo {
        max-height: 180px;
    }
}

@media (max-width: 419.98px) {
    .sw-comae-gallery {
        grid-template-columns: 1fr;
    }

    .sw-comae-gallery-card {
        flex-direction: row;
        align-items: stretch;
    }

    .sw-comae-gallery-photo {
        width: 108px;
        min-width: 108px;
        max-height: none;
        aspect-ratio: auto;
        align-self: stretch;
    }

    .sw-comae-gallery-meta {
        padding: 10px 12px;
    }
}

@media (max-width: 575.98px) {
    .sw-comae-intro .sw-school-prose {
        text-align: left;
        font-size: 14px;
    }
}

/* ------------------------------------------------------------
   Visitas — carrossel
   ------------------------------------------------------------ */

.sw-comae-visits {
    position: relative;
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    aspect-ratio: 4 / 3;
    max-height: min(56vh, 420px);
    overflow: hidden;
    border-radius: 12px;
    background: #0a1e24;
    border: 1px solid var(--sm-border, #dbe7ea);
}

.sw-comae-visits-slides {
    display: flex;
    height: 100%;
    transition: transform .45s ease;
}

.sw-comae-visits-slide {
    min-width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sw-comae-visits-slide img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

.sw-comae-visits-nav {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 8px;
    pointer-events: none;
}

.sw-comae-visits-nav button {
    pointer-events: auto;
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 10px;
    background: rgba(6, 62, 72, .55);
    color: #fff;
    font-size: 1.15rem;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sw-comae-visits-nav button:hover {
    background: rgba(12, 122, 140, .85);
}

.sw-comae-visits-empty {
    margin: 0;
    text-align: center;
    color: var(--sm-muted, #5a7076);
    font-size: 1rem;
}

html[data-theme="dark"] .sw-comae-visits {
    border-color: rgba(64, 200, 219, .14);
}

/* Tabela composição (modal) */
.sw-comae-table {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    font-size: 1.02rem;
}

.sw-comae-table th,
.sw-comae-table td {
    padding: 12px 14px;
    border-bottom: 1px solid var(--sm-border, #dbe7ea);
    text-align: left;
    vertical-align: top;
}

.sw-comae-table th {
    font-weight: 800;
    color: var(--brand-900, #063e48);
    background: color-mix(in srgb, var(--brand-600, #0f9cb3) 8%, transparent);
}

.sw-comae-table td {
    color: var(--sm-text, #1c2b30);
}

html[data-theme="dark"] .sw-comae-table th {
    color: #e6f2f4;
    background: rgba(64, 200, 219, .1);
    border-color: rgba(64, 200, 219, .12);
}

html[data-theme="dark"] .sw-comae-table td {
    color: rgba(230, 242, 244, .9);
    border-color: rgba(64, 200, 219, .1);
}
