/* ── Animaciones ────────────────────────────────────────────── */
@keyframes slideIn {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}
@keyframes spin {
    to { transform: rotate(360deg); }
}
@keyframes progressBar {
    0%   { left: -40%; }
    100% { left: 100%; }
}
@keyframes enlaceMovidoPulsoVert {
    0%, 100% { transform: translateY(0); opacity: 1; }
    50%      { transform: translateY(-8px); opacity: .8; }
}
@keyframes enlaceMovidoPulsoHoriz {
    0%, 100% { transform: translateX(0); opacity: 1; }
    50%      { transform: translateX(10px); opacity: .8; }
}
.progress-bar {
    position: relative;
    width: 100%;
    max-width: 320px;
    margin: 0 auto;
    height: 8px;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    overflow: hidden;
}
.progress-bar > span {
    position: absolute;
    top: 0;
    height: 100%;
    width: 40%;
    background: #B90022;
    animation: progressBar 1.2s linear infinite;
}

/* ── Global: sin esquinas redondeadas (excepto .r) ──────────── */
*:not(.r):not(.r *), *:not(.r):not(.r *)::before, *:not(.r):not(.r *)::after {
    border-radius: 0 !important;
}
.spinner {
    width: 16px;
    height: 16px;
    border: 2px solid #e5e7eb;
    border-top-color: #B90022;
    border-radius: 50% !important;
    animation: spin .8s linear infinite;
    display: inline-block;
}

/* ── Covasa brand tokens ─────────────────────────────────────── */
:root {
    --color-brand:   #B90022;
    --color-brand-dk:#96001b;
    --color-rotulo:  #515151;
}

/* Utility classes (supplement Tailwind) */
.btn-brand {
    background: var(--color-brand);
    color: #fff;
    border-radius: 0;
    padding: .5rem 1.25rem;
    font-weight: 600;
    transition: opacity .15s;
}
.btn-brand:hover    { opacity: .85; }
.btn-brand:disabled { opacity: .5; cursor: not-allowed; }

.btn-secondary {
    background: var(--color-rotulo);
    color: #fff;
    border-radius: 0;
    padding: .5rem 1.25rem;
    font-weight: 600;
    transition: opacity .15s;
}
.btn-secondary:hover { opacity: .85; }

.link-brand {
    color: var(--color-brand);
    cursor: pointer;
    text-decoration: none;
}
.link-brand:hover { text-decoration: underline; opacity: .8; }

.form-input {
    width: 100%;
    border: 1px solid #d1d5db;
    border-radius: 0;
    padding: .5rem .75rem;
    outline: none;
    transition: box-shadow .15s;
}
.form-input:focus { box-shadow: 0 0 0 2px #fca5a5; }

.alert-error {
    background: #fff5f5;
    border: 1px solid #fca5a5;
    color: #b91c1c;
    border-radius: 0;
    padding: .75rem;
    font-size: .875rem;
}

.card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0;
    box-shadow: 0 1px 3px rgba(0,0,0,.08);
    padding: 2rem;
}
@media (max-width: 767px) {
    .card { padding: .75rem; }
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Minijuego tragaperras ─────────────────────────────────── */
@keyframes slideDown {
    from { transform: translateY(-100%); }
    to { transform: translateY(0); }
}
@keyframes slotPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(226,176,74,.4); }
    50% { box-shadow: 0 0 20px 5px rgba(226,176,74,.6); }
}
@keyframes slotWin {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}
.slot-reel {
    transition: none;
}
.slot-reel.stopped {
    transition: transform .3s ease-out;
}
@keyframes slotSpin {
    0% { transform: rotateY(0deg) scale(1); opacity:1; }
    50% { transform: rotateY(90deg) scale(.7); opacity:.3; }
    100% { transform: rotateY(180deg) scale(1); opacity:1; }
}
@keyframes slotPulseText {
    0%, 100% { opacity: 1; }
    50% { opacity: .5; }
}
.slot-win-glow {
    animation: slotPulse 1.5s ease-in-out infinite;
}