:root {
  --app-bg: #f5f7fb;
  --app-ink: #182033;
  --app-primary: #3157d5;
  --app-sidebar: #10182b;
}

body { background: var(--app-bg); color: var(--app-ink); }
a { text-underline-offset: 2px; }
.landing, .auth-page, .onboarding-page { background: radial-gradient(circle at 20% 20%, rgba(49,87,213,.13), transparent 30%), var(--app-bg); }
.architecture-card, .stat-card, .panel-card, .module-hero, .welcome-card, .auth-card { background: #fff; border: 1px solid #e8ebf2; border-radius: 1.25rem; box-shadow: 0 10px 30px rgba(21, 33, 64, .05); }
.auth-card { max-width: 560px; }
.architecture-dot { width: 52px; height: 52px; border-radius: 18px; background: linear-gradient(135deg, #3157d5, #66d9ef); }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 260px minmax(0, 1fr); }
.sidebar { background: var(--app-sidebar); color: white; min-height: 100vh; position: sticky; top: 0; height: 100vh; }
.brand { display: flex; align-items: center; gap: .75rem; color: white; }
.brand-dark { color: var(--app-ink); }
.brand small { display: block; color: #aeb8d3; font-size: .75rem; }
.brand-dark small { color: #667085; }
.brand-mark { width: 40px; height: 40px; border-radius: 14px; display: grid; place-items: center; background: #3157d5; color: white; font-weight: 900; }
.tenant-chip { padding: .85rem; border-radius: .9rem; background: rgba(255,255,255,.07); }
.sidebar .nav-link { color: #b9c2d9; border-radius: .8rem; padding: .7rem .9rem; }
.sidebar .nav-link:hover { color: white; background: rgba(255,255,255,.07); }
.sidebar .nav-link.active { background: #3157d5; color: white; }
.content-shell { min-width: 0; }
.stat-card .h3, .stat-card .h4 { color: #17203a; }
.flow-grid { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; }
.flow-grid span { background: #f0f3fb; border-radius: 999px; padding: .6rem .9rem; font-weight: 600; }
.feature-pill { padding: .85rem 1rem; border: 1px solid #e7eaf2; border-radius: .9rem; background: #fafbfe; font-weight: 600; }
.plan-option { cursor: pointer; }
.plan-card { border: 2px solid #e7eaf2; border-radius: 1rem; transition: .18s ease; background: #fff; }
.plan-option:hover .plan-card { border-color: #aebcf3; transform: translateY(-1px); }
.plan-option input:checked + .plan-card { border-color: var(--app-primary); box-shadow: 0 0 0 3px rgba(49,87,213,.10); background: #f8faff; }
.organization-choice { border: 1px solid #e7eaf2; border-radius: 1rem; background: white; box-shadow: 0 8px 24px rgba(21,33,64,.05); transition: .18s ease; }
.organization-choice:hover { border-color: #9fb0ef; transform: translateY(-2px); }
.form-control, .form-select { border-radius: .75rem; padding: .7rem .85rem; }
.btn { border-radius: .75rem; }
code { color: #3157d5; }

@media (max-width: 991.98px) {
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { min-height: auto; height: auto; position: static; }
  .sidebar nav { flex-direction: row !important; flex-wrap: wrap; }
  .sidebar .mt-auto { margin-top: 1rem !important; }
  .topbar { align-items: flex-start !important; gap: .75rem; flex-wrap: wrap; }
}

/* v0.2.0 - Eventos y Bingo 75 */
.event-card { background:#fff; border:1px solid #e7eaf2; border-radius:1rem; box-shadow:0 8px 24px rgba(21,33,64,.04); transition:.18s ease; }
.event-card:hover { border-color:#a9b7eb; transform:translateY(-2px); box-shadow:0 14px 30px rgba(21,33,64,.08); }
.mini-bingo-card { display:block; background:#fff; color:var(--app-ink); border:1px solid #e3e7f0; border-radius:1rem; padding:.9rem; transition:.16s ease; }
.mini-bingo-card:hover { transform:translateY(-2px); border-color:#9fb0ef; box-shadow:0 10px 24px rgba(21,33,64,.08); }
.mini-bingo-head, .mini-bingo-grid { display:grid; grid-template-columns:repeat(5,1fr); }
.mini-bingo-head span { text-align:center; font-weight:800; background:var(--app-primary); color:#fff; padding:.28rem 0; font-size:.8rem; }
.mini-bingo-head span:first-child { border-radius:.45rem 0 0 0; }
.mini-bingo-head span:last-child { border-radius:0 .45rem 0 0; }
.mini-bingo-grid span { display:grid; place-items:center; min-height:30px; font-size:.78rem; font-weight:700; border-right:1px solid #edf0f5; border-bottom:1px solid #edf0f5; }
.mini-bingo-grid span.free { background:#eef2ff; color:var(--app-primary); }
.bingo75-card { overflow:hidden; border:2px solid #1e293b; border-radius:1rem; background:#fff; }
.bingo75-head, .bingo75-grid { display:grid; grid-template-columns:repeat(5,1fr); }
.bingo75-head span { background:var(--app-primary); color:#fff; font-size:1.6rem; font-weight:900; text-align:center; padding:.75rem .2rem; }
.bingo75-grid > div { display:grid; place-items:center; aspect-ratio:1/1; min-height:68px; border-right:1px solid #dce1eb; border-bottom:1px solid #dce1eb; font-size:1.6rem; font-weight:800; }
.bingo75-grid > div.free { background:#eef2ff; color:var(--app-primary); font-size:1rem; }
/* v0.3.0 - Design Studio + PDF */
.design-check { display:block; padding:.8rem .9rem; border:1px solid #e4e8f1; border-radius:.8rem; background:#fafbfe; font-weight:600; }
.design-preview { border:1px solid #e1e6ef; border-radius:1rem; padding:1rem; box-shadow:0 12px 30px rgba(21,33,64,.08); color:var(--preview-secondary); }
.preview-bingo-head, .preview-bingo-grid { display:grid; grid-template-columns:repeat(5,1fr); }
.preview-bingo-head span { background:var(--preview-primary); color:white; text-align:center; font-weight:900; padding:.45rem .2rem; }
.preview-bingo-grid span { min-height:48px; display:grid; place-items:center; border-right:1px solid #dfe4ed; border-bottom:1px solid #dfe4ed; background:white; font-weight:800; }
.preview-bingo-grid span.free { background:#eef2ff; color:var(--preview-primary); font-size:.75rem; }

/* Sprint 4.2.0 - Public Storefront */
.storefront-admin-event { border:1px solid #e5e9f2; border-radius:1rem; background:#fbfcff; }
.storefront-admin-media { border:1px solid #e5e9f2; border-radius:1rem; padding:1rem; background:#fafbfe; text-align:center; }
.storefront-admin-media img { max-width:100%; max-height:120px; object-fit:contain; }
.storefront-admin-media.hero img { max-height:220px; width:100%; object-fit:cover; border-radius:.75rem; }
.storefront-mini-preview { background:var(--store-bg); border-top:5px solid var(--store-primary); color:var(--store-secondary); }
.storefront-accent { color:var(--store-primary); }
.storefront-preview-bar { height:12px; border-radius:999px; background:linear-gradient(90deg,var(--store-primary),var(--store-secondary)); }

.public-storefront-body { background:var(--store-bg); color:var(--store-secondary); }
.public-store-nav { background:#fff; border-bottom:1px solid rgba(15,23,42,.08); position:sticky; top:0; z-index:20; }
.public-store-brand { display:flex; align-items:center; gap:.8rem; color:var(--store-secondary); }
.public-store-brand small { display:block; color:#667085; font-size:.75rem; }
.public-store-logo { width:48px; height:48px; object-fit:contain; border-radius:14px; border:1px solid rgba(15,23,42,.08); background:#fff; padding:.2rem; }
.public-store-logo-fallback { width:48px; height:48px; border-radius:14px; display:grid; place-items:center; background:var(--store-primary); color:#fff; font-size:1.2rem; font-weight:900; }
.btn-store { background:var(--store-primary); border-color:var(--store-primary); color:#fff; }
.btn-store:hover { filter:brightness(.95); color:#fff; }
.btn-outline-store { border-color:var(--store-primary); color:var(--store-primary); }
.btn-outline-store:hover { background:var(--store-primary); color:#fff; }
.public-store-hero { background:linear-gradient(135deg,var(--store-primary),var(--store-secondary)); color:#fff; }
.public-store-hero.has-image { background-size:cover !important; background-position:center !important; }
.py-lg-6 { padding-top:6rem !important; padding-bottom:6rem !important; }
.public-store-announcement { display:inline-flex; padding:.45rem .8rem; border-radius:999px; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.22); font-weight:700; }
.public-store-eyebrow { color:var(--store-primary); font-size:.78rem; font-weight:800; letter-spacing:.08em; }
.public-event-card, .public-white-card { background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:1.25rem; box-shadow:0 12px 34px rgba(15,23,42,.06); overflow:hidden; }
.public-event-card-top { min-height:150px; padding:1.2rem; display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.public-event-card-top img { width:88px; height:88px; object-fit:contain; border-radius:1rem; background:#fff; padding:.45rem; }
.public-metric { border:1px solid #e8ecf3; border-radius:.9rem; padding:.8rem; text-align:center; background:#fafbfe; }
.public-metric strong { display:block; font-size:1.25rem; }
.public-metric span { display:block; font-size:.72rem; color:#667085; }
.public-empty { background:#fff; border:1px dashed #cfd6e6; border-radius:1rem; padding:3rem; text-align:center; color:#667085; }
.public-store-about { background:#fff; border-top:1px solid rgba(15,23,42,.06); border-bottom:1px solid rgba(15,23,42,.06); }
.public-contact-card { border:1px solid #e7eaf2; border-radius:1rem; padding:1.25rem; background:#fafbfe; }
.public-store-footer { background:var(--store-secondary); color:#fff; }
.public-event-detail { border-radius:1.3rem; overflow:hidden; box-shadow:0 14px 36px rgba(15,23,42,.08); }
.public-event-detail-banner { min-height:300px; padding:2.2rem; color:#fff; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.public-event-detail-banner > div { max-width:760px; }
.public-event-detail-banner img { width:150px; height:150px; object-fit:contain; border-radius:1.2rem; background:#fff; padding:.7rem; }
.public-detail-row { border:1px solid #e7eaf2; border-radius:.9rem; padding:.9rem 1rem; background:#fafbfe; display:flex; justify-content:space-between; gap:1rem; }
.public-detail-row span { color:#667085; }
.public-prize-card { border:1px solid #e7eaf2; border-radius:1rem; padding:1rem; display:flex; gap:.9rem; align-items:flex-start; height:100%; background:#fafbfe; }
.public-prize-number { width:40px; height:40px; border-radius:12px; display:grid; place-items:center; flex:0 0 auto; background:var(--store-primary); color:#fff; font-weight:900; }

@media (max-width: 767.98px) {
  .public-event-detail-banner { min-height:auto; padding:1.5rem; align-items:flex-start; flex-direction:column; }
  .public-event-detail-banner img { width:100px; height:100px; }
  .public-store-nav { position:static; }
}

/* Sprint 4.2.1 - Commercial Storefront & Activity Identity */
.activity-identity-card { display:flex; align-items:center; gap:1rem; padding:1rem; border:1px solid #e7eaf2; border-radius:1rem; background:#fafbfe; }
.activity-number { width:54px; height:54px; border-radius:16px; display:grid; place-items:center; background:var(--app-primary); color:#fff; font-size:1.05rem; font-weight:900; flex:0 0 auto; }
.public-count-chip { padding:.55rem .9rem; border:1px solid rgba(15,23,42,.09); border-radius:999px; background:#fff; color:#667085; font-weight:700; }
.public-activity-badge { display:inline-flex; align-items:center; padding:.45rem .75rem; border-radius:999px; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.28); color:#fff; font-size:.78rem; font-weight:900; letter-spacing:.04em; text-transform:uppercase; }
.public-progress-card { border:1px solid #e7eaf2; border-radius:1rem; padding:1rem; background:linear-gradient(180deg,#fff,#fafbfe); }
.public-buy-card { border-top:5px solid var(--store-primary); }
.public-event-card { transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.public-event-card:hover { transform:translateY(-4px); box-shadow:0 20px 48px rgba(15,23,42,.11); border-color:color-mix(in srgb, var(--store-primary) 30%, #e7eaf2); }
.public-event-card h3 { color:var(--store-secondary); }
.public-event-card .btn-store { min-height:48px; display:flex; align-items:center; justify-content:center; font-weight:800; }
.public-event-detail-banner .public-activity-badge { background:rgba(255,255,255,.16); }
.public-storefront-body .progress { background:rgba(15,23,42,.08); border-radius:999px; overflow:hidden; }
.public-storefront-body .progress-bar { border-radius:999px; }

@media (max-width: 575.98px) {
  .public-store-nav .container { align-items:flex-start !important; }
  .public-store-nav .d-flex.gap-2 { flex-direction:column; }
  .public-store-hero .display-2 { font-size:2.6rem; }
}
.public-rule-note { padding:.75rem .9rem; border-radius:.85rem; background:color-mix(in srgb, var(--store-primary) 7%, #fff); border:1px solid color-mix(in srgb, var(--store-primary) 14%, #e7eaf2); color:var(--store-secondary); font-size:.9rem; }

/* Sprint 4.2.2 - Public Card Selector, Lucky Numbers & Reservation Engine */
.selector-option-card { border-top:4px solid var(--store-primary); }
.selector-icon { width:52px; height:52px; border-radius:16px; display:grid; place-items:center; background:color-mix(in srgb, var(--store-primary) 10%, #fff); font-size:1.6rem; margin-bottom:1rem; }
.visual-card-choice { display:block; cursor:pointer; }
.visual-card-choice > input { position:absolute; opacity:0; pointer-events:none; }
.visual-card-shell { border:2px solid #e7eaf2; border-radius:1rem; padding:.85rem; background:#fff; transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.visual-card-choice:hover .visual-card-shell { transform:translateY(-2px); box-shadow:0 10px 24px rgba(15,23,42,.08); }
.visual-card-choice > input:checked + .visual-card-shell { border-color:var(--store-primary); box-shadow:0 0 0 3px color-mix(in srgb, var(--store-primary) 14%, transparent); }
.choice-mark { width:28px; height:28px; border-radius:999px; display:grid; place-items:center; background:#eef2f7; color:#98a2b3; font-weight:900; }
.visual-card-choice > input:checked + .visual-card-shell .choice-mark { background:var(--store-primary); color:#fff; }
.mini-bingo-head, .mini-bingo-grid { display:grid; grid-template-columns:repeat(5,1fr); }
.mini-bingo-head span { background:var(--store-primary); color:#fff; text-align:center; padding:.3rem .1rem; font-size:.72rem; font-weight:900; border-right:1px solid rgba(255,255,255,.2); }
.mini-bingo-grid span { min-height:34px; display:grid; place-items:center; border-right:1px solid #e2e7ef; border-bottom:1px solid #e2e7ef; font-size:.78rem; font-weight:800; background:#fff; }
.mini-bingo-grid span.free { background:color-mix(in srgb, var(--store-primary) 8%, #fff); color:var(--store-primary); font-size:.58rem; }
.sticky-selector-action { position:sticky; bottom:1rem; z-index:10; display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1rem; border:1px solid rgba(15,23,42,.09); border-radius:1rem; background:rgba(255,255,255,.96); box-shadow:0 14px 36px rgba(15,23,42,.12); backdrop-filter:blur(10px); }
.reservation-clock { padding:.6rem .9rem; border-radius:999px; background:var(--store-secondary); color:#fff; font-weight:900; font-variant-numeric:tabular-nums; }
.reservation-clock.expired { background:#b42318; }
.reserved-card-preview { border:1px solid #e7eaf2; border-radius:1rem; padding:1rem; background:#fafbfe; }
.payment-foundation-placeholder { border:1px dashed color-mix(in srgb, var(--store-primary) 45%, #cfd6e6); border-radius:.9rem; padding:1rem; background:color-mix(in srgb, var(--store-primary) 5%, #fff); }
.public-purchase-feature { min-height:62px; border:1px solid #e7eaf2; border-radius:.8rem; display:grid; place-items:center; gap:.1rem; padding:.45rem; background:#fafbfe; font-size:1rem; }
.public-purchase-feature span { font-size:.68rem; color:#667085; font-weight:700; }
@media (max-width: 575.98px) { .sticky-selector-action { align-items:stretch; flex-direction:column; } .sticky-selector-action .btn { width:100%; } }


/* Sprint 4.2.2.1 — Card Privacy & Buyer Validation */
.public-security-banner {
  display:flex; align-items:flex-start; gap:.85rem; padding:1rem 1.1rem;
  border:1px solid color-mix(in srgb, var(--store-primary) 28%, #d9e1ea 72%);
  border-radius:1rem; background:color-mix(in srgb, var(--store-primary) 7%, #fff 93%);
}
.public-security-icon { font-size:1.35rem; line-height:1.2; }
.protected-card-shell { min-height:148px; display:flex; flex-direction:column; justify-content:center; gap:.75rem; }
.protected-card-shell > .d-flex { width:100%; }
.protected-card-lock { font-size:2rem; text-align:center; opacity:.85; }
.protected-reservation-card { min-height:170px; }
.protected-card-placeholder {
  display:grid; grid-template-columns:repeat(5,1fr); gap:.35rem;
}
.protected-card-placeholder span {
  display:grid; place-items:center; min-height:48px; border-radius:.65rem;
  background:color-mix(in srgb, var(--store-primary) 8%, #f4f6f8 92%);
  border:1px dashed color-mix(in srgb, var(--store-primary) 22%, #cfd7df 78%);
  font-weight:800; color:var(--store-primary);
}

/* Sprint 4.2.3 - payments & secure delivery */
.payment-method-card{border-top:3px solid var(--store-primary,#3157D5)}
.secure-delivery-page{max-width:1180px}
.bingo-delivery-table{table-layout:fixed;font-weight:700}
.bingo-delivery-table thead th{background:var(--store-primary,#3157D5);color:#fff}
.bingo-delivery-table td{vertical-align:middle;height:42px}
.delivered-bingo-card{break-inside:avoid}
@media print{
  .no-print,.public-store-footer{display:none!important}
  body{background:#fff!important}
  .secure-delivery-page{max-width:none!important;padding:0!important}
  .public-white-card{box-shadow:none!important;border:1px solid #bbb!important}
  .col-md-6.col-xl-4{width:50%!important}
}

/* Sprint 4.2.3.1 - buyer card portal */
.buyer-portal-shell{max-width:1180px}
.buyer-lookup-card{border-top:4px solid var(--store-primary)}
.buyer-security-point{height:100%;padding:1rem;border:1px solid #e7eaf2;border-radius:1rem;background:#fafbfe;display:flex;flex-direction:column;gap:.3rem}
.buyer-security-point span{color:#667085;font-size:.9rem}
.buyer-sale-card{border-top:3px solid var(--store-primary)}
.buyer-sale-card .public-detail-row{min-height:72px}
@media (max-width:767.98px){.buyer-portal-shell{padding-top:1.5rem!important}.buyer-sale-card .badge{font-size:.68rem}}

/* HOTFIX 4.2.3.1 PRINT-LAYOUT START */
@media print {
  @page {
    size: A4 portrait;
    margin: 8mm;
  }

  html,
  body {
    width: auto !important;
    min-width: 0 !important;
    background: #fff !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  .secure-delivery-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Compact the purchase header without removing the reference/security data. */
  .secure-delivery-page > .public-white-card:first-child {
    margin: 0 0 5mm !important;
    padding: 4mm !important;
    break-inside: avoid-page !important;
    page-break-inside: avoid !important;
  }

  .secure-delivery-page > .public-white-card:first-child .h2 {
    font-size: 17pt !important;
    line-height: 1.05 !important;
  }

  .secure-delivery-page > .public-white-card:first-child p,
  .secure-delivery-page > .public-white-card:first-child .small {
    font-size: 8pt !important;
    line-height: 1.25 !important;
  }

  .secure-delivery-page .public-security-banner {
    margin-top: 3mm !important;
    padding: 3mm !important;
  }

  /* Bootstrap flex rows can fragment badly in Chromium print. Use a print-only grid. */
  .secure-delivery-page > .row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 5mm !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: start !important;
  }

  .secure-delivery-page > .row > .col-md-6.col-xl-4 {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    min-width: 0 !important;
    break-inside: avoid-page !important;
    page-break-inside: avoid !important;
  }

  .secure-delivery-page .delivered-bingo-card {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 3mm !important;
    overflow: visible !important;
    break-inside: avoid-page !important;
    page-break-inside: avoid !important;
    box-sizing: border-box !important;
  }

  .secure-delivery-page .delivered-bingo-card > .d-flex {
    margin-bottom: 2mm !important;
  }

  .secure-delivery-page .delivered-bingo-card .h5 {
    font-size: 13pt !important;
    line-height: 1 !important;
  }

  .secure-delivery-page .public-store-eyebrow,
  .secure-delivery-page .badge {
    font-size: 7pt !important;
    line-height: 1.1 !important;
  }

  .secure-delivery-page .bingo-delivery-table {
    width: 100% !important;
    table-layout: fixed !important;
    margin: 0 0 2.5mm !important;
    break-inside: avoid-page !important;
    page-break-inside: avoid !important;
  }

  .secure-delivery-page .bingo-delivery-table thead,
  .secure-delivery-page .bingo-delivery-table tbody,
  .secure-delivery-page .bingo-delivery-table tr {
    break-inside: avoid !important;
    page-break-inside: avoid !important;
  }

  .secure-delivery-page .bingo-delivery-table th,
  .secure-delivery-page .bingo-delivery-table td {
    height: 7mm !important;
    min-height: 0 !important;
    padding: 0.8mm !important;
    font-size: 9pt !important;
    line-height: 1 !important;
    vertical-align: middle !important;
  }

  .secure-delivery-page .delivered-bingo-card > .small {
    font-size: 7.5pt !important;
    line-height: 1.18 !important;
  }

  .secure-delivery-page .text-break {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }
}
/* HOTFIX 4.2.3.1 PRINT-LAYOUT END */