/* Sitio Si — Precios y Compra
   Paleta duplicada intencionalmente del theme (no depende de que
   Sitio Si sea el tema activo). Colores: ver paleta oficial de marca. */

.sitiosi-pricing{
  --sp-blue: #2563EB;
  --sp-blue-hover: #1D4ED8;
  --sp-blue-dark: #172554;
  --sp-blue-light: #DBEAFE;
  --sp-text: #111827;
  --sp-text-dim: #4B5563;
  --sp-text-faint: #6B7280;
  --sp-border: #E2E8F0;
  --sp-border-strong: #CBD5E1;
  --sp-bg-soft: #F1F5F9;
  --sp-surface: #FFFFFF;
  --sp-radius: 14px;
  --sp-shadow: 0 8px 24px rgba(17,24,39,0.08);

  /* Color distintivo del producto (botones y badge resaltado). Por
     defecto es el mismo azul de marca; las clases .sitiosi-pricing-accent-*
     de abajo lo pisan por producto. Si un producto no tiene color
     distintivo asignado, no se agrega la clase y queda este azul. */
  --sp-accent: var(--sp-blue);
  --sp-accent-hover: var(--sp-blue-hover);

  font-family: 'Inter', -apple-system, sans-serif;
  color: var(--sp-text);
  max-width: 1120px;
  margin: 0 auto;
  padding: 48px 20px;
}

/* Colores distintivos por producto — duplicados intencionalmente de
   --tv-accent / --mc-accent / --rp-accent del tema (mismo criterio que
   el resto de esta hoja: no depender de que el tema esté activo). */
.sitiosi-pricing.sitiosi-pricing-accent-tv{ --sp-accent:#16A34A; --sp-accent-hover:#15803D; }
.sitiosi-pricing.sitiosi-pricing-accent-mc{ --sp-accent:#7C3AED; --sp-accent-hover:#6D28D9; }
.sitiosi-pricing.sitiosi-pricing-accent-rp{ --sp-accent:#EA580C; --sp-accent-hover:#C2410C; }
.sitiosi-pricing.sitiosi-pricing-accent-tc{ --sp-accent:#0D9488; --sp-accent-hover:#0F766E; }
.sitiosi-pricing.sitiosi-pricing-accent-fs{ --sp-accent:#E11D48; --sp-accent-hover:#BE123C; }

.sitiosi-pricing-head{max-width:640px; margin-bottom:36px;}
.sitiosi-pricing-head h2{
  font-family: 'Space Grotesk', sans-serif; font-weight:600;
  font-size: clamp(1.5rem, 2.6vw, 2rem); color: var(--sp-blue-dark); margin: 0 0 10px;
}
.sitiosi-pricing-head p{color: var(--sp-text-dim); font-size:1rem; margin:0;}

.sitiosi-pricing-lite{
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  background: var(--sp-bg-soft); border:1px dashed var(--sp-border-strong); border-radius: var(--sp-radius);
  padding:22px 26px; margin-top:26px;
}
.sitiosi-pricing-lite-info{display:flex; flex-direction:column; gap:4px;}
.sitiosi-pricing-lite-tag{
  display:inline-flex; width:fit-content; font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.04em;
  color:#116233; background:#DCFCE7; padding:3px 10px; border-radius:999px; margin-bottom:4px;
}
.sitiosi-pricing-lite-info h3{
  font-family:'Space Grotesk', sans-serif; font-weight:600; font-size:1.05rem; color: var(--sp-blue-dark); margin:0;
}
.sitiosi-pricing-lite-info p{color:var(--sp-text-dim); font-size:0.87rem; margin:0;}
.sitiosi-pricing-btn-lite{
  background:#fff; color: var(--sp-blue) !important; border:1px solid var(--sp-border-strong); flex-shrink:0;
  box-shadow:0 1px 3px rgba(15,23,42,0.08), 0 1px 2px rgba(15,23,42,0.06);
}
.sitiosi-pricing-btn-lite:hover{background: var(--sp-blue-light); border-color:var(--sp-blue); box-shadow:0 2px 6px rgba(15,23,42,0.1);}

.sitiosi-pricing-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch;
}

.sitiosi-pricing-card{
  position:relative;
  background: var(--sp-surface); border:1px solid var(--sp-border); border-radius: var(--sp-radius);
  padding: 28px 24px; box-shadow: 0 1px 2px rgba(17,24,39,0.05);
  display:flex; flex-direction:column;
}
.sitiosi-pricing-card.is-highlighted{
  border-color: var(--sp-accent, var(--sp-blue)); box-shadow: var(--sp-shadow);
}
.sitiosi-pricing-badge{
  position:absolute; top:-12px; right:24px;
  background: var(--sp-accent, var(--sp-blue)); color:#fff; font-size:0.72rem; font-weight:700;
  padding:4px 12px; border-radius:999px; letter-spacing:0.02em;
}
.sitiosi-pricing-pro-tag{
  display:inline-flex; width:fit-content; font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.04em;
  color:#fff; background: var(--sp-blue-dark); padding:3px 10px; border-radius:999px; margin-bottom:2px;
}
.sitiosi-pricing-card h3{
  font-family:'Space Grotesk', sans-serif; font-weight:600; font-size:1.15rem;
  color: var(--sp-blue-dark); margin: 6px 0 6px;
}
.sitiosi-pricing-desc{color:var(--sp-text-faint); font-size:0.87rem; margin:0 0 18px; min-height:2.6em;}

.sitiosi-pricing-price{
  font-family:'Space Grotesk', sans-serif; font-weight:700; font-size:1.7rem; color: var(--sp-text);
}
.sitiosi-pricing-price .woocommerce-Price-amount{font-size:inherit; font-weight:inherit;}
.sitiosi-pricing-price.sitiosi-pricing-unavailable{font-size:1rem; font-weight:600; color: var(--sp-text-faint);}
.sitiosi-pricing-period{color:var(--sp-text-faint); font-size:0.82rem; margin-bottom:18px; min-height:1.2em;}
.sitiosi-pricing-per-site{display:block; margin-top:2px; font-size:0.78rem;}

.sitiosi-pricing-features{list-style:none; margin:0 0 22px; padding:0; display:flex; flex-direction:column; gap:9px; flex:1;}
.sitiosi-pricing-features li{
  font-size:0.87rem; color: var(--sp-text-dim); font-weight:600; padding-left:22px; position:relative;
}
.sitiosi-pricing-features li::before{
  content:"✓"; position:absolute; left:0; top:0; color: var(--sp-blue); font-weight:700;
}

.sitiosi-pricing-btn{
  display:block; text-align:center; background: var(--sp-accent, var(--sp-blue)); color:#fff !important;
  padding:13px 20px; border-radius:9px; font-weight:600; font-size:0.94rem;
  text-decoration:none; border:none; cursor:pointer; transition: background 0.15s ease;
}
.sitiosi-pricing-btn:hover{background: var(--sp-accent-hover, var(--sp-blue-hover)); color:#fff;}
.sitiosi-pricing-btn.is-disabled{
  background: var(--sp-surface); color: var(--sp-text-faint) !important; cursor:not-allowed;
  border:1px solid var(--sp-border-strong); box-shadow:0 1px 3px rgba(15,23,42,0.06);
}
.sitiosi-pricing-btn:focus-visible{outline:2px solid var(--sp-accent, var(--sp-blue)); outline-offset:2px;}

.sitiosi-pricing-note{
  margin-top:28px; font-size:0.85rem; color: var(--sp-text-faint); max-width:760px; line-height:1.6;
}
.sitiosi-pricing-note a{color: var(--sp-blue); text-decoration:underline;}

@media (max-width: 900px){
  .sitiosi-pricing-grid{grid-template-columns:1fr; gap:16px;}
  .sitiosi-pricing{padding:36px 20px;}
  .sitiosi-pricing-lite{flex-direction:column; align-items:stretch; text-align:left;}
  .sitiosi-pricing-btn-lite{width:100%; text-align:center;}
}

/* ---------- POPUP DEL CARRITO ---------- */
body.sitiosi-modal-open{overflow:hidden;}

.sitiosi-cart-modal{
  --sp-blue: #2563EB; --sp-blue-hover:#1D4ED8; --sp-blue-dark:#172554; --sp-blue-light:#DBEAFE;
  --sp-text:#111827; --sp-text-dim:#4B5563; --sp-text-faint:#6B7280;
  --sp-border:#E2E8F0; --sp-border-strong:#CBD5E1; --sp-bg-soft:#F1F5F9; --sp-surface:#FFFFFF;
  position:fixed; inset:0; z-index:9999; display:none; align-items:center; justify-content:center; padding:20px;
  font-family:'Inter', -apple-system, sans-serif;
}
.sitiosi-cart-modal.is-open{display:flex;}
.sitiosi-cart-modal__backdrop{position:absolute; inset:0; background:rgba(17,24,39,0.55);}
.sitiosi-cart-modal__box{
  position:relative; z-index:1; background:var(--sp-surface); border-radius:16px;
  max-width:440px; width:100%; max-height:86vh; overflow-y:auto;
  padding:32px 28px 28px; box-shadow:0 24px 60px rgba(17,24,39,0.25);
  animation: sitiosiModalIn 0.18s ease;
}
@keyframes sitiosiModalIn{from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:translateY(0);}}
.sitiosi-cart-modal__close{
  position:absolute; top:14px; right:14px; width:32px; height:32px; border-radius:50%;
  background:var(--sp-bg-soft); border:none; font-size:1.3rem; line-height:1; color:var(--sp-text-faint);
  cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.sitiosi-cart-modal__close:hover{background:var(--sp-border);}
.sitiosi-cart-modal__body h2{
  font-family:'Space Grotesk', sans-serif; font-weight:600; font-size:1.2rem; color:var(--sp-blue-dark); margin:0 0 18px;
}
.sitiosi-cart-modal__items{display:flex; flex-direction:column; gap:10px; margin-bottom:14px;}
.sitiosi-cart-modal__item{
  display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 14px; background:var(--sp-bg-soft); border-radius:10px;
  font-size:0.9rem; color:var(--sp-text);
}
.sitiosi-cart-modal__item-name{flex:1; min-width:0;}
.sitiosi-cart-modal__item-name em{font-style:normal; color:var(--sp-text-faint);}
.sitiosi-cart-modal__item-price{font-weight:600; white-space:nowrap;}
.sitiosi-cart-modal__item-remove{
  width:24px; height:24px; border-radius:50%; border:none; background:transparent; color:var(--sp-text-faint);
  font-size:1.15rem; line-height:1; cursor:pointer; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  transition:background 0.15s ease, color 0.15s ease;
}
.sitiosi-cart-modal__item-remove:hover{background:#FEE2E2; color:#B91C1C;}
.sitiosi-cart-modal__item-remove:disabled{opacity:0.4; cursor:not-allowed;}
.sitiosi-cart-modal__total{
  display:flex; justify-content:space-between; padding:12px 14px; border-top:1px solid var(--sp-border);
  font-weight:700; color:var(--sp-blue-dark); margin-bottom:20px; font-size:0.98rem;
}
.sitiosi-cart-modal__empty{color:var(--sp-text-faint); font-size:0.9rem; margin-bottom:20px;}
.sitiosi-cart-modal__error{
  background:#FEE2E2; border:1px solid #F6C6C6; color:#7A1E1E; border-radius:10px;
  padding:14px 16px; margin-bottom:18px; font-size:0.88rem; line-height:1.5;
}
.sitiosi-cart-modal__error p{margin:0;}
.sitiosi-cart-modal__error p + p{margin-top:6px;}
.sitiosi-cart-modal__actions{display:flex; flex-direction:column; gap:10px;}
.sitiosi-cart-modal__actions .sitiosi-pricing-btn{width:100%; text-align:center;}

@media (max-width: 480px){
  .sitiosi-cart-modal__box{padding:26px 20px 22px;}
}

/* ---------- BOTÓN FLOTANTE PARA REABRIR EL CARRITO ---------- */
.sitiosi-cart-fab{
  --sp-blue: #2563EB; --sp-blue-hover:#1D4ED8;
  position:fixed; right:20px; bottom:20px; z-index:9998;
  width:52px; height:52px; border-radius:50%; border:none;
  background:var(--sp-blue); color:#fff; cursor:pointer;
  display:none; align-items:center; justify-content:center;
  box-shadow:0 8px 20px rgba(37,99,235,0.35);
  transition:transform 0.15s ease, background 0.15s ease;
}
.sitiosi-cart-fab.is-visible{display:flex;}
.sitiosi-cart-fab:hover{background:var(--sp-blue-hover); transform:translateY(-2px);}
.sitiosi-cart-fab__icon{width:22px; height:22px; stroke:currentColor; stroke-width:2; fill:none; stroke-linecap:round; stroke-linejoin:round;}
.sitiosi-cart-fab__count{
  position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; padding:0 4px;
  border-radius:999px; background:#fff; color:var(--sp-blue); font-size:0.7rem; font-weight:700;
  display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 2px var(--sp-blue);
}
@media (max-width:600px){
  .sitiosi-cart-fab{right:16px; bottom:16px; width:48px; height:48px;}
}