/* =========================
   Event Manager Pro – Admin Styles
========================= */

/* ===== EMP Admin Layout Fix (WP Admin) ===== */
#wpcontent { padding-left: 0 !important; }
#wpbody-content { padding-bottom: 24px; }
.wrap { margin: 0; }
.emp-admin-wrap { padding: 24px; }

/* En móvil WP admin mete cosas raras */
@media (max-width: 782px){
  #wpcontent, #wpbody-content{ padding-left:0 !important; }
  .emp-admin-wrap { padding: 16px; }
  .wrap.emp-saas-page,
  .emp-saas-page{overflow-x:hidden;max-width:100%;}
  body.wp-admin .wrap{ max-width:100vw; overflow-x:hidden; box-sizing:border-box; }
}

/* Wizard (alta/editar evento) - adaptación móvil */
@media (max-width: 768px){
  .emp-admin-wrap .emp-page.emp-page-wizard,
  .emp-page.emp-page-wizard .emp-page-content{
    max-width:100% !important;
    overflow-x:hidden !important;
    box-sizing:border-box !important;
  }
  body.wp-admin .emp-admin-wrap{
    max-width:100% !important;
    overflow-x:hidden !important;
  }
  .emp-page-wrap{
    overflow-x:hidden !important;
    max-width:100vw !important;
    padding:10px 0 100px !important;
    box-sizing:border-box !important;
  }
  .emp-page-wrap .emp-container,
  .emp-page-wrap .container{
    max-width:100% !important;
    width:100% !important;
    padding-left:14px !important;
    padding-right:14px !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
  }
  .emp-page-wrap .emp-card,
  .emp-page-wrap .emp-body{
    padding:14px !important;
  }
  .emp-page-wrap .emp-stepper{
    gap:8px !important;
    padding-bottom:4px !important;
    -webkit-overflow-scrolling:touch;
  }
  .emp-page-wrap .emp-step{
    min-width:100px !important;
  }
  .emp-page-wrap .emp-step-label{
    font-size:11px !important;
    white-space:nowrap !important;
  }
  .emp-page-wrap .emp-step-dot{
    width:28px !important;
    height:28px !important;
    font-size:12px !important;
  }
  .emp-page-wrap .row{
    margin-left:-6px !important;
    margin-right:-6px !important;
  }
  .emp-page-wrap .row > [class*="col-"]{
    padding-left:6px !important;
    padding-right:6px !important;
  }
  .emp-page-wrap .emp-wizard .emp-card,
  .emp-page-wrap .emp-wizard .emp-body{
    min-width:0 !important;
  }
}

/* =========================
   EMP Page Shell
========================= */
.emp-page{
  max-width: 1320px;
  margin: 0 auto;
  display: grid;
  gap: 14px;
}

.emp-page-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 14px;
  padding: 18px 18px;
  border: 1px solid var(--emp-border);
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(10px);
  border-radius: var(--emp-radius);
  box-shadow: var(--emp-shadow);
}

.emp-page-title{
  margin: 0;
  font-size: 22px;
  line-height: 1.2;
  letter-spacing: -.02em;
  color: var(--emp-text);
  font-weight: 850;
}

.emp-page-desc{
  margin: 6px 0 0;
  color: var(--emp-muted);
  font-size: 13px;
  line-height: 1.45;
  max-width: 76ch;
}

.emp-page-head-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

/* Shell buttons (used by emp_admin_page_open actions) */
.emp-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.10);
  background: #fff;
  color: #0f172a;
  text-decoration: none;
  font-weight: 800;
  font-size: 13px;
  line-height: 1;
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
}
.emp-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(2,6,23,.10);
  border-color: rgba(79,70,229,.22);
}
.emp-btn:focus{ outline: none; }
.emp-btn-primary{
  background: var(--emp-primary);
  border-color: var(--emp-primary);
  color: #fff;
}
.emp-btn-primary:hover{
  background: var(--emp-primary-hover);
  border-color: var(--emp-primary-hover);
  color:#fff;
}
.emp-btn-secondary{
  background:#fff;
}
.emp-btn-ghost{
  background: transparent;
  box-shadow: none;
}
.emp-btn-ghost:hover{
  background: rgba(79,70,229,.08);
}
.emp-btn-ic{
  font-size: 14px;
  line-height: 1;
}

.emp-page-toolbar{
  border: 1px solid var(--emp-border);
  background: var(--emp-card);
  border-radius: var(--emp-radius);
  box-shadow: var(--emp-shadow);
  padding: 12px 12px;
}

.emp-page-content{
  display:block;
}

/* When legacy views use Bootstrap containers inside shell */
.emp-page-content > .container,
.emp-page-content > .container-fluid{
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.emp-page-content > .row{
  margin-left: 0;
  margin-right: 0;
}

/* Provider/Location legacy wrappers should not add their own background/padding */
.emp-page-providers .emp-proveedores-ui,
.emp-page-locations .emp-saas-wrap{
  background: transparent !important;
  padding: 0 !important;
}
.emp-page-providers .emp-proveedores-ui .emp-wrap,
.emp-page-locations .emp-saas-container{
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.emp-page-footer{
  border: 1px solid var(--emp-border);
  background: var(--emp-card);
  border-radius: var(--emp-radius);
  box-shadow: var(--emp-shadow);
  padding: 12px 12px;
}

@media (max-width: 782px){
  .emp-page-header{ padding: 14px; flex-direction: column; }
  .emp-page-head-actions{ width:100%; justify-content:flex-start; }
}

/* =========================
   EMP Toolbar building blocks
========================= */
.emp-toolbar-grid{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.emp-toolbar-grid.is-right-only{
  justify-content:flex-end;
}
.emp-toolbar-left,
.emp-toolbar-right{ display:flex; align-items:center; gap: 10px; flex-wrap: wrap; }

.emp-toolbar-form{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.emp-toolbar-form .input-group{
  width: min(420px, 100%);
}
.emp-toolbar-form .form-select{
  width: auto;
  min-width: 170px;
}

/* Polished SaaS filter row */
.emp-page-toolbar{
  padding: 14px;
}
.emp-toolbar-grid{
  row-gap: 10px;
}
.emp-toolbar-form .input-group{
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(2,6,23,.06);
}
.emp-toolbar-form .input-group-text{
  border: 1px solid rgba(15,23,42,.10) !important;
  border-right: 0 !important;
  background: #fff !important;
  color: #64748b;
  padding: 10px 12px;
}
.emp-toolbar-form .input-group .form-control{
  border: 1px solid rgba(15,23,42,.10) !important;
  border-left: 0 !important;
  padding: 10px 12px;
  height: 42px;
}
.emp-toolbar-form .form-select{
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.10) !important;
  background-color: #fff;
  padding: 10px 12px;
  box-shadow: 0 10px 25px rgba(2,6,23,.06);
}
.emp-toolbar-form .btn{
  height: 42px;
  border-radius: 14px !important;
  padding: 10px 14px !important;
  font-weight: 800 !important;
  box-shadow: 0 10px 25px rgba(2,6,23,.06);
}
.emp-toolbar-form .btn-outline-primary{
  border-color: rgba(79,70,229,.25) !important;
}
.emp-toolbar-form .btn-outline-primary:hover{
  background: rgba(79,70,229,.08) !important;
}
.emp-toolbar-extra{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
}

@media (max-width: 782px){
  .emp-toolbar-form .input-group{ width: 100%; }
  .emp-toolbar-form .form-select{ min-width: 140px; flex: 1 1 auto; }
  .emp-toolbar-form .btn{ width: 100%; justify-content:center; }
}

/* Desktop: keep everything in one row (no wrap) */
@media (min-width: 783px){
  .emp-toolbar-grid{ flex-wrap: nowrap; }
  .emp-toolbar-left{ flex: 0 0 auto; }
  .emp-toolbar-right{ flex: 1 1 auto; justify-content: flex-end; }
  .emp-toolbar-form{ flex-wrap: nowrap; }
  .emp-toolbar-form .input-group{ width: 360px; }
  .emp-toolbar-form .form-select{ min-width: 160px; }
}

.emp-chipset{ display:flex; gap: 8px; flex-wrap: wrap; }
.emp-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: #fff;
  color: #0f172a;
  text-decoration:none;
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 8px 22px rgba(2,6,23,.06);
}
.emp-chip:hover{ transform: translateY(-1px); box-shadow: 0 12px 26px rgba(2,6,23,.10); }
.emp-chip.is-active{
  background: var(--emp-primary-ring);
  border-color: rgba(79,70,229,.18);
  color: #3730a3;
}

:root{
  --emp-bg: #F7F8FA;
  --emp-card: #FFFFFF;
  --emp-text: #111827;
  --emp-muted: #6B7280;
  --emp-border: #E5E7EB;

  --emp-primary: #5B5FEF;
  --emp-primary-hover: #4A4FD8;
  --emp-primary-ring: #EEF2FF;

  --emp-success-bg:#D1FAE5;
  --emp-success:#059669;
  --emp-danger-bg:#FEE2E2;
  --emp-danger:#DC2626;

  --emp-radius: 16px;
  --emp-radius-sm: 12px;

  --emp-shadow: 0 2px 8px rgba(0,0,0,0.04);
  --emp-shadow-hover: 0 8px 24px rgba(0,0,0,0.08);
}

/* =========================
   EMP Toasts (global)
========================= */
#empToastStack{
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 100000;
  display: grid;
  gap: 10px;
  max-width: min(420px, calc(100vw - 24px));
}
@media (max-width: 782px){
  #empToastStack{ left: 12px; right: 12px; bottom: 12px; max-width: none; }
}
.emp-toast{
  background: #fff;
  border: 1px solid rgba(15, 23, 42, .10);
  border-radius: 16px;
  padding: 12px 14px;
  box-shadow: 0 16px 40px rgba(2, 6, 23, .14);
  color: #0f172a;
  transform: translateY(10px);
  opacity: 0;
  transition: transform .18s ease, opacity .18s ease;
  position: relative;
  overflow: hidden;
}
.emp-toast.is-in{ transform: translateY(0); opacity: 1; }
.emp-toast.is-leaving{ transform: translateY(10px); opacity: 0; }
.emp-toast::before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width: 6px;
  background: #64748b;
}
.emp-toast-title{ font-weight: 800; margin-bottom: 2px; }
.emp-toast-msg{ color:#334155; font-size: 13px; line-height: 1.35; padding-right: 28px; }
.emp-toast-x{
  position:absolute;
  top: 8px;
  right: 10px;
  border: 0;
  background: transparent;
  color: #64748b;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}
.emp-toast-success::before{ background:#16a34a; }
.emp-toast-error::before{ background:#ef4444; }
.emp-toast-warn::before{ background:#f59e0b; }
.emp-toast-info::before{ background:#4f46e5; }

/* =========================
   EMP Admin Alerts (PHP-rendered)
========================= */
.emp-alert{
  margin: 8px 0;
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 13px;
}
.emp-alert-success{
  background:#ecfdf3;
  border:1px solid #bbf7d0;
  color:#065f46;
}
.emp-alert-error{
  background:#fef2f2;
  border:1px solid #fecaca;
  color:#b91c1c;
}
.emp-alert-warning{
  background:#fffbeb;
  border:1px solid #fcd34d;
  color:#92400e;
}
.emp-alert-info{
  background:#eff6ff;
  border:1px solid #bfdbfe;
  color:#1d4ed8;
}

/* =========================
   EMP Front Alerts
========================= */
.emp-front-alert{
  margin: 10px 0;
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 14px;
  display:flex;
  align-items:flex-start;
  gap:8px;
}
.emp-front-alert-success{
  background:#ecfdf3;
  border:1px solid #bbf7d0;
  color:#065f46;
}
.emp-front-alert-error{
  background:#fef2f2;
  border:1px solid #fecaca;
  color:#b91c1c;
}
.emp-front-alert-warning{
  background:#fffbeb;
  border:1px solid #fcd34d;
  color:#92400e;
}
.emp-front-alert-info{
  background:#eff6ff;
  border:1px solid #bfdbfe;
  color:#1d4ed8;
}

/* HERO FIX */
.emp-ticket-hero{
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  min-height: clamp(200px, 28vw, 320px);
  background: #1f2937;
}

.emp-ticket-hero > img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.emp-ticket-overlay{
  position: relative;
  z-index: 2;
  padding: 16px;
  color: #fff;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,.45) 0%,
    rgba(0,0,0,.20) 45%,
    rgba(0,0,0,.55) 100%
  );
}

/* =========================
   Icon Buttons (Calendar)
========================= */
.emp-calendar-actions{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.emp-icon-btn{
  width: 40px;
  height: 40px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(0,0,0,.08);
}

.emp-icon-btn .dashicons{
  font-size: 18px;
}

.emp-icon-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(0,0,0,.12);
}

.emp-icon-btn.emp-google{ color:#0d6efd; }
.emp-icon-btn.emp-outlook{ color:#6c757d; }
.emp-icon-btn.emp-ics{ color:#198754; }

/* Mobile tweaks */
@media (max-width: 480px){
  .emp-icon-btn{ width:36px;height:36px; }
  .emp-icon-btn .dashicons{ font-size:16px; }
}


      /* =========================
   HERO (admin) - ordenado tipo "event details"
========================= */

.emp-ticket-hero{
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  background: #0f172a;
  min-height: 240px;
}

.emp-ticket-hero > img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* overlay limpio + blur sutil */
.emp-ticket-overlay{
  position: relative;
  z-index: 2;
  min-height: inherit;
  padding: 16px;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 10px;
  background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.25) 45%, rgba(0,0,0,.72) 100%);
}

/* bloque superior (título + fecha) */
.emp-ticket-overlay > .d-flex.justify-content-between{
  gap: 10px !important;
  align-items: flex-end !important;
}

/* título */
.emp-ticket-overlay h2{
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1.15 !important;
  letter-spacing: -0.2px;
  text-shadow: 0 10px 25px rgba(0,0,0,.35);
}

/* “Evento” más discreto */
.emp-ticket-overlay .text-white-50{
  opacity: .75;
}

/* ubicación/online: más compacto */
.emp-ticket-overlay .small{
  color: rgba(255,255,255,.88) !important;
}

/* ===== Fecha: conviértela en pill elegante (el div .text-end) ===== */
.emp-ticket-overlay > .d-flex.justify-content-between .text-end{
  margin-left: auto;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  text-shadow: 0 10px 25px rgba(0,0,0,.30);
}

/* Quita el look “columna derecha” */
.emp-ticket-overlay > .d-flex.justify-content-between .text-end .small.text-white-50{
  margin-bottom: 2px;
}

/* chips: fila ordenada */
.emp-ticket-overlay .mt-2.d-flex.flex-wrap{
  gap: 8px !important;
  margin-top: 6px !important;
}

/* chips estilo consistente */
.emp-ticket-overlay .badge.emp-pill{
  border-radius: 999px !important;
  padding: .38rem .6rem !important;
  font-weight: 600;
  letter-spacing: .1px;
  border: 1px solid rgba(255,255,255,.14);
}

/* ===== Mobile: layout tipo “tarjeta” ordenada ===== */
@media (max-width: 576px){

  .emp-ticket-hero{
    min-height: 270px;
  }

  /* apila todo (como tu ejemplo) */
  .emp-ticket-overlay > .d-flex.justify-content-between{
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  /* la fecha pasa abajo como pill full-width */
  .emp-ticket-overlay > .d-flex.justify-content-between .text-end{
    width: 100%;
    text-align: left !important;
    margin-left: 0 !important;
  }

  /* la etiqueta “Fecha” se puede ocultar para evitar ruido */
  .emp-ticket-overlay > .d-flex.justify-content-between .text-end .small.text-white-50{
    display: none;
  }

  /* título un poco más grande */
  .emp-ticket-overlay h2{
    font-size: 20px !important;
  }

  /* chips en 2 líneas bonitas */
  .emp-ticket-overlay .badge.emp-pill{
    font-size: 12px !important;
    padding: .34rem .55rem !important;
  }
}


        .emp-evento-layout{
            background:#f5f7fb;
        }
        .emp-card-soft{
            border:0;
            border-radius:1rem;
            box-shadow:0 .25rem 1rem rgba(15,23,42,.08);
            background:#fff;
        }
        .emp-section-title{
            font-weight:600;
            font-size:.9rem;
            text-transform:uppercase;
            letter-spacing:.04em;
            color:#6b7280;
        }
        .emp-pill{
            border-radius:999px;
            padding:.1rem .6rem;
            font-size:.75rem;
        }
        .emp-kpi-value{
            font-size:1.4rem;
            font-weight:700;
        }
        .emp-kpi-label{
            font-size:.8rem;
            color:#6b7280;
        }


        /* Grid general */
        .emp-detail-grid{
            margin-top:.75rem;
        }
        .emp-detail-main > .emp-block{
            margin-bottom:1rem;
        }

        /* Nav lateral */
        .emp-side-nav-list a{
            display:flex;
            align-items:center;
            gap:.4rem;
            font-size:.85rem;
            padding:.45rem .75rem;
            border-radius:999px;
            color:#4b5563;
            text-decoration:none;
            background:#eef2ff;
            margin-bottom:.35rem;
            transition:all .15s ease;
        }
        .emp-side-nav-list a span.icon{
            font-size:1rem;
        }
        .emp-side-nav-list a:hover{
            background:#4f46e5;
            color:#fff;
        }
        .emp-side-nav-list a:first-child{
            background:#4f46e5;
            color:#fff;
        }

        @media (max-width:992px){
            .emp-ticket-overlay{
                padding:1rem;
            }
        }
        @media (max-width:768px){
            .emp-side-nav{
                margin-top:1rem;
            }
            .emp-side-nav-list{
                display:flex;
                flex-wrap:wrap;
                gap:.4rem;
            }
            .emp-side-nav-list a{
                margin-bottom:0;
            }
        }

        /* Venue mitad / mitad */
        .emp-venue-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            min-height: 250px;
            background: #f9f9ff;
        }
        @media(max-width:768px){
            .emp-venue-grid {
                grid-template-columns: 1fr;
                height:auto;
            }
        }
        .emp-venue-left {
            position: relative;
            overflow: hidden;
        }
        .emp-venue-bg {
            position: absolute;
            inset: 0;
            background-size: cover;
            background-position: center;
            filter: blur(6px) brightness(0.8);
            transform: scale(1.1);
        }
        .emp-venue-overlay {
            position: relative;
            z-index: 2;
            color: #fff;
            height: 100%;
            padding: 18px 20px;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.55));
        }
        .emp-venue-chip {
            font-size: .7rem;
            padding: 4px 10px;
            border-radius: 999px;
            background: rgba(255,255,255,0.25);
            backdrop-filter: blur(3px);
            width: fit-content;
        }
        .emp-venue-title {
            font-size: 1rem;
            font-weight: 700;
        }
        .emp-venue-sub {
            opacity: .85;
        }
        .emp-venue-contact div {
            line-height: 1.35;
        }
        .emp-venue-right {
            height: 100%;
            min-height: 250px;
        }
        .emp-venue-right iframe {
            width: 100%;
            height: 100%;
            display: block;
            border: 0;
        }

        .emp-sections-nav .emp-section-pill{
    display:flex;
    align-items:center;
    padding:.55rem .85rem;
    border-radius:999px;
    background:#f4f6ff;
    color:#111827;
    text-decoration:none;
    font-size:.875rem;
    transition:all .15s ease;
}
.emp-calendar-actions {
  justify-content: flex-start;
}

.emp-icon-btn {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e5e7eb;
  background: #fff;
  text-decoration: none;
  transition: all .2s ease;
  box-shadow: 0 4px 10px rgba(0,0,0,.06);
}

.emp-icon-btn .dashicons {
  font-size: 18px;
  line-height: 1;
}

/* Colores */
.emp-icon-btn.emp-google   { color: #1a73e8; }
.emp-icon-btn.emp-outlook  { color: #0078d4; }
.emp-icon-btn.emp-ics      { color: #16a34a; }

/* Hover */
.emp-icon-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0,0,0,.12);
}

/* Mobile tweak */
@media (max-width: 576px) {
  .emp-icon-btn {
    width: 38px;
    height: 38px;
  }
  .emp-icon-btn .dashicons {
    font-size: 16px;
  }
}
.emp-sections-nav .emp-section-pill:hover{
    background:#4f46e5;
    color:#fff;
}

.emp-sections-nav .emp-pill-icon{
    width:26px;
    height:26px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,.8);
    font-size:.9rem;
}

/* Variante peligrosa para eliminar */
.emp-section-pill.emp-action-danger{
    background:#fef2f2;
    color:#b91c1c;
}
.emp-section-pill.emp-action-danger:hover{
    background:#dc2626;
    color:#fff;
}

/* Solo UI del plugin */
.emp-card-soft{
  background: rgba(255,255,255,.6);
  border: 1px solid rgba(15,23,42,.06);
  box-shadow: 0 10px 30px rgba(2,6,23,.06);
}

.emp-pagination ul{
  margin:0;
  padding:0;
  display:flex;
  gap:8px;
  list-style:none;
}
.emp-pagination a,
.emp-pagination span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:999px;
  text-decoration:none;
  border:1px solid rgba(15,23,42,.10);
  background:#fff;
  color:#0f172a;
  font-weight:700;
}
.emp-pagination .current{
  background:#0d6efd;
  border-color:#0d6efd;
  color:#fff;
}

/* =========================
   EMP - Beneficios (skin light)
   ========================= */
.wrap .container-fluid {
  color: #0f172a;
}

/* Tipografía ligera (sin romper WP) */
.wrap h1, .wrap h2, .wrap h3,
.wrap .btn, .wrap .badge, .wrap .form-control {
  font-weight: 500;
}

.emp-card-soft{
  background: #f7f7fb;
  border: 1px solid rgba(15, 23, 42, .06);
  box-shadow: none;
}

/* Cards */
.emp-card-soft > .bg-white {
  background: #fff !important;
  border: 1px solid rgba(15, 23, 42, .06);
  box-shadow: 0 10px 25px rgba(2, 6, 23, .06) !important;
}

/* Badge tipo “pill” suave */
.badge.bg-light.text-primary{
  background: rgba(13,110,253,.08) !important;
  color: #0d6efd !important;
  font-weight: 600 !important;
}

/* Botones menos “pesados” */
.btn{
  border-width: 1px !important;
  font-weight: 600 !important;
}

.btn-outline-primary,
.btn-outline-danger{
  background: #fff;
}

/* Input estilo “Ventixe” */
.input-group-text,
.form-control{
  border-color: rgba(15, 23, 42, .12) !important;
  box-shadow: none !important;
}
.form-control:focus{
  border-color: rgba(13,110,253,.45) !important;
  box-shadow: 0 0 0 .2rem rgba(13,110,253,.10) !important;
}

/* Píldora “en catálogo” */
.emp-pill{
  background: rgba(15,23,42,.04);
  border: 1px solid rgba(15,23,42,.06);
  border-radius: 14px;
  font-weight: 600;
}

/* ============================
   EMP Dashboard Tokens (vanilla CSS)
   Basado en tu export de Figma/shadcn
   ============================ */
.emp-home-wrap{
  --emp-font-size: 16px;
  --emp-bg: #ffffff;
  --emp-fg: #0a0a0a; /* fallback simple */
  --emp-card: #ffffff;
  --emp-border: rgba(0,0,0,.10);

  --emp-muted: #ececf0;
  --emp-muted-fg: #717182;

  --emp-accent: #e9ebef;
  --emp-primary: #030213;

  --emp-input-bg: #f3f3f5;

  --emp-radius: 0.625rem; /* 10px */
  --emp-radius-sm: calc(var(--emp-radius) - 4px);
  --emp-radius-md: calc(var(--emp-radius) - 2px);
  --emp-radius-lg: var(--emp-radius);
  --emp-radius-xl: calc(var(--emp-radius) + 4px);

  --emp-shadow-sm: 0 8px 18px rgba(16,24,40,.06);
  --emp-shadow-md: 0 16px 30px rgba(16,24,40,.10);

  /* colores para banner (ajústalos si quieres tu morado actual) */
  --emp-grad-a: #5b5ce6;
  --emp-grad-b: #6e56cf;

  font-size: var(--emp-font-size);
}

/* Tipografía/legibilidad dentro del dashboard */
.emp-home-wrap .emp-home{
  color: var(--emp-fg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Títulos y muted */
.emp-home-wrap .text-muted,
.emp-home-wrap .emp-muted{
  color: var(--emp-muted-fg) !important;
}

/* ============================
   KPI cards
   ============================ */
.emp-home-wrap .emp-kpi-card{
  background: var(--emp-card);
  border: 1px solid var(--emp-border);
  border-radius: 14px;
  padding: 14px 14px;
  display:flex;
  gap:12px;
  align-items:center;
  box-shadow: var(--emp-shadow-sm);
}

.emp-home-wrap .emp-kpi-icon{
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: color-mix(in srgb, var(--emp-muted) 70%, #fff 30%);
  font-size: 18px;
}

.emp-home-wrap .emp-kpi-label{
  font-size: 12px;
  color: var(--emp-muted-fg);
}

.emp-home-wrap .emp-kpi-value{
  font-size: 22px;
  color: #101828;
  line-height: 1.1;
}

/* ============================
   Action cards
   ============================ */
.emp-home-wrap .emp-action-card{
  background: var(--emp-card);
  border: 1px solid var(--emp-border);
  border-radius: 16px;
  padding: 16px;
  box-shadow: var(--emp-shadow-sm);
}

.emp-home-wrap .emp-action-top{
  display:flex;
  gap:12px;
  align-items:flex-start;
  margin-bottom: 12px;
}

.emp-home-wrap .emp-action-icon{
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: color-mix(in srgb, var(--emp-accent) 55%, #fff 45%);
  font-size: 18px;
}

.emp-home-wrap .emp-action-title{
  color: #101828;
}

.emp-home-wrap .emp-action-desc{
  font-size: 12px;
  color: var(--emp-muted-fg);
  margin-top: 2px;
}

.emp-home-wrap .emp-action-links{
  display:flex;
  flex-direction:column;
  gap: 6px;
}

.emp-home-wrap .emp-action-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size: 13px;
  text-decoration:none;
  color: #334155;
}

.emp-home-wrap .emp-action-link:hover{
  text-decoration: underline;
}

/* ============================
   Event detail – Acciones rápidas
   (evita que los links se salgan del card en escritorio)
============================ */
.emp-event-detail .emp-actions-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.emp-event-detail .emp-action-card{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid #e5e7eb;
  background:#ffffff;
  text-decoration:none;
  color:#111827;
  width:100%;
  box-sizing:border-box;
}

.emp-event-detail .emp-action-card .emp-action-ico{
  width:32px;
  height:32px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#f3f4ff;
}

.emp-event-detail .emp-action-card.is-danger{
  border-color:#fecaca;
  color:#b91c1c;
  background:#fef2f2;
}

@media (max-width: 782px){
  .emp-event-detail .emp-actions-card .emp-actions-list{
    gap:6px;
  }
}

/* ============================
   Banner QR (gradiente)
   ============================ */
.emp-home-wrap .emp-qr-banner{
  position:relative;
  overflow:hidden;
  border-radius: 18px;
  padding: 18px;
  background: linear-gradient(135deg, var(--emp-grad-a), var(--emp-grad-b));
  color: #fff;
  box-shadow: 0 16px 30px rgba(91,92,230,.20);
}

.emp-home-wrap .emp-qr-left{
  display:flex;
  gap:14px;
  align-items:center;
  position:relative;
  z-index: 2;
}

.emp-home-wrap .emp-qr-icon{
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.15);
  font-size: 20px;
}

.emp-home-wrap .emp-qr-title{
  font-weight: 900;
  font-size: 16px;
}

.emp-home-wrap .emp-qr-desc{
  opacity: .9;
  font-size: 13px;
}

.emp-home-wrap .emp-qr-bg{
  position:absolute;
  right:-10px;
  top:-10px;
  font-size: 140px;
  opacity: .12;
  transform: rotate(12deg);
  z-index: 1;
  user-select:none;
}

/* ============================
   Mini settings
   ============================ */
.emp-home-wrap .emp-mini-setting{
  background: var(--emp-card);
  border: 1px solid var(--emp-border);
  border-radius: 14px;
  padding: 12px 14px;
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color: inherit;
  box-shadow: var(--emp-shadow-sm);
}

.emp-home-wrap .emp-mini-ic{
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: color-mix(in srgb, var(--emp-muted) 70%, #fff 30%);
}

.emp-home-wrap .emp-mini-title{
  color: #101828;
  font-size: 13px;
}

.emp-home-wrap .emp-mini-desc{
  color: var(--emp-muted-fg);
  font-size: 12px;
}

.emp-home-wrap .emp-mini-arrow{
  margin-left:auto;
  color: var(--emp-muted-fg);
}

/* Responsive */
@media (max-width: 575.98px){
  .emp-home-wrap .emp-kpi-value{ font-size: 20px; }
}

/* =========================================================
   EMP - Eventos SaaS UI (Cards/Lista/Calendario + Bottomsheet)
   v2 FIX: header + filtros en fila + evita conflictos con otros estilos
========================================================= */

/* 🔒 Scope: todo lo de eventos vive dentro de .emp-saas-page */
.emp-saas-page{
  background:#f5f7fb;
}
.emp-saas-page .emp-saas-box{
  /* Full width within admin content (no max-width cap) */
  margin: 0;
}
.emp-saas-page .emp-saas-surface{
  background:#fff;
  border:1px solid #eef0f4;
  border-radius:18px;
  box-shadow:0 10px 22px rgba(16,24,40,.04);
}
.emp-saas-page .emp-saas-surface.emp-empty{
  padding:48px 24px;
  text-align:center;
}
.emp-saas-page .emp-empty-ico{
  width:72px;height:72px;
  border-radius:999px;
  background:linear-gradient(135deg,#eef2ff,#e0e7ff);
  margin:0 auto 16px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:32px;
}
.emp-saas-page .emp-empty-title{margin:0 0 8px;font-size:20px;font-weight:600;color:var(--emp-text,#111827);}
.emp-saas-page .emp-empty-sub{margin:0 0 20px;font-size:15px;color:var(--emp-muted,#6b7280);line-height:1.5;}
.emp-saas-page .emp-empty .emp-btn-lg{padding:.7rem 1.2rem;font-size:15px;border-radius:14px;}

/* Back */
.emp-saas-page .emp-saas-back{margin-bottom:12px;}
.emp-saas-page .emp-saas-backlink{
  display:inline-flex;align-items:center;gap:8px;
  text-decoration:none;color:#6b7280;font-size:13px;
}
.emp-saas-page .emp-saas-backicon{font-size:18px;line-height:0;}

/* =========================
   HEADER / TOPBAR (Figma)
========================= */
.emp-saas-page .emp-events-head{padding:16px 18px;}
.emp-saas-page .emp-events-head-top{
  display:flex;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  align-items:center; /* ✅ clave para que no se “rompa” */
}

.emp-saas-page .emp-events-title-row{
  display:flex;align-items:center;gap:10px;
}
.emp-saas-page .emp-events-emoji{font-size:18px;opacity:.9;}
.emp-saas-page .emp-events-title{
  margin:0;
  font-size:20px;
  font-weight:800;
  color:#111827;
  line-height:1.15;
}
.emp-saas-page .emp-events-sub{
  color:#6b7280;
  font-size:12px;
  margin-top:2px;
}

.emp-saas-page .emp-events-head-right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}

/* Badge contador */
.emp-saas-page .emp-pill{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  border-radius:999px;
  padding:.35rem .75rem;
  font-size:12px;
  font-weight:700;
  background:rgba(79,70,229,.10);
  color:#4f46e5;
  border:1px solid rgba(79,70,229,.18);
  white-space:nowrap;
}

/* Tabs */
.emp-saas-page .emp-view-tabs{
  display:inline-flex;
  gap:6px;
  background:#f3f4f6;
  border-radius:999px;
  padding:4px;
  border:1px solid #e5e7eb;
}
.emp-saas-page .emp-tab{
  text-decoration:none;
  font-size:12px;
  font-weight:700;
  padding:.45rem .8rem;
  border-radius:999px;
  color:#6b7280;
  display:inline-flex;
  align-items:center;
  gap:8px;
  line-height:1;
}
.emp-saas-page .emp-tab.is-active{
  background:#4f46e5;
  color:#fff;
  box-shadow:0 10px 22px rgba(79,70,229,.20);
}

/* Botón primary estilo Figma (sin pelear con .btn global) */
.emp-saas-page .emp-btn-primary{
  border-radius:999px;
  padding:.55rem 1rem;
  background:#2563eb;
  color:#fff;
  text-decoration:none;
  border:0;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  gap:10px;
  white-space:nowrap;
}
.emp-saas-page .emp-btn-primary:hover{filter:brightness(.96);}

/* =========================
   FILTROS DESKTOP (en fila)
========================= */
.emp-saas-page .emp-events-filters-shell{
  margin-top:12px;
  border-top:1px solid #eef0f4;
  padding-top:12px;
}
.emp-saas-page .emp-events-filters-row{
  display:grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr; /* ✅ sin “auto” para que no se caiga */
  gap:10px;
  align-items:center;
}

/* Campo input/select */
.emp-saas-page .emp-inp{
  height:44px;
  display:flex;
  align-items:center;
  background:#fff;
  border:1px solid rgba(15,23,42,.12);
  border-radius:14px;
  padding:0 12px;
  font-size:13px;
  box-shadow:none;
}
.emp-saas-page .emp-inp:focus-within{
  outline:none;
  box-shadow:0 0 0 .2rem rgba(79,70,229,.12);
  border-color:#c7d2fe;
}
.emp-saas-page .emp-inp input{
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  box-shadow:none;
}
.emp-saas-page .emp-inp select{
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  box-shadow:none;
  height:42px;
}

/* Search icon */
.emp-saas-page .emp-search{gap:10px;min-width:220px;}
.emp-saas-page .emp-ic{opacity:.7;}

/* Helpers */
.emp-saas-page .emp-only-mobile{display:none;}
.emp-saas-page .emp-only-desktop{display:block;}

/* =========================
   MOBILE (search + Filtrar + chips)
========================= */
@media (max-width: 768px){
  .emp-saas-page .emp-only-mobile{display:block;}
  .emp-saas-page .emp-only-desktop{display:none;}
  .emp-saas-page .emp-events-filters-shell{border-top:0;padding-top:10px;}
}

.emp-saas-page .emp-events-filters-mobile{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.emp-saas-page .emp-btn-filter{
  height:44px;
  border-radius:14px;
  border:1px solid rgba(15,23,42,.12);
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:#111827;
  font-weight:800;
}
.emp-saas-page .emp-filter-ic{opacity:.75;}

.emp-saas-page .emp-filter-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:2px;
}
.emp-saas-page .emp-chip-x{
  text-decoration:none;
  border-radius:999px;
  padding:.38rem .65rem;
  font-size:12px;
  font-weight:700;
  background:rgba(79,70,229,.10);
  color:#4f46e5;
  border:1px solid rgba(79,70,229,.18);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.emp-saas-page .emp-chip-x span{opacity:.7;}
.emp-saas-page .emp-chip-clear{
  text-decoration:none;
  border-radius:999px;
  padding:.38rem .65rem;
  font-size:12px;
  font-weight:800;
  border:1px dashed #c7d2fe;
  color:#4f46e5;
  background:#fff;
}

/* =======================
   TITULO DE MES
======================= */
.emp-saas-page .emp-month-title{
  color:#6b7280;
  font-size:12px;
  margin:18px 0 10px;
  font-weight:800;
  letter-spacing:.02em;
}

/* =======================
   CARDS (Figma style)
======================= */
.emp-saas-page .emp-cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
@media(max-width: 992px){.emp-saas-page .emp-cards-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width: 520px){.emp-saas-page .emp-cards-grid{grid-template-columns:1fr;gap:10px;} }

.emp-saas-page .emp-card-saas{
  background:#fff;border:1px solid #eef0f4;border-radius:16px;
  box-shadow:0 10px 22px rgba(16,24,40,.04);
  overflow:hidden;
}
.emp-saas-page .emp-card-cover{position:relative;height:140px;background:#e5e7eb;}
.emp-saas-page .emp-card-cover img{width:100%;height:100%;object-fit:cover;display:block;}
.emp-saas-page .emp-card-badges{position:absolute;left:10px;top:10px;display:flex;gap:8px;flex-wrap:wrap;}
.emp-saas-page .emp-card-ribbon{
  position:absolute;left:10px;bottom:10px;
  border-radius:999px;padding:.25rem .6rem;font-size:12px;font-weight:800;
  background:#111827;color:#fff;
}
.emp-saas-page .emp-card-ribbon.is-draft{background:#f59e0b;}
.emp-saas-page .emp-card-ribbon.is-finished{background:#6b7280;}
.emp-saas-page .emp-card-ribbon.is-full{background:#ef4444;}

.emp-saas-page .emp-card-body{padding:12px;}
.emp-saas-page .emp-card-title{font-size:14px;margin:0 0 6px;line-height:1.25;font-weight:600;}
.emp-saas-page .emp-card-title a{text-decoration:none;color:#111827;}
.emp-saas-page .emp-card-meta{font-size:12px;color:#6b7280;display:flex;flex-direction:column;gap:4px;margin-bottom:10px;}
.emp-saas-page .emp-card-price-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;}
.emp-saas-page .emp-card-price{font-size:16px;color:#111827;}
.emp-saas-page .emp-card-cap{font-size:12px;color:#6b7280;}

.emp-saas-page .emp-card-actions-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.emp-saas-page .emp-btn-card{
  border-radius:12px;
  padding:.45rem .85rem;
  
  text-decoration:none;
}
.emp-saas-page .emp-icon{
  width:36px;height:36px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid #e5e7eb;background:#fff;color:#6b7280;text-decoration:none;
}
.emp-saas-page .emp-icon:hover{border-color:#c7d2fe;color:#4f46e5;}
.emp-saas-page .emp-danger:hover{border-color:#fecaca;color:#ef4444;}

/* Badges */
.emp-saas-page .emp-badge{border-radius:999px;padding:.25rem .6rem;font-size:12px;border:1px solid transparent;display:inline-flex;align-items:center;gap:6px;font-weight:600;}
.emp-saas-page .emp-badge-green{background:#e7f7ee;color:#0f7a3f;border-color:rgba(15,122,63,.12);}
.emp-saas-page .emp-badge-blue{background:#eef2ff;color:#4f46e5;border-color:rgba(79,70,229,.15);}
.emp-saas-page .emp-badge-gray{background:#f3f4f6;color:#374151;border-color:#e5e7eb;}
.emp-saas-page .emp-badge-danger{background:#fee2e2;color:#b91c1c;border-color:rgba(185,28,28,.12);}

.emp-saas-page .emp-badge-status{background:#f3f4f6;color:#374151;border-color:#e5e7eb;}
.emp-saas-page .emp-badge-status.is-proximo{background:#eef2ff;color:#4f46e5;border-color:rgba(79,70,229,.12);}
.emp-saas-page .emp-badge-status.is-finalizado{background:#f3f4f6;color:#6b7280;}
.emp-saas-page .emp-badge-status.is-borrador{background:#ffedd5;color:#9a3412;border-color:rgba(154,52,18,.12);}

/* Ocupación */
.emp-saas-page .emp-card-ocup{margin-top:6px;}
.emp-saas-page .emp-ocup-label{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#6b7280;margin-bottom:6px;font-weight:600;}
.emp-saas-page .emp-ocup-bar{height:6px;border-radius:999px;background:#e5e7eb;overflow:hidden;}
.emp-saas-page .emp-ocup-bar span{display:block;height:100%;border-radius:999px;width:0%;}
.emp-saas-page .emp-ocup-bar.is-green span{background:#22c55e;}
.emp-saas-page .emp-ocup-bar.is-orange span{background:#f59e0b;}
.emp-saas-page .emp-ocup-bar.is-red span{background:#ef4444;}

/* =======================
   LISTA (SaaS row)
======================= */
.emp-saas-page .emp-list-row{
  display:grid;grid-template-columns:28px 56px 1fr 420px;
  gap:14px;align-items:center;
  padding:16px;border-radius:18px;background:#fff;border:1px solid #eef0f4;
  box-shadow:0 10px 22px rgba(16,24,40,.04);
  margin-bottom:12px;
}
.emp-saas-page .emp-list-chk input{width:16px;height:16px;accent-color:#5B5FEF;cursor:pointer;}
.emp-saas-page .emp-list-avatar{
  width:44px;height:44px;border-radius:14px;background:#4f46e5;color:#fff;
  display:flex;align-items:center;justify-content:center;
}
.emp-saas-page .emp-list-main{min-width:0;}
.emp-saas-page .emp-list-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px;}
.emp-saas-page .emp-list-title{font-size:14px;line-height:1.2;margin-bottom:6px;}
.emp-saas-page .emp-list-title a{text-decoration:none;color:#111827;}
.emp-saas-page .emp-list-meta{font-size:12px;color:#6b7280;display:flex;flex-wrap:wrap;gap:10px;font-weight:700;}
.emp-saas-page .emp-list-right{display:flex;align-items:center;justify-content:flex-end;gap:14px;flex-wrap:wrap;}
.emp-saas-page .emp-list-price{text-align:right;min-width:120px;font-size:14px;color:#111827;}
.emp-saas-page .emp-list-price small{display:block;font-weight:600;color:#9ca3af;font-size:11px;margin-top:-2px;}
.emp-saas-page .emp-list-ocup{min-width:220px;}
.emp-saas-page .emp-ocup-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#6b7280;font-weight:600;}
.emp-saas-page .emp-ocup-foot{font-size:11px;color:#6b7280;margin-top:6px;font-weight:700;}
.emp-saas-page .emp-list-actions{display:flex;gap:8px;align-items:center;justify-content:flex-end;}

@media(max-width: 992px){
  .emp-saas-page .emp-list-row{grid-template-columns:28px 56px 1fr;grid-template-areas:"chk av main" "chk right right";}
  .emp-saas-page .emp-list-chk{grid-area:chk;align-self:start;margin-top:6px;}
  .emp-saas-page .emp-list-avatar{grid-area:av;}
  .emp-saas-page .emp-list-main{grid-area:main;}
  .emp-saas-page .emp-list-right{grid-area:right;justify-content:space-between;}
  .emp-saas-page .emp-list-actions{justify-content:flex-start;}
}

/* =======================
   Bottom sheet (mobile)
======================= */
.emp-saas-page .emp-bottomsheet{position:fixed;inset:0;display:none;z-index:99999;}
.emp-saas-page .emp-bottomsheet.is-open{display:block;}
.emp-saas-page .emp-bottomsheet__backdrop{position:absolute;inset:0;background:rgba(17,24,39,.45);}
.emp-saas-page .emp-bottomsheet__panel{
  position:absolute;left:0;right:0;bottom:0;
  background:#fff;border-radius:18px 18px 0 0;
  padding:10px 14px 14px;
  box-shadow:0 -12px 30px rgba(16,24,40,.18);
  max-height:78vh;overflow:auto;
}
.emp-saas-page .emp-bottomsheet__grab{width:54px;height:5px;border-radius:999px;background:#e5e7eb;margin:6px auto 10px;}
.emp-saas-page .emp-bottomsheet__head{display:flex;align-items:center;justify-content:space-between;padding:6px 2px 10px;border-bottom:1px solid #eef0f4;}
.emp-saas-page .emp-bottomsheet__title{color:#111827;}
.emp-saas-page .emp-bottomsheet__close{border:0;background:transparent;font-size:22px;line-height:1;color:#6b7280;}
.emp-saas-page .emp-bottomsheet__form{display:flex;flex-direction:column;gap:10px;padding-top:10px;}
.emp-saas-page .emp-bs-label{font-size:12px;color:#6b7280;margin-top:6px;font-weight:600;}
.emp-saas-page .emp-bs-apply{border-radius:14px;padding:.65rem 1rem;}
.emp-saas-page .emp-bs-cancel{border-radius:14px;padding:.65rem 1rem;border:1px solid #e5e7eb;}

/* =======================
   Calendar (month)
======================= */
.emp-saas-page .emp-cal-surface{padding:14px;}
.emp-saas-page .emp-cal-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.emp-saas-page .emp-cal-tabs{display:flex;gap:10px;align-items:center;}
.emp-saas-page .emp-cal-pill{border-radius:999px;padding:.4rem .8rem;font-size:12px;background:#f3f4f6;color:#6b7280;border:1px solid #e5e7eb;}
.emp-saas-page .emp-cal-pill.is-active{background:#4f46e5;color:#fff;border-color:#4f46e5;}
.emp-saas-page .emp-cal-nav{display:flex;align-items:center;gap:10px;}
.emp-saas-page .emp-cal-btn{border-radius:999px;padding:.35rem .75rem;font-size:12px;border:1px solid #e5e7eb;background:#fff;text-decoration:none;color:#111827;}
.emp-saas-page .emp-cal-icon{width:34px;height:34px;border-radius:999px;border:1px solid #e5e7eb;background:#fff;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:#111827;}
.emp-saas-page .emp-cal-title{color:#111827;min-width:140px;text-align:center;}

.emp-saas-page .emp-cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:0;border-bottom:1px solid #eef0f4;padding-bottom:8px;margin-bottom:8px;}
.emp-saas-page .emp-cal-weekdays > div{font-size:12px;color:#6b7280;text-align:center;}

.emp-saas-page .emp-cal-days{display:grid;grid-template-columns:repeat(7,1fr);gap:0;}
.emp-saas-page .emp-cal-cell{min-height:92px;border-right:1px solid #eef0f4;border-bottom:1px solid #eef0f4;padding:8px;position:relative;}
.emp-saas-page .emp-cal-cell:nth-child(7n){border-right:0;}
.emp-saas-page .emp-cal-cell.is-empty{background:#fafafa;}
.emp-saas-page .emp-cal-cell.is-today{background:#f5f3ff;}
.emp-saas-page .emp-cal-daynum{font-size:12px;color:#111827;margin-bottom:6px;}

.emp-saas-page .emp-cal-event{
  display:flex;align-items:center;gap:6px;
  border-radius:10px;padding:6px 8px;margin-bottom:6px;
  background:rgba(79,70,229,.08);
  text-decoration:none;
}
.emp-saas-page .emp-cal-event .emp-cal-dot{width:8px;height:8px;border-radius:999px;background:var(--empCalColor, #4f46e5);}
.emp-saas-page .emp-cal-event .emp-cal-tag{font-size:10px;color:#0f7a3f;background:#e7f7ee;border-radius:999px;padding:2px 6px;}
.emp-saas-page .emp-cal-event .emp-cal-tag--recurring{color:#b45309;background:#fef3c7;}
.emp-saas-page .emp-cal-event .emp-cal-name{font-size:12px;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;}
.emp-saas-page .emp-cal-event .emp-cal-time{font-size:11px;color:#6b7280;margin-left:auto;font-weight:600;}
.emp-saas-page .emp-cal-event.is-draft{background:#ffedd5;}
.emp-saas-page .emp-cal-event.is-finished{background:#f3f4f6;}
.emp-saas-page .emp-cal-event.is-free{background:#e7f7ee;}
.emp-saas-page .emp-cal-more{font-size:11px;color:#6b7280;margin-top:2px;font-weight:600;}

@media(max-width: 768px){
  .emp-saas-page .emp-cal-cell{min-height:86px;padding:6px;}
  .emp-saas-page .emp-cal-event .emp-cal-name{max-width:90px;}
}

/* =========================================
   EMP Eventos - Mostrar botón "Filtrar" solo en móvil
   (override final)
========================================= */

/* 1) Desktop: oculta el bloque mobile completo */
@media (min-width: 769px){
  /* Si tu HTML usa estas clases (recomendado) */
  .emp-saas-page .emp-events-filters-mobile,
  .emp-saas-page .emp-only-mobile{
    display:none !important;
  }

  /* Fallback: si el botón tiene texto "Filtrar" dentro del header de eventos,
     evitamos que aparezca en desktop aunque no tenga clase correcta */
  .emp-saas-page button.emp-btn-filter,
  .emp-saas-page .emp-btn-filter{
    display:none !important;
  }

  /* Si tienes un contenedor tipo "filter-bar" */
  .emp-saas-page .emp-filterbar-mobile{
    display:none !important;
  }
}

/* 2) Móvil: oculta la fila desktop (filtros en línea) y deja solo el botón Filtrar */
@media (max-width: 768px){
  .emp-saas-page .emp-events-filters-row,
  .emp-saas-page .emp-only-desktop{
    display:none !important;
  }

  .emp-saas-page .emp-events-filters-mobile,
  .emp-saas-page .emp-only-mobile{
    display:block !important;
  }
}

/* =========================================================
   EMP Eventos - Toggle definitivo Desktop/Mobile (override final)
   (Tu markup usa: .emp-only-desktop y .emp-only-mobile)
========================================================= */

/* Base: por defecto desktop visible, mobile oculto */
.emp-saas-page .emp-only-desktop { display: block !important; }
.emp-saas-page .emp-only-mobile  { display: none !important; }

/* Desktop (>=769px): asegúrate que el botón Filtrar NO exista */
@media (min-width: 769px) {
  .emp-saas-page .emp-events-filters-mobile,
  .emp-saas-page .emp-only-mobile,
  .emp-saas-page .emp-btn-filter {
    display: none !important;
  }

  .emp-saas-page .emp-events-filters-row,
  .emp-saas-page .emp-only-desktop {
    display: grid !important; /* porque tu row es grid */
  }

  /* Ajuste: tu form tiene 5 columnas (search + 3 selects + botón) */
  .emp-saas-page .emp-events-filters-row{
    grid-template-columns: 1.6fr 1fr 1fr 1fr auto !important;
    gap: 12px !important;
    align-items: center !important;
  }

  /* Tus selects no deben tener display:flex como .emp-inp */
  .emp-saas-page select.emp-inp{
    display:block !important;
    padding: 10px 12px !important;
  }
}

/* Mobile (<=768px): ocultar fila desktop y mostrar bloque móvil */
@media (max-width: 768px) {
  .emp-saas-page .emp-events-filters-row,
  .emp-saas-page .emp-only-desktop {
    display: none !important;
  }

  .emp-saas-page .emp-events-filters-mobile,
  .emp-saas-page .emp-only-mobile {
    display: flex !important;
  }
}

/* =========================================================
   EMP Eventos - Cards Figma EXACTO (para tu markup actual)
   (usa .emp-card-saas, .emp-card-cover, .emp-card-badges, etc.)
========================================================= */

/* Card base */
.emp-saas-page .emp-card-saas{
  border-radius:18px !important;
  border:1px solid #eef0f4 !important;
  box-shadow:0 12px 28px rgba(16,24,40,.06) !important;
}

/* Cover */
.emp-saas-page .emp-card-cover{
  height:140px !important;
  background:#e5e7eb !important;
}
.emp-saas-page .emp-card-cover img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}
/* Overlay suave como Figma */
.emp-saas-page .emp-card-cover::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(to bottom, rgba(0,0,0,.00), rgba(0,0,0,.08));
  pointer-events:none;
}

/* Badges (chips) */
.emp-saas-page .emp-card-badges{
  left:12px !important;
  top:12px !important;
  gap:8px !important;
}
.emp-saas-page .emp-card-badges > span{
  border-radius:999px !important;
  padding:.28rem .65rem !important;
  font-size:12px !important;
  font-weight:800 !important;
  border:1px solid transparent !important;
  line-height:1 !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
}

/* Si tus $chip_priv/$chip_pay ya devuelven clases tipo emp-badge-green/blue/gray, perfecto.
   Si NO, estos fallback ayudan a que se vean bien aunque sean "badge badge-success" etc. */
.emp-saas-page .emp-card-badges > span.badge,
.emp-saas-page .emp-card-badges > span[class*="badge"]{
  background:#f3f4f6 !important;
  color:#374151 !important;
  border-color:#e5e7eb !important;
}

/* Ribbon estado */
.emp-saas-page .emp-card-ribbon{
  left:12px !important;
  bottom:12px !important;
  padding:.30rem .70rem !important;
  font-size:12px !important;
  font-weight:900 !important;
  border-radius:999px !important;
  box-shadow:0 10px 22px rgba(16,24,40,.18);
}
.emp-saas-page .emp-card-ribbon.is-full{ background:#ef4444 !important; }
.emp-saas-page .emp-card-ribbon.is-draft{ background:#f59e0b !important; color:#111827 !important; }
.emp-saas-page .emp-card-ribbon.is-finished{ background:#6b7280 !important; }

/* Body spacing */
.emp-saas-page .emp-card-body{
  padding:14px 14px 14px !important;
}

/* Title + meta */
.emp-saas-page .emp-card-title a{
  font-weight:900 !important;
  color:#111827 !important;
  text-decoration:none !important;
}
.emp-saas-page .emp-card-meta{
  margin-bottom:12px !important;
}
.emp-saas-page .emp-card-meta > div{
  display:flex !important;
  gap:8px !important;
  align-items:center !important;
  line-height:1.25 !important;
}

/* Price row + divider (como Figma) */
.emp-saas-page .emp-card-price-row{
  padding-bottom:10px !important;
  border-bottom:1px solid #eef0f4 !important;
  margin-bottom:10px !important;
}
.emp-saas-page .emp-card-price{
  font-size:16px !important;
  font-weight:900 !important;
}
.emp-saas-page .emp-card-cap{
  font-size:12px !important;
  color:#6b7280 !important;
  font-weight:700 !important;
}

/* Ocupación */
.emp-saas-page .emp-ocup-label{
  font-size:12px !important;
  font-weight:800 !important;
}
.emp-saas-page .emp-ocup-bar{
  height:6px !important;
}
.emp-saas-page .emp-ocup-bar.is-green span{ background:#22c55e !important; }
.emp-saas-page .emp-ocup-bar.is-orange span{ background:#f59e0b !important; }
.emp-saas-page .emp-ocup-bar.is-red span{ background:#ef4444 !important; }

/* Action row: botón full + delete square */
.emp-saas-page .emp-card-actions-row{
  margin-top:12px !important;
  gap:10px !important;
  flex-wrap:nowrap !important; /* evita que se rompa en desktop */
}
.emp-saas-page .emp-card-actions-row .emp-btn-card.btn{
  height:40px !important;
  border-radius:12px !important;
  font-weight:900 !important;
  flex:1 1 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
}
.emp-saas-page .emp-card-actions-row .btn-primary.emp-btn-card{
  background:#4f46e5 !important;
  border-color:#4f46e5 !important;
  box-shadow:0 10px 22px rgba(79,70,229,.20) !important;
}
.emp-saas-page .emp-card-actions-row .btn-outline-primary.emp-btn-card{
  border-color:rgba(79,70,229,.35) !important;
  color:#4f46e5 !important;
}

/* Botón delete estilo Figma */
.emp-saas-page .emp-icon.emp-danger{
  width:40px !important;
  height:40px !important;
  border-radius:12px !important;
  background:#fee2e2 !important;
  color:#ef4444 !important;
  border:0 !important;
  flex:0 0 auto !important;
}
.emp-saas-page .emp-icon.emp-danger:hover{
  filter:brightness(.97);
}

/* Estado finalizado: card “gris” */
.emp-saas-page .emp-card-saas.is-finished{
  opacity:.60;
}
.emp-saas-page .emp-card-saas.is-finished .emp-card-cover::after{
  background:linear-gradient(to bottom, rgba(0,0,0,.35), rgba(0,0,0,.35));
}

/* Mobile: que no desborde y se vea como Figma */
@media (max-width: 520px){
  .emp-saas-page .emp-card-cover{height:90px !important;}
  .emp-saas-page .emp-card-body{padding:8px 10px 10px !important;}
  .emp-saas-page .emp-card-title{font-size:13px !important;margin-bottom:4px !important;}
  .emp-saas-page .emp-card-meta{font-size:11px !important;margin-bottom:6px !important;}
  .emp-saas-page .emp-card-price{font-size:13px !important;}
  .emp-saas-page .emp-card-actions-row{
    flex-wrap:wrap !important;
    margin-top:8px !important;gap:6px !important;
  }
  .emp-saas-page .emp-btn-card{padding:.4rem .65rem !important;font-size:12px !important;}
  .emp-saas-page .emp-icon.emp-danger{
    width:36px !important;
    height:36px !important;
  }
}
/* =========================================================
   EMP Eventos - Refinamientos vista Lista / Cards / Calendario
   (ajustes compatibles, respetando estilos actuales)
========================================================= */
.emp-saas-page .emp-badge-warm{background:#fff3d6;color:#9a5b00;border-color:rgba(154,91,0,.16);}
.emp-saas-page .emp-badge-soft{background:#f3f4f6;color:#667085;border-color:#eceff3;}

.emp-saas-page .emp-list-row{
  grid-template-columns:28px 56px minmax(0,1fr) minmax(260px,380px);
  border-radius:22px;
  padding:18px 20px;
}
.emp-saas-page .emp-list-row.is-readonly{
  grid-template-columns:56px minmax(0,1fr) minmax(260px,380px);
}
.emp-saas-page .emp-list-row.is-draft{border-style:dashed;border-color:#e9c46a;background:linear-gradient(180deg,#fffdf7 0%,#fff 100%);}
.emp-saas-page .emp-list-row.is-full{box-shadow:0 12px 28px rgba(239,68,68,.08);}
.emp-saas-page .emp-list-avatar{
  width:48px;height:48px;border-radius:16px;background:#5b5fef;color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:800;
  box-shadow:0 10px 20px rgba(91,95,239,.18);
}
.emp-saas-page .emp-list-title{font-size:15px;font-weight:600;margin-bottom:8px;}
.emp-saas-page .emp-list-title a:hover{color:#4f46e5;}
.emp-saas-page .emp-list-meta{gap:12px 16px;line-height:1.45;}
.emp-saas-page .emp-list-right{gap:18px;}
.emp-saas-page .emp-list-price{font-size:18px;font-weight:600;}
.emp-saas-page .emp-list-price small{margin-top:2px;}
.emp-saas-page .emp-list-actions{gap:10px;}
.emp-saas-page .emp-list-actions .emp-icon{background:#fafafa;}
.emp-saas-page .emp-list-actions .emp-icon:hover{transform:translateY(-1px);}

@media(max-width: 992px){
  .emp-saas-page .emp-list-row{grid-template-columns:28px 56px 1fr;grid-template-areas:"chk av main" "chk right right";padding:16px;}
  .emp-saas-page .emp-list-row.is-readonly{grid-template-columns:56px 1fr;grid-template-areas:"av main" "right right";}
  .emp-saas-page .emp-list-chk{grid-area:chk;align-self:start;margin-top:4px;}
  .emp-saas-page .emp-list-avatar{grid-area:av;}
  .emp-saas-page .emp-list-main{grid-area:main;}
  .emp-saas-page .emp-list-right{grid-area:right;justify-content:flex-start;gap:14px;margin-top:4px;}
}
@media(max-width: 640px){
  .emp-saas-page .emp-list-row{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:12px 14px;}
  .emp-saas-page .emp-list-main,.emp-saas-page .emp-list-right,.emp-saas-page .emp-list-ocup{width:100%;}
  .emp-saas-page .emp-list-chips{gap:6px;margin-bottom:6px;}
  .emp-saas-page .emp-list-title{font-size:13px;margin-bottom:4px;}
  .emp-saas-page .emp-list-meta{font-size:11px;gap:6px;}
  .emp-saas-page .emp-list-right{flex-direction:column;align-items:stretch;gap:8px;}
  .emp-saas-page .emp-list-price{text-align:left;font-size:14px;}
  .emp-saas-page .emp-list-ocup{min-width:0;}
  .emp-saas-page .emp-list-actions{justify-content:flex-start;flex-wrap:wrap;gap:6px;}
  .emp-saas-page .emp-list-avatar{width:36px;height:36px;font-size:14px;}
}

.emp-saas-page .emp-cards-grid{gap:14px;}
.emp-saas-page .emp-card-saas{
  position:relative;
  border-radius:20px;
  box-shadow:0 14px 30px rgba(16,24,40,.06);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.emp-saas-page .emp-card-corner-chk{
  position:absolute;top:12px;left:12px;z-index:5;
}
.emp-saas-page .emp-card-corner-chk input{width:16px;height:16px;accent-color:#5B5FEF;cursor:pointer;}
.emp-saas-page .emp-card-saas:hover{transform:translateY(-2px);box-shadow:0 20px 36px rgba(16,24,40,.10);}
.emp-saas-page .emp-card-saas.is-draft{border-style:dashed;border-color:#e9c46a;}
.emp-saas-page .emp-card-saas.is-full{border-color:rgba(239,68,68,.20);}
.emp-saas-page .emp-card-cover{height:182px;}
.emp-saas-page .emp-card-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,24,39,.08) 0%, rgba(17,24,39,0) 42%, rgba(17,24,39,.10) 100%);pointer-events:none;}
.emp-saas-page .emp-card-topstate{position:absolute;right:10px;top:10px;z-index:2;display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
.emp-saas-page .emp-card-badges,.emp-saas-page .emp-card-ribbon,.emp-saas-page .emp-card-topstate{z-index:2;}
.emp-saas-page .emp-card-body{padding:14px 14px 16px;}
.emp-saas-page .emp-card-title{font-size:17px;line-height:1.35;margin:0 0 10px;min-height:46px;}
.emp-saas-page .emp-card-meta{font-size:14px;gap:8px;margin-bottom:14px;}
.emp-saas-page .emp-card-price-row{padding-bottom:12px;border-bottom:1px solid #edf1f5;margin-bottom:12px;}
.emp-saas-page .emp-card-price{font-size:15px;font-weight:600;color:#111827;}
.emp-saas-page .emp-card-price.is-free{color:#16a34a;}
.emp-saas-page .emp-card-cap{font-size:14px;color:#667085;font-weight:700;}
.emp-saas-page .emp-card-tags-row{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 14px;min-height:32px;}
.emp-saas-page .emp-card-actions-row{
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:flex-start;
  flex-wrap:wrap;
}
/* Agrupa Ver detalles + Editar borrador para que los iconos no queden en columna al estrechar */
.emp-saas-page .emp-card-actions-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  flex:1 1 auto;
  min-width:0;
}
.emp-saas-page .emp-card-icon-actions{
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  gap:8px;
  align-items:center;
  flex-shrink:0;
  min-width:min(100%, 184px);
}
.emp-saas-page .emp-btn-card{padding:.7rem 1rem;border-radius:14px;font-weight:700;min-width:0;justify-content:center;display:inline-flex;align-items:center;flex:0 1 auto;}
.emp-saas-page .emp-card-draft-note{
  display:inline-flex;align-items:center;gap:6px;
  margin-bottom:12px;padding:.45rem .8rem;border-radius:999px;
  background:#fff3d6;color:#9a5b00;border:1px solid rgba(154,91,0,.14);font-size:12px;font-weight:600;
}
@media(max-width: 767px){
  .emp-saas-page .emp-card-cover{height:100px;}
  .emp-saas-page .emp-card-body{padding:10px 12px 12px;}
  .emp-saas-page .emp-card-title{font-size:14px;min-height:auto;margin-bottom:5px;}
  .emp-saas-page .emp-card-meta{font-size:12px;gap:4px;margin-bottom:6px;}
  .emp-saas-page .emp-card-price-row{padding-bottom:6px;margin-bottom:6px;}
  .emp-saas-page .emp-card-price{font-size:13px;}
  .emp-saas-page .emp-card-cap{font-size:11px;}
  .emp-saas-page .emp-card-actions-row{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px;}
  .emp-saas-page .emp-card-actions-buttons{flex:1 1 min(100%, 220px);}
  .emp-saas-page .emp-card-icon-actions{justify-content:flex-end;margin-left:auto;flex-shrink:0;}
  .emp-saas-page .emp-btn-card{min-width:0;padding:.5rem .75rem;font-size:13px;}
  .emp-saas-page .emp-card-tags-row{min-height:auto;gap:4px;margin:6px 0 8px;}
}

.emp-saas-page .emp-cal-surface{padding:18px;border-radius:24px;overflow:hidden;}
.emp-saas-page .emp-cal-head{margin-bottom:16px;}
.emp-saas-page .emp-cal-grid{overflow-x:auto;padding-bottom:2px;}
.emp-saas-page .emp-cal-weekdays,
.emp-saas-page .emp-cal-days{min-width:980px;}
.emp-saas-page .emp-cal-weekdays{padding-bottom:12px;margin-bottom:0;}
.emp-saas-page .emp-cal-weekdays > div{font-size:14px;font-weight:600;color:#667085;letter-spacing:.02em;}
.emp-saas-page .emp-cal-cell{min-height:138px;padding:10px;background:#fff;vertical-align:top;}
.emp-saas-page .emp-cal-cell.is-today{background:#f7f6ff;box-shadow:inset 0 0 0 2px rgba(91,95,239,.15);}
.emp-saas-page .emp-cal-daynum{font-size:14px;font-weight:600;margin-bottom:10px;}
.emp-saas-page .emp-cal-event{
  position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;
  padding:8px 10px 8px 12px;border-radius:12px;margin-bottom:8px;border:1px solid rgba(17,24,39,.04);
}
.emp-saas-page .emp-cal-event::before{content:"";position:absolute;left:8px;top:10px;bottom:10px;width:4px;border-radius:999px;background:var(--empCalColor, #4f46e5);}
.emp-saas-page .emp-cal-event .emp-cal-dot{display:none;}
.emp-saas-page .emp-cal-event .emp-cal-tag{order:-1;font-size:10px;font-weight:600;}
.emp-saas-page .emp-cal-event .emp-cal-name{max-width:none;padding-left:0;font-size:13px;font-weight:700;line-height:1.2;white-space:normal;display:block;}
.emp-saas-page .emp-cal-event .emp-cal-time{margin-left:0;font-size:11px;}
.emp-saas-page .emp-cal-more{font-size:12px;margin-top:4px;}
@media(max-width: 768px){
  .emp-saas-page .emp-cal-surface{padding:14px 12px;}
  .emp-saas-page .emp-cal-weekdays,
  .emp-saas-page .emp-cal-days{min-width:760px;}
  .emp-saas-page .emp-cal-cell{min-height:120px;padding:8px;}
}

/* =========================================================
   EMP Eventos 2026 - listado profesional / escalable
========================================================= */
.emp-saas-page{
  --emp-surface:#ffffff;
  --emp-stroke:#e9edf5;
  --emp-text:#0f172a;
  --emp-muted:#64748b;
  --emp-soft:#f8fafc;
  --emp-brand:#5b5fef;
}
.emp-saas-page .emp-events-kpis{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin:14px 0;
}
.emp-saas-page .emp-kpi-card{padding:16px 18px;border-radius:22px;position:relative;overflow:hidden;}
.emp-saas-page .emp-kpi-card::after{
  content:"";position:absolute;right:-18px;top:-18px;width:84px;height:84px;border-radius:50%;
  background:radial-gradient(circle, rgba(91,95,239,.15), rgba(91,95,239,0));pointer-events:none;
}
.emp-saas-page .emp-kpi-label{font-size:12px;font-weight:600;color:var(--emp-muted);text-transform:uppercase;letter-spacing:.04em;}
.emp-saas-page .emp-kpi-value{font-size:34px;line-height:1;font-weight:600;color:var(--emp-text);margin:10px 0 6px;}
.emp-saas-page .emp-kpi-foot{font-size:13px;color:var(--emp-muted);}

.emp-saas-page .emp-month-shortcuts{padding:16px 18px;border-radius:22px;margin-bottom:14px;}
.emp-saas-page .emp-month-shortcuts__head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px;}
.emp-saas-page .emp-section-title{font-size:15px;font-weight:600;color:var(--emp-text);margin:0 0 3px;}
.emp-saas-page .emp-section-sub{font-size:13px;color:var(--emp-muted);}
.emp-saas-page .emp-month-shortcuts__clear{font-size:13px;font-weight:600;color:var(--emp-brand);text-decoration:none;white-space:nowrap;}
.emp-saas-page .emp-month-shortcuts__list{display:flex;gap:10px;overflow:auto;padding-bottom:2px;scrollbar-width:none;}
.emp-saas-page .emp-month-shortcuts__list::-webkit-scrollbar{display:none;}
.emp-saas-page .emp-month-pill{
  flex:0 0 auto;text-decoration:none;border-radius:999px;padding:.7rem 1rem;font-size:13px;font-weight:800;
  color:#334155;background:#fff;border:1px solid var(--emp-stroke);box-shadow:0 8px 18px rgba(15,23,42,.04);
}
.emp-saas-page .emp-month-pill.is-active{background:linear-gradient(135deg,#5b5fef,#7c3aed);color:#fff;border-color:transparent;box-shadow:0 14px 30px rgba(91,95,239,.26);}

.emp-saas-page .emp-results-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;margin:0 0 14px;border-radius:22px;}
.emp-saas-page .emp-results-toolbar__meta{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--emp-muted);font-weight:700;}
.emp-saas-page .emp-results-toolbar__meta strong{font-weight:600;color:var(--emp-text);}

.emp-saas-page .emp-list-head{
  display:grid;grid-template-columns:28px 56px minmax(0,1fr) minmax(260px,380px);gap:14px;
  padding:0 20px 8px;color:#94a3b8;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;
}
.emp-saas-page .emp-list-head.is-readonly{
  grid-template-columns:56px minmax(0,1fr) minmax(260px,380px);
}
.emp-saas-page .emp-list-head > div:nth-child(3){padding-left:0;}
.emp-saas-page .emp-list-head > div:last-child{text-align:right;}

.emp-saas-page .emp-month-title{
  display:flex;align-items:center;gap:10px;font-size:12px;font-weight:900;text-transform:uppercase;
  letter-spacing:.08em;color:#475569;margin:22px 0 12px;
}
.emp-saas-page .emp-month-title::before{content:"";width:10px;height:10px;border-radius:999px;background:linear-gradient(135deg,#5b5fef,#8b5cf6);box-shadow:0 0 0 6px rgba(91,95,239,.10);}
/* Month header spanning full grid (cards view): compactar bloques por mes */
.emp-saas-page .emp-cards-grid .emp-month-title--span{
  grid-column:1/-1;margin-top:14px;margin-bottom:8px;padding:4px 0 2px;
  border-bottom:1px solid #e2e8f0;font-size:11px;letter-spacing:.07em;color:#64748b;
}
.emp-saas-page .emp-cards-grid .emp-month-title--span:first-child{margin-top:0;padding-top:0;}
.emp-saas-page .emp-cards-grid .emp-month-title--span::before{width:8px;height:8px;box-shadow:0 0 0 4px rgba(91,95,239,.08);}

.emp-saas-page .emp-cal-head{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;}
.emp-saas-page .emp-cal-tabs{display:inline-flex;gap:8px;padding:5px;background:#f8fafc;border:1px solid var(--emp-stroke);border-radius:999px;}
.emp-saas-page .emp-cal-pill{display:inline-flex;align-items:center;padding:.55rem .85rem;border-radius:999px;font-size:12px;font-weight:600;color:#64748b;background:transparent;}
.emp-saas-page .emp-cal-pill.is-active{background:#fff;color:var(--emp-text);box-shadow:0 8px 20px rgba(15,23,42,.06);}
.emp-saas-page .emp-cal-nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.emp-saas-page .emp-cal-title{font-size:18px;font-weight:600;color:var(--emp-text);min-width:180px;text-align:center;}
.emp-saas-page .emp-cal-btn,.emp-saas-page .emp-cal-icon{
  text-decoration:none;border:1px solid var(--emp-stroke);background:#fff;color:#334155;font-weight:800;
  border-radius:14px;height:42px;display:inline-flex;align-items:center;justify-content:center;padding:0 14px;
}
.emp-saas-page .emp-cal-icon{width:42px;padding:0;font-size:20px;}
.emp-saas-page .emp-cal-grid{border:1px solid var(--emp-stroke);border-radius:22px;background:#f8fafc;padding:10px;}
.emp-saas-page .emp-cal-weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;}
.emp-saas-page .emp-cal-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;}
.emp-saas-page .emp-cal-weekdays>div{display:flex;align-items:center;justify-content:center;height:34px;background:#fff;border-radius:12px;border:1px solid var(--emp-stroke);}
.emp-saas-page .emp-cal-cell{border:1px solid var(--emp-stroke);border-radius:18px;box-shadow:0 10px 18px rgba(15,23,42,.03);}
.emp-saas-page .emp-cal-cell.is-empty{background:transparent;border-style:dashed;box-shadow:none;}
.emp-saas-page .emp-cal-daynum{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;border-radius:999px;background:#fff;border:1px solid var(--emp-stroke);}
.emp-saas-page .emp-cal-cell.is-today .emp-cal-daynum{background:linear-gradient(135deg,#5b5fef,#8b5cf6);border-color:transparent;color:#fff;box-shadow:0 12px 24px rgba(91,95,239,.24);}
.emp-saas-page .emp-cal-event{background:#fff;box-shadow:0 8px 14px rgba(15,23,42,.04);}
.emp-saas-page .emp-cal-event.is-draft{background:#fffaf0;}
.emp-saas-page .emp-cal-event.is-finished{opacity:.68;}
.emp-saas-page .emp-cal-more{display:inline-flex;align-items:center;padding:.25rem .55rem;border-radius:999px;background:#eef2ff;color:#4338ca;font-weight:600;}

.emp-saas-page .emp-pagination-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 6px 2px;flex-wrap:wrap;}
.emp-saas-page .emp-pagination-bar--cards{margin-top:8px;padding-top:14px;border-top:1px solid #e2e8f0;}
.emp-saas-page .emp-pagination-bar .emp-sub{color:#64748b;font-size:13px;}
.emp-saas-page .emp-pagination-bar .emp-pagination-per{color:#94a3b8;font-weight:500;}
.emp-saas-page .emp-pagination{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.emp-saas-page .emp-pagination a,
.emp-saas-page .emp-page-dots{
  min-width:40px;height:40px;border-radius:12px;border:1px solid var(--emp-stroke);background:#fff;
  display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:800;color:#334155;
}
.emp-saas-page .emp-pagination a.current{background:linear-gradient(135deg,#5b5fef,#7c3aed);color:#fff;border-color:transparent;box-shadow:0 12px 24px rgba(91,95,239,.24);}
.emp-saas-page .emp-pagination .emp-page-nav{padding:0 14px;min-width:auto;}
.emp-saas-page .emp-page-dots{border-style:dashed;color:#94a3b8;}

/* Benefits - mobile list & cards */
@media(max-width: 767px){
  .emp-benefits-ui .emp-ben-row{
    display:flex !important;
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
    padding:12px 14px !important;
    grid-template-columns:none !important;
  }
  .emp-benefits-ui .emp-ben-row > div:first-child{order:1;}
  .emp-benefits-ui .emp-ben-row > div:nth-child(2){order:2;width:36px;height:36px;font-size:14px !important;}
  .emp-benefits-ui .emp-ben-row > div:nth-child(3){order:3;width:100%;}
  .emp-benefits-ui .emp-ben-row > div:nth-child(4){order:4;width:100%;font-size:12px !important;}
  .emp-benefits-ui .emp-ben-row > div:nth-child(5){order:5;width:100%;}
  .emp-benefits-ui .emp-ben-row > div:nth-child(6){order:6;width:100%;display:flex;justify-content:flex-end;gap:8px;}
  .emp-benefits-ui .emp-ben-grid{
    grid-template-columns:1fr !important;
    gap:12px !important;
  }
  .emp-benefits-ui .emp-ben-card{
    padding:14px !important;
  }
  .emp-benefits-ui .emp-ben-card .emp-name{font-size:13px !important;}
  .emp-benefits-ui .emp-ben-card > div[style*="width:44px"]{width:36px !important;height:36px !important;font-size:12px !important;}
}

@media (max-width: 1100px){
  .emp-saas-page .emp-events-kpis{grid-template-columns:repeat(2,minmax(0,1fr));}
  .emp-saas-page .emp-list-head{display:none;}
}
@media (max-width: 767px){
  .emp-saas-page,.emp-admin-wrap.emp-saas-page{overflow-x:hidden;max-width:100vw;box-sizing:border-box;}
  .emp-saas-page .container-fluid,
  .emp-benefits-ui .container-fluid{padding-left:12px;padding-right:12px;max-width:100%;}
  .emp-saas-page .emp-saas-box{max-width:100%;}
  .emp-saas-page .emp-events-head{padding:12px 14px;max-width:100%;}
  .emp-saas-page .emp-events-title{font-size:18px;word-break:break-word;}
  .emp-saas-page .emp-events-kpis{grid-template-columns:1fr;gap:10px;}
  .emp-saas-page .emp-kpi-card{padding:12px 14px;border-radius:16px;}
  .emp-saas-page .emp-kpi-value{font-size:24px;}
  .emp-saas-page .emp-cards-grid{gap:10px !important;}
  .emp-saas-page .emp-card-cover{height:100px !important;}
  .emp-saas-page .emp-month-shortcuts,
  .emp-saas-page .emp-results-toolbar,
  .emp-saas-page .emp-cal-surface{border-radius:18px;}
  .emp-saas-page .emp-events-head-top,
  .emp-saas-page .emp-events-head-right{flex-wrap:wrap;min-width:0;}
  .emp-saas-page .emp-month-shortcuts__head,
  .emp-saas-page .emp-results-toolbar,
  .emp-saas-page .emp-cal-head{flex-direction:column;align-items:flex-start;}
  .emp-saas-page .emp-results-toolbar__meta{width:100%;justify-content:space-between;}
  .emp-saas-page .emp-month-shortcuts__clear{align-self:flex-start;}
  .emp-saas-page .emp-view-tabs{width:100%;display:grid;grid-template-columns:repeat(3,1fr);}
  .emp-saas-page .emp-tab{justify-content:center;padding:.6rem .35rem;font-size:12px;}
  .emp-saas-page .emp-cal-tabs{width:100%;overflow:auto;}
  .emp-saas-page .emp-cal-title{min-width:0;text-align:left;font-size:16px;}
  .emp-saas-page .emp-pagination{width:100%;justify-content:flex-start;}
  .emp-saas-page .emp-cal-grid{max-width:100%;-webkit-overflow-scrolling:touch;}
  .emp-saas-page .emp-cal-weekdays,
  .emp-saas-page .emp-cal-days{min-width:100%;grid-template-columns:repeat(7,minmax(0,1fr));}
  .emp-saas-page .emp-cal-cell{min-height:90px;padding:5px;}
  .emp-saas-page .emp-cal-event{padding:5px 6px;font-size:11px;}
  .emp-saas-page .emp-cal-event .emp-cal-name{font-size:10px;}
  .emp-saas-page .emp-list-row{grid-template-columns:1fr;grid-template-areas:"main" "right" !important;gap:8px;padding:10px 12px;margin-bottom:8px;}
  .emp-saas-page .emp-list-chk,.emp-saas-page .emp-list-avatar{display:none;}
  .emp-saas-page .emp-list-row.is-readonly .emp-list-avatar{display:flex !important;}
  .emp-saas-page .emp-list-main{grid-area:main;}
  .emp-saas-page .emp-list-title{font-size:13px !important;margin-bottom:4px !important;}
  .emp-saas-page .emp-list-meta{font-size:11px !important;gap:6px !important;}
  .emp-saas-page .emp-list-right{grid-area:right;flex-direction:column;align-items:stretch;gap:6px;}
  .emp-saas-page .emp-list-price,.emp-saas-page .emp-list-ocup{min-width:0;}
  .emp-saas-page .emp-list-price{font-size:13px !important;}
  .emp-saas-page .emp-list-actions{justify-content:flex-start;flex-wrap:wrap;gap:6px;}
  .emp-saas-page .emp-card-saas .emp-card-body{padding:10px 12px;}
  .emp-saas-page .emp-card-title{font-size:14px !important;}
}

/* Global softer typography across plugin admin UI */
.emp-admin-wrap h1,
.emp-admin-wrap h2,
.emp-admin-wrap h3,
.emp-admin-wrap h4,
.emp-admin-wrap h5,
.emp-admin-wrap h6,
.emp-admin-wrap strong,
.emp-admin-wrap .emp-btn,
.emp-admin-wrap .emp-chip,
.emp-admin-wrap .emp-page-title,
.emp-admin-wrap .emp-kpi-value,
.emp-admin-wrap .emp-events-title,
.emp-admin-wrap .emp-card-title,
.emp-admin-wrap .emp-linkcard strong,
.emp-admin-wrap .emp-mini-link,
.emp-saas-page h1,
.emp-saas-page h2,
.emp-saas-page h3,
.emp-saas-page h4,
.emp-saas-page h5,
.emp-saas-page h6,
.emp-saas-page strong,
.emp-saas-page .emp-btn,
.emp-saas-page .emp-chip,
.emp-saas-page .emp-events-title,
.emp-saas-page .emp-kpi-value {
  font-weight: 400 !important;
}

/* Shortcode [emp_lista_eventos_saas] en el front */
.emp-lista-saas-msg{margin:1em 0;padding:12px 14px;border-radius:12px;background:#fef2f2;border:1px solid #fecaca;color:#991b1b;font-size:14px;}
.emp-lista-saas-demo-note{margin:0 0 14px;font-size:13px;line-height:1.5;color:#64748b;}
.emp-lista-saas-demo-badge{display:inline-block;margin-right:8px;padding:3px 9px;border-radius:8px;background:#eef2ff;color:#4338ca;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.04em;vertical-align:middle;}
.emp-lista-saas-title{margin-bottom:12px;}