/* SpaMaster 360 v28.4 — Merge Summary Modal Refine */

/* Scroll correcto del resumen */
.agenda-v221-modal-backdrop:has(.sm360-summary-v284),
.agenda-v221-modal-backdrop:has(.agenda-detail-pro){
    align-items:flex-start!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:18px 0!important;
}

.agenda-v221-modal:has(.sm360-summary-v284),
.agenda-v221-modal:has(.agenda-detail-pro){
    max-height:calc(100vh - 36px)!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
}

.agenda-v221-modal:has(.sm360-summary-v284) .agenda-v221-modal-head,
.agenda-v221-modal:has(.agenda-detail-pro) .agenda-v221-modal-head{
    position:sticky!important;
    top:0!important;
    z-index:50!important;
    flex:0 0 auto!important;
    background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,255,255,.76))!important;
    border-bottom:1px solid rgba(148,163,184,.18)!important;
    backdrop-filter:blur(18px) saturate(1.14)!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.14)!important;
}

.agenda-v221-modal:has(.sm360-summary-v284) .agenda-v221-modal-body,
.agenda-v221-modal:has(.agenda-detail-pro) .agenda-v221-modal-body{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    max-height:calc(100vh - 118px)!important;
    padding-bottom:24px!important;
}

/* X bien ubicada */
.agenda-v221-modal:has(.sm360-summary-v284) .agenda-v221-close,
.agenda-v221-modal:has(.agenda-detail-pro) .agenda-v221-close{
    position:absolute!important;
    top:12px!important;
    right:14px!important;
    z-index:80!important;
    width:42px!important;
    height:42px!important;
    border-radius:16px!important;
    display:grid!important;
    place-items:center!important;
    background:rgba(255,255,255,.80)!important;
    border:1px solid rgba(148,163,184,.22)!important;
    box-shadow:0 12px 28px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.90)!important;
    color:#0F172A!important;
}

.agenda-v221-modal:has(.sm360-summary-v284) .agenda-v221-modal-title{
    padding-right:64px!important;
    font-family:var(--sc-font-display,"General Sans",sans-serif)!important;
    font-weight:820!important;
    letter-spacing:-.04em!important;
}

/* Modal resumen */
.sm360-summary-v284,
.sm360-summary-v279,
.agenda-detail-pro.sm360-summary-v284{
    border-radius:28px!important;
    background:
        radial-gradient(circle at 7% 4%,rgba(109,74,255,.10),transparent 30%),
        radial-gradient(circle at 98% 8%,rgba(47,128,237,.06),transparent 28%),
        linear-gradient(135deg,rgba(255,255,255,.94),rgba(255,255,255,.76))!important;
    border:1px solid rgba(148,163,184,.22)!important;
    box-shadow:0 28px 76px rgba(15,23,42,.16), inset 0 1px 0 rgba(255,255,255,.90)!important;
    backdrop-filter:blur(26px) saturate(1.20)!important;
    -webkit-backdrop-filter:blur(26px) saturate(1.20)!important;
}

/* Pestañas arriba, no duplicadas */
.sm360-summary-v284 .agenda-detail-tabs,
.sm360-summary-tabs-v284{
    width:100%!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    padding:8px!important;
    margin:0 0 10px!important;
    border-radius:20px!important;
    background:linear-gradient(135deg,rgba(255,255,255,.86),rgba(255,255,255,.66))!important;
    border:1px solid rgba(148,163,184,.20)!important;
    box-shadow:0 12px 28px rgba(15,23,42,.055), inset 0 1px 0 rgba(255,255,255,.88)!important;
}

.sm360-summary-v284 .agenda-detail-tabs button,
.sm360-summary-tabs-v284 button{
    min-height:40px!important;
    padding:0 18px!important;
    border-radius:15px!important;
    border:0!important;
    background:rgba(241,245,249,.70)!important;
    color:#475569!important;
    font-family:var(--sc-font-display,"General Sans",sans-serif)!important;
    font-weight:760!important;
}

.sm360-summary-v284 .agenda-detail-tabs button.active,
.sm360-summary-tabs-v284 button.active{
    background:linear-gradient(135deg,#7C3AED,#5E2BFF)!important;
    color:#fff!important;
    box-shadow:0 12px 28px rgba(94,43,255,.22)!important;
}

.sm360-summary-v284 .agenda-detail-tabs.sm360-tabs-duplicate-v284{
    display:none!important;
}

.sm360-summary-v284 .agenda-detail-legend,
.sm360-summary-legend-v284{
    margin:0 0 14px!important;
    padding:10px 12px!important;
    border-radius:16px!important;
    background:rgba(255,255,255,.55)!important;
    border:1px solid rgba(148,163,184,.16)!important;
    font-size:12px!important;
    color:#64748B!important;
}

/* Cards generales */
.sm360-summary-v284 .agenda-v221-form-card,
.sm360-summary-v284 .agenda-service-option,
.sm360-summary-v284 .agenda-notes-card{
    border-radius:22px!important;
    background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(255,255,255,.68))!important;
    border:1px solid rgba(148,163,184,.22)!important;
    box-shadow:0 16px 38px rgba(15,23,42,.055), inset 0 1px 0 rgba(255,255,255,.88)!important;
}

/* Pago amarillo/verde según estado */
.sm360-summary-v284 .agenda-payment-pro,
.sm360-summary-payment-card-v284{
    border-radius:22px!important;
    background:
        radial-gradient(circle at 8% 10%,rgba(245,158,11,.13),transparent 34%),
        linear-gradient(135deg,rgba(255,251,235,.92),rgba(255,255,255,.72))!important;
    border:1px solid rgba(245,158,11,.38)!important;
    box-shadow:0 18px 44px rgba(245,158,11,.14), inset 0 1px 0 rgba(255,255,255,.88)!important;
}

.sm360-summary-v284 .agenda-payment-pro.sm360-payment-paid-v284,
.sm360-summary-payment-card-v284.sm360-payment-paid-v284{
    background:
        radial-gradient(circle at 8% 10%,rgba(22,163,74,.12),transparent 34%),
        linear-gradient(135deg,rgba(236,253,245,.88),rgba(255,255,255,.70))!important;
    border-color:rgba(22,163,74,.30)!important;
    box-shadow:0 18px 44px rgba(22,163,74,.12), inset 0 1px 0 rgba(255,255,255,.88)!important;
}

/* Botón eliminar pago */
#rdDeletePayment,
.sm360-delete-payment-v284,
.sm360-rs-delete-btn{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    padding:0!important;
    display:inline-grid!important;
    place-items:center!important;
    border-radius:16px!important;
    color:#EF4444!important;
    background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(254,226,226,.82))!important;
    border:1px solid rgba(239,68,68,.34)!important;
    box-shadow:0 12px 28px rgba(239,68,68,.14), inset 0 1px 0 rgba(255,255,255,.92)!important;
}

#rdDeletePayment .sm360-rs-btn-icon,
.sm360-rs-delete-btn .sm360-rs-btn-icon{
    width:20px!important;
    height:20px!important;
    display:block!important;
    background:#EF4444!important;
    opacity:1!important;
    visibility:visible!important;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M8 6V4h8v2'/%3E%3Cpath d='M19 6l-1 14H6L5 6'/%3E%3Cpath d='M10 11v6'/%3E%3Cpath d='M14 11v6'/%3E%3C/svg%3E") center/contain no-repeat!important;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M8 6V4h8v2'/%3E%3Cpath d='M19 6l-1 14H6L5 6'/%3E%3Cpath d='M10 11v6'/%3E%3Cpath d='M14 11v6'/%3E%3C/svg%3E") center/contain no-repeat!important;
}

/* Medios de pago Liquid Glass */
.sm360-summary-v284 .agenda-payment-methods button{
    position:relative!important;
    overflow:hidden!important;
    min-height:80px!important;
    padding-top:14px!important;
    border-radius:20px!important;
    background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(255,255,255,.68))!important;
    border:1px solid rgba(148,163,184,.22)!important;
    box-shadow:0 12px 28px rgba(15,23,42,.055), inset 0 1px 0 rgba(255,255,255,.86)!important;
}

.sm360-summary-v284 .agenda-payment-methods button > span:first-child{
    display:none!important;
}

.sm360-summary-v284 .agenda-payment-methods button::before{
    content:""!important;
    display:block!important;
    width:34px!important;
    height:34px!important;
    margin:0 auto 8px!important;
    border-radius:14px!important;
    background:radial-gradient(circle at 28% 18%,rgba(255,255,255,.52),transparent 42%),linear-gradient(135deg,var(--payA),var(--payB))!important;
    box-shadow:0 12px 26px var(--payShadow), inset 0 1px 0 rgba(255,255,255,.42)!important;
}

.sm360-summary-v284 .agenda-payment-methods button::after{
    content:""!important;
    position:absolute!important;
    top:22px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    width:18px!important;
    height:18px!important;
    background:#fff!important;
    mask:var(--payIcon) center/contain no-repeat!important;
    -webkit-mask:var(--payIcon) center/contain no-repeat!important;
}

.sm360-summary-v284 .agenda-payment-methods button[data-method="efectivo"]{
    --payA:#22C55E;--payB:#0F7A3D;--payShadow:rgba(22,163,74,.22);
    --payIcon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='12' x='2' y='6' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Cpath d='M6 12h.01M18 12h.01'/%3E%3C/svg%3E");
}

.sm360-summary-v284 .agenda-payment-methods button[data-method="datafono"]{
    --payA:#38BDF8;--payB:#2563EB;--payShadow:rgba(37,99,235,.22);
    --payIcon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='14' x='2' y='5' rx='2'/%3E%3Cpath d='M2 10h20'/%3E%3Cpath d='M7 15h.01M11 15h2'/%3E%3C/svg%3E");
}

.sm360-summary-v284 .agenda-payment-methods button[data-method="transferencia"]{
    --payA:#A78BFA;--payB:#6D4AFF;--payShadow:rgba(109,74,255,.22);
    --payIcon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M5 21V10'/%3E%3Cpath d='M19 21V10'/%3E%3Cpath d='M9 21V10'/%3E%3Cpath d='M15 21V10'/%3E%3Cpath d='M12 3 2 9h20z'/%3E%3C/svg%3E");
}

/* Botones inferiores */
.sm360-rs-cancel-btn,
.sm360-rs-save-btn,
.sm360-rs-payment-btn{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    min-height:48px!important;
    padding:0 18px!important;
    border-radius:16px!important;
    font-family:var(--sc-font-display,"General Sans",sans-serif)!important;
    font-weight:820!important;
    transition:transform .16s cubic-bezier(.2,.8,.2,1), box-shadow .16s ease!important;
}

.sm360-rs-cancel-btn{
    color:#B4232A!important;
    background:linear-gradient(135deg,rgba(255,255,255,.90),rgba(254,226,226,.78))!important;
    border:1px solid rgba(239,68,68,.30)!important;
    box-shadow:0 12px 28px rgba(239,68,68,.10), inset 0 1px 0 rgba(255,255,255,.90)!important;
}

.sm360-rs-save-btn{
    color:#fff!important;
    background:radial-gradient(circle at 22% 14%,rgba(255,255,255,.24),transparent 34%),linear-gradient(135deg,#7C3AED,#5E2BFF 58%,#4C1D95)!important;
    border:1px solid rgba(255,255,255,.32)!important;
    box-shadow:0 16px 36px rgba(94,43,255,.24), inset 0 1px 0 rgba(255,255,255,.32)!important;
}

.sm360-rs-payment-btn{
    color:#fff!important;
    background:radial-gradient(circle at 22% 14%,rgba(255,255,255,.24),transparent 34%),linear-gradient(135deg,#22C55E,#16A34A 58%,#0F7A3D)!important;
    border:1px solid rgba(255,255,255,.32)!important;
    box-shadow:0 16px 36px rgba(22,163,74,.24), inset 0 1px 0 rgba(255,255,255,.32)!important;
}

.sm360-rs-cancel-btn:hover,
.sm360-rs-save-btn:hover,
.sm360-rs-payment-btn:hover,
.sm360-rs-delete-btn:hover{
    transform:translateY(-2px) scale(1.02)!important;
}

/* Iconos de botones */
.sm360-rs-btn-icon{
    width:18px!important;
    height:18px!important;
    display:inline-block!important;
    background:currentColor!important;
    mask:var(--rsIcon) center/contain no-repeat!important;
    -webkit-mask:var(--rsIcon) center/contain no-repeat!important;
}

.sm360-rs-icon-cancel{--rsIcon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m15 9-6 6'/%3E%3Cpath d='m9 9 6 6'/%3E%3C/svg%3E");}
.sm360-rs-icon-save{--rsIcon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z'/%3E%3Cpath d='M17 21v-7H7v7'/%3E%3Cpath d='M7 3v5h8'/%3E%3C/svg%3E");background:#fff!important;}
.sm360-rs-icon-payment{--rsIcon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v20'/%3E%3Cpath d='M17 5H9.5a3.5 3.5 0 0 0 0 7H14a3.5 3.5 0 0 1 0 7H6'/%3E%3C/svg%3E");background:#fff!important;}

/* Imagen real en servicio seleccionado */
.sm360-summary-v284 .agenda-service-thumb{
    font-size:0!important;
    border-radius:18px!important;
    overflow:hidden!important;
}
.sm360-summary-v284 .agenda-service-thumb img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
}
