/* PROMO LANZAMIENTO WEB */
.promo-launch-strip{
padding:0 18px 12px;
}
.promo-launch-card{
width:100%;
border-radius:18px;
padding:13px 14px;
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
background:linear-gradient(135deg,rgba(37,211,102,.15),rgba(250,204,21,.08));
border:1px solid rgba(37,211,102,.22);
box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.promo-launch-copy{min-width:0;}
.promo-launch-copy span{
display:block;
color:#7dffad;
font-size:10px;
font-weight:950;
letter-spacing:.45px;
text-transform:uppercase;
margin-bottom:3px;
}
.promo-launch-copy strong{
display:block;
color:#fff;
font-size:15px;
line-height:1.08;
font-weight:950;
}
.promo-launch-copy small{
display:block;
color:#b7bcc6;
font-size:11.5px;
line-height:1.25;
font-weight:750;
margin-top:4px;
}
.promo-launch-btn{
flex:0 0 auto;
min-height:36px;
padding:0 12px;
border-radius:999px;
border:1px solid rgba(37,211,102,.24);
background:rgba(37,211,102,.16);
color:#9bffc2;
font-size:11.5px;
font-weight:950;
cursor:pointer;
}
.promo-cart-note{
display:none;
margin:0 0 10px;
padding:10px 11px;
border-radius:14px;
background:rgba(37,211,102,.09);
border:1px solid rgba(37,211,102,.18);
color:#b8ffd2;
font-size:11.5px;
line-height:1.28;
font-weight:800;
}
.cart-group-label{
margin:10px 2px 5px;
color:#8d939f;
font-size:10.5px;
font-weight:950;
letter-spacing:.38px;
text-transform:uppercase;
}
.cart-item.free-item{
border-color:rgba(37,211,102,.22);
background:linear-gradient(135deg,rgba(37,211,102,.10),#141820 70%);
}
.cart-item-free-badge{
display:inline-flex;
align-items:center;
margin-left:6px;
min-height:16px;
padding:2px 6px;
border-radius:999px;
background:rgba(37,211,102,.18);
color:#9bffc2;
font-size:8.5px;
line-height:1;
font-weight:950;
vertical-align:middle;
letter-spacing:.25px;
}
.song-options-menu button.promo-disabled,
.song-options-menu button:disabled{
opacity:.45;
cursor:not-allowed;
}
.song-options-menu button[data-menu-action="free"] i{
color:#9bffc2;
}
.song-options-menu button[data-menu-action="free"]:not(:disabled):not(.promo-disabled){
background:linear-gradient(135deg,#25d366,#16a34a);
color:#fff;
box-shadow:0 10px 24px rgba(37,211,102,.22);
}
.song-options-menu button[data-menu-action="free"]:not(:disabled):not(.promo-disabled) i{
color:#fff;
}
.song-options-menu button[data-menu-action="free"]:not(:disabled):not(.promo-disabled):hover,
.song-options-menu button[data-menu-action="free"]:not(:disabled):not(.promo-disabled):active{
background:linear-gradient(135deg,#2ee879,#16a34a);
color:#fff;
}
@media (min-width:1024px){
.promo-launch-strip{
padding-left:18px;
padding-right:18px;
}
.promo-launch-card{
max-width:100%;
padding:14px 18px;
}
}
/* MEJORAS: artista clickeable, compartir link y sección LOS MÁS PEDIDOS */
.artist-filter-link{
border:0 !important;
background:transparent !important;
padding:0 !important;
margin:0 !important;
font:inherit !important;
color:inherit !important;
text-align:left !important;
cursor:pointer !important;
max-width:100% !important;
}
.song-artist.artist-filter-link{
display:block !important;
width:100% !important;
color:#8d939f !important;
font-size:12.5px !important;
font-weight:600 !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
}
.album-sub.artist-filter-link{
display:block !important;
width:100% !important;
color:#737985 !important;
font-size:11px !important;
font-weight:650 !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
}
.artist-filter-link:hover,
.artist-filter-link:active{
color:var(--blue) !important;
text-decoration:underline !important;
}
.song-options-menu{
width:226px !important;
}
.song-options-menu button[data-menu-action="share"] i{
color:#13c8ff !important;
}
#mostRequestedWrap .section-title::after{
content:"";
display:inline-block;
width:7px;
height:7px;
margin-left:8px;
border-radius:999px;
background:var(--green);
box-shadow:0 0 12px rgba(37,211,102,.55);
vertical-align:middle;
}
/* AJUSTE: pastillas y covers compactos para TOP HITS / MÁS PEDIDOS */
.tabs{
gap:7px !important;
}
.tab{
min-width:auto !important;
height:33px !important;
padding:0 11px !important;
font-size:11.2px !important;
letter-spacing:.15px !important;
}
.rail{
gap:12px !important;
}
.album-card{
flex:0 0 106px !important;
width:106px !important;
}
.album-cover{
width:106px !important;
border-radius:7px !important;
}
.album-title{
margin-top:7px !important;
font-size:12px !important;
line-height:16px !important;
max-height:16px !important;
}
.album-sub.artist-filter-link,
.album-sub{
margin-top:3px !important;
font-size:10.2px !important;
line-height:13px !important;
min-height:13px !important;
}
@media (min-width:720px){
.album-card{
flex-basis:122px !important;
width:122px !important;
}
.album-cover{
width:122px !important;
}
}
@media (min-width:1024px){
.album-card{
flex-basis:132px !important;
width:132px !important;
}
.album-cover{
width:132px !important;
}
}
/* AJUSTE MODAL PEDIDO COMPACTO - 2 GRATIS + 2 COMPRADAS */
.cart-modal{
max-width:392px !important;
border-radius:22px !important;
}
.cart-modal .modal-head{
padding:12px 15px !important;
}
.cart-modal .modal-head h3{
font-size:16px !important;
line-height:1 !important;
}
.cart-modal .modal-close{
width:30px !important;
height:30px !important;
}
.cart-modal .modal-body{
padding:10px 14px 13px !important;
max-height:calc(92vh - 52px) !important;
}
.cart-modal .modal-copy,
.promo-cart-note,
.cart-more-note,
.cart-toggle-list{
display:none !important;
}
.cart-items{
gap:6px !important;
margin-bottom:8px !important;
max-height:min(330px, 43vh) !important;
overflow-y:auto !important;
padding-right:2px !important;
}
.cart-section{
display:grid !important;
gap:5px !important;
padding:0 !important;
}
.cart-section + .cart-section{
margin-top:8px !important;
}
.cart-group-label{
margin:0 2px 1px !important;
color:#a0a6b2 !important;
font-size:10px !important;
line-height:1 !important;
font-weight:950 !important;
letter-spacing:.45px !important;
text-transform:uppercase !important;
}
.cart-section-note{
padding:7px 9px !important;
border-radius:10px !important;
font-size:11px !important;
line-height:1.22 !important;
font-weight:850 !important;
}
.cart-section-note.free-note{
background:rgba(37,211,102,.10) !important;
border:1px solid rgba(37,211,102,.18) !important;
color:#9bffc2 !important;
}
.cart-section-note.paid-note{
background:rgba(19,200,255,.10) !important;
border:1px solid rgba(19,200,255,.18) !important;
color:#b8efff !important;
}
.cart-section-note.ok{
background:rgba(37,211,102,.08) !important;
border-color:rgba(37,211,102,.18) !important;
color:#7dffad !important;
}
.cart-item.compact-cart-item{
grid-template-columns:34px minmax(0,1fr) 30px !important;
min-height:44px !important;
gap:8px !important;
padding:6px !important;
border-radius:11px !important;
}
.cart-item-cover{
width:34px !important;
height:34px !important;
border-radius:7px !important;
}
.compact-cart-info{
min-width:0 !important;
}
.cart-item-title{
font-size:12px !important;
line-height:1.15 !important;
-webkit-line-clamp:1 !important;
white-space:nowrap !important;
display:block !important;
text-overflow:ellipsis !important;
}
.cart-item-artist{
font-size:10.3px !important;
line-height:1.1 !important;
margin-top:2px !important;
}
.cart-item .tag-row{
margin-top:3px !important;
gap:4px !important;
}
.cart-item .pill{
min-height:13px !important;
padding:2px 4px !important;
font-size:7.5px !important;
border-radius:4px !important;
}
.cart-item-free-badge{
min-height:14px !important;
padding:2px 5px !important;
font-size:7.5px !important;
margin-left:5px !important;
}
.remove-cart{
width:28px !important;
height:28px !important;
background:rgba(239,68,68,.14) !important;
color:#fecaca !important;
}
.cart-paid-more-btn{
width:100% !important;
min-height:32px !important;
border:1px solid rgba(255,255,255,.08) !important;
border-radius:10px !important;
background:#171b22 !important;
color:#dce2ec !important;
font-size:11px !important;
font-weight:900 !important;
cursor:pointer !important;
}
.price-card.compact-price-card{
margin:7px 0 8px !important;
padding:9px 10px !important;
border-radius:14px !important;
}
.price-main-line{
padding-bottom:7px !important;
}
.price-main-line span{
font-size:11px !important;
letter-spacing:.35px !important;
}
.price-main-line strong{
font-size:24px !important;
}
.price-mini-line{
gap:6px !important;
padding:7px 0 0 !important;
}
.price-mini-line span{
font-size:9px !important;
line-height:1.05 !important;
}
.price-mini-line b{
margin-top:2px !important;
font-size:12px !important;
}
.tariff-note{
display:none !important;
}
#paymentCartWrap{
margin:6px 0 8px !important;
}
#paymentCartWrap > label{
margin-bottom:7px !important;
font-size:12px !important;
line-height:1 !important;
}
#paymentCartWrap .payment-options{
grid-template-columns:1fr 1fr !important;
gap:8px !important;
}
.payment-pill{
min-height:44px !important;
flex-direction:row !important;
gap:8px !important;
padding:7px 10px !important;
border-radius:12px !important;
}
.payment-logo{
width:30px !important;
height:20px !important;
object-fit:contain !important;
}
.payment-pill strong{
font-size:12px !important;
}
.payment-pill small{
display:none !important;
}
.payment-warning{
margin:7px 0 !important;
padding:8px 9px !important;
border-radius:11px !important;
font-size:11px !important;
line-height:1.25 !important;
}
#sendOrderBtn{
min-height:44px !important;
border-radius:14px !important;
font-size:13px !important;
font-weight:950 !important;
}
.cart-actions-row{
gap:8px !important;
margin-top:8px !important;
}
.cart-actions-row .secondary-btn{
min-height:38px !important;
border-radius:12px !important;
font-size:12px !important;
}
#keepSearchingBtn{
background:rgba(19,200,255,.13) !important;
color:#b8efff !important;
border:1px solid rgba(19,200,255,.18) !important;
}
#clearCartBtn{
background:rgba(239,68,68,.14) !important;
color:#fecaca !important;
border:1px solid rgba(239,68,68,.20) !important;
}
@media (max-width:380px){
.cart-modal .modal-body{
padding-left:11px !important;
padding-right:11px !important;
}
.price-main-line strong{
font-size:22px !important;
}
.payment-pill{
padding-left:8px !important;
padding-right:8px !important;
gap:6px !important;
}
}
/* =========================================================
AJUSTES DJGABO - MODAL DETALLE DE PISTA MEJORADO
========================================================= */
.song-order-cover{
position:relative !important;
overflow:hidden !important;
}
.song-order-cover:after{
content:"";
position:absolute;
inset:0;
background:rgba(0,0,0,.10);
pointer-events:none;
z-index:1;
}
.song-modal-cover-play{
position:absolute;
inset:0;
margin:auto;
width:48px;
height:48px;
border-radius:999px;
border:1px solid rgba(255,255,255,.42);
background:rgba(0,0,0,.34);
color:#fff;
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
backdrop-filter:blur(5px);
z-index:4;
box-shadow:0 10px 26px rgba(0,0,0,.38), 0 0 22px rgba(37,211,102,.18);
}
.song-modal-cover-play i{
font-size:17px;
margin-left:3px;
}
.song-modal-cover-play:disabled{
opacity:.38;
cursor:not-allowed;
box-shadow:none;
}
.song-modal-hand{
position:absolute;
right:-3px;
top:48%;
transform:translateY(-50%);
font-size:30px;
line-height:1;
z-index:5;
pointer-events:none;
filter:drop-shadow(0 4px 9px rgba(0,0,0,.62));
animation:modalHandPoint 1.05s ease-in-out infinite;
}
@keyframes modalHandPoint{
0%,100%{ transform:translateY(-50%) translateX(0) rotate(-16deg); opacity:.72; }
50%{ transform:translateY(-50%) translateX(-7px) rotate(-16deg); opacity:1; }
}
.song-order-title{
white-space:normal !important;
overflow:visible !important;
text-overflow:unset !important;
display:block !important;
max-height:none !important;
word-break:normal !important;
overflow-wrap:anywhere !important;
}
.song-inline-player{
margin:12px auto 14px !important;
max-width:310px !important;
display:none;
}
.song-inline-player.is-open{
display:block !important;
}
.song-inline-player strong{
display:none !important;
}
.song-inline-player audio{
width:100% !important;
height:38px !important;
display:block !important;
}
.song-inline-player iframe{
width:100% !important;
height:74px !important;
border:0 !important;
border-radius:12px !important;
background:#0d0f13 !important;
}
.song-inline-help{
margin-top:7px;
color:#8d939f;
font-size:10.5px;
line-height:1.25;
font-weight:750;
}
.song-order-btn.secondary{
background:#263041 !important;
color:#ffffff !important;
border:1px solid rgba(255,255,255,.16) !important;
box-shadow:0 8px 18px rgba(0,0,0,.22) !important;
}
.song-order-btn.secondary:hover,
.song-order-btn.secondary:active{
background:#303b50 !important;
}
/* FIX FINAL: quitar reproductor blanco nativo dentro del modal */
#songBackdrop .song-order-modal{
background:#1d1f22 !important;
border-color:rgba(255,255,255,.09) !important;
box-shadow:0 26px 70px rgba(0,0,0,.58) !important;
}
#songBackdrop .song-order-modal .modal-head{
background:#111419 !important;
border-bottom-color:rgba(255,255,255,.07) !important;
}
#songBackdrop .song-order-body{
background:#1d1f22 !important;
padding-top:14px !important;
}
#songBackdrop .song-order-cover{margin-bottom:10px !important;}
#songBackdrop .song-order-title{margin-bottom:4px !important;}
#songBackdrop .song-order-artist{margin-bottom:10px !important;}
#songBackdrop .song-order-tags .tag-row{margin-bottom:11px !important;}
#songBackdrop .song-price-box{
background:rgba(6,78,54,.24) !important;
border-color:rgba(37,211,102,.24) !important;
box-shadow:none !important;
}
#songBackdrop .song-order-btn{min-height:48px !important;font-size:13px !important;line-height:1.1 !important;}
#songBackdrop .song-order-btn i{width:16px;text-align:center;font-size:13px;}
#songLocalAudio,
.song-inline-player audio{
display:none !important;
visibility:hidden !important;
width:0 !important;
height:0 !important;
margin:0 !important;
padding:0 !important;
opacity:0 !important;
pointer-events:none !important;
overflow:hidden !important;
}
.song-inline-player{
width:calc(100% + 36px) !important;
max-width:none !important;
margin:12px -18px 14px !important;
padding:0 !important;
background:transparent !important;
border:0 !important;
border-radius:0 !important;
overflow:hidden !important;
}
#songDrivePreview{
display:none;
width:100% !important;
height:78px !important;
border:0 !important;
border-radius:0 !important;
background:#1d1f22 !important;
}
#songDrivePreview.is-active{
display:block !important;
}
.song-inline-player:has(#songDrivePreview.is-active){
display:block !important;
}
/* =========================================================
MODAL PEDIDO MÓVIL FINAL · WHATSAPP DIRECTO + GUÍA GRATIS
========================================================= */
#cartBackdrop{
padding:0 !important;
align-items:stretch !important;
justify-content:center !important;
background:rgba(0,0,0,.46) !important;
backdrop-filter:blur(4px) !important;
}
#cartBackdrop .ck-cart-modal{
width:100% !important;
max-width:520px !important;
height:100dvh !important;
max-height:100dvh !important;
border-radius:0 !important;
background:#fff !important;
color:#111827 !important;
border:0 !important;
box-shadow:0 24px 80px rgba(0,0,0,.22) !important;
display:flex !important;
flex-direction:column !important;
overflow:hidden !important;
}
.ck-cart-head{
flex:0 0 auto;
padding:20px 20px 12px;
background:#fff;
border-bottom:1px solid #eceff3;
z-index:3;
}
.ck-cart-head-top{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
}
.ck-cart-title{
margin:0;
font-size:18px;
font-weight:900;
color:#111827;
letter-spacing:-.02em;
}
.ck-cart-count{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:20px;
height:20px;
padding:0 6px;
border-radius:999px;
background:#25d366;
color:#06180c;
font-size:11px;
font-weight:950;
margin-left:5px;
vertical-align:middle;
}
.ck-cart-close{
width:34px;
height:34px;
border:0;
border-radius:999px;
background:#f3f4f6;
color:#111827;
font-size:22px;
line-height:1;
cursor:pointer;
}
.ck-cart-scroll{
flex:1 1 auto;
min-height:0;
overflow-y:auto;
padding:12px 20px 14px;
background:#fff;
-webkit-overflow-scrolling:touch;
}
.ck-cart-scroll::-webkit-scrollbar{
width:4px;
}
.ck-cart-scroll::-webkit-scrollbar-thumb{
background:#d1d5db;
border-radius:999px;
}
.ck-section-head{
display:flex;
align-items:center;
justify-content:space-between;
margin:10px 0 8px;
}
.ck-section-head h3{
margin:0;
font-size:11px;
font-weight:950;
letter-spacing:.08em;
color:#6b7280;
}
.ck-section-head span{
font-size:11px;
font-weight:900;
color:#111827;
}
.ck-list{
border-top:1px solid #eceff3;
border-bottom:1px solid #eceff3;
}
.ck-row{
display:grid;
grid-template-columns:1fr auto;
gap:12px;
align-items:center;
padding:11px 0;
border-bottom:1px solid #eceff3;
background:transparent !important;
color:#111827;
}
.ck-row:last-child{
border-bottom:0;
}
.ck-row-info{
min-width:0;
}
.ck-row-title{
font-size:13.7px;
font-weight:850;
color:#111827;
line-height:1.18;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.ck-row-artist{
margin-top:3px;
font-size:11.5px;
color:#8a9099;
font-weight:600;
line-height:1.15;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.ck-row .tag-row{
display:flex;
gap:5px;
flex-wrap:wrap;
margin-top:6px;
}
.ck-row .pill{
min-height:17px;
padding:3px 7px;
border-radius:999px;
font-size:8.5px;
line-height:1;
font-weight:950;
letter-spacing:.03em;
}
.ck-row .pill-vivo,
.ck-row .pill-live{
background:#dffcf9;
color:#0f8f87;
}
.ck-row .pill-coro{
background:#ede9fe;
color:#6d28d9;
}
.ck-row .pill-full{
display:none !important;
}
.ck-row-right{
display:flex;
align-items:center;
gap:8px;
}
.ck-price{
font-size:14px;
font-weight:900;
color:#111827;
white-space:nowrap;
}
.ck-price.free{
color:#16a34a;
}
.ck-price-stack{
display:flex;
flex-direction:column;
align-items:flex-end;
justify-content:center;
gap:1px;
min-width:64px;
line-height:1;
}
.ck-price-old{
font-size:10px;
font-weight:850;
color:#9ca3af;
text-decoration:line-through;
white-space:nowrap;
}
.ck-price-unit{
font-size:14px;
font-weight:950;
color:#111827;
white-space:nowrap;
}
.ck-price-unit.discount{
color:#16a34a;
}
.ck-price-hint{
font-size:8.3px;
font-weight:900;
color:#16a34a;
white-space:nowrap;
line-height:1;
}
.ck-free-label{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:17px;
padding:3px 7px;
border-radius:999px;
background:#dcfce7;
color:#047857;
font-size:8.5px;
line-height:1;
font-weight:950;
letter-spacing:.03em;
}
.ck-remove{
width:26px;
height:26px;
border:0;
border-radius:999px;
background:#f3f4f6;
color:#8a9099;
font-size:16px;
line-height:1;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
}
.ck-free-slot{
width:100%;
min-height:48px;
border:1px dashed #25d366;
border-radius:12px;
background:#f0fff6;
padding:9px 11px;
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
cursor:pointer;
margin-bottom:7px;
text-align:left;
}
.ck-free-slot:last-child{
margin-bottom:0;
}
.ck-free-slot-main{
min-width:0;
}
.ck-free-slot strong{
display:block;
color:#047857;
font-size:12.8px;
font-weight:900;
}
.ck-free-slot span{
display:block;
margin-top:2px;
color:#4b8062;
font-size:10.8px;
line-height:1.15;
font-weight:650;
}
.ck-free-slot-icon{
width:28px;
height:28px;
border-radius:999px;
background:#25d366;
color:#06180c;
display:flex;
align-items:center;
justify-content:center;
font-size:15px;
font-weight:950;
flex:0 0 auto;
}
.ck-empty{
padding:18px 8px;
text-align:center;
color:#6b7280;
font-size:13px;
line-height:1.35;
font-weight:700;
background:#fff !important;
border:0 !important;
}
.ck-footer{
flex:0 0 auto;
padding:10px 20px calc(12px + env(safe-area-inset-bottom));
border-top:1px solid #eceff3;
background:#fff !important;
box-shadow:0 -8px 22px rgba(17,24,39,.05);
z-index:3;
color:#111827 !important;
}
.ck-total-row{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:14px;
}
.ck-footer-left{
padding-top:8px;
}
.ck-detail-toggle{
border:0;
background:transparent;
color:#0a84ff;
padding:0;
font-size:12px;
font-weight:850;
cursor:pointer;
}
.ck-footer-right{
text-align:right;
}
.ck-total-label{
display:block;
color:#6b7280;
font-size:11.5px;
font-weight:700;
}
.ck-total-amount{
display:block;
margin-top:1px;
color:#111827 !important;
font-size:22px;
line-height:1;
font-weight:950;
letter-spacing:-.04em;
}
.ck-empty-cart{
border:0;
background:transparent;
color:#dc4362;
padding:0;
margin-top:3px;
font-size:11px;
font-weight:850;
cursor:pointer;
}
.ck-price-detail{
display:none;
margin-top:8px;
padding:8px 0;
border-top:1px solid #eceff3;
border-bottom:1px solid #eceff3;
}
.ck-price-detail.show{
display:grid;
gap:5px;
}
.ck-price-line{
display:flex;
justify-content:space-between;
gap:12px;
color:#7d8590;
font-size:11.5px;
font-weight:650;
}
.ck-price-line strong{
color:#111827;
font-weight:850;
}
.ck-price-line.discount strong{
color:#dc4362;
}
#cartError{
margin:8px 0 0 !important;
padding:9px 10px !important;
border-radius:11px !important;
background:#fff1f2 !important;
color:#dc4362 !important;
border:1px solid #fecdd3 !important;
font-size:11.5px !important;
font-weight:800 !important;
text-align:center !important;
}
.ck-whatsapp-btn{
width:100%;
min-height:46px;
margin-top:10px;
border:0;
border-radius:8px;
background:#25d366 !important;
color:#06180c !important;
font-size:14.5px;
font-weight:950;
cursor:pointer;
display:none;
align-items:center;
justify-content:center;
gap:8px;
}
.ck-whatsapp-note{
margin:6px 0 0;
text-align:center;
color:#7d8590;
font-size:10.8px;
line-height:1.2;
font-weight:600;
}
.ck-hidden-control{
display:none !important;
}
/* Modal guía para escoger pista gratis */
.free-guide-backdrop{
position:fixed;
inset:0;
z-index:10050;
display:none;
align-items:center;
justify-content:center;
padding:16px;
background:rgba(0,0,0,.72);
backdrop-filter:blur(8px);
}
.free-guide-modal{
width:100%;
max-width:430px;
max-height:92dvh;
background:#fff;
border-radius:20px;
overflow:hidden;
box-shadow:0 22px 70px rgba(0,0,0,.38);
color:#111827;
display:flex;
flex-direction:column;
}
.free-guide-head{
flex:0 0 auto;
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
padding:14px 16px;
border-bottom:1px solid #eceff3;
}
.free-guide-head h3{
margin:0;
font-size:16px;
font-weight:950;
color:#111827;
}
.free-guide-close{
width:32px;
height:32px;
border:0;
border-radius:999px;
background:#f3f4f6;
color:#111827;
font-size:22px;
line-height:1;
cursor:pointer;
}
.free-guide-body{
flex:1 1 auto;
min-height:0;
overflow:auto;
padding:14px;
}
.free-guide-img{
width:100%;
display:block;
border-radius:14px;
border:1px solid #e5e7eb;
background:#f8fafc;
}
.free-guide-text{
margin:10px 0 0;
color:#6b7280;
font-size:12.5px;
line-height:1.35;
font-weight:650;
}
.free-guide-footer{
flex:0 0 auto;
padding:12px 14px calc(14px + env(safe-area-inset-bottom));
border-top:1px solid #eceff3;
background:#fff;
}
.free-guide-go{
width:100%;
min-height:46px;
border:0;
border-radius:10px;
background:#25d366;
color:#06180c;
font-size:14px;
font-weight:950;
cursor:pointer;
}
.free-pending-backdrop{position:fixed;inset:0;z-index:13100;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(0,0,0,.72);backdrop-filter:blur(8px);}
.free-pending-backdrop.show{display:flex;}
.free-pending-modal{width:100%;max-width:370px;padding:22px 18px 18px;border-radius:24px;background:#fff;color:#111827;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.42);}
.free-pending-icon{display:grid;place-items:center;width:52px;height:52px;margin:0 auto 12px;border-radius:17px;background:#dcfce7;color:#059669;font-size:23px;}
.free-pending-modal h3{margin:0;color:#111827;font-size:21px;line-height:1.12;font-weight:950;}
.free-pending-modal p{margin:9px auto 17px;max-width:300px;color:#6b7280;font-size:12.5px;line-height:1.4;font-weight:750;}
.free-pending-actions{display:grid;gap:9px;}
.free-pending-actions button{min-height:46px;border-radius:13px;font-size:13px;font-weight:950;cursor:pointer;}
.free-pending-choose{border:0;background:#25d366;color:#052012;}
.free-pending-continue{border:1px solid #e5e7eb;background:#f8fafc;color:#6b7280;}
@media (min-width:520px){
#cartBackdrop{
align-items:center !important;
padding:16px !important;
}
#cartBackdrop .ck-cart-modal{
height:760px !important;
max-height:90dvh !important;
border-radius:30px !important;
}
}
/* CLIENTES FRECUENTES + CANASTA FLOTANTE - DJGABO */
.promo-launch-strip{
display:none !important;
}
.search-cart-row{
grid-template-columns:1fr 46px !important;
}
.client-access-btn{
position:relative;
width:46px;
height:46px;
border-radius:999px;
border:1px solid rgba(255,255,255,.12);
background:linear-gradient(180deg,#171a20,#101318);
color:#fff;
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
box-shadow:0 12px 28px rgba(0,0,0,.32);
}
.client-access-btn i{
font-size:18px;
}
.client-access-btn.client-ok{
border-color:rgba(37,211,102,.36);
color:#7dffad;
box-shadow:0 0 0 1px rgba(37,211,102,.08),0 12px 28px rgba(0,0,0,.32),0 0 18px
rgba(37,211,102,.18);
}
.client-access-dot{
position:absolute;
right:3px;
top:3px;
width:11px;
height:11px;
border-radius:999px;
background:#25d366;
border:2px solid #101318;
display:none;
}
.client-access-btn.client-ok .client-access-dot{
display:block;
}
.float-cart{
position:fixed;
right:16px;
bottom:82px;
width:46px;
height:46px;
border-radius:999px;
border:1px solid rgba(37,211,102,.35);
background:radial-gradient(circle at 50% 30%,rgba(37,211,102,.28),rgba(37,211,102,.08)
46%,rgba(255,255,255,.035) 100%);
color:#7dffad;
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
z-index:821;
box-shadow:0 0 0 1px rgba(37,211,102,.08),0 0 18px rgba(37,211,102,.25),0 12px 28px
rgba(0,0,0,.34);
animation:cartGlowPulse 1.65s ease-in-out infinite;
}
.float-cart i{
font-size:18px;
}
.float-cart .cart-badge{
position:absolute;
top:-3px;
right:-3px;
min-width:18px;
height:18px;
padding:0 5px;
border-radius:999px;
background:var(--green);
color:#06180c;
display:none;
align-items:center;
justify-content:center;
font-size:10px;
font-weight:950;
line-height:1;
z-index:3;
}
.float-cart.cart-pop{
animation:cartPop .55s ease both;
}
.float-search{
right:16px !important;
bottom:26px !important;
}
.client-modal{
max-width:392px;
border-radius:26px;
}
.client-modal-body{
padding:18px;
}
.client-modal-icon{
width:54px;
height:54px;
border-radius:18px;
margin:0 auto 12px;
background:rgba(37,211,102,.12);
color:#7dffad;
border:1px solid rgba(37,211,102,.22);
display:flex;
align-items:center;
justify-content:center;
font-size:22px;
}
.client-modal-title{
margin:0;
text-align:center;
color:#fff;
font-size:19px;
font-weight:950;
line-height:1.15;
}
.client-modal-copy{
margin:9px auto 14px;
max-width:320px;
text-align:center;
color:#a9afba;
font-size:12.8px;
line-height:1.42;
font-weight:700;
}
.client-privacy-note{
margin:-5px 0 13px;
padding:9px 10px;
border-radius:13px;
background:rgba(19,200,255,.08);
border:1px solid rgba(19,200,255,.16);
color:#b8eaff;
font-size:11.3px;
line-height:1.32;
font-weight:800;
text-align:center;
}
.client-verify-form{
display:grid;
gap:9px;
}
.client-phone-input{
width:100%;
min-height:47px;
border-radius:14px;
border:1px solid rgba(255,255,255,.10);
background:#141820;
color:#fff;
outline:0;
padding:0 14px;
font-size:15px;
font-weight:750;
}
.client-phone-input::placeholder{
color:#777e8b;
}
.client-phone-input:focus{
border-color:rgba(37,211,102,.58);
box-shadow:0 0 0 3px rgba(37,211,102,.10);
}
.client-check-btn{
width:100%;
min-height:47px;
border-radius:15px;
border:0;
background:var(--green);
color:#06180c;
font-size:13.5px;
font-weight:950;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
gap:8px;
}
.client-check-btn:disabled{
opacity:.65;
cursor:wait;
}
.client-benefit-status{
display:none;
margin-top:12px;
padding:12px;
border-radius:16px;
background:#141820;
border:1px solid rgba(255,255,255,.08);
color:#d5dae3;
font-size:12.7px;
line-height:1.38;
font-weight:800;
text-align:center;
}
.client-benefit-status.show{display:block;}
.client-benefit-status.ok{
background:rgba(37,211,102,.12);
border-color:rgba(37,211,102,.24);
color:#b8ffd2;
}
.client-benefit-status.warn{
background:rgba(250,204,21,.10);
border-color:rgba(250,204,21,.22);
color:#ffe083;
}
.client-benefit-status.error{
background:rgba(239,68,68,.12);
border-color:rgba(239,68,68,.24);
color:#fecaca;
}
.client-benefit-actions{
display:none;
grid-template-columns:1fr 1fr;
gap:8px;
margin-top:10px;
}
.client-benefit-actions.show{
display:grid;
}
.client-mini-btn{
min-height:40px;
border-radius:13px;
border:0;
font-size:12.3px;
font-weight:950;
cursor:pointer;
}
.client-mini-btn.dark{
background:#1c2027;
color:#fff;
}
.client-mini-btn.green{
background:var(--green);
color:#06180c;
}
.ck-free-slot.locked-client{
opacity:.95;
border-color:rgba(250,204,21,.22) !important;
background:rgba(250,204,21,.08) !important;
}
.song-order-btn.free.need-verify,
.song-options-menu button.promo-disabled{
opacity:.72;
}
@media (max-width:390px){
.float-cart{right:14px;bottom:80px;}
.float-search{right:14px !important;}
.client-benefit-actions{grid-template-columns:1fr;}
}
/* AJUSTE COMPACTO CLIENTES FRECUENTES - V2 */
.client-modal{max-width:390px !important;border-radius:22px !important;}
.client-modal .modal-head{padding:11px 14px !important;}
.client-modal .modal-head h3{font-size:16px !important;}
.client-modal-body{padding:14px !important;}
.client-modal-icon{width:44px !important;height:44px !important;border-radius:15px
!important;margin:0 auto 9px !important;font-size:19px !important;}
.client-modal-title{font-size:18px !important;line-height:1.12 !important;}
.client-modal-copy{margin:7px auto 10px !important;font-size:12.2px
!important;line-height:1.32 !important;max-width:305px !important;}
.client-privacy-note{margin:0 0 10px !important;padding:8px 10px
!important;border-radius:12px !important;font-size:10.8px !important;line-height:1.28
!important;}
.client-verify-form{gap:8px !important;}
.client-phone-input{min-height:43px !important;border-radius:13px !important;font-size:14px
!important;}
.client-check-btn{min-height:43px !important;border-radius:13px !important;font-size:12.8px
!important;}
.client-benefit-status{margin-top:9px !important;padding:10px 11px
!important;border-radius:13px !important;font-size:12px !important;line-height:1.32
!important;}
.client-benefit-status.ok strong{color:#d7ffe4 !important;}
.client-benefit-actions{grid-template-columns:1fr 1fr !important;gap:8px
!important;margin-top:8px !important;}
.client-mini-btn{min-height:37px !important;border-radius:12px !important;font-size:11.8px
!important;}
@media (max-width:390px){.client-benefit-actions{grid-template-columns:1fr 1fr
!important;}.client-mini-btn{font-size:11.2px !important;padding:0 8px !important;}}


/* =========================================================
   RULETA TEMU DJGABO - WEB DE PRUEBA
========================================================= */
.wheel-entry-btn{
position:fixed;left:16px;bottom:82px;z-index:822;min-height:46px;padding:0 14px;border-radius:999px;border:1px solid rgba(250,204,21,.38);background:linear-gradient(135deg,#ffdf5d,#ff7a18);color:#180b00;font-size:12px;font-weight:950;box-shadow:0 14px 32px rgba(0,0,0,.36),0 0 22px rgba(250,204,21,.28);cursor:pointer;display:flex;align-items:center;gap:8px;animation:wheelEntryPulse 1.45s ease-in-out infinite;
}
.wheel-entry-btn i{font-size:15px;}
@keyframes wheelEntryPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
.wheel-backdrop{position:fixed;inset:0;z-index:10100;display:none;align-items:center;justify-content:center;padding:14px;background:rgba(0,0,0,.72);backdrop-filter:blur(9px)}
.wheel-modal{width:100%;max-width:410px;max-height:94dvh;overflow:auto;border-radius:26px;background:linear-gradient(180deg,#25123e 0%,#0f1118 54%,#0b0d12 100%);border:1px solid rgba(255,255,255,.14);box-shadow:0 26px 80px rgba(0,0,0,.62);color:#fff;position:relative;padding:16px 16px 18px;text-align:center}
.wheel-close{position:absolute;top:12px;right:12px;width:32px;height:32px;border:0;border-radius:999px;background:rgba(255,255,255,.10);color:#fff;font-size:22px;line-height:1;cursor:pointer}
.wheel-kicker{display:inline-flex;align-items:center;gap:7px;margin:6px auto 7px;padding:6px 10px;border-radius:999px;background:rgba(250,204,21,.16);border:1px solid rgba(250,204,21,.26);color:#ffe083;font-size:10px;font-weight:950;letter-spacing:.5px;text-transform:uppercase}
.wheel-title{margin:0;color:#fff;font-size:25px;line-height:1.05;font-weight:950;letter-spacing:-.035em}
.wheel-sub{margin:8px auto 13px;max-width:315px;color:#d4d7df;font-size:12.5px;line-height:1.35;font-weight:700}
.wheel-board{position:relative;width:252px;height:252px;margin:0 auto 14px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#fff 0 9%,transparent 10%),conic-gradient(#ff4d6d 0 45deg,#ffd166 45deg 90deg,#06d6a0 90deg 135deg,#118ab2 135deg 180deg,#8338ec 180deg 225deg,#ff9f1c 225deg 270deg,#2ec4b6 270deg 315deg,#ef476f 315deg 360deg);box-shadow:inset 0 0 0 8px rgba(255,255,255,.13),0 18px 44px rgba(0,0,0,.42);transition:transform 3.2s cubic-bezier(.12,.72,.12,1)}
.wheel-board:after{content:"";position:absolute;inset:24px;border-radius:50%;border:1px solid rgba(255,255,255,.32);background:radial-gradient(circle,rgba(0,0,0,.08),rgba(0,0,0,.24));pointer-events:none}
.wheel-center{position:absolute;z-index:3;width:86px;height:86px;border-radius:50%;background:linear-gradient(180deg,#fff,#f4f4f5);color:#111827;display:flex;align-items:center;justify-content:center;flex-direction:column;font-weight:950;box-shadow:0 10px 26px rgba(0,0,0,.34)}
.wheel-center i{color:#f97316;font-size:22px;margin-bottom:3px}.wheel-center span{font-size:11px;line-height:1}.wheel-pointer{position:absolute;left:50%;top:-2px;transform:translateX(-50%);z-index:4;width:0;height:0;border-left:15px solid transparent;border-right:15px solid transparent;border-top:30px solid #fff;filter:drop-shadow(0 4px 7px rgba(0,0,0,.36))}
.wheel-form{display:grid;gap:9px;margin-top:8px}.wheel-phone{width:100%;min-height:45px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;padding:0 14px;outline:0;font-size:14px;font-weight:800}.wheel-phone::placeholder{color:#aeb4c1}.wheel-spin-btn{width:100%;min-height:48px;border:0;border-radius:15px;background:linear-gradient(135deg,#ffdf5d,#ff7a18);color:#1b0b00;font-size:14px;font-weight:950;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px}.wheel-spin-btn:disabled{opacity:.7;cursor:wait}.wheel-result{display:none;margin-top:11px;padding:12px;border-radius:17px;background:rgba(37,211,102,.12);border:1px solid rgba(37,211,102,.26);color:#c7ffd9;font-size:12.5px;line-height:1.35;font-weight:800}.wheel-result.show{display:block}.wheel-result strong{display:block;color:#fff;font-size:18px;line-height:1.1;margin-bottom:5px}.wheel-tier{display:none;margin-top:9px;color:#ffe083;font-size:11px;font-weight:900}.wheel-actions{display:none;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.wheel-actions.show{display:grid}.wheel-mini-btn{min-height:39px;border:0;border-radius:13px;font-size:12px;font-weight:950;cursor:pointer}.wheel-mini-btn.dark{background:rgba(255,255,255,.10);color:#fff}.wheel-mini-btn.green{background:#25d366;color:#06180c}.wheel-legal{margin:10px auto 0;max-width:320px;color:#9198a5;font-size:10.5px;line-height:1.25;font-weight:650}
.wheel-applied-note{display:none;margin:8px 0 0;padding:8px 10px;border-radius:12px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;font-size:11px;font-weight:850;text-align:center}.wheel-applied-note.show{display:block}
@media(max-width:390px){.wheel-board{width:226px;height:226px}.wheel-title{font-size:23px}.wheel-entry-btn{left:12px;bottom:82px;padding:0 11px;font-size:11.5px}}

/* MODAL DE REGALOS DESDE ICONO DE USUARIO - SIN BOTÓN GIRA Y GANA */
.wheel-entry-btn{display:none !important;}
.wheel-board{display:none !important;}
.wheel-modal{max-width:410px !important;}
.wheel-title{font-size:24px !important;}
.wheel-sub{margin-bottom:12px !important;}
.wheel-guide-wrap{display:none;width:88%;max-width:320px;margin:8px auto 12px;border-radius:16px;overflow:hidden;background:#0b0d12;border:1px solid rgba(255,255,255,.14);box-shadow:0 14px 34px rgba(0,0,0,.32);}
.wheel-guide-wrap.show{display:block;}
.wheel-guide-wrap img{display:block;width:100%;height:auto;object-fit:contain;}
.wheel-spin-btn{background:linear-gradient(135deg,#25d366,#17e87a) !important;color:#06180c !important;}
.wheel-result.warn{display:block;background:rgba(250,204,21,.10);border-color:rgba(250,204,21,.22);color:#ffe083;}
.wheel-result.ok{display:block;background:rgba(37,211,102,.12);border-color:rgba(37,211,102,.26);color:#c7ffd9;}
@media(max-width:390px){.wheel-title{font-size:22px !important}.wheel-guide-wrap{width:92%;max-width:300px;}}

.promo-launch-strip[aria-hidden="false"]{display:block !important;}
.promo-launch-strip[aria-hidden="true"]{display:none !important;}
/* DJGABO FINAL · promos, precio unitario y pago bottom sheet */
.song-order-actions.single{grid-template-columns:1fr !important;}
.song-order-actions.single .song-order-btn.add{width:100% !important;}
.ck-row .tag-row.cart-inline-tags{display:flex !important;flex-direction:row !important;align-items:center !important;gap:5px !important;flex-wrap:wrap !important;}
.ck-price.free{color:#16a34a !important;font-weight:950 !important;letter-spacing:.02em !important;}
#paymentCartWrap{display:none !important;}
.pay-sheet-backdrop{position:fixed;inset:0;z-index:13000;display:none;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.56);backdrop-filter:blur(6px);padding:0;}
.pay-sheet-backdrop.show{display:flex;}
.pay-sheet{width:100%;max-width:520px;background:#fff;color:#251f38;border-radius:24px 24px 0 0;padding:18px 18px calc(18px + env(safe-area-inset-bottom));box-shadow:0 -24px 70px rgba(0,0,0,.40);transform:translateY(105%);transition:transform .24s ease;position:relative;}
.pay-sheet-backdrop.show .pay-sheet{transform:translateY(0);}
.pay-sheet-close{position:absolute;right:16px;top:14px;width:38px;height:38px;border:0;border-radius:999px;background:#f2f2f4;color:#231f2f;font-size:28px;font-weight:800;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.pay-sheet-title{margin:38px 46px 6px 0;text-align:center;color:#7b2b86;font-size:26px;line-height:1.05;font-weight:950;letter-spacing:-.03em;}
.pay-sheet-sub{margin:0 auto 16px;max-width:320px;text-align:center;color:#6f6a80;font-size:13px;line-height:1.35;font-weight:750;}
.pay-sheet-total{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px;padding:12px 14px;border-radius:16px;background:#f4f7fb;border:1px solid #e8edf5;}
.pay-sheet-total span{font-size:12px;font-weight:900;color:#746f83;text-transform:uppercase;letter-spacing:.25px;}
.pay-sheet-total strong{font-size:20px;font-weight:950;color:#241f35;}
.pay-sheet-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.pay-sheet-option{min-height:72px;border:1px solid #e4e7ee;border-radius:18px;background:#fafafa;color:#241f35;display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;font-size:15px;font-weight:950;box-shadow:0 8px 20px rgba(20,20,30,.06);}
.pay-sheet-option:active{transform:scale(.985);}
.pay-sheet-logo{width:46px;height:30px;object-fit:contain;display:block;}
.pay-sheet-note{margin:12px 4px 0;text-align:center;color:#7b7287;font-size:11.5px;font-weight:750;line-height:1.3;}
@media (max-width:380px){.pay-sheet-title{font-size:23px}.pay-sheet-options{gap:8px}.pay-sheet-option{min-height:64px;font-size:14px}.pay-sheet-logo{width:40px;height:26px}}

/* =========================================================
   DJGABO · FLUJOS PUBLICO/CLIENTE + PAGO FINAL ALINEADO
   ========================================================= */
.wheel-modal.promo-public-mode,
.wheel-modal.client-zone-mode,
.wheel-modal.client-validated-mode{
  max-width:390px !important;
  padding:20px 16px 18px !important;
}
.wheel-modal.promo-public-mode .wheel-kicker,
.wheel-modal.promo-public-mode .wheel-form,
.wheel-modal.promo-public-mode .wheel-actions,
.wheel-modal.promo-public-mode .wheel-tier,
.wheel-modal.promo-public-mode .wheel-legal,
.wheel-modal.promo-public-mode .wheel-guide-wrap{
  display:none !important;
}
.wheel-modal.client-zone-mode .wheel-kicker,
.wheel-modal.client-zone-mode .wheel-actions,
.wheel-modal.client-zone-mode .wheel-tier,
.wheel-modal.client-zone-mode .wheel-legal,
.wheel-modal.client-zone-mode .wheel-guide-wrap{
  display:none !important;
}
.wheel-modal.client-validated-mode .wheel-kicker,
.wheel-modal.client-validated-mode .wheel-form,
.wheel-modal.client-validated-mode .wheel-actions,
.wheel-modal.client-validated-mode .wheel-tier,
.wheel-modal.client-validated-mode .wheel-legal,
.wheel-modal.client-validated-mode .wheel-guide-wrap{
  display:none !important;
}
.wheel-modal.promo-public-mode .wheel-title,
.wheel-modal.client-zone-mode .wheel-title,
.wheel-modal.client-validated-mode .wheel-title{
  margin-top:18px !important;
}
.wheel-modal.promo-public-mode .wheel-result,
.wheel-modal.client-validated-mode .wheel-result{
  display:block !important;
  margin-top:12px !important;
}
.wheel-modal.client-zone-mode .wheel-phone{
  text-align:left !important;
}
.wheel-modal.client-zone-mode .wheel-spin-btn{
  background:linear-gradient(135deg,#25d366,#17e87a) !important;
  color:#06180c !important;
}
/* Bottom sheet pago: mismo lenguaje visual del modal de pedido */
.pay-sheet-backdrop{
  background:rgba(0,0,0,.62) !important;
  backdrop-filter:blur(8px) !important;
}
.pay-sheet{
  width:min(100%,420px) !important;
  max-width:420px !important;
  background:#ffffff !important;
  color:#111827 !important;
  border-radius:24px 24px 0 0 !important;
  padding:18px 16px calc(18px + env(safe-area-inset-bottom)) !important;
  box-shadow:0 -24px 70px rgba(0,0,0,.38) !important;
  text-align:center !important;
}
.pay-sheet-close{
  top:12px !important;
  right:14px !important;
  width:34px !important;
  height:34px !important;
  background:#f1f3f5 !important;
  color:#111827 !important;
  font-size:26px !important;
  z-index:2 !important;
}
.pay-sheet-title{
  margin:34px auto 6px !important;
  width:100% !important;
  padding:0 42px !important;
  text-align:center !important;
  color:#111827 !important;
  font-size:22px !important;
  line-height:1.08 !important;
  font-weight:950 !important;
  letter-spacing:-.03em !important;
}
.pay-sheet-sub{
  margin:0 auto 14px !important;
  max-width:285px !important;
  text-align:center !important;
  color:#6b7280 !important;
  font-size:12px !important;
  line-height:1.3 !important;
  font-weight:800 !important;
}
.pay-sheet-total{
  margin:0 0 12px !important;
  padding:11px 13px !important;
  border-radius:15px !important;
  background:#f8fafc !important;
  border:1px solid #e5e7eb !important;
}
.pay-sheet-total span{
  color:#6b7280 !important;
  font-size:11px !important;
  font-weight:950 !important;
}
.pay-sheet-total strong{
  color:#111827 !important;
  font-size:21px !important;
  font-weight:950 !important;
}
.pay-sheet-options{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:9px !important;
}
.pay-sheet-option{
  min-height:64px !important;
  border:1px solid #e5e7eb !important;
  border-radius:17px !important;
  background:#ffffff !important;
  color:#111827 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
  font-size:14px !important;
  font-weight:950 !important;
  box-shadow:0 8px 20px rgba(17,24,39,.05) !important;
}
.pay-sheet-option:active{
  transform:scale(.985) !important;
  background:#f9fafb !important;
}
.pay-sheet-logo{
  width:42px !important;
  height:28px !important;
  object-fit:contain !important;
}
.pay-sheet-note{
  margin:11px auto 0 !important;
  max-width:305px !important;
  text-align:center !important;
  color:#6b7280 !important;
  font-size:11px !important;
  line-height:1.3 !important;
  font-weight:800 !important;
}
@media (max-width:380px){
  .pay-sheet-title{font-size:20px !important;padding:0 38px !important;}
  .pay-sheet-option{min-height:60px !important;font-size:13px !important;}
  .pay-sheet-logo{width:38px !important;height:25px !important;}
}


/* CAMPAÑA GRATIS - DESCARGA VÍA WHATSAPP */
.campaign-claim-box{
margin:10px 0 8px;
padding:12px;
border-radius:16px;
background:linear-gradient(135deg,rgba(37,211,102,.12),rgba(19,200,255,.08));
border:1px solid rgba(37,211,102,.24);
}
.campaign-claim-title{
display:block;
font-size:12.5px;
font-weight:950;
color:#fff;
margin-bottom:4px;
}
.campaign-claim-copy{
margin:0 0 10px;
color:#aeb5c1;
font-size:11.5px;
line-height:1.35;
font-weight:750;
}
.campaign-phone-input{
width:100%;
min-height:44px;
border-radius:14px;
border:1px solid rgba(255,255,255,.12);
background:#0e1116;
color:#fff;
outline:0;
padding:0 13px;
font-size:14px;
font-weight:800;
}
.campaign-phone-input:focus{
border-color:rgba(37,211,102,.65);
box-shadow:0 0 0 3px rgba(37,211,102,.10);
}
.ck-footer.campaign-free-mode .ck-total-label{
color:#7dffad;
}
.ck-footer.campaign-free-mode .ck-total-amount{
color:#7dffad !important;
}
.ck-footer.campaign-free-mode #cartPriceDetailToggle,
.ck-footer.campaign-free-mode #cartPriceDetail,
.ck-footer.campaign-free-mode #tariffNote{
display:none!important;
}
.ck-campaign-return{
margin:9px 0 0;
padding:10px;
border-radius:14px;
background:rgba(250,204,21,.10);
border:1px solid rgba(250,204,21,.18);
color:#ffe083;
font-size:11.5px;
font-weight:850;
line-height:1.35;
}
.ck-campaign-buy-btn{
width:100%;
margin-top:8px;
min-height:39px;
border-radius:13px;
border:0;
background:#1c2027;
color:#fff;
font-size:12.5px;
font-weight:950;
cursor:pointer;
}


/* AJUSTE FINAL CAMPAÑA GRATIS: modal blanco legible y compacto */
#cartBackdrop .ck-cart-modal .campaign-claim-box{
  margin:10px 0 8px !important;
  padding:10px 11px !important;
  border-radius:15px !important;
  background:#f0fdf4 !important;
  border:1px solid rgba(37,211,102,.36) !important;
  box-shadow:0 8px 20px rgba(17,24,39,.04) !important;
}
#cartBackdrop .ck-cart-modal .campaign-claim-title{
  color:#065f46 !important;
  font-size:12px !important;
  line-height:1.15 !important;
  margin:0 0 3px !important;
}
#cartBackdrop .ck-cart-modal .campaign-claim-copy{
  color:#4b5563 !important;
  font-size:11px !important;
  line-height:1.25 !important;
  margin:0 0 8px !important;
}
#cartBackdrop .ck-cart-modal .campaign-phone-input{
  min-height:40px !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#111827 !important;
  border:1px solid #cbd5e1 !important;
  padding:0 12px !important;
  font-size:13.5px !important;
  font-weight:850 !important;
}
#cartBackdrop .ck-cart-modal .campaign-phone-input::placeholder{
  color:#9ca3af !important;
}
#cartBackdrop .ck-cart-modal .campaign-phone-input:focus{
  border-color:#25d366 !important;
  box-shadow:0 0 0 3px rgba(37,211,102,.13) !important;
}
#cartBackdrop .ck-cart-modal .ck-campaign-section-head h3{
  color:#065f46 !important;
}
#cartBackdrop .ck-cart-modal .ck-campaign-list{
  border-top-color:rgba(37,211,102,.22) !important;
  border-bottom-color:rgba(37,211,102,.22) !important;
}
#cartBackdrop .ck-cart-modal .ck-price.free,
#cartBackdrop .ck-cart-modal .ck-free-label{
  color:#059669 !important;
}



/* MODAL CAMPAÑA GRATIS - WhatsApp simple y compacto */
#campaignPhoneSheetBackdrop{
  align-items:center !important;
  justify-content:center !important;
  padding:18px !important;
  background:rgba(0,0,0,.68) !important;
  backdrop-filter:blur(10px) !important;
}
#campaignPhoneSheetBackdrop.show{
  display:flex !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-sheet{
  width:min(100%, 358px) !important;
  max-width:358px !important;
  border-radius:24px !important;
  padding:22px 18px 20px !important;
  background:#ffffff !important;
  color:#111827 !important;
  text-align:center !important;
  transform:scale(.96) translateY(10px) !important;
  transition:transform .20s ease, opacity .20s ease !important;
  box-shadow:0 24px 70px rgba(0,0,0,.48) !important;
}
#campaignPhoneSheetBackdrop.show .campaign-phone-sheet{
  transform:scale(1) translateY(0) !important;
}
#campaignPhoneSheetBackdrop .pay-sheet-close{
  top:10px !important;
  right:10px !important;
  width:32px !important;
  height:32px !important;
  background:#f1f3f5 !important;
  color:#111827 !important;
  font-size:24px !important;
  line-height:1 !important;
}
#campaignPhoneSheetBackdrop .pay-sheet-title{
  margin:14px auto 16px !important;
  padding:0 34px !important;
  color:#111827 !important;
  font-size:23px !important;
  line-height:1.08 !important;
  font-weight:950 !important;
  letter-spacing:-.03em !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-field{
  margin:0 0 10px !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-field label{
  display:none !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-input-wrap{
  display:grid !important;
  grid-template-columns:36px 1fr !important;
  align-items:center !important;
  min-height:56px !important;
  width:100% !important;
  border-radius:17px !important;
  background:#f8fafc !important;
  border:1px solid #d8dee8 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 8px 22px rgba(17,24,39,.06) !important;
  overflow:hidden !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-input-wrap:focus-within{
  border-color:#25d366 !important;
  box-shadow:0 0 0 4px rgba(37,211,102,.13), 0 8px 22px rgba(17,24,39,.06) !important;
  background:#ffffff !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-input-wrap i{
  color:#25d366 !important;
  font-size:21px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
#campaignPhoneSheetBackdrop #campaignPhoneSheetInput{
  width:100% !important;
  min-height:54px !important;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  color:#111827 !important;
  padding:0 14px 0 0 !important;
  font-size:18px !important;
  font-weight:900 !important;
  letter-spacing:.02em !important;
}
#campaignPhoneSheetBackdrop #campaignPhoneSheetInput::placeholder{
  color:#9ca3af !important;
  font-size:15px !important;
  font-weight:800 !important;
  letter-spacing:0 !important;
}
#campaignPhoneSheetBackdrop .pay-sheet-sub{
  margin:8px auto 15px !important;
  max-width:292px !important;
  color:#4b5563 !important;
  font-size:12.5px !important;
  line-height:1.35 !important;
  font-weight:800 !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-summary{
  display:none !important;
}
#campaignPhoneSheetBackdrop #campaignPhoneSheetError{
  margin:0 0 11px !important;
  padding:10px 11px !important;
  border-radius:13px !important;
  background:#fef2f2 !important;
  color:#b91c1c !important;
  border:1px solid #fecaca !important;
  font-size:12px !important;
  font-weight:850 !important;
  text-align:center !important;
}
#campaignPhoneSheetBackdrop .pay-sheet-confirm{
  width:100% !important;
  min-height:52px !important;
  border:0 !important;
  border-radius:17px !important;
  background:linear-gradient(135deg,#25d366,#17e87a) !important;
  color:#06180c !important;
  font-size:15px !important;
  font-weight:950 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:9px !important;
  box-shadow:0 12px 26px rgba(37,211,102,.25) !important;
  cursor:pointer !important;
}
#campaignPhoneSheetBackdrop .pay-sheet-confirm:active{
  transform:scale(.985) !important;
}
#campaignPhoneSheetBackdrop .pay-sheet-confirm:disabled{
  opacity:.72 !important;
  cursor:not-allowed !important;
  transform:none !important;
}
@media (max-width:380px){
  #campaignPhoneSheetBackdrop{
    padding:14px !important;
  }
  #campaignPhoneSheetBackdrop .campaign-phone-sheet{
    width:min(100%, 334px) !important;
    padding:20px 15px 17px !important;
    border-radius:22px !important;
  }
  #campaignPhoneSheetBackdrop .pay-sheet-title{
    font-size:21px !important;
  }
}


/* AJUSTE FINAL CAMPAÑA: pedido simple con cambiar pista */
#campaignPhoneSheetBackdrop{
  align-items:center !important;
  justify-content:center !important;
  padding:18px !important;
  background:rgba(0,0,0,.72) !important;
  backdrop-filter:blur(10px) !important;
}
#campaignPhoneSheetBackdrop.show{display:flex !important;}
#campaignPhoneSheetBackdrop .campaign-phone-sheet{
  width:min(100%, 362px) !important;
  max-width:362px !important;
  padding:20px 16px 17px !important;
  border-radius:23px !important;
  background:#ffffff !important;
  color:#101827 !important;
  text-align:left !important;
  box-shadow:0 24px 70px rgba(0,0,0,.48) !important;
}
#campaignPhoneSheetBackdrop .pay-sheet-close{
  top:10px !important;
  right:10px !important;
  width:30px !important;
  height:30px !important;
  border-radius:999px !important;
  background:#f1f3f5 !important;
  color:#111827 !important;
  font-size:23px !important;
  line-height:1 !important;
}
#campaignPhoneSheetBackdrop .pay-sheet-title{
  margin:0 38px 13px 0 !important;
  padding:0 !important;
  color:#111827 !important;
  font-size:24px !important;
  line-height:1.08 !important;
  font-weight:950 !important;
  letter-spacing:-.04em !important;
  text-align:left !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-summary{
  display:grid !important;
  grid-template-columns:1fr auto !important;
  align-items:center !important;
  gap:12px !important;
  width:100% !important;
  margin:0 0 8px !important;
  padding:14px !important;
  border-radius:16px !important;
  background:linear-gradient(180deg,#121927,#0d1421) !important;
  color:#fff !important;
  border:1px solid rgba(15,23,42,.08) !important;
  text-align:left !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-summary-main{
  min-width:0 !important;
}
#campaignPhoneSheetBackdrop #campaignPhoneTrackTitle{
  display:block !important;
  color:#fff !important;
  font-size:14.5px !important;
  line-height:1.15 !important;
  font-weight:950 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
#campaignPhoneSheetBackdrop #campaignPhoneTrackArtist{
  display:block !important;
  margin-top:4px !important;
  color:#d1d5db !important;
  font-size:11.5px !important;
  line-height:1.15 !important;
  font-weight:800 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-summary b{
  align-self:center !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:24px !important;
  padding:0 10px !important;
  border-radius:999px !important;
  background:#23d66f !important;
  color:#062112 !important;
  font-size:10px !important;
  font-weight:950 !important;
  letter-spacing:.2px !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-tags{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:5px !important;
  margin-top:7px !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-tags:empty{display:none !important;}
#campaignPhoneSheetBackdrop .campaign-phone-tags .pill{
  min-height:16px !important;
  padding:3px 6px !important;
  border-radius:5px !important;
  font-size:8px !important;
  line-height:1 !important;
}
#campaignPhoneSheetBackdrop .campaign-change-track{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 0 13px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  color:#0f9f55 !important;
  font-size:12.5px !important;
  line-height:1 !important;
  font-weight:950 !important;
  cursor:pointer !important;
}
#campaignPhoneSheetBackdrop .campaign-change-track:active{transform:scale(.98) !important;}
#campaignPhoneSheetBackdrop .campaign-phone-field{
  margin:0 0 8px !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-field label{
  display:block !important;
  margin:0 0 7px !important;
  color:#111827 !important;
  font-size:13px !important;
  line-height:1 !important;
  font-weight:950 !important;
  text-align:left !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-input-wrap{
  display:block !important;
  min-height:54px !important;
  width:100% !important;
  border-radius:16px !important;
  background:#ffffff !important;
  border:1.5px solid #22c55e !important;
  box-shadow:0 0 0 3px rgba(34,197,94,.10), inset 0 1px 0 rgba(255,255,255,.9) !important;
  overflow:hidden !important;
}
#campaignPhoneSheetBackdrop .campaign-phone-input-wrap i{display:none !important;}
#campaignPhoneSheetBackdrop #campaignPhoneSheetInput{
  width:100% !important;
  min-height:52px !important;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  color:#111827 !important;
  padding:0 14px !important;
  font-size:18px !important;
  font-weight:900 !important;
  letter-spacing:.01em !important;
}
#campaignPhoneSheetBackdrop #campaignPhoneSheetInput::placeholder{
  color:#9ca3af !important;
  font-size:15px !important;
  font-weight:900 !important;
  letter-spacing:0 !important;
}
#campaignPhoneSheetBackdrop .pay-sheet-sub{
  margin:7px 0 13px !important;
  max-width:none !important;
  color:#374151 !important;
  font-size:12.5px !important;
  line-height:1.28 !important;
  font-weight:900 !important;
  text-align:left !important;
}
#campaignPhoneSheetBackdrop #campaignPhoneSheetError{
  margin:0 0 10px !important;
  padding:10px 11px !important;
  border-radius:13px !important;
  background:#fef2f2 !important;
  color:#b91c1c !important;
  border:1px solid #fecaca !important;
  font-size:12px !important;
  font-weight:900 !important;
  text-align:center !important;
}
#campaignPhoneSheetBackdrop .pay-sheet-confirm{
  width:100% !important;
  min-height:52px !important;
  border:0 !important;
  border-radius:16px !important;
  background:linear-gradient(135deg,#22c55e,#1ee77b) !important;
  color:#06180c !important;
  font-size:15px !important;
  font-weight:950 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:0 !important;
  box-shadow:0 12px 26px rgba(34,197,94,.24) !important;
  cursor:pointer !important;
}
#campaignPhoneSheetBackdrop .pay-sheet-confirm:active{transform:scale(.985) !important;}
#campaignPhoneSheetBackdrop .pay-sheet-confirm:disabled{opacity:.72 !important;cursor:not-allowed !important;transform:none !important;}
@media (max-width:380px){
  #campaignPhoneSheetBackdrop{padding:14px !important;}
  #campaignPhoneSheetBackdrop .campaign-phone-sheet{width:min(100%, 338px) !important;padding:18px 14px 15px !important;border-radius:22px !important;}
  #campaignPhoneSheetBackdrop .pay-sheet-title{font-size:22px !important;}
}



/* ===== CRM E HISTORIAL DJGABO ===== */
.crm-phone-label{
  display:block;
  margin:12px 2px 6px;
  color:#d9dde6;
  font-size:11px;
  font-weight:900;
  text-align:left;
}
.crm-phone-input{
  width:100%;
  min-height:48px;
  box-sizing:border-box;
  border:1px solid rgba(255,255,255,.14);
  border-radius:13px;
  background:#20232b;
  color:#fff;
  padding:0 14px;
  font-size:16px;
  font-weight:850;
  outline:none;
}
.crm-phone-input:focus{
  border-color:rgba(37,211,102,.72);
  box-shadow:0 0 0 3px rgba(37,211,102,.12);
}
.crm-phone-privacy{
  margin:11px 4px 0;
  color:#8f96a2;
  font-size:10px;
  line-height:1.4;
  text-align:center;
}
.order-phone-icon{
  width:48px;
  height:48px;
  margin:0 auto 9px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(37,211,102,.14);
  color:#25d366;
  font-size:24px;
}
.campaign-disabled-payments{
  margin-top:12px;
  padding:10px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:rgba(255,255,255,.025);
}
.campaign-disabled-payments-title{
  margin-bottom:8px;
  color:#aeb4bf;
  font-size:10.5px;
  font-weight:850;
  text-align:center;
}
.campaign-disabled-payments-options{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.campaign-disabled-pay-option{
  position:relative;
  min-height:48px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  background:#191b21;
  color:#737985;
  filter:grayscale(1);
  opacity:.52;
  user-select:none;
}
.campaign-disabled-pay-option img{
  width:27px;
  height:27px;
  object-fit:contain;
  border-radius:7px;
}
.campaign-disabled-pay-option span{
  font-size:11px;
  font-weight:900;
}
.campaign-disabled-pay-option i{
  position:absolute;
  right:8px;
  top:8px;
  color:#ef4444;
  font-size:12px;
}
.crm-zone-tabs{
  display:none;
  grid-template-columns:1fr 1fr;
  gap:6px;
  margin:10px 0 8px;
  padding:4px;
  border-radius:12px;
  background:rgba(255,255,255,.055);
}
.crm-zone-tabs.show{display:grid;}
.crm-zone-tab{
  min-height:34px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#8f96a2;
  font-size:10.5px;
  font-weight:900;
  cursor:pointer;
}
.crm-zone-tab.active{
  background:#25d366;
  color:#052012;
  box-shadow:0 5px 14px rgba(37,211,102,.18);
}
.crm-history-panel{
  display:none;
  max-height:285px;
  overflow:auto;
  margin-top:6px;
  padding-right:2px;
  scrollbar-width:thin;
}
.wheel-modal.crm-history-active .crm-history-panel{display:block;}
.wheel-modal.crm-history-active .wheel-guide-wrap,
.wheel-modal.crm-history-active .wheel-tier,
.wheel-modal.crm-history-active .wheel-result{display:none!important;}
.crm-history-loading,
.crm-history-empty{
  min-height:98px;
  padding:17px 13px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:13px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  background:rgba(255,255,255,.025);
  color:#9ba2ae;
  font-size:11px;
  line-height:1.4;
  text-align:center;
}
.crm-history-empty strong{color:#fff;font-size:12px;}
.crm-history-summary{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin:2px 2px 8px;
  color:#d6dae2;
  font-size:9.5px;
}
.crm-history-summary span{
  color:#25d366;
  font-weight:900;
}
.crm-history-card{
  margin-bottom:7px;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:12px;
  background:rgba(255,255,255,.035);
  text-align:left;
}
.crm-history-card-head,
.crm-history-card-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.crm-history-card-head{
  margin-bottom:6px;
  color:#8f96a2;
  font-size:9px;
  font-weight:800;
}
.crm-history-card-head b{color:#25d366;font-size:10px;}
.crm-history-card>strong{
  display:block;
  color:#f1f3f6;
  font-size:10.5px;
  line-height:1.35;
}
.crm-history-card-foot{
  margin-top:7px;
  color:#7e8591;
  font-size:8.7px;
  font-weight:800;
}
.client-access-btn.client-registered .client-access-dot{
  background:#facc15!important;
  box-shadow:0 0 0 3px rgba(250,204,21,.14)!important;
}
@media(max-width:420px){
  .crm-history-panel{max-height:250px;}
  .campaign-disabled-payments-options{gap:6px;}
}


/* ===== AJUSTE DJGABO 20260727-16: BOTÓN CONTINUAR + HISTORIAL NUMERADO ===== */
#orderPhoneSheetBackdrop .pay-sheet-confirm{
  width:100% !important;
  min-height:52px !important;
  margin-top:12px !important;
  border:0 !important;
  border-radius:16px !important;
  background:linear-gradient(135deg,#22c55e,#1ee77b) !important;
  color:#06180c !important;
  font-size:15px !important;
  font-weight:950 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  box-shadow:0 12px 26px rgba(34,197,94,.24) !important;
  cursor:pointer !important;
  transition:transform .16s ease, box-shadow .16s ease, opacity .16s ease !important;
}
#orderPhoneSheetBackdrop .pay-sheet-confirm:hover{
  box-shadow:0 14px 30px rgba(34,197,94,.30) !important;
  transform:translateY(-1px) !important;
}
#orderPhoneSheetBackdrop .pay-sheet-confirm:active{
  transform:scale(.985) !important;
}
#orderPhoneSheetBackdrop .pay-sheet-confirm:disabled{
  opacity:.72 !important;
  cursor:not-allowed !important;
  transform:none !important;
}
#orderPhoneSheetBackdrop .pay-sheet-confirm i{
  font-size:14px !important;
}

.crm-history-panel{
  max-height:340px;
  padding-right:4px;
}
.crm-history-summary{
  position:sticky;
  top:0;
  z-index:2;
  margin:0 0 8px;
  padding:7px 4px 8px;
  background:linear-gradient(180deg,#17111f 78%,rgba(23,17,31,0));
}
.crm-history-summary strong{
  color:#f4f6f8;
  font-size:10px;
  font-weight:900;
}
.crm-history-card{
  margin-bottom:8px;
  padding:10px 11px 9px;
  border-color:rgba(255,255,255,.09);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.025));
}
.crm-history-tracks{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.crm-history-track{
  display:grid;
  grid-template-columns:26px minmax(0,1fr);
  gap:7px;
  align-items:start;
}
.crm-history-track + .crm-history-track{
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.06);
}
.crm-history-track-number{
  color:#25d366;
  font-size:12px;
  line-height:1.35;
  font-weight:950;
  text-align:right;
}
.crm-history-track-copy{
  min-width:0;
  display:block;
}
.crm-history-track-copy strong{
  display:block;
  color:#f5f7fa;
  font-size:11px;
  line-height:1.32;
  font-weight:900;
  overflow-wrap:anywhere;
}
.crm-history-track-copy small{
  display:block;
  margin-top:2px;
  color:#9ba2ae;
  font-size:9.2px;
  line-height:1.3;
  font-weight:700;
  overflow-wrap:anywhere;
}
.crm-history-card-head{
  margin-bottom:8px;
}
.crm-history-card-foot{
  margin-top:9px;
  padding-top:7px;
  border-top:1px solid rgba(255,255,255,.06);
}
@media(max-width:420px){
  .crm-history-panel{max-height:320px;}
  .crm-history-track-copy strong{font-size:10.7px;}
  .crm-history-track-copy small{font-size:9px;}
}


/* DJGABO 20260727-17 · FLUJO RÁPIDO, SESIÓN RECORDADA Y ASSETS */
.client-access-btn.client-registered{
  border-color:rgba(37,211,102,.45)!important;
  color:#7dffad!important;
  box-shadow:0 0 0 1px rgba(37,211,102,.10),0 12px 28px rgba(0,0,0,.32),0 0 16px rgba(37,211,102,.14)!important;
}
.client-access-btn.client-registered .client-access-dot{
  display:block!important;
  background:#25d366!important;
  box-shadow:0 0 0 3px rgba(37,211,102,.14)!important;
}
.crm-identity-bar{
  display:flex;
  align-items:center;
  gap:9px;
  margin:7px 0 10px;
  padding:9px 10px;
  border:1px solid rgba(37,211,102,.24);
  border-radius:14px;
  background:rgba(37,211,102,.09);
  text-align:left;
}
.crm-identity-bar[hidden]{display:none!important;}
.crm-identity-icon{
  width:34px;height:34px;border-radius:11px;display:grid;place-items:center;
  background:rgba(37,211,102,.16);color:#72f5a3;font-size:17px;flex:0 0 auto;
}
.crm-identity-copy{min-width:0;display:flex;flex-direction:column;gap:1px;flex:1;}
.crm-identity-copy span{font-size:9px;color:#aeb6c3;font-weight:850;text-transform:uppercase;letter-spacing:.35px;}
.crm-identity-copy strong{font-size:13px;color:#fff;font-weight:950;letter-spacing:.2px;}
#crmLogoutBtn{
  border:0;background:transparent;color:#aeb6c3;font-size:10px;font-weight:900;
  padding:7px 4px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;
}
.crm-cart-identity{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:0 14px 9px;padding:8px 10px;border-radius:13px;
  background:#f0fff5;border:1px solid #c9f4d8;color:#13251a;
}
.crm-cart-identity[hidden]{display:none!important;}
.crm-cart-identity-copy{display:flex;flex-direction:column;gap:1px;min-width:0;}
.crm-cart-identity-copy span{font-size:9px;font-weight:850;color:#5a7463;text-transform:uppercase;letter-spacing:.35px;}
.crm-cart-identity-copy strong{font-size:12px;font-weight:950;color:#102618;}
#crmCartChangePhone{
  border:0;border-radius:10px;background:#dff8e8;color:#147236;
  min-height:32px;padding:0 10px;font-size:10px;font-weight:950;cursor:pointer;
}
/* El fondo aparece inmediatamente mientras llega la imagen; evita sensación de hueco vacío. */
.album-cover,.song-cover{
  background:linear-gradient(135deg,#171b22,#252b35 52%,#171b22);
}
.album-cover img,.song-cover img{background:#15191f;}
@supports(content-visibility:auto){
  .song-row{content-visibility:auto;contain-intrinsic-size:64px;}
}
#orderPhoneSheetBackdrop .pay-sheet-title{max-width:310px;margin-left:auto!important;margin-right:auto!important;}
#orderPhoneSheetBackdrop .pay-sheet-sub{max-width:330px;margin-left:auto!important;margin-right:auto!important;}
@media(max-width:420px){
  .crm-cart-identity{margin-left:10px;margin-right:10px;}
  .crm-identity-bar{margin-top:5px;}
}


/* =========================================================
   DJGABO 20260727-19 · CARRITO GUIADO, SIMPLE Y COMPACTO
   Un solo siguiente paso visible para el cliente.
   ========================================================= */
#cartBackdrop .ck-order-route{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:30px;
  padding:5px 14px 7px;
  border-bottom:1px solid #eef1f4;
  background:#fff;
  color:#89919c;
  font-size:10px;
  font-weight:850;
  letter-spacing:.01em;
}
#cartBackdrop .ck-order-route span:first-child{color:#159447;}
#cartBackdrop .ck-order-route i{font-size:7px;color:#c2c7ce;}
#cartBackdrop .ck-cart-scroll{padding-top:9px!important;}
#cartBackdrop .ck-promo-summary{
  margin:0 0 12px;
  padding:11px 12px;
  border:1px solid #dfe6e2;
  border-radius:14px;
  background:#f8fbf9;
}
#cartBackdrop .ck-promo-summary.is-pending{
  border-color:#bfeccc;
  background:linear-gradient(135deg,#f1fff6,#fbfffc);
}
#cartBackdrop .ck-promo-summary.is-complete{
  border-color:#99e4b1;
  background:#effdf4;
}
#cartBackdrop .ck-promo-summary-kicker{
  margin-bottom:2px;
  color:#168f45;
  font-size:9px;
  font-weight:950;
  letter-spacing:.08em;
}
#cartBackdrop .ck-promo-summary-title{
  color:#142019;
  font-size:13.5px;
  line-height:1.15;
  font-weight:950;
}
#cartBackdrop .ck-promo-progress{
  display:flex;
  gap:7px;
  margin-top:8px;
}
#cartBackdrop .ck-promo-progress span{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:29px;
  padding:0 9px;
  border-radius:9px;
  background:#fff;
  border:1px solid #e4ebe6;
  color:#69746d;
  font-size:10.5px;
  font-weight:800;
}
#cartBackdrop .ck-promo-progress strong{
  color:#12261a;
  font-size:11.5px;
  font-weight:950;
}
#cartBackdrop .ck-promo-summary p{
  margin:7px 0 0;
  color:#4f6257;
  font-size:10.7px;
  line-height:1.25;
  font-weight:700;
}
#cartBackdrop .ck-section-head{margin:9px 0 6px;}
#cartBackdrop .ck-list{border-top:1px solid #edf0f2;border-bottom:1px solid #edf0f2;}
#cartBackdrop .ck-row{padding:9px 0;}
#cartBackdrop .ck-empty-section{
  min-height:38px;
  display:flex;
  align-items:center;
  padding:8px 10px;
  border:1px dashed #d9dee4;
  border-radius:10px;
  background:#fafbfc;
  color:#8a919a;
  font-size:11px;
  font-weight:750;
}
#cartBackdrop .ck-footer.ck-order-incomplete.ck-no-paid .ck-total-row,
#cartBackdrop .ck-footer.ck-order-incomplete.ck-no-paid .ck-price-detail,
#cartBackdrop .ck-footer.ck-order-incomplete.ck-no-paid .ck-whatsapp-note{
  display:none!important;
}
#cartBackdrop .ck-footer.ck-order-incomplete.ck-no-paid{
  padding-top:10px!important;
}
#cartBackdrop .ck-footer.ck-order-incomplete.ck-no-paid .ck-whatsapp-btn{
  margin-top:0!important;
}
#cartBackdrop .ck-footer.ck-order-incomplete #cartError{
  display:none!important;
}
#cartBackdrop .ck-whatsapp-btn{
  border-radius:12px!important;
  min-height:47px!important;
}
@media(max-width:520px){
  #cartBackdrop .ck-cart-head{padding:14px 14px 9px;}
  #cartBackdrop .ck-cart-scroll{padding-left:14px!important;padding-right:14px!important;}
  #cartBackdrop .ck-footer{padding-left:14px!important;padding-right:14px!important;}
  #cartBackdrop .ck-promo-summary{margin-bottom:9px;padding:10px;}
}


/* =========================================================
   DJGABO 20260728-20 · PROMOCIÓN PASO A PASO
   Pistas gratis → Pistas compradas → WhatsApp
   ========================================================= */
#cartBackdrop .ck-order-route span{
  color:#9aa1aa!important;
  transition:color .16s ease, font-weight .16s ease;
}
#cartBackdrop .ck-order-route span.is-active{
  color:#159447!important;
  font-weight:950!important;
}
#cartBackdrop .ck-order-route span.is-done{
  color:#159447!important;
}
#cartBackdrop .ck-order-route span.is-done::before{
  content:"✓ ";
  font-weight:950;
}
/* Ya no se muestra una tarjeta grande de resumen: el listado queda limpio. */
#cartBackdrop .ck-promo-summary{display:none!important;}
#cartBackdrop .ck-step-message{
  display:none;
  margin:0 0 9px;
  padding:10px 11px;
  border-radius:12px;
  text-align:left;
  line-height:1.25;
}
#cartBackdrop .ck-step-message.show{display:block;}
#cartBackdrop .ck-step-message strong{
  display:block;
  color:#08783a;
  font-size:11.5px;
  font-weight:950;
}
#cartBackdrop .ck-step-message span{
  display:block;
  margin-top:3px;
  color:#43554a;
  font-size:10.7px;
  font-weight:750;
}
#cartBackdrop .ck-step-message.paid-step{
  background:#f0fff5;
  border:1px solid #bce9ca;
}
#cartBackdrop .ck-step-message.complete-step{
  background:#effdf4;
  border:1px solid #99e4b1;
}
/* Durante una promoción incompleta se ocultan precio y detalle: una sola tarea visible. */
#cartBackdrop .ck-footer.ck-order-incomplete .ck-total-row,
#cartBackdrop .ck-footer.ck-order-incomplete .ck-price-detail,
#cartBackdrop .ck-footer.ck-order-incomplete .ck-whatsapp-note{
  display:none!important;
}
#cartBackdrop .ck-footer.ck-order-incomplete{padding-top:10px!important;}
#cartBackdrop .ck-footer.ck-order-incomplete .ck-whatsapp-btn{margin-top:0!important;}
.song-options-menu button.guided-locked,
.song-order-btn.guided-locked{
  opacity:.38!important;
  filter:grayscale(.55);
  cursor:not-allowed!important;
  box-shadow:none!important;
}
.song-order-btn.free:not(.guided-locked),
.song-options-menu button[data-menu-action="free"]:not(.guided-locked):not(:disabled){
  box-shadow:0 10px 24px rgba(37,211,102,.22)!important;
}
@media(max-width:520px){
  #cartBackdrop .ck-order-route{gap:6px!important;font-size:9.5px!important;}
  #cartBackdrop .ck-step-message{margin-bottom:8px;padding:9px 10px;}
}


/* DJGABO 20260728-23 · CIERRE PERSUASIVO SIN PROMESA FALSA */
#cartBackdrop .ck-step-message.complete-step strong{
  font-size:12px!important;
  color:#06783a!important;
}
#cartBackdrop .ck-step-message.complete-step span{
  font-size:11px!important;
}
#cartBackdrop .ck-footer:not(.ck-order-incomplete) #sendOrderBtn{
  font-weight:950!important;
  letter-spacing:-.01em!important;
}


/* DJGABO 20260728-25 · UNA SOLA ACCIÓN EN PROMOCIÓN */
.song-order-actions.guided-single-action{grid-template-columns:1fr!important;}
.song-order-actions.guided-single-action .song-order-btn{width:100%!important;}
.song-order-btn.free.guided-primary{
  display:flex;
  background:linear-gradient(135deg,#25d366,#17e87a)!important;
  color:#06180c!important;
  border:1px solid rgba(78,255,145,.72)!important;
  box-shadow:0 12px 28px rgba(37,211,102,.30)!important;
  opacity:1!important;
  filter:none!important;
}
.song-order-btn.free.guided-primary i{color:#06180c!important;}
.song-order-btn.free.guided-primary:hover,
.song-order-btn.free.guided-primary:active{
  background:linear-gradient(135deg,#35e476,#19ef80)!important;
  transform:translateY(-1px);
}
.song-options-menu button[data-menu-action="free"].guided-primary{
  display:flex;
  background:linear-gradient(135deg,#25d366,#17e87a)!important;
  color:#06180c!important;
  box-shadow:0 10px 24px rgba(37,211,102,.26)!important;
  opacity:1!important;
  filter:none!important;
}
.song-options-menu button[data-menu-action="free"].guided-primary i{color:#06180c!important;}

/* =========================================================
   DJGABO 20260731 · FLUJO SIMPLE, PROMO OPCIONAL Y ÉXITO
   ========================================================= */
#cartBackdrop .ck-step-message.free-step{
  background:#fff8df;
  border:1px solid #f2cf69;
}
#cartBackdrop .ck-step-message.free-step strong{
  color:#8a5a00!important;
  font-size:12px!important;
}
#cartBackdrop .ck-promo-choice{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:8px 0 10px;
  padding:10px 11px;
  border:1px solid #f1d36f;
  border-radius:13px;
  background:#fff9e6;
}
#cartBackdrop .ck-promo-choice strong{
  color:#6f4b00;
  font-size:11.5px;
  line-height:1.25;
  font-weight:950;
}
#cartBackdrop .ck-promo-choice button{
  flex:0 0 auto;
  min-height:34px;
  padding:0 11px;
  border:0;
  border-radius:10px;
  background:#25d366;
  color:#062312;
  font-size:10px;
  font-weight:950;
  cursor:pointer;
}
#cartBackdrop .ck-promo-cancel{
  display:block;
  margin:7px 0 3px auto;
  padding:4px 0;
  border:0;
  background:transparent;
  color:#7a818a;
  font-size:10.5px;
  font-weight:800;
  text-decoration:underline;
  cursor:pointer;
}
.song-order-actions.meta-single-action{
  grid-template-columns:1fr!important;
}
.song-order-actions.meta-single-action .song-order-btn.free{
  width:100%!important;
  min-height:50px!important;
}
.order-success-panel[hidden],
#paymentSheetContent[hidden],
#campaignPhoneContent[hidden]{display:none!important;}
.order-success-panel{
  padding:32px 4px 8px;
  text-align:center;
}
.order-success-icon{
  display:grid;
  place-items:center;
  width:64px;
  height:64px;
  margin:0 auto 13px;
  border-radius:22px;
  background:#dcfce7;
  color:#079447;
  font-size:28px;
  box-shadow:0 10px 28px rgba(7,148,71,.16);
}
.order-success-panel h3{
  margin:0;
  color:#132019;
  font-size:23px;
  line-height:1.08;
  font-weight:950;
  letter-spacing:-.03em;
}
.order-success-panel>p{
  margin:8px auto 0;
  max-width:310px;
  color:#667069;
  font-size:13px;
  line-height:1.35;
  font-weight:750;
}
.order-success-summary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:31px;
  margin:13px auto 0;
  padding:0 12px;
  border-radius:999px;
  background:#effdf4;
  color:#08783a;
  font-size:11.5px;
  font-weight:950;
}
.order-success-summary:empty{display:none;}
.order-success-offer{
  display:grid;
  gap:4px;
  margin:15px 0 10px;
  padding:12px;
  border:1px solid #f1d36f;
  border-radius:15px;
  background:#fff9e6;
  text-align:left;
}
.order-success-offer[hidden]{display:none!important;}
.order-success-offer strong{
  color:#704c00;
  font-size:13px;
  font-weight:950;
}
.order-success-offer span{
  color:#77643c;
  font-size:11.5px;
  font-weight:750;
}
.order-success-offer button{
  min-height:40px;
  margin-top:5px;
  border:0;
  border-radius:11px;
  background:#25d366;
  color:#052313;
  font-size:11.5px;
  font-weight:950;
  cursor:pointer;
}
.order-success-whatsapp{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  min-height:46px;
  margin-top:14px;
  border:0;
  border-radius:13px;
  background:#25d366;
  color:#052313;
  font-size:12px;
  font-weight:950;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(37,211,102,.22);
}
.order-success-whatsapp i{font-size:17px;}
.order-success-primary{
  width:100%;
  min-height:47px;
  margin-top:8px;
  border:0;
  border-radius:13px;
  background:#171b22;
  color:#fff;
  font-size:12px;
  font-weight:950;
  cursor:pointer;
}
.pay-sheet.is-success,
.campaign-phone-sheet.is-success{
  padding-top:16px!important;
}
@media(max-width:420px){
  #cartBackdrop .ck-promo-choice{align-items:stretch;flex-direction:column;}
  #cartBackdrop .ck-promo-choice button{width:100%;}
  .order-success-panel{padding-top:28px;}
  .order-success-panel h3{font-size:21px;}
}


/* V5: confirmación post-WhatsApp más comercial y menos técnica */
.order-success-whatsapp{
  display:inline-flex!important;
  width:auto!important;
  min-height:auto!important;
  margin:10px auto 0!important;
  padding:5px 8px!important;
  border-radius:8px!important;
  background:transparent!important;
  color:#118a45!important;
  font-size:10.5px!important;
  font-weight:850!important;
  text-decoration:underline!important;
  box-shadow:none!important;
}
.order-success-whatsapp i{font-size:13px!important;}
.order-success-offer{
  gap:7px!important;
  margin:18px 0 8px!important;
  padding:16px 14px!important;
  border:1.5px solid #efcf62!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fffdf3,#fff7d9)!important;
  text-align:center!important;
  box-shadow:0 10px 28px rgba(164,116,0,.10)!important;
}
.order-success-offer strong{
  display:block!important;
  color:#6d4900!important;
  font-size:14.5px!important;
  line-height:1.2!important;
  font-weight:950!important;
}
.order-success-offer span{display:block!important;}
.order-success-offer span b{
  display:block!important;
  margin-top:1px!important;
  color:#17130a!important;
  font-size:20px!important;
  line-height:1.08!important;
  font-weight:1000!important;
  letter-spacing:-.025em!important;
}
.order-success-offer span small{
  display:block!important;
  margin-top:5px!important;
  color:#725d29!important;
  font-size:12.5px!important;
  line-height:1.25!important;
  font-weight:850!important;
}
.order-success-offer button{
  min-height:48px!important;
  margin-top:7px!important;
  border-radius:14px!important;
  font-size:13px!important;
  box-shadow:0 10px 22px rgba(37,211,102,.20)!important;
}
#campaignSuccessPrimary{
  display:inline-block!important;
  width:auto!important;
  min-height:auto!important;
  margin:8px auto 0!important;
  padding:5px 10px!important;
  border-radius:8px!important;
  background:transparent!important;
  color:#737b76!important;
  font-size:11px!important;
  font-weight:800!important;
  text-decoration:underline!important;
}


/* V6 cache-proof final modal */
#campaignSuccessWhatsappBtn{
 display:inline-flex!important;width:auto!important;min-height:auto!important;
 margin:8px auto 0!important;padding:4px 8px!important;
 background:transparent!important;color:#118a45!important;
 border:0!important;box-shadow:none!important;text-decoration:underline!important;
 font-size:10.5px!important;font-weight:850!important;
}
#campaignSuccessPrimary{
 display:inline-block!important;width:auto!important;min-height:auto!important;
 margin:8px auto 0!important;padding:5px 10px!important;
 background:transparent!important;color:#737b76!important;border:0!important;
 box-shadow:none!important;text-decoration:underline!important;font-size:11px!important;
}
#campaignSuccessOfferTitle{font-size:15px!important;}
#campaignSuccessOfferText b{font-size:21px!important;}

/* V7 — parche definitivo sobre nombres originales */
#campaignSuccessWhatsappBtn{
  display:inline-flex!important;
  width:auto!important;
  min-height:auto!important;
  margin:8px auto 0!important;
  padding:4px 6px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#118a45!important;
  box-shadow:none!important;
  font-size:10.5px!important;
  font-weight:850!important;
  text-decoration:underline!important;
}
#campaignSuccessWhatsappBtn i{font-size:12px!important;}
#campaignSuccessOffer{
  gap:7px!important;
  margin:18px 0 7px!important;
  padding:16px 14px!important;
  border:1.5px solid #efcf62!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fffdf3,#fff7d9)!important;
  text-align:center!important;
  box-shadow:0 10px 28px rgba(164,116,0,.10)!important;
}
#campaignSuccessOfferTitle{
  display:block!important;
  color:#6d4900!important;
  font-size:15px!important;
  line-height:1.2!important;
  font-weight:950!important;
}
#campaignSuccessOfferText{display:block!important;}
#campaignSuccessOfferText b{
  display:block!important;
  color:#17130a!important;
  font-size:21px!important;
  line-height:1.08!important;
  font-weight:1000!important;
}
#campaignSuccessOfferText small{
  display:block!important;
  margin-top:5px!important;
  color:#725d29!important;
  font-size:12.5px!important;
  font-weight:850!important;
}
#campaignSuccessOfferBtn{
  width:100%!important;
  min-height:48px!important;
  margin-top:7px!important;
  border:0!important;
  border-radius:14px!important;
  background:#25d366!important;
  color:#052313!important;
  font-size:13px!important;
  font-weight:950!important;
  box-shadow:0 10px 22px rgba(37,211,102,.20)!important;
}
#campaignSuccessPrimary{
  display:inline-block!important;
  width:auto!important;
  min-height:auto!important;
  margin:7px auto 0!important;
  padding:5px 8px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#737b76!important;
  box-shadow:none!important;
  font-size:11px!important;
  font-weight:800!important;
  text-decoration:underline!important;
}