/**
 * =========================================================
 * PROPOSTAS PREMIUM
 * ESTILOS DO PORTAL INTERNO
 * =========================================================
 */
:root {
    --pp-portal-primary: #160d23;
    --pp-portal-dark: #0e0915;
    --pp-portal-deep: #211034;
    --pp-portal-purple: #321650;
    --pp-portal-purple-light: #64358e;
    --pp-portal-violet: #8d5bd1;
    --pp-portal-highlight: #b997ed;
    --pp-portal-lavender: #eadfff;
    --pp-portal-white: #ffffff;
    --pp-portal-text: #e7deef;
    --pp-portal-muted: #aaa0b7;
    --pp-portal-border: rgba(255, 255, 255, 0.13);
    --pp-portal-success: #79c267;
    --pp-portal-success-bg: rgba(121, 194, 103, 0.12);
    --pp-portal-error: #e36b72;
    --pp-portal-error-bg: rgba(227, 107, 114, 0.12);
    --pp-portal-radius: 18px;
    --pp-portal-radius-small: 10px;
    --pp-portal-shadow:
        0 24px 70px rgba(5, 1, 12, 0.32);
    --pp-portal-font:
        "Inter",
        "Montserrat",
        Arial,
        sans-serif;
}
/**
 * =========================================================
 * RESET DO PORTAL
 * =========================================================
 */
.pp-portal-wrapper,
.pp-portal-wrapper *,
.pp-portal-wrapper *::before,
.pp-portal-wrapper *::after {
    box-sizing: border-box;
}
.pp-portal-wrapper {
    position: relative;
    width: min(
        calc(100% - 40px),
        1180px
    );
    margin: 50px auto 90px;
    color: var(--pp-portal-text);
    font-family: var(--pp-portal-font);
}
.pp-portal-wrapper::before {
    content: "";
    position: fixed;
    z-index: -1;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(
            circle at 85% 5%,
            rgba(141, 91, 209, 0.18),
            transparent 30rem
        ),
        radial-gradient(
            circle at 10% 50%,
            rgba(50, 22, 80, 0.3),
            transparent 30rem
        ),
        linear-gradient(
            135deg,
            var(--pp-portal-dark),
            var(--pp-portal-primary)
        );
}
.pp-portal-wrapper h1,
.pp-portal-wrapper h2,
.pp-portal-wrapper h3,
.pp-portal-wrapper p {
    margin-top: 0;
}
.pp-portal-wrapper h1,
.pp-portal-wrapper h2,
.pp-portal-wrapper h3 {
    color: var(--pp-portal-white);
    letter-spacing: -0.055em;
    line-height: 1;
}
.pp-portal-wrapper p {
    color: var(--pp-portal-muted);
    line-height: 1.7;
}
.pp-portal-wrapper a {
    color: inherit;
    text-decoration: none;
}
/**
 * =========================================================
 * LOGIN
 * =========================================================
 */
.pp-portal-login-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 720px;
    margin-top: 0;
    margin-bottom: 0;
}
.pp-portal-login-card {
    width: min(100%, 470px);
    padding: 44px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius);
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.07),
            rgba(255, 255, 255, 0.02)
        ),
        rgba(22, 13, 35, 0.92);
    box-shadow: var(--pp-portal-shadow);
}
.pp-portal-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 24px;
    color: var(--pp-portal-highlight);
    font-size: 0.5rem;   /* 8px — legível */
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}
.pp-portal-logo::before {
    content: "";
    width: 22px;         /* proporcional ao texto */
    height: 2px;
    background: var(--pp-portal-highlight);

}.pp-portal-login-card h1 {
    margin-bottom: 16px;
    font-size: clamp(2rem, 5vw, 3.2rem);
}
.pp-portal-login-card > p {
    margin-bottom: 32px;
    font-size: 0.9rem;
}
/**
 * =========================================================
 * CABEÇALHO DO PORTAL
 * =========================================================
 */
.pp-portal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 38px;
    padding: 42px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius);
    background:
        radial-gradient(
            circle at 90% 0%,
            rgba(185, 151, 237, 0.22),
            transparent 25rem
        ),
        linear-gradient(
            135deg,
            rgba(100, 53, 142, 0.42),
            rgba(22, 13, 35, 0.95)
        );
    box-shadow: var(--pp-portal-shadow);
}
.pp-portal-overline {
    display: block;
    margin-bottom: 13px;
    color: var(--pp-portal-highlight);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}
.pp-portal-header h1 {
    margin-bottom: 15px;
    font-size: clamp(2.6rem, 6vw, 5.5rem);
}
.pp-portal-header p {
    margin-bottom: 0;
    font-size: 1rem;
}
.pp-portal-logout {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 18px;
    border: 1px solid rgba(185, 151, 237, 0.35);
    border-radius: 999px;
    color: var(--pp-portal-lavender) !important;
    background: rgba(185, 151, 237, 0.08);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    transition:
        background 0.25s ease,
        transform 0.25s ease;
}
.pp-portal-logout:hover {
    background: rgba(185, 151, 237, 0.2);
    transform: translateY(-2px);
}
/**
 * =========================================================
 * AÇÕES
 * =========================================================
 */
.pp-portal-actions {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 26px;
}
/**
 * =========================================================
 * BOTÕES
 * =========================================================
 */
.pp-portal-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 13px 22px;
    border: 1px solid var(--pp-portal-purple-light);
    border-radius: 999px;
    color: var(--pp-portal-white) !important;
    background:
        linear-gradient(
            135deg,
            var(--pp-portal-purple-light),
            var(--pp-portal-purple)
        );
    box-shadow:
        0 9px 24px rgba(50, 22, 80, 0.35);
    cursor: pointer;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease;
}
.pp-portal-button:hover,
.pp-portal-button:focus {
    color: var(--pp-portal-white) !important;
    background:
        linear-gradient(
            135deg,
            var(--pp-portal-violet),
            var(--pp-portal-purple-light)
        );
    box-shadow:
        0 14px 32px rgba(50, 22, 80, 0.48);
    outline: none;
    transform: translateY(-3px);
}
/**
 * =========================================================
 * SEÇÕES
 * =========================================================
 */
.pp-portal-section {
    margin-bottom: 28px;
    padding: 34px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius);
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.055),
            rgba(255, 255, 255, 0.015)
        ),
        rgba(22, 13, 35, 0.82);
    box-shadow: var(--pp-portal-shadow);
}
.pp-portal-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 28px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--pp-portal-border);
}
.pp-portal-section-header h2 {
    margin-bottom: 0;
    font-size: clamp(2rem, 4vw, 3.5rem);
}
.pp-portal-count {
    display: inline-grid;
    place-items: center;
    min-width: 44px;
    height: 44px;
    padding: 0 12px;
    border: 1px solid rgba(185, 151, 237, 0.35);
    border-radius: 50%;
    color: var(--pp-portal-highlight);
    background: rgba(185, 151, 237, 0.1);
    font-size: 0.9rem;
    font-weight: 800;
}
/**
 * =========================================================
 * LISTA DE PROPOSTAS
 * =========================================================
 */
.pp-portal-propostas {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}
.pp-portal-proposta-card {
    position: relative;
    padding: 25px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius-small);
    background:
        linear-gradient(
            145deg,
            rgba(100, 53, 142, 0.22),
            rgba(14, 9, 21, 0.72)
        );
    transition:
        border-color 0.25s ease,
        transform 0.25s ease,
        box-shadow 0.25s ease;
}
.pp-portal-proposta-card:hover {
    border-color: rgba(185, 151, 237, 0.48);
    box-shadow: 0 14px 35px rgba(5, 1, 12, 0.25);
    transform: translateY(-4px);
}
.pp-portal-proposta-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 23px;
    color: var(--pp-portal-muted);
    font-size: 0.72rem;
}
.pp-portal-proposta-status {
    padding: 6px 10px;
    border: 1px solid rgba(121, 194, 103, 0.3);
    border-radius: 999px;
    color: var(--pp-portal-success);
    background: var(--pp-portal-success-bg);
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.pp-portal-proposta-card h3 {
    margin-bottom: 18px;
    font-size: 1.65rem;
}
.pp-portal-proposta-card p {
    margin-bottom: 8px;
    font-size: 0.88rem;
}
.pp-portal-proposta-card p strong {
    color: var(--pp-portal-lavender);
}
.pp-portal-proposta-card-footer {
    margin-top: 25px;
    padding-top: 18px;
    border-top: 1px solid var(--pp-portal-border);
}
.pp-portal-proposta-card-footer a {
    color: var(--pp-portal-highlight);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.pp-portal-proposta-card-footer a:hover {
    color: var(--pp-portal-white);
}
/**
 * =========================================================
 * FORMULÁRIOS
 * =========================================================
 */
.pp-portal-form {
    display: grid;
    gap: 20px;
}
.pp-portal-new-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.pp-portal-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.pp-portal-field label {
    color: var(--pp-portal-lavender);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.05em;
}
.pp-portal-field input,
.pp-portal-field textarea,
.pp-portal-field select {
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius-small);
    color: var(--pp-portal-white);
    background: rgba(14, 9, 21, 0.72);
    font-family: inherit;
    font-size: 0.92rem;
    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease;
}
.pp-portal-field textarea {
    min-height: 130px;
    resize: vertical;
}
.pp-portal-field input::placeholder,
.pp-portal-field textarea::placeholder {
    color: var(--pp-portal-muted);
}
.pp-portal-field input:focus,
.pp-portal-field textarea:focus,
.pp-portal-field select:focus {
    border-color: var(--pp-portal-highlight);
    background: rgba(14, 9, 21, 0.92);
    box-shadow:
        0 0 0 3px rgba(185, 151, 237, 0.13);
    outline: none;
}
.pp-portal-new-form .pp-portal-button {
    justify-self: start;
    grid-column: 1 / -1;
}
.pp-portal-checkbox {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--pp-portal-muted);
    font-size: 0.82rem;
}
.pp-portal-checkbox input {
    accent-color: var(--pp-portal-violet);
}
/**
 * =========================================================
 * ESTADO VAZIO
 * =========================================================
 */
.pp-portal-empty {
    padding: 45px 25px;
    border: 1px dashed rgba(185, 151, 237, 0.35);
    border-radius: var(--pp-portal-radius-small);
    text-align: center;
}
.pp-portal-empty h3 {
    margin-bottom: 12px;
    font-size: 1.6rem;
}
.pp-portal-empty p {
    margin-bottom: 0;
}
/**
 * =========================================================
 * MENSAGENS
 * =========================================================
 */
.pp-portal-message {
    margin-bottom: 25px;
    padding: 15px 18px;
    border-radius: var(--pp-portal-radius-small);
    font-size: 0.88rem;
    line-height: 1.5;
}
.pp-portal-message-success {
    border: 1px solid rgba(121, 194, 103, 0.35);
    color: var(--pp-portal-success);
    background: var(--pp-portal-success-bg);
}
.pp-portal-message-error {
    border: 1px solid rgba(227, 107, 114, 0.35);
    color: var(--pp-portal-error);
    background: var(--pp-portal-error-bg);
}
/**
 * =========================================================
 * RESPONSIVIDADE
 * =========================================================
 */
@media (max-width: 760px) {
    .pp-portal-wrapper {
        width: min(
            calc(100% - 28px),
            1180px
        );
        margin-top: 28px;
        margin-bottom: 55px;
    }
    .pp-portal-login-wrapper {
        min-height: 650px;
        margin-top: 0;
    }
    .pp-portal-login-card,
    .pp-portal-header,
    .pp-portal-section {
        padding: 25px;
    }
    .pp-portal-header {
        flex-direction: column;
    }
    .pp-portal-logout {
        width: 100%;
    }
    .pp-portal-propostas,
    .pp-portal-new-form {
        grid-template-columns: 1fr;
    }
    .pp-portal-actions {
        justify-content: stretch;
    }
    .pp-portal-actions .pp-portal-button {
        width: 100%;
    }
    .pp-portal-new-form .pp-portal-button {
        width: 100%;
    }
}
@media (max-width: 480px) {
    .pp-portal-login-card,
    .pp-portal-header,
    .pp-portal-section {
        padding: 20px;
    }
    .pp-portal-login-card h1 {
        font-size: 2.8rem;
    }
    .pp-portal-header h1 {
        font-size: 3rem;
    }
    .pp-portal-section-header {
        align-items: flex-start;
    }
    .pp-portal-section-header h2 {
        font-size: 2.3rem;
    }
    .pp-portal-count {
        flex: 0 0 auto;
    }
}
/**
 * =========================================================
 * IMPRESSÃO
 * =========================================================
 */
@media print {
    .pp-portal-wrapper {
        width: 100%;
        margin: 0;
        color: #211034;
    }
    .pp-portal-wrapper::before {
        display: none;
    }
    .pp-portal-header,
    .pp-portal-section,
    .pp-portal-proposta-card {
        color: #211034;
        border-color: #d8d0df;
        background: #ffffff;
        box-shadow: none;
    }
    .pp-portal-wrapper h1,
    .pp-portal-wrapper h2,
    .pp-portal-wrapper h3,
    .pp-portal-wrapper p,
    .pp-portal-proposta-card p {
        color: #211034;
    }
    .pp-portal-actions,
    .pp-portal-logout,
    .pp-portal-new-section {
        display: none;
    }
}
/**
 * =========================================================
 * FORMULÁRIO COMPLETO DA PROPOSTA
 * =========================================================
 */
.pp-portal-proposta-form {
    gap: 30px;
}
.pp-portal-form-section {
    padding: 28px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius-small);
    background:
        linear-gradient(
            145deg,
            rgba(100, 53, 142, 0.16),
            rgba(14, 9, 21, 0.35)
        );
}
.pp-portal-form-section > h3 {
    margin-bottom: 24px;
    color: var(--pp-portal-white);
    font-size: 1.7rem;
}
.pp-portal-form-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}
.pp-portal-form-section-heading h3 {
    margin-bottom: 0;
}
.pp-portal-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}
.pp-portal-field-full {
    grid-column: 1 / -1;
}
.pp-portal-field small {
    color: var(--pp-portal-muted);
    font-size: 0.75rem;
}
.pp-portal-button-small {
    min-height: 40px;
    padding: 10px 15px;
    font-size: 0.68rem;
}
.pp-portal-save-button {
    width: 100%;
    border-radius: var(--pp-portal-radius-small);
}
.pp-portal-servicos {
    display: grid;
    gap: 18px;
}
.pp-portal-servico {
    padding: 24px;
    border: 1px solid var(--pp-portal-border);
    border-left: 4px solid var(--pp-portal-highlight);
    border-radius: var(--pp-portal-radius-small);
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.055),
            rgba(255, 255, 255, 0.012)
        );
}
.pp-portal-servico-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 22px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--pp-portal-border);
}
.pp-portal-servico-header strong {
    color: var(--pp-portal-lavender);
    font-size: 0.95rem;
}
.pp-portal-remover-servico {
    padding: 8px 12px;
    border: 1px solid rgba(227, 107, 114, 0.35);
    border-radius: 999px;
    color: var(--pp-portal-error);
    background: var(--pp-portal-error-bg);
    cursor: pointer;
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
}
.pp-portal-remover-servico:hover {
    color: #ffffff;
    background: var(--pp-portal-error);
}
.pp-portal-proposta-card-footer {
    display: flex;
    align-items: center;
    gap: 18px;
}
.pp-portal-proposta-card-footer a + a {
    color: var(--pp-portal-white);
}
@media (max-width: 760px) {
    .pp-portal-form-grid {
        grid-template-columns: 1fr;
    }
    .pp-portal-field-full {
        grid-column: auto;
    }
    .pp-portal-form-section-heading,
    .pp-portal-servico-header {
        align-items: flex-start;
        flex-direction: column;
    }
    .pp-portal-button-small {
        width: 100%;
    }
    .pp-portal-remover-servico {
        width: 100%;
    }
}
/**
 * =========================================================
 * LINK PÚBLICO DA PROPOSTA
 * =========================================================
 */
.pp-portal-link-publico {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--pp-portal-border);
}
.pp-portal-link-publico label {
    display: block;
    margin-bottom: 8px;
    color: var(--pp-portal-lavender);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.pp-portal-link-publico-row {
    display: flex;
    align-items: stretch;
    gap: 8px;
}
.pp-portal-link-input {
    flex: 1;
    min-width: 0;
    min-height: 42px;
    padding: 10px 12px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius-small);
    color: var(--pp-portal-lavender);
    background: rgba(14, 9, 21, 0.75);
    font-family: monospace;
    font-size: 0.76rem;
}
.pp-portal-copy-link {
    min-height: 42px;
    padding: 10px 15px;
    border-radius: var(--pp-portal-radius-small);
    white-space: nowrap;
    font-size: 0.66rem;
}
.pp-portal-copy-feedback {
    display: block;
    min-height: 18px;
    margin-top: 7px;
    color: var(--pp-portal-success);
    font-size: 0.76rem;
}
.pp-portal-link-pendente {
    margin-top: 20px;
    padding: 12px 14px;
    border: 1px solid rgba(185, 151, 237, 0.2);
    border-radius: var(--pp-portal-radius-small);
    color: var(--pp-portal-muted);
    background: rgba(185, 151, 237, 0.06);
    font-size: 0.78rem;
    line-height: 1.5;
}
.pp-portal-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.pp-portal-button-secondary {
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.08);
}
.pp-portal-button-secondary:hover {
    background: rgba(255, 255, 255, 0.15);
}
@media (max-width: 650px) {
    .pp-portal-link-publico-row {
        flex-direction: column;
    }
    .pp-portal-copy-link {
        width: 100%;
    }
    .pp-portal-form-actions {
        flex-direction: column;
    }
    .pp-portal-form-actions .pp-portal-button {
        width: 100%;
    }
}
/**
 * =========================================================
 * PRODUTOS PRÉ-CADASTRADOS
 * =========================================================
 */
.pp-portal-produto-seletor {
    display: flex;
    align-items: stretch;
    gap: 10px;
    margin-bottom: 24px;
}
.pp-portal-select-produto {
    flex: 1;
    min-width: 0;
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius-small);
    color: var(--pp-portal-white);
    background: rgba(14, 9, 21, 0.78);
    font-family: var(--pp-portal-font);
    font-size: 0.9rem;
}
.pp-portal-select-produto option {
    color: #211034;
    background: #ffffff;
}
.pp-portal-aviso-produtos {
    margin-bottom: 24px;
    padding: 15px 18px;
    border: 1px solid rgba(227, 107, 114, 0.3);
    border-radius: var(--pp-portal-radius-small);
    color: var(--pp-portal-error);
    background: var(--pp-portal-error-bg);
    font-size: 0.85rem;
}
.pp-portal-produto-resumo {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius-small);
    background: rgba(14, 9, 21, 0.45);
}
.pp-portal-produto-resumo > div {
    min-width: 0;
}
.pp-portal-produto-resumo span,
.pp-portal-produto-resumo label {
    display: block;
    margin-bottom: 7px;
    color: var(--pp-portal-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1.25;
    text-transform: uppercase;
}
.pp-portal-produto-resumo strong {
    display: block;
    color: var(--pp-portal-lavender);
    font-size: 0.95rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}
.pp-portal-produto-resumo input {
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius-small);
    color: var(--pp-portal-white);
    background: rgba(14, 9, 21, 0.85);
    font-family: var(--pp-portal-font);
    font-size: 0.88rem;
}
.pp-portal-produto-resumo input:focus {
    border-color: var(--pp-portal-highlight);
    box-shadow:
        0 0 0 3px rgba(185, 151, 237, 0.13);
    outline: none;
}
.pp-portal-produto-resumo small {
    display: block;
    margin-top: 6px;
    color: var(--pp-portal-muted);
    font-size: 0.68rem;
    line-height: 1.3;
}
.pp-portal-valor-final {
    color: var(--pp-portal-highlight) !important;
}
.pp-portal-valor-desconto {
    color: #f0aab5 !important;
}
.pp-portal-produto-detalhes {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--pp-portal-border);
}
.pp-portal-produto-detalhes strong {
    display: block;
    margin-bottom: 7px;
    color: var(--pp-portal-highlight);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.pp-portal-produto-detalhes p,
.pp-portal-produto-detalhes ul {
    margin-bottom: 0;
    color: var(--pp-portal-muted);
    font-size: 0.82rem;
    line-height: 1.6;
}
.pp-portal-produto-detalhes ul {
    padding-left: 20px;
}
.pp-portal-produto-detalhes li {
    margin-bottom: 4px;
}
.pp-portal-produto-detalhes li:last-child {
    margin-bottom: 0;
}
@media (max-width: 850px) {
    .pp-portal-produto-resumo {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 620px) {
    .pp-portal-produto-seletor {
        flex-direction: column;
    }
    .pp-portal-produto-seletor .pp-portal-button {
        width: 100%;
    }
    .pp-portal-produto-resumo {
        grid-template-columns: 1fr;
    }
}
/**
 * =========================================================
 * PRODUTOS PRÉ-CADASTRADOS NO ESTILO ORIGINAL DO PORTAL
 * =========================================================
 */
.pp-portal-section-description {
    margin: 9px 0 0;
    color: var(--pp-portal-muted);
    font-size: 0.86rem;
    line-height: 1.6;
}
.pp-portal-produto-seletor {
    display: flex;
    align-items: stretch;
    gap: 10px;
    margin-bottom: 24px;
}
.pp-portal-select-produto {
    flex: 1;
    min-width: 0;
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius-small);
    color: var(--pp-portal-white);
    background: rgba(14, 9, 21, 0.72);
    font-family: var(--pp-portal-font);
    font-size: 0.88rem;
}
.pp-portal-select-produto:focus {
    border-color: var(--pp-portal-highlight);
    box-shadow:
        0 0 0 3px rgba(185, 151, 237, 0.13);
    outline: none;
}
.pp-portal-select-produto option {
    color: #211034;
    background: #ffffff;
}
.pp-portal-aviso-produtos {
    margin-bottom: 24px;
    padding: 15px 18px;
    border: 1px solid rgba(227, 107, 114, 0.35);
    border-radius: var(--pp-portal-radius-small);
    color: var(--pp-portal-error);
    background: var(--pp-portal-error-bg);
    font-size: 0.84rem;
    line-height: 1.5;
}
/**
 * Card do produto selecionado.
 */
.pp-portal-servico {
    margin-bottom: 18px;
    padding: 24px;
    border: 1px solid var(--pp-portal-border);
    border-left: 3px solid var(--pp-portal-highlight);
    border-radius: var(--pp-portal-radius-small);
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.055),
            rgba(255, 255, 255, 0.012)
        );
    box-shadow:
        0 12px 30px rgba(5, 1, 12, 0.15);
}
.pp-portal-servico-topo {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--pp-portal-border);
}
.pp-portal-servico-topo strong {
    display: block;
    color: var(--pp-portal-lavender);
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}
.pp-portal-servico-topo small {
    display: block;
    margin-top: 5px;
    color: var(--pp-portal-muted);
    font-size: 0.7rem;
}
.pp-portal-remover-servico {
    flex: 0 0 auto;
    min-height: 34px;
    padding: 8px 13px;
    border: 1px solid rgba(227, 107, 114, 0.35);
    border-radius: 999px;
    color: var(--pp-portal-error);
    background: var(--pp-portal-error-bg);
    cursor: pointer;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    transition:
        color 0.25s ease,
        background 0.25s ease,
        transform 0.25s ease;
}
.pp-portal-remover-servico:hover {
    color: #ffffff;
    background: var(--pp-portal-error);
    transform: translateY(-2px);
}
/**
 * Informações financeiras do produto.
 */
.pp-portal-produto-resumo {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius-small);
    background: rgba(14, 9, 21, 0.48);
}
.pp-portal-produto-resumo > div {
    min-width: 0;
}
.pp-portal-produto-resumo span,
.pp-portal-produto-resumo label {
    display: block;
    margin: 0 0 7px;
    color: var(--pp-portal-muted);
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1.25;
    text-transform: uppercase;
}
.pp-portal-produto-resumo strong {
    display: block;
    color: var(--pp-portal-lavender);
    font-size: 0.94rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}
.pp-portal-produto-resumo input {
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;
    border: 1px solid var(--pp-portal-border);
    border-radius: var(--pp-portal-radius-small);
    color: var(--pp-portal-white);
    background: rgba(14, 9, 21, 0.85);
    font-family: var(--pp-portal-font);
    font-size: 0.86rem;
}
.pp-portal-produto-resumo input:focus {
    border-color: var(--pp-portal-highlight);
    box-shadow:
        0 0 0 3px rgba(185, 151, 237, 0.13);
    outline: none;
}
.pp-portal-produto-resumo small {
    display: block;
    margin-top: 6px;
    color: var(--pp-portal-muted);
    font-size: 0.65rem;
    line-height: 1.3;
}
.pp-portal-valor-final {
    color: var(--pp-portal-highlight) !important;
}
.pp-portal-valor-desconto {
    color: #f0aab5 !important;
}
/**
 * Descrição e itens inclusos.
 */
.pp-portal-detalhes {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--pp-portal-border);
}
.pp-portal-detalhes strong {
    display: block;
    margin-bottom: 7px;
    color: var(--pp-portal-highlight);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.pp-portal-detalhes p,
.pp-portal-detalhes ul {
    margin-bottom: 0;
    color: var(--pp-portal-muted);
    font-size: 0.82rem;
    line-height: 1.6;
}
.pp-portal-detalhes ul {
    padding-left: 20px;
}
.pp-portal-detalhes li {
    margin-bottom: 4px;
}
.pp-portal-detalhes li:last-child {
    margin-bottom: 0;
}
/**
 * Responsividade dos produtos.
 */
@media (max-width: 850px) {
    .pp-portal-produto-resumo {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 620px) {
    .pp-portal-produto-seletor {
        align-items: stretch;
        flex-direction: column;
    }
    .pp-portal-produto-seletor .pp-portal-button {
        width: 100%;
    }
    .pp-portal-produto-resumo {
        grid-template-columns: 1fr;
    }
    .pp-portal-servico-topo {
        align-items: stretch;
        flex-direction: column;
    }
    .pp-portal-remover-servico {
        width: 100%;
    }
}

/**
 * =========================================================
 * TEMA CLARO / ESCURO DO PORTAL (agregado)
 * =========================================================
 * O PHP do portal deve imprimir no .pp-portal-wrapper:
 *   class="pp-portal-wrapper pp-portal-tema-claro (ou -escuro) pp-portal-com-cores"
 *   style="--pp-portal-primary: COR; --pp-portal-highlight: COR;"
 * O tema escuro abaixo é o padrão atual, explícito.
 * =========================================================
 */

/* Tema escuro (padrão atual, explícito). */
.pp-portal-wrapper.pp-portal-tema-escuro {
    --pp-portal-primary: #160d23;
    --pp-portal-dark: #0e0915;
    --pp-portal-deep: #211034;
    --pp-portal-purple: #321650;
    --pp-portal-purple-light: #64358e;
    --pp-portal-violet: #8d5bd1;
    --pp-portal-lavender: #eadfff;
    --pp-portal-white: #ffffff;
    --pp-portal-text: #e7deef;
    --pp-portal-muted: #aaa0b7;
    --pp-portal-border: rgba(255, 255, 255, 0.13);
}

/* Tema claro. */
.pp-portal-wrapper.pp-portal-tema-claro {
    --pp-portal-primary: #160d23;
    --pp-portal-dark: #f6f3fa;
    --pp-portal-deep: #f1ecf7;
    --pp-portal-purple: #e4dbf0;
    --pp-portal-purple-light: #7c4ab0;
    --pp-portal-violet: #7a4fae;
    --pp-portal-lavender: #5d3d8a;
    --pp-portal-white: #241a2e;
    --pp-portal-text: #37303f;
    --pp-portal-muted: #6f6580;
    --pp-portal-border: rgba(30, 20, 45, 0.14);
    --pp-portal-shadow:
        0 24px 70px rgba(40, 25, 60, 0.12);
}

/* Cores da marca: quando o PHP adiciona a classe pp-portal-com-cores,
   botões e acentos passam a usar a cor principal da proposta. */
.pp-portal-wrapper.pp-portal-com-cores {
    --pp-portal-purple-light: var(--pp-portal-primary);
    --pp-portal-violet: var(--pp-portal-primary);
}

/* Fundo de página do tema claro. */
.pp-portal-wrapper.pp-portal-tema-claro::before {
    background:
        radial-gradient(
            circle at 85% 5%,
            rgba(141, 91, 209, 0.10),
            transparent 30rem
        ),
        radial-gradient(
            circle at 10% 50%,
            rgba(50, 22, 80, 0.10),
            transparent 30rem
        ),
        linear-gradient(
            135deg,
            #f6f3fa,
            #ffffff
        );
}

/* Superfícies do tema claro (substituem os fundos escuros fixos). */
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-login-card {
    background:
        linear-gradient(
            145deg,
            rgba(122, 79, 174, 0.05),
            rgba(255, 255, 255, 0.7)
        ),
        #ffffff;
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-header {
    background:
        radial-gradient(
            circle at 90% 0%,
            rgba(185, 151, 237, 0.18),
            transparent 25rem
        ),
        linear-gradient(
            135deg,
            #f1ecf7,
            #ffffff
        );
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-section {
    background:
        linear-gradient(
            145deg,
            rgba(122, 79, 174, 0.04),
            rgba(255, 255, 255, 0.6)
        ),
        #ffffff;
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-form-section {
    background:
        linear-gradient(
            145deg,
            rgba(122, 79, 174, 0.06),
            rgba(255, 255, 255, 0.6)
        ),
        #ffffff;
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-proposta-card {
    background:
        linear-gradient(
            145deg,
            rgba(122, 79, 174, 0.06),
            rgba(255, 255, 255, 0.7)
        ),
        #ffffff;
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-proposta-card:hover {
    border-color: rgba(122, 79, 174, 0.40);
    box-shadow: 0 14px 35px rgba(40, 25, 60, 0.12);
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-servico {
    background:
        linear-gradient(
            145deg,
            rgba(122, 79, 174, 0.04),
            rgba(255, 255, 255, 0.6)
        ),
        #ffffff;
    box-shadow: 0 12px 30px rgba(40, 25, 60, 0.08);
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-produto-resumo {
    background: rgba(122, 79, 174, 0.05);
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-proposta-card-footer a:hover {
    color: var(--pp-portal-primary);
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-link-pendente {
    background: rgba(185, 151, 237, 0.08);
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-empty {
    border-color: rgba(122, 79, 174, 0.30);
}

/* Campos de formulário do tema claro. */
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-field input,
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-field textarea,
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-field select,
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-select-produto,
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-link-input,
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-produto-resumo input {
    color: #241a2e;
    background: #ffffff;
    border-color: rgba(30, 20, 45, 0.16);
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-field input:focus,
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-field textarea:focus,
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-field select:focus,
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-select-produto:focus,
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-produto-resumo input:focus {
    background: #ffffff;
    border-color: var(--pp-portal-highlight);
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-button-secondary {
    border-color: rgba(30, 20, 45, 0.20);
    background: rgba(30, 20, 45, 0.06);
}
.pp-portal-wrapper.pp-portal-tema-claro .pp-portal-button-secondary:hover {
    background: rgba(30, 20, 45, 0.12);
}


.pp-portal-resposta { margin: 14px 0; padding: 12px 14px; border: 1px solid var(--pp-border, rgba(128,128,128,.25)); border-radius: 10px; background: var(--pp-surface, rgba(255,255,255,.04)); }
.pp-portal-resposta-topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.pp-portal-resposta-badge { display: inline-flex; align-items: center; padding: 5px 10px; border-radius: 999px; font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.pp-portal-resposta-aprovada .pp-portal-resposta-badge { color: #2f9e44; background: rgba(47,158,68,.14); }
.pp-portal-resposta-alteracoes .pp-portal-resposta-badge { color: #e8a13a; background: rgba(232,161,58,.14); }
.pp-portal-resposta-negada .pp-portal-resposta-badge { color: #e03131; background: rgba(224,49,49,.14); }
.pp-portal-resposta-topo small { color: var(--pp-muted, #b0a5c2); font-size: .75rem; }
.pp-portal-resposta-texto { margin: 4px 0 0; color: var(--pp-text-soft, #ddd2ec); font-size: .85rem; }
.pp-portal-resposta-texto strong { color: var(--pp-heading, #ffffff); }