/**
 * Sorteio Common Styles — Full White Label
 * Uses wl_css_variables() from init.php
 */
*{margin:0;padding:0;box-sizing:border-box}

body{
    font-family:'Segoe UI',system-ui,-apple-system,sans-serif;
    background:var(--wl-bg-main, #f5f0e8);
    min-height:100vh;
    display:flex;
    flex-direction:column;
    color:var(--wl-text-primary, #1f2937);
}

.header{
    background:linear-gradient(135deg, var(--wl-primary, #1B3A5F) 0%, var(--wl-primary-light, #2c4a6f) 100%);
    color:#fff;
    padding:24px 20px;
    text-align:center;
    position:relative;
    overflow:hidden;
}
.header::before{
    content:'';position:absolute;top:-50%;right:-50%;width:100%;height:200%;
    background:radial-gradient(circle,rgba(255,255,255,0.08) 0%,transparent 60%);
    pointer-events:none;
}
.header-logo{
    width:60px;height:60px;border-radius:50%;object-fit:cover;
    border:3px solid rgba(255,255,255,0.3);margin:0 auto 12px;display:block;
    background:#fff;
}
.header h1{font-size:clamp(22px,5vw,32px);margin-bottom:6px;font-weight:700;position:relative;}
.header p{font-size:15px;opacity:0.85;position:relative;}

.container{max-width:960px;margin:0 auto;padding:24px 16px;flex:1;}

.card{
    background:var(--wl-bg-card, #fff);
    border-radius:var(--wl-border-radius-md, 12px);
    padding:clamp(20px,4vw,36px);
    box-shadow:0 2px 12px var(--wl-overlay-black-06, rgba(0,0,0,0.06));
}

/* Buttons */
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:6px;
    padding:12px 24px;border:none;border-radius:var(--wl-border-radius, 8px);
    font-size:15px;font-weight:600;cursor:pointer;transition:all 0.2s;
    text-decoration:none;text-align:center;
}
.btn-primary{background:var(--wl-secondary, #8B6F47);color:#fff;}
.btn-primary:hover{filter:brightness(1.1);transform:translateY(-1px);}
.btn-success{background:var(--wl-success, #27ae60);color:#fff;}
.btn-success:hover{filter:brightness(1.1);transform:translateY(-1px);}

/* Forms */
.form-group{margin-bottom:18px;}
.form-group label{display:block;margin-bottom:6px;font-weight:600;font-size:14px;color:var(--wl-text-primary);}
.form-group input,.form-group select,.form-group textarea{
    width:100%;padding:12px 14px;border:1.5px solid var(--wl-border-color, #e5e7eb);
    border-radius:var(--wl-border-radius, 8px);font-size:15px;transition:border-color 0.2s;
    background:var(--wl-bg-card, #fff);color:var(--wl-text-primary);
}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{
    outline:none;border-color:var(--wl-secondary, #8B6F47);
    box-shadow:0 0 0 3px rgba(139,111,71,0.1);
}

/* Loading */
.loading-container{text-align:center;padding:48px 20px;}
.spinner{
    width:40px;height:40px;
    border:3px solid var(--wl-border-color, #e5e7eb);
    border-top-color:var(--wl-secondary, #8B6F47);
    border-radius:50%;animation:spin 0.7s linear infinite;margin:0 auto 16px;
}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-text{color:var(--wl-text-secondary);font-size:14px;}

/* Footer */
.footer{
    background:var(--wl-primary, #1B3A5F);color:#fff;
    padding:32px 20px;text-align:center;margin-top:auto;
}
.footer-logo{width:48px;height:48px;border-radius:50%;object-fit:cover;margin:0 auto 12px;display:block;border:2px solid rgba(255,255,255,0.2);background:#fff;}
.footer-title{font-size:18px;margin-bottom:4px;}
.footer-text{opacity:0.7;margin-bottom:16px;font-size:14px;}
.social-links{display:flex;justify-content:center;gap:12px;margin-bottom:16px;}
.social-link{
    width:42px;height:42px;background:rgba(255,255,255,0.1);border-radius:50%;
    display:flex;align-items:center;justify-content:center;font-size:20px;
    text-decoration:none;transition:all 0.2s;color:#fff;
}
.social-link:hover{background:var(--wl-accent, #D4915D);transform:scale(1.1);}
.footer-copyright{font-size:12px;opacity:0.5;}

/* Messages */
.error-message{background:var(--color-error-light, #fee2e2);color:var(--color-error, #dc2626);padding:12px 16px;border-radius:var(--wl-border-radius, 8px);margin-bottom:16px;display:none;font-size:14px;}
.error-message.show{display:block;}
.success-message{text-align:center;padding:32px;}

/* Empty/Error States */
.empty-state,.error-state{text-align:center;padding:48px 20px;background:var(--wl-bg-card, #fff);border-radius:var(--wl-border-radius-md, 12px);}
.empty-state-icon,.error-state-icon{font-size:48px;margin-bottom:16px;}
.empty-state h3,.error-state h3{margin-bottom:8px;color:var(--wl-text-primary);}
.empty-state p,.error-state p{color:var(--wl-text-secondary);}
.btn-retry{margin-top:16px;padding:10px 20px;background:var(--wl-primary, #1B3A5F);color:#fff;border:none;border-radius:var(--wl-border-radius, 8px);cursor:pointer;font-size:14px;}

@media(max-width:768px){
    .header{padding:20px 16px;}
    .card{padding:20px 16px;}
    .container{padding:16px 12px;}
}