/* ============================================
   Sistema de Rifas - CSS principal
   ============================================ */

:root{
    --bg:#040b15;
    --panel:#0c1727;
    --panel-2:#111f33;
    --panel-3:#162740;
    --line:rgba(255,255,255,.10);
    --soft:rgba(255,255,255,.68);
    --text:#f6f8fb;
    --accent:#22c55e;
    --accent-2:#38bdf8;
    --warning:#f59e0b;
    --danger:#ef4444;
    --shadow:0 25px 70px rgba(0,0,0,.28);
    --radius:26px;
    --radius-sm:18px;
    --max:1240px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
    font-family:Inter,Segoe UI,Arial,sans-serif;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.15), transparent 22%),
        radial-gradient(circle at top left, rgba(34,197,94,.10), transparent 25%),
        linear-gradient(180deg, #07111f 0%, #040b15 100%);
    color:var(--text);
    min-height:100vh;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,textarea,select{font:inherit}

.site-shell{min-height:100vh;display:flex;flex-direction:column}
.container{width:min(var(--max), calc(100% - 32px));margin:0 auto}
.page-gap{padding:28px 0}
.topbar{
    position:sticky;top:0;z-index:50;
    backdrop-filter:blur(18px);
    background:rgba(6,14,25,.78);
    border-bottom:1px solid var(--line);
}
.topbar-inner{
    min-height:76px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.02em}
.brand img{width:42px;height:42px;border-radius:14px;object-fit:cover;background:#fff}
.brand-badge{
    width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--accent),var(--accent-2));
    display:grid;place-items:center;font-size:20px;
}
.brand-text{font-size:1rem}
.topbar-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.ghost-link{
    color:var(--soft);
    transition:.2s ease;
}
.ghost-link:hover{color:#fff}

.hero-panel,.detail-card,.gallery-card,.checkout-card,.auth-card,.form-shell,.dash-card,.admin-raffle-card,.order-card,.empty-state,.numbers-section,.pix-card,.promoter-box{
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow);
}
.hero-panel{
    padding:28px;
    display:grid;
    grid-template-columns:1.4fr .9fr;
    gap:20px;
    align-items:stretch;
}
.hero-copy h1,.detail-card h1,.checkout-card h1,.auth-card h1,.admin-topbar h1{margin:10px 0 12px;font-size:clamp(1.8rem, 4vw, 3rem);line-height:1.02}
.hero-copy p,.detail-card p,.checkout-card p,.auth-card p{color:var(--soft);line-height:1.65}
.eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    color:#9cd7ff;font-weight:800;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
}
.hero-stats,.dashboard-cards{display:grid;gap:14px}
.hero-stats{grid-template-columns:1fr}
.stat-card,.dash-card{
    padding:20px;border-radius:24px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)
}
.stat-card strong,.dash-card strong{display:block;font-size:1.6rem;margin-bottom:6px}
.stat-card span,.dash-card span,.dash-card small{color:var(--soft);display:block}

.section-header{
    display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap;margin-bottom:18px
}
.section-header h2{margin:0 0 6px;font-size:1.45rem}
.section-header p{margin:0;color:var(--soft)}

.cards-grid,.admin-list-grid{display:grid;gap:18px}
.cards-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.admin-list-grid{grid-template-columns:repeat(auto-fit,minmax(270px,1fr))}
.raffle-card{
    border-radius:var(--radius);
    overflow:hidden;
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
    border:1px solid var(--line);
    transition:transform .2s ease,border-color .2s ease, box-shadow .2s ease;
}
.raffle-card:hover{transform:translateY(-3px);border-color:rgba(56,189,248,.35);box-shadow:0 30px 80px rgba(0,0,0,.36)}
.raffle-card-link{display:block;height:100%}
.raffle-photo-frame{position:relative;aspect-ratio:1.2/1;overflow:hidden;background:#0a1627}
.raffle-photo-frame img{width:100%;height:100%;object-fit:cover;transition:transform .25s ease}
.raffle-card:hover img{transform:scale(1.05)}
.raffle-photo-placeholder{height:100%;display:grid;place-items:center;font-size:3rem;opacity:.8}
.type-pill{
    position:absolute;top:14px;left:14px;z-index:2;
    padding:8px 12px;border-radius:999px;
    background:rgba(5,10,18,.78);backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,.12);font-weight:700;font-size:.78rem
}
.raffle-card-body{padding:20px}
.raffle-card-body h2{margin:0 0 10px;font-size:1.28rem}
.raffle-card-body p{margin:0 0 14px;color:var(--soft);line-height:1.6}
.info-row,.detail-topline,.legend-row,.form-actions,.success-actions,.card-links,.admin-actions{
    display:flex;flex-wrap:wrap;gap:10px;align-items:center
}
.mini-pill{
    padding:9px 12px;border-radius:999px;
    background:rgba(56,189,248,.10);
    color:#c7ecff;border:1px solid rgba(56,189,248,.18);font-size:.85rem
}
.counts-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px
}
.counts-grid>div,.detail-metrics>div{
    padding:14px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)
}
.counts-grid strong,.detail-metrics strong{display:block;font-size:1.15rem}
.counts-grid span,.detail-metrics span{display:block;color:var(--soft);font-size:.9rem;margin-top:4px}
.compact-grid>div{padding:12px}

.detail-grid{
    display:grid;grid-template-columns:.92fr 1.08fr;gap:22px;align-items:start
}
.gallery-card,.detail-card,.numbers-section,.checkout-card,.auth-card,.form-shell,.order-card{padding:24px}
.gallery-main{
    aspect-ratio:1.2/1;
    max-height:520px;
    overflow:hidden;
    border-radius:24px;
    background:#091423
}
.gallery-main img{width:100%;height:100%;object-fit:cover}
.gallery-thumbs{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:10px;margin-top:14px
}
.thumb-button{
    padding:0;border:none;background:none;cursor:pointer;border-radius:18px;overflow:hidden
}
.thumb-button img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid rgba(255,255,255,.12);border-radius:18px}
.gallery-empty{
    min-height:440px;border-radius:24px;display:grid;place-items:center;
    background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
    text-align:center;color:var(--soft)
}
.gallery-empty-icon{font-size:3rem;margin-bottom:10px}
.description-box{
    margin-top:18px;
    color:#edf2f8;
    line-height:1.75;
    text-align:justify;
    white-space:normal;
}
.detail-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}
.promoter-box,.pix-card{
    margin-top:16px;padding:18px;border-radius:22px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)
}
.promoter-box div{margin:7px 0;color:var(--soft)}
.promoter-box strong,.pix-topline{color:#fff}

.numbers-section{margin-top:22px}
.numbers-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(72px, 1fr));
    gap:10px;
}
.number-tile{
    border:none;
    border-radius:20px;
    min-height:72px;
    padding:10px 8px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    color:#fff;
}
.number-tile span{font-weight:800;font-size:1rem}
.number-tile small{font-size:.68rem;color:#d8dfeb}
.number-tile.is-available{cursor:pointer;transition:.18s ease}
.number-tile.is-available:hover{transform:translateY(-1px);border-color:rgba(34,197,94,.45);background:rgba(34,197,94,.12)}
.number-tile.is-selected{background:rgba(34,197,94,.18)!important;border-color:rgba(34,197,94,.75)!important}
.number-tile.is-pending,.admin-tile.tile-pending{background:rgba(245,158,11,.18);border-color:rgba(245,158,11,.35)}
.admin-tile.tile-confirmed{background:rgba(239,68,68,.16);border-color:rgba(239,68,68,.34)}
.admin-tile.tile-available{background:rgba(34,197,94,.10);border-color:rgba(34,197,94,.24)}
.selection-bar{
    margin-top:18px;padding:16px 18px;border-radius:22px;background:rgba(255,255,255,.04);
    display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;border:1px solid rgba(255,255,255,.08)
}
.selection-bar strong{display:block;margin-bottom:4px}
.selection-bar span{color:var(--soft)}
.legend-row{gap:14px}
.legend-item{display:flex;align-items:center;gap:8px;color:var(--soft)}
.legend-dot{width:12px;height:12px;border-radius:999px;display:inline-block}
.legend-dot.available{background:var(--accent)}
.legend-dot.pending{background:var(--warning)}

.primary-button,.secondary-button{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    min-height:48px;padding:0 18px;border-radius:16px;border:none;cursor:pointer;font-weight:700
}
.primary-button{
    background:linear-gradient(135deg,var(--accent),#16a34a);color:#03100a;box-shadow:0 10px 30px rgba(34,197,94,.22)
}
.primary-button:disabled{opacity:.45;cursor:not-allowed}
.secondary-button{
    background:rgba(56,189,248,.12);color:#d8f2ff;border:1px solid rgba(56,189,248,.18)
}
.full-width{width:100%}

.checkout-shell,.auth-shell{padding:16px 0 40px}
.checkout-grid{
    display:grid;grid-template-columns:1fr .9fr;gap:20px
}
.field-block{display:flex;flex-direction:column;gap:8px}
.field-label{font-weight:700}
.field-help{font-size:.85rem;color:var(--soft)}
.text-input{
    width:100%;min-height:50px;border-radius:16px;padding:0 15px;
    background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);color:#fff;outline:none
}
.text-input:focus{border-color:rgba(56,189,248,.45);box-shadow:0 0 0 3px rgba(56,189,248,.12)}
.text-input::placeholder{color:#9aa8bb}
.textarea-input{min-height:180px;padding:15px;resize:vertical}
.buyer-form,.raffle-admin-form,.auth-form{display:grid;gap:16px}
.checkout-summary{
    display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px
}
.checkout-summary>div{
    padding:15px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);line-height:1.6
}
.copy-field{
    display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:10px
}
.copy-field input{
    min-height:48px;padding:0 14px;border-radius:16px;border:1px solid rgba(255,255,255,.10);
    background:rgba(255,255,255,.05);color:#fff
}
.pix-help,.info-note{
    color:var(--soft);line-height:1.65
}
.info-note{
    margin-top:16px;padding:16px 18px;border-radius:18px;background:rgba(56,189,248,.08);border:1px solid rgba(56,189,248,.14)
}
.success-shell{text-align:center;max-width:860px;margin:0 auto}
.success-icon{font-size:4rem}

.auth-shell{display:grid;place-items:center;min-height:calc(100vh - 180px)}
.auth-card{max-width:480px;margin:0 auto}

.flash{
    margin-top:16px;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.10)
}
.flash-success{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.28)}
.flash-danger{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.28)}

.admin-topbar{
    display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap
}
.admin-section{padding-bottom:12px}
.form-shell{padding:22px}
.form-grid{display:grid;gap:16px}
.two-cols{grid-template-columns:repeat(2,1fr)}
.three-cols{grid-template-columns:repeat(3,1fr)}
.filters-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:end
}
.filters-actions{align-self:end}
.admin-photo-grid{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px
}
.admin-photo-card{
    padding:12px;border-radius:20px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);display:grid;gap:10px
}
.admin-photo-card img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:18px}
.admin-photo-card span{display:flex;gap:8px;align-items:center;color:var(--soft)}
.order-card-head,.order-grid,.status-form,.footer-inner{
    display:flex;gap:14px;flex-wrap:wrap
}
.order-card-head{justify-content:space-between;align-items:flex-start}
.order-card-head h3{margin:8px 0 6px}
.order-card-head p{margin:0;color:var(--soft)}
.order-head-side{text-align:right;display:grid;gap:8px;justify-items:end}
.status-pill{
    display:inline-flex;padding:8px 12px;border-radius:999px;font-size:.82rem;font-weight:800;letter-spacing:.04em;border:1px solid transparent
}
.status-pending{background:rgba(245,158,11,.15);color:#ffd38b;border-color:rgba(245,158,11,.25)}
.status-confirmed{background:rgba(34,197,94,.15);color:#b4f5c9;border-color:rgba(34,197,94,.28)}
.status-cancelled{background:rgba(239,68,68,.15);color:#ffc2c2;border-color:rgba(239,68,68,.28)}
.order-grid{
    margin:18px 0;
    display:grid;grid-template-columns:repeat(4,1fr);gap:12px
}
.order-grid>div{
    padding:14px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);line-height:1.55
}
.status-form{align-items:center}
.status-form .text-input{max-width:240px}
.history-box{margin-top:18px;border-top:1px solid rgba(255,255,255,.08);padding-top:16px}
.history-box summary{cursor:pointer;font-weight:700}
.history-items{display:grid;gap:10px;margin-top:14px}
.history-item{
    padding:14px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)
}
.history-item span{display:block;color:var(--soft);font-size:.9rem;margin-top:6px}
.history-item p{margin:8px 0 0;color:#eef2f7;line-height:1.6}
.orders-stack{display:grid;gap:16px}
.empty-state{
    padding:28px;text-align:center
}
.small-empty{padding:20px}
.empty-state h1,.empty-state h2{margin:0 0 8px}
.empty-state p{margin:0;color:var(--soft)}
.site-footer{
    margin-top:auto;border-top:1px solid rgba(255,255,255,.08);padding:22px 0;color:var(--soft)
}
.footer-inner{justify-content:space-between}
.iti{width:100%}
.iti__country-list{color:#111}

@media (max-width: 1100px){
    .detail-grid,.checkout-grid,.hero-panel{grid-template-columns:1fr}
    .three-cols,.filters-grid{grid-template-columns:repeat(2,1fr)}
    .order-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 720px){
    .container{width:min(var(--max), calc(100% - 20px))}
    .topbar-inner{min-height:68px}
    .detail-card,.gallery-card,.numbers-section,.checkout-card,.auth-card,.form-shell,.order-card{padding:18px}
    .counts-grid,.detail-metrics,.checkout-summary,.three-cols,.two-cols,.filters-grid,.order-grid{grid-template-columns:1fr}
    .numbers-grid{grid-template-columns:repeat(auto-fit,minmax(66px,1fr))}
    .selection-bar,.footer-inner,.order-card-head,.admin-topbar,.topbar-inner{align-items:flex-start}
    .copy-field{grid-template-columns:1fr}
    .topbar-actions{gap:8px}
    .brand-text{font-size:.92rem}
}

select.text-input option{color:#111;background:#fff;}
