/* Pagina: pages/winners.php (estilos extraidos do arquivo e convertidos para o tema claro) */
.winners-wrap{max-width: 700px;margin: 0 auto;padding: 0 14px 60px;font-family:"Inter",sans-serif;}
.winners-header{padding: 26px 2px 6px;}
.winners-title{font-size: 22px;font-weight: 700;color: #000000;margin: 0 0 4px;letter-spacing: -.3px;font-family:"Space Grotesk",sans-serif;}
.winners-subtitle{font-size: 13px;color: #5c5c63;margin: 0 0 20px;}
.w-divider{height: 1px;background: #f5f5f6;margin: 0 0 20px;}

/* Card */
.winner-card{
    background: #ffffff;border-radius: 12px;padding: 14px;margin-bottom: 10px;
    display: flex;align-items: center;gap: 14px;cursor: pointer;
    transition: all .2s ease;border: 1px solid #e6e6e9;position: relative;overflow: hidden;
}
.winner-card::before{content:'';position: absolute;top: 0;left: 0;width: 3px;height: 100%;background: #DC2626;border-radius: 3px 0 0 3px;}
.winner-card:hover{border-color: #e6e6e9;transform: translateY(-2px);box-shadow: 0 6px 20px rgba(0, 0, 0, 0.10);}

/* Imagem */
.winner-img-wrap{
    flex-shrink: 0;width: 80px;height: 80px;border-radius: 10px;overflow: hidden;
    border: 1px solid #e6e6e9;cursor: zoom-in;position: relative;
}
.winner-img-wrap img{width: 100%;height: 100%;object-fit: cover;display: block;transition: transform .2s;}
.winner-card:hover .winner-img-wrap img{transform: scale(1.05);}
.winner-img-wrap .zoom-icon{
    position: absolute;inset: 0;display: flex;align-items: center;justify-content: center;
    background: rgba(0, 0, 0, 0.45);opacity: 0;transition: opacity .2s;font-size: 18px;color: #000000;
}
.winner-card:hover .winner-img-wrap .zoom-icon{opacity: 1;}

/* Info */
.winner-info{flex: 1;min-width: 0;}
.winner-name{font-size: 15px;font-weight: 700;color: #000000;margin-bottom: 3px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.winner-product{font-size: 12px;color: #5c5c63;margin-bottom: 8px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.winner-badge{
    display: inline-flex;align-items: center;gap: 5px;
    background: var(--r-red-soft);color: #f87171;
    padding: 4px 10px;border-radius: 6px;font-size: 11px;font-weight: 700;
    border: 1px solid rgba(220,38,38,.2);letter-spacing: .2px;
}
.winner-meta{display: flex;align-items: center;justify-content: space-between;margin-top: 8px;}
.winner-date,.winner-city{font-size: 11px;color: #5c5c63;display: flex;align-items: center;gap: 4px;}

/* Lightbox imagem */
.img-lightbox{
    display: none;position: fixed;inset: 0;background: rgba(0, 0, 0, 0.45);z-index: 99998;
    justify-content: center;align-items: center;padding: 20px;cursor: zoom-out;
}
.img-lightbox.active{display: flex;}
.img-lightbox img{max-width: 90vw;max-height: 85vh;border-radius: 12px;object-fit: contain;box-shadow: 0 20px 60px rgba(0, 0, 0, 0.10);}

/* Modal ganhador */
.w-modal-overlay{
    display: none;position: fixed;inset: 0;background: rgba(0, 0, 0, 0.45);z-index: 99999;
    justify-content: center;align-items: center;padding: 16px;
}
.w-modal-overlay.active{display: flex;}
.w-modal{
    background: #ffffff;border-radius: 16px;border: 1px solid #e6e6e9;
    max-width: 460px;width: 100%;position: relative;
    animation: modalIn .3s cubic-bezier(.34,1.56,.64,1);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.10);overflow: hidden;
}
@keyframes modalIn{from{transform: translateY(-30px) scale(.94);opacity: 0}to{transform: translateY(0) scale(1);opacity: 1}}

.w-modal-header{
    padding: 0;position: relative;
    border-bottom: 1px solid #e6e6e9;
}
.w-modal-img{
    width: 100%;height: auto;object-fit: contain;display: block;cursor: zoom-in;
}
.w-modal-close{
    position: absolute;top: 12px;right: 12px;width: 32px;height: 32px;border-radius: 50%;
    background: rgba(0, 0, 0, 0.45);border: 1px solid #e6e6e9;color: #000000;font-size: 18px;
    cursor: pointer;display: flex;align-items: center;justify-content: center;
    transition: all .2s;line-height: 1;
}
.w-modal-close:hover{background: #DC2626;border-color: #DC2626;}

.w-modal-avatar{
    width: 72px;height: 72px;border-radius: 50%;object-fit: cover;
    border: 3px solid #DC2626;position: absolute;bottom: -36px;left: 20px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.10);cursor: zoom-in;
}

.w-modal-body{padding: 48px 20px 20px;}
.w-modal-name{font-size: 18px;font-weight: 700;color: #000000;margin-bottom: 2px;font-family:"Space Grotesk",sans-serif;}
.w-modal-product{font-size: 13px;color: #5c5c63;margin-bottom: 16px;}

.w-detail{background: #ffffff;border-radius: 8px;padding: 12px 14px;margin-bottom: 8px;border: 1px solid #e6e6e9;}
.w-detail-label{color: #5c5c63;font-size: 10px;font-weight: 700;text-transform: uppercase;letter-spacing: .5px;display: block;margin-bottom: 4px;}
.w-detail-value{color: #000000;font-size: 14px;font-weight: 500;}
.w-detail.highlight{background: var(--r-red-soft);border-color: rgba(220,38,38,.2);}
.w-detail.highlight .w-detail-value{color: #f87171;font-weight: 700;}

.w-modal-desc{background: #ffffff;border-radius: 8px;padding: 12px 14px;margin-top: 8px;color: #5c5c63;font-size: 13px;line-height: 1.6;border: 1px solid #e6e6e9;}

/* Empty */
.empty-state{text-align: center;padding: 60px 20px;color: #000000;}
.empty-icon{font-size: 48px;margin-bottom: 16px;display: block;}
.empty-text{font-size: 16px;font-weight: 600;}

@media(max-width:600px){
    .winner-card{padding: 12px;gap: 12px;}
    .winner-img-wrap{width: 68px;height: 68px;}
    .w-modal-img{height: 180px;}
    .w-modal-avatar{width: 60px;height: 60px;bottom: -30px;}
    .w-modal-body{padding: 42px 16px 16px;}
}