:root{ --c-prim:#4492CB; --c-sec:#E4509A; --c-acc:#2FA9B4; }
body{background:#f6f8fc;color:#0b1220;overflow-x:hidden}
.bg-pattern{background-image:linear-gradient(0deg,rgba(0,0,0,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.02) 1px,transparent 1px);background-size:24px 24px}
.navbar,.offcanvas,.dropdown-menu{background:#ffffffcc;backdrop-filter:blur(6px);border-bottom:1px solid #e5e7eb}
.dropdown-menu{border:1px solid #e5e7eb}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:14px}
.table{--bs-table-bg:#fff;--bs-table-color:#0b1220}
a{color:var(--c-prim)} a:hover{text-decoration:underline}
/* Ensure buttons never show underline, even as links */
.btn, .btn-prim, .btn-sec, .btn-acc { text-decoration:none !important; }
.btn:hover, .btn:focus, a.btn:hover, a.btn:focus,
.btn-prim:hover, .btn-prim:focus,
.btn-sec:hover, .btn-sec:focus,
.btn-acc:hover, .btn-acc:focus { text-decoration:none !important; }
.btn-prim{background-color:var(--c-prim);color:#fff;border:0;border-radius:12px}
.btn-sec{background-color:var(--c-sec);color:#fff;border:0;border-radius:12px}
.btn-acc{background-color:var(--c-acc);color:#001014;border:0;border-radius:12px}
.btn-prim:hover,.btn-sec:hover,.btn-acc:hover{opacity:.95}
.form-control:focus,.btn:focus{outline:2px solid var(--c-prim)!important;outline-offset:2px;box-shadow:none!important}
/* Mejorar legibilidad del título de acceso */
.card h1.h5, .card .h5 { 
  text-shadow: none !important;
  color: #0b1220 !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
}

/* Mejorar visibilidad del formulario de login */
.card {
  box-shadow: 0 8px 32px rgba(68, 146, 203, 0.12) !important;
  border: 1px solid rgba(68, 146, 203, 0.15) !important;
}

.kpi{display:flex !important;align-items:center !important;gap:14px !important;border-radius:16px !important;box-shadow:0 2px 6px rgba(0,0,0,.06) !important;flex-direction:row !important;}
.kpi-icon{width:52px !important;height:52px !important;border-radius:50% !important;border:2px solid var(--c-prim) !important;display:grid !important;place-items:center !important;color:var(--c-prim) !important;background:#fff !important;flex-shrink:0 !important;}
.kpi-info{margin-left:0 !important;text-align:left !important;display:flex !important;flex-direction:column !important;flex:1 !important;}
.kpi-label{font-size:.78rem;letter-spacing:.06em;color:#6b7280}
.kpi-value{font-size:1.9rem;font-weight:800;line-height:1}
.kpi[data-accent="prim"] .kpi-icon{border-color:var(--c-prim);color:var(--c-prim)}
.kpi[data-accent="sec"] .kpi-icon{border-color:var(--c-sec);color:var(--c-sec)}
.kpi[data-accent="acc"] .kpi-icon{border-color:var(--c-acc);color:var(--c-acc)}
.kpi[data-accent="money"] .kpi-icon{border-color:var(--c-acc);color:var(--c-acc)}
.stripe{height:4px;background:var(--c-prim)}
.stripe.tri{height:4px;background:linear-gradient(90deg,var(--c-prim) 0 33%, var(--c-sec) 33% 66%, var(--c-acc) 66% 100%)}
.support-bar{background:#ffffffdd;backdrop-filter:blur(6px);border-top:1px solid #e5e7eb;margin-top:auto}
.cards-grid{display:grid;gap:16px}
@media (min-width:768px){.cards-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:992px){.cards-grid{grid-template-columns:repeat(3,1fr)}}
.badge-estado-borrador{background:#6c757d}
.badge-estado-revision{background:#ffc107;color:#1a1a1a}
.badge-estado-publicado{background:#198754}

/* Login variants */
.login-split{min-height:100vh}
.login-split .left{display:flex;align-items:center}
.login-split .right{min-height:50vh;background-size:cover;background-position:center;border-left:1px solid #e5e7eb}
.login-split .right{background-repeat:no-repeat}
@media (min-width: 992px){ .login-split .right{min-height:100vh} }
.login-card{background:#fff;border:1px solid #e5e7eb;border-radius:16px}
.login-overlay{position:relative;min-height:100vh;background-size:cover;background-position:center}
/* Match landing hero overlay gradient */
.login-overlay::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(246,248,252,0) 0%, rgba(246,248,252,0.35) 45%, rgba(246,248,252,0.65) 70%, rgba(246,248,252,0.92) 100%)}
.login-overlay .form-wrap{position:relative;z-index:1}

/* Dashboard layout */
.dashboard-navbar{background:#1A232E;color:#fff}
.dashboard-navbar .btn-outline-light{border-color:rgba(255,255,255,.3)}
.dashboard-sidebar{position:sticky;top:96px;border-radius:18px}
.dashboard-sidebar .nav-link{color:#0b1220;opacity:.95;border-radius:12px;padding:.65rem .9rem;transition:all .2s ease}
.dashboard-sidebar .nav-link i{font-size:1rem}
.dashboard-sidebar .nav-link:hover,
.dashboard-sidebar .nav-link.active{background:#eef2f9}
.dashboard-main{display:flex;flex-direction:column;gap:1.75rem;min-width:0}
.dashboard-main .card{margin-bottom:0}
.chip{display:inline-flex;align-items:center;border:1px solid #e5e7eb;padding:.3rem .75rem;border-radius:999px;margin:.15rem;font-size:.82rem}
.chip[data-color="prim"]{border-color:var(--c-prim);color:var(--c-prim)}
.chip[data-color="sec"]{border-color:var(--c-sec);color:var(--c-sec)}
.chip[data-color="acc"]{border-color:var(--c-acc);color:var(--c-acc)}
.offcanvas .nav-link{color:#fff;opacity:.9;border-radius:12px;padding:.65rem .9rem}
.offcanvas .nav-link:hover{background:rgba(255,255,255,.08)}
.offcanvas .btn-close{filter:invert(1)}
.card-header{background:#fff;border-bottom:1px solid #e5e7eb}

/* Colorful accents without blending */
.tri-divider{height:6px;background:linear-gradient(90deg,var(--c-prim) 0 33.33%, var(--c-sec) 33.33% 66.66%, var(--c-acc) 66.66% 100%)}
.card-accent{border-top:4px solid transparent;border-radius:14px}
.card-accent[data-accent="prim"]{border-top-color:var(--c-prim)}
.card-accent[data-accent="sec"]{border-top-color:var(--c-sec)}
.card-accent[data-accent="acc"]{border-top-color:var(--c-acc)}

/* Hero panel */
.hero-panel{background:#fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="600" height="200" viewBox="0 0 600 200"><g fill="none" stroke="%23e5e7eb" stroke-width="1"><path d="M0 40 H600"/><path d="M0 80 H600"/><path d="M0 120 H600"/><path d="M0 160 H600"/></g></svg>') right bottom/300px no-repeat;border:1px solid #e5e7eb;border-radius:14px}
.hero-panel h5{margin:0}
.hero-actions .btn{min-width:140px}

/* Better media placement for hero + cards */
@media (min-width: 768px){
  .hero-panel{position:relative}
  .hero-panel .orbit{position:absolute;right:16px;top:16px}
  .hero-panel{padding-right:190px}
}

.card-with-orbit{position:relative}
@media (min-width: 768px){
  .card-with-orbit{padding-right:190px}
  .card-with-orbit > .orbit{position:absolute;right:16px;top:16px}
}

/* Tags for content types */
.tag{display:inline-block;padding:.2rem .55rem;border-radius:999px;font-size:.75rem;font-weight:600}
.tag-prim{background:var(--c-prim);color:#fff}
.tag-sec{background:var(--c-sec);color:#fff}
.tag-acc{background:var(--c-acc);color:#001014}

/* Quick actions */
.quick-actions .btn{border-radius:12px}

/* Timeline */
.timeline{list-style:none;padding-left:0;margin:0}
.timeline li{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
.timeline .dot{width:10px;height:10px;border-radius:50%;margin-top:6px}
.dot-prim{background:var(--c-prim)}
.dot-sec{background:var(--c-sec)}
.dot-acc{background:var(--c-acc)}

/* Reusable media blocks */
.card-media{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:12px;display:block}
.ambient-media{height:180px;border-radius:12px;background-size:cover;background-position:center;margin-bottom:12px;position:relative;overflow:hidden}
.ambient-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.75) 100%)}

/* Ambient futuristic card (subtle, professional) */
.ambient-card{position:relative;border-radius:16px;border:1px solid rgba(11,18,32,.08);background:linear-gradient(180deg,#ffffff 0%, #f7f9fd 100%);box-shadow:0 8px 28px rgba(11,18,32,.06)}
.ambient-card::before{content:"";position:absolute;inset:-15%;z-index:0;filter:blur(8px);background:
  radial-gradient(420px 280px at 18% 8%, rgba(68,146,203,.18), transparent 60%),
  radial-gradient(420px 260px at 90% 85%, rgba(228,80,154,.14), transparent 62%),
  radial-gradient(360px 260px at 0% 100%, rgba(47,169,180,.12), transparent 65%)}
.ambient-card::after{content:"";position:absolute;inset:0;border-radius:16px;background:
  linear-gradient(180deg, rgba(255,255,255,.6), rgba(255,255,255,.2));
  pointer-events:none}
.ambient-card > *{position:relative;z-index:1}
.ambient-card .eyebrow{color:#425066}
.ambient-card .chip{background:rgba(255,255,255,.7);backdrop-filter:saturate(120%) blur(2px);border-color:rgba(11,18,32,.08)}
.ambient-card .chip[data-color="prim"]{border-color:rgba(68,146,203,.45)}
.ambient-card .chip[data-color="sec"]{border-color:rgba(228,80,154,.45)}
.ambient-card .chip[data-color="acc"]{border-color:rgba(47,169,180,.45)}
.feature-ambient{position:relative;overflow:hidden}
.feature-ambient .feature-right{position:absolute;right:-20px;top:50%;transform:translateY(-50%);opacity:.95}
@media (max-width: 991.98px){.feature-ambient .feature-right{position:static;transform:none;margin-top:12px;display:flex;justify-content:flex-end}}
.feature-ambient .orbit{filter:drop-shadow(0 18px 38px rgba(11,18,32,.18))}
.filter-bar{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:10px 12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.filter-bar .form-control{max-width:220px}
.filter-bar .form-select{max-width:180px}
.media-circle{width:96px;height:96px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 6px 20px rgba(0,0,0,.08)}
@media (min-width:768px){.media-circle{width:120px;height:120px}}
@media (min-width:992px){.media-circle{width:140px;height:140px}}
.orbit{position:relative;display:inline-grid;place-items:center;border-radius:50%;filter:drop-shadow(0 6px 18px rgba(11,18,32,.12))}
.orbit::before{content:"";position:absolute;inset:0;border-radius:50%;padding:3px;background:conic-gradient(from 0deg, var(--c-prim), var(--c-sec), var(--c-acc), var(--c-prim));-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.orbit img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.orbit-sm{width:88px;height:88px}
.orbit-md{width:120px;height:120px}
.orbit-lg{width:140px;height:140px}
.text-prim{color:var(--c-prim)!important}
.x-cloak{display:none!important}
.floating-donation-btn{position:fixed;left:20px;bottom:20px;z-index:1055;animation:donation-pulse 2s infinite}
.floating-donation-btn .btn{border-radius:999px;box-shadow:0 8px 24px rgba(0,0,0,.15);padding:12px 20px;font-weight:600}
@media (max-width:768px){
  .floating-donation-btn{left:16px;bottom:16px}
  .floating-donation-btn .btn{width:56px;height:56px;border-radius:50%;padding:0;display:flex;align-items:center;justify-content:center}
}
@keyframes donation-pulse{
  0%{transform:scale(1)}
  50%{transform:scale(1.05)}
  100%{transform:scale(1)}
}
.support-bar .container{gap:1rem}
@media (max-width:1199.98px){
  .dashboard-navbar .btn-outline-light{padding-inline:0.75rem}
  .dashboard-sidebar{position:static}
  .dashboard-main{gap:1.5rem}
}
@media (max-width:991.98px){
  .support-bar .container{flex-direction:column;align-items:flex-start}
  .card{border-radius:18px}
}
@media (max-width:575.98px){
  .dashboard-navbar{padding-inline:0.75rem}
  .dashboard-main{gap:1.25rem}
  .modal .modal-dialog{margin-inline:1rem}
  .card{padding-inline:1rem}
}