/* ==========================================================================
   SKYSTONE 2.0 - PAGES.CSS
   Internal page shell only. Page-specific rules can later move to
   assets/pages/<page>/style.css if needed.
   ========================================================================== */

body.template-skystone .sky-page {
    background: #fff;
    border: 1px solid var(--sky-border);
    padding: 22px;
}

body.template-skystone .sky-page-title {
    margin: 0 0 18px;
    font-family: Georgia, "Times New Roman", serif;
    color: #075f78;
}


/* ==========================================================================
   SKYSTONE V25 - NAVEGAÇÃO PARCIAL
   Somente o conteúdo central troca; a sidebar permanece montada.
   ========================================================================== */

body.template-skystone .sky-page-main {
    position: relative;

    min-width: 0;

    transition:
        opacity .16s ease,
        transform .16s ease;
}

body.template-skystone .sky-page-main.is-page-loading {
    opacity: .48;

    pointer-events: none;
}

body.template-skystone .sky-page-main.is-page-loading::after {
    content: "";

    position: absolute;

    top: 14px;
    right: 14px;
    z-index: 20;

    width: 14px;
    height: 14px;

    border: 2px solid rgba(7,95,120,.16);
    border-top-color: #0785a7;
    border-radius: 50%;

    animation:
        sky-page-spin .65s linear infinite;
}

body.template-skystone .sky-page-main.is-page-entering {
    animation:
        sky-page-enter .20s ease both;
}

body.template-skystone .sky-page-sidebar {
    align-self: start;
}

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

@keyframes sky-page-enter {
    from {
        opacity: .55;
        transform: translateY(3px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    body.template-skystone .sky-page-main {
        transition: none;
    }

    body.template-skystone .sky-page-main.is-page-entering {
        animation: none;
    }
}


/* ==========================================================================
   SKYSTONE V28 - HERO + QUICK INFO EM TODAS AS PÁGINAS
   ========================================================================== */

/*
 * Nas páginas internas:
 *
 * Header
 * Hero
 * Quick Info
 * [pequeno respiro]
 * Conteúdo 535px + Sidebar 220px
 */
body.template-skystone .sky-quick-info + .sky-container {
    margin-top: 10px;
}

body.template-skystone .sky-page-layout {
    align-items: start;
}

body.template-skystone .sky-page-main,
body.template-skystone .sky-page-sidebar {
    align-self: start;
}

/*
 * O login/account panel é o primeiro elemento da sidebar interna.
 * Não adicionamos margem superior nele, para começar alinhado
 * com o conteúdo central.
 */
body.template-skystone
.sky-page-sidebar
> :first-child {
    margin-top: 0;
}

/*
 * Hero e Quick Info pertencem ao shell fixo.
 * A transição AJAX continua restrita à .sky-page-main.
 */
body.template-skystone
[data-sky-page-main] {
    contain: layout style;
}

@media (max-width: 620px) {
    body.template-skystone .sky-quick-info + .sky-container {
        margin-top: 8px;
    }
}