/* ==========================================================
   SpaMaster 360 v27.8 — Forced Agenda Modal Templates
   Direct template classes + hard CSS override.
   ========================================================== */

:root{
    --sm360-fm-ink:#0F172A;
    --sm360-fm-muted:#64748B;
    --sm360-fm-purple:#6D4AFF;
    --sm360-fm-green:#16A34A;
    --sm360-fm-red:#EF4444;
    --sm360-fm-blue:#2F80ED;
}

/* NEW RESERVATION + SUMMARY MODALS */
.sm360-forced-new-reservation-modal,
.sm360-forced-summary-modal,
.sm360-reserve-modal,
.sm360-reserva-summary-modal,
.agenda-reservation-pro.sm360-reserve-modal,
.agenda-reservation-edit.sm360-reserva-summary-modal,
.agenda-reservation-detail.sm360-reserva-summary-modal{
    border-radius:28px!important;
    background:
        radial-gradient(circle at 8% 6%, rgba(109,74,255,.11), transparent 30%),
        radial-gradient(circle at 96% 8%, rgba(22,163,74,.07), transparent 28%),
        linear-gradient(135deg,rgba(255,255,255,.94),rgba(255,255,255,.74))!important;
    border:1px solid rgba(148,163,184,.24)!important;
    box-shadow:0 28px 76px rgba(15,23,42,.18), inset 0 1px 0 rgba(255,255,255,.90)!important;
    backdrop-filter:blur(26px) saturate(1.2)!important;
    -webkit-backdrop-filter:blur(26px) saturate(1.2)!important;
    color:var(--sm360-fm-ink)!important;
}

/* Cards */
.sm360-forced-new-reservation-modal .agenda-v221-form-card,
.sm360-forced-summary-modal .agenda-v221-form-card,
.sm360-reserva-summary-modal .agenda-v221-form-card,
.sm360-rs-card{
    border-radius:22px!important;
    background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(255,255,255,.66))!important;
    border:1px solid rgba(148,163,184,.22)!important;
    box-shadow:0 16px 38px rgba(15,23,42,.06), inset 0 1px 0 rgba(255,255,255,.86)!important;
    backdrop-filter:blur(18px) saturate(1.14)!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.14)!important;
}

/* Labels */
.sm360-forced-new-reservation-modal label,
.sm360-forced-summary-modal label,
.sm360-reserva-summary-modal label,
.sm360-reserve-modal label{
    color:var(--sm360-fm-muted)!important;
    font-family:var(--sc-font-display,"General Sans",sans-serif)!important;
    font-size:12px!important;
    font-weight:760!important;
    letter-spacing:.06em!important;
    text-transform:uppercase!important;
}

/* Inputs */
.sm360-forced-new-reservation-modal input,
.sm360-forced-new-reservation-modal select,
.sm360-forced-new-reservation-modal textarea,
.sm360-forced-summary-modal input,
.sm360-forced-summary-modal select,
.sm360-forced-summary-modal textarea,
.sm360-reserva-summary-modal input,
.sm360-reserva-summary-modal select,
.sm360-reserva-summary-modal textarea{
    min-height:46px!important;
    border-radius:16px!important;
    background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,255,255,.72))!important;
    border:1px solid rgba(148,163,184,.25)!important;
    box-shadow:0 10px 24px rgba(15,23,42,.045), inset 0 1px 0 rgba(255,255,255,.88)!important;
    color:var(--sm360-fm-ink)!important;
    font-family:var(--sc-font-body,"Manrope",sans-serif)!important;
    font-weight:620!important;
    outline:none!important;
}

.sm360-forced-new-reservation-modal input:focus,
.sm360-forced-new-reservation-modal select:focus,
.sm360-forced-new-reservation-modal textarea:focus,
.sm360-forced-summary-modal input:focus,
.sm360-forced-summary-modal select:focus,
.sm360-forced-summary-modal textarea:focus{
    border-color:rgba(109,74,255,.48)!important;
    box-shadow:0 0 0 4px rgba(109,74,255,.10), 0 12px 28px rgba(109,74,255,.08)!important;
}

/* Client Search FORCED */
.sm360-template-client-search,
.agenda-client-search-wrap.sm360-real-client-search{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:52px!important;
    border-radius:18px!important;
    background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,255,255,.72))!important;
    border:1px solid rgba(148,163,184,.25)!important;
    box-shadow:0 12px 28px rgba(15,23,42,.055), inset 0 1px 0 rgba(255,255,255,.88)!important;
    overflow:hidden!important;
}

.sm360-real-client-search-icon{
    width:50px!important;
    min-width:50px!important;
    height:52px!important;
    display:grid!important;
    place-items:center!important;
}

.sm360-real-client-search-icon::before{
    content:""!important;
    width:21px!important;
    height:21px!important;
    background:linear-gradient(135deg,#6D4AFF,#2F80ED)!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.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21 21-4.34-4.34'/%3E%3Ccircle cx='11' cy='11' r='8'/%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.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21 21-4.34-4.34'/%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3C/svg%3E") center/contain no-repeat!important;
}

.sm360-template-client-search input,
.agenda-client-search-wrap.sm360-real-client-search input{
    flex:1!important;
    min-height:52px!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    border-radius:0!important;
    padding-left:0!important;
}

.sm360-real-client-clear{
    width:48px!important;
    min-width:48px!important;
    height:52px!important;
    display:grid!important;
    place-items:center!important;
    border-left:1px solid rgba(148,163,184,.16)!important;
    background:rgba(248,250,252,.60)!important;
    cursor:pointer!important;
    font-size:0!important;
}

.sm360-real-client-clear::before{
    content:""!important;
    width:19px!important;
    height:19px!important;
    background:#64748B!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.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%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.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E") center/contain no-repeat!important;
}

/* Time panel FORCED */
.sm360-template-time-panel,
.sm360-real-time-panel{
    margin:12px 0 0!important;
    padding:16px!important;
    border-radius:22px!important;
    background:radial-gradient(circle at 8% 10%, rgba(109,74,255,.09), transparent 34%),
        linear-gradient(135deg,rgba(255,255,255,.86),rgba(255,255,255,.66))!important;
    border:1px solid rgba(148,163,184,.22)!important;
    box-shadow:0 16px 38px rgba(15,23,42,.065), inset 0 1px 0 rgba(255,255,255,.86)!important;
}

.sm360-real-time-head{
    display:flex!important;
    justify-content:space-between!important;
    align-items:center!important;
    gap:12px!important;
    margin-bottom:14px!important;
}

.sm360-real-time-title{
    color:var(--sm360-fm-muted)!important;
    font-family:var(--sc-font-display,"General Sans",sans-serif)!important;
    font-size:12px!important;
    font-weight:780!important;
    letter-spacing:.06em!important;
    text-transform:uppercase!important;
}

.sm360-real-time-badge{
    border-radius:999px!important;
    padding:5px 10px!important;
    background:rgba(109,74,255,.10)!important;
    color:#5E2BFF!important;
    font-family:var(--sc-font-display,"General Sans",sans-serif)!important;
    font-size:12px!important;
    font-weight:780!important;
}

.sm360-real-time-grid{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:14px!important;
}

.sm360-real-time-field{
    display:flex!important;
    flex-direction:column!important;
    gap:8px!important;
}

.sm360-real-time-field span{
    color:#475569!important;
    font-family:var(--sc-font-display,"General Sans",sans-serif)!important;
    font-size:12px!important;
    font-weight:760!important;
    text-transform:none!important;
    letter-spacing:.02em!important;
}

/* Buttons FORCED */
.sm360-real-cancel-btn,
.sm360-rs-cancel-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;
    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;
    font-family:var(--sc-font-display,"General Sans",sans-serif)!important;
    font-weight:820!important;
}

.sm360-real-save-btn,
.sm360-rs-save-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;
    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;
    font-family:var(--sc-font-display,"General Sans",sans-serif)!important;
    font-weight:820!important;
}

.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;
    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;
    font-family:var(--sc-font-display,"General Sans",sans-serif)!important;
    font-weight:820!important;
}

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

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

.sm360-reserve-btn-icon-cancel,
.sm360-rs-icon-cancel{
    --sm360-icon-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%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-reserve-btn-icon-save,
.sm360-rs-icon-save{
    --sm360-icon-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='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
    background:#fff!important;
}

.sm360-rs-icon-payment{
    --sm360-icon-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='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;
}

/* Summary cards direct */
.sm360-forced-summary-modal .agenda-payment-card,
.sm360-forced-summary-modal .agenda-payment-section,
.sm360-reserva-summary-modal .agenda-payment-card,
.sm360-reserva-summary-modal .agenda-payment-section{
    background:radial-gradient(circle at 8% 10%, rgba(22,163,74,.11), transparent 34%),
        linear-gradient(135deg,rgba(236,253,245,.86),rgba(255,255,255,.68))!important;
    border-color:rgba(22,163,74,.26)!important;
}

@media(max-width:640px){
    .sm360-real-time-grid{grid-template-columns:1fr!important;}
}
