body {
    /*background: linear-gradient(135deg, #1e1822 0%, #2a223078 50%, #17121b 100%);*/
    background: #a98d7a;
    color: #eddcd1;
    font-family: 'Plus Jakarta Sans', sans-serif;
    min-height: 100vh;
}
.glass-panel {
    background: rgba(42, 34, 48, 0.55);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(224, 192, 120, 0.15);
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
}
.gold-border {
    border-color: rgba(224, 192, 120, 0.3);
}
.input-ether {
    background: rgba(30, 24, 34, 0.6);
    border: 1px solid rgba(224, 192, 120, 0.25);
    color: #f7f0eb;
    transition: all 0.3s ease;
}
.input-ether:focus {
    border-color: #e0c078;
    outline: none;
    box-shadow: 0 0 10px rgba(224, 192, 120, 0.2);
}

input[type="time"]::-webkit-calendar-picker-indicator,
input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(0.7);
}

/* Remove o marcador nativo da seta */
details summary::-webkit-details-marker,
details summary::marker {
    display: none;
    content: "";
}

/* Animação de Rotação da Seta personalizada */
details[open] summary .summary-chevron {
    transform: rotate(180deg);
}

/* Transição Suave de Expansão (Grid Trick para suporte universal em browsers) */
details .details-content {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

details[open] .details-content {
    grid-template-rows: 1fr;
}

details .details-content > div {
    overflow: hidden;
}

/* Imagem de Fundo Celestial (Céu acima das nuvens com o sol ao fundo) */
body.angelic-body {
    background: linear-gradient(to bottom, rgba(255, 253, 250, 1), rgba(248, 243, 234, 0.55)), url('/assets/sky.avif');
    background-size: cover;
    background-position: center top;
    background-attachment: fixed;
    color: #4a4237;
    font-family: 'Plus Jakarta Sans', sans-serif;
    min-height: 100vh;
}

/* Painel de Vidro Angelical (Glassmorphism Claro) */
.glass-panel-angelic {
    background: rgba(255, 253, 250, 0.72);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(212, 175, 55, 0.25);
    box-shadow: 0 16px 40px -10px rgba(140, 115, 62, 0.12),
                0 0 30px rgba(255, 255, 255, 0.8) inset;
}

/* Inputs em Tom Creme e Luz Suave */
.input-angelic {
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(212, 175, 55, 0.3);
    color: #3b332a;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.input-angelic:focus {
    border-color: #d4af37;
    background: #ffffff;
    outline: none;
    box-shadow: 0 0 15px rgba(212, 175, 55, 0.3);
}

/* Marcadores nos Cantos dos Painéis (Pormenor de Design) */
.corner-ornament {
    position: absolute;
    width: 12px;
    height: 12px;
    border-color: rgba(212, 175, 55, 0.5);
    pointer-events: none;
}
.corner-top-left     { top: 10px; left: 10px; border-top: 1px solid; border-left: 1px solid; }
.corner-top-right    { top: 10px; right: 10px; border-top: 1px solid; border-right: 1px solid; }
.corner-bottom-left  { bottom: 10px; left: 10px; border-bottom: 1px solid; border-left: 1px solid; }
.corner-bottom-right { bottom: 10px; right: 10px; border-bottom: 1px solid; border-right: 1px solid; }

/* Animações e Detalhes do Details */
details summary::-webkit-details-marker,
details summary::marker {
    display: none;
    content: "";
}
details[open] summary .summary-chevron {
    transform: rotate(180deg);
}
details .details-content {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
details[open] .details-content {
    grid-template-rows: 1fr;
}
details .details-content > div {
    overflow: hidden;
}

/* Cantoneiras Arquitetónicas Celestiais / Neoclássicas */
.architectural-corner {
    position: absolute;
    width: 28px;
    height: 28px;
    color: rgba(212, 175, 55, 0.65); /* Dourado celestial */
    pointer-events: none;
    transition: color 0.3s ease;
}

.glass-panel-angelic:hover .architectural-corner {
    color: rgba(212, 175, 55, 0.9);
}

.corner-tl { top: 8px; left: 8px; }
.corner-tr { top: 8px; right: 8px; transform: scaleX(-1); }
.corner-bl { bottom: 8px; left: 8px; transform: scaleY(-1); }
.corner-br { bottom: 8px; right: 8px; transform: scale(-1, -1); }

/* Alerta Angelical de Erro */
.alert-angelic-error {
    background: rgba(253, 242, 242, 0.85);
    border: 1px solid rgba(224, 120, 120, 0.4);
    box-shadow: 0 8px 25px -5px rgba(220, 38, 38, 0.08),
                0 0 15px rgba(255, 255, 255, 0.9) inset;
    color: #8c2a2a;
}

/* Alerta Angelical de Sucesso */
.alert-angelic-success {
    background: rgba(254, 252, 243, 0.85);
    border: 1px solid rgba(212, 175, 55, 0.45);
    box-shadow: 0 8px 25px -5px rgba(212, 175, 55, 0.12),
                0 0 15px rgba(255, 255, 255, 0.9) inset;
    color: #6e5827;
}

/* Cantoneiras Miniatura para Alertas */
.alert-corner {
    position: absolute;
    width: 14px;
    height: 14px;
    pointer-events: none;
}
.alert-corner-tl { top: 4px; left: 4px; }
.alert-corner-tr { top: 4px; right: 4px; transform: scaleX(-1); }
.alert-corner-bl { bottom: 4px; left: 4px; transform: scaleY(-1); }
.alert-corner-br { bottom: 4px; right: 4px; transform: scale(-1, -1); }