/* =====================================================================
   PIXELARTE — cliente.css · panel del cliente (taller de personalizados y Mi cuenta)
   Mismo armazón que el panel admin, en claro: aside blanco con los accesos del cliente,
   encabezado con carrito y menú de la cuenta (el del inicio) y el contenido en el cuerpo.
   Todo vive bajo body.cli; el carrito, los avisos y la vista previa siguen oscuros.
   ===================================================================== */
body.cli{
  /* todo sale de la paleta de styles.css (:root y «PALETA PREMIUM»): si la paleta cambia, el panel la sigue */
  --c-bg:var(--premium-paper,#f4f5f8); --c-s0:#fff;
  --c-t1:var(--premium-ink,#14151a); --c-t3:var(--premium-muted,#6b6e7a);
  --c-t2:color-mix(in srgb,var(--c-t1) 80%,#fff); --c-t4:color-mix(in srgb,var(--c-t3) 68%,#fff);
  --c-s1:color-mix(in srgb,var(--c-bg) 55%,#fff); --c-s2:color-mix(in srgb,var(--c-t1) 5%,#fff);
  --c-b1:color-mix(in srgb,var(--c-t1) 10%,#fff); --c-b2:color-mix(in srgb,var(--c-t1) 15%,#fff); --c-b3:color-mix(in srgb,var(--c-t1) 28%,#fff);
  --c-acc:var(--amarillo-2); --c-acc-s:color-mix(in srgb,var(--amarillo) 22%,transparent); --c-acc-t:var(--c-t1);
  --c-acc-claro:color-mix(in srgb,var(--amarillo) 9%,#fff);
  --c-azul-t:color-mix(in srgb,var(--azul) 88%,#000); --c-verde-t:color-mix(in srgb,var(--verde) 78%,#000); --c-rosa-t:color-mix(in srgb,var(--rosa) 72%,#000);
  --c-ink:var(--premium-ink,#0a0b0f);
  --c-side-w:272px; --c-top-h:64px;
  background:var(--c-bg);
}
body.cli::after{display:none}
.cli :focus-visible{outline:3px solid var(--azul);outline-offset:2px}

/* ---------- armazón ---------- */
.cli .c-shell{display:grid;grid-template-columns:var(--c-side-w) minmax(0,1fr);min-height:100vh;min-height:100dvh}
.cli .c-side{position:sticky;top:0;height:100vh;height:100dvh;display:flex;flex-direction:column;background:var(--c-s0);
  border-right:1px solid var(--c-b1);padding:18px 14px 14px;overflow:hidden;z-index:60;color:var(--c-t1)}
.cli .c-side-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 6px 16px}
.cli .c-marca{display:flex;align-items:center;gap:10px;font:700 18.5px var(--display);color:var(--c-t1);white-space:nowrap}
.cli .c-marca img{width:34px;height:34px;flex:none}
.cli .c-marca b{color:var(--c-t1);background:linear-gradient(transparent 58%,var(--amarillo) 58%,var(--amarillo) 92%,transparent 92%);padding:0 1px}
.cli .c-marca-tag{font:600 10.5px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3);border:1px solid var(--c-b2);background:var(--c-s1);border-radius:999px;padding:1px 8px}
.cli .c-icono{width:40px;height:40px;display:inline-grid;place-items:center;flex:none;border-radius:12px;border:1px solid transparent;background:transparent;color:var(--c-t2);cursor:pointer;font-size:16px;transition:background .15s,color .15s}
.cli .c-icono:hover{background:var(--c-s2);color:var(--c-t1)}
.cli .c-side-cerrar{display:none}
.cli .c-nav{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:2px;padding:2px;margin:0 -2px;scrollbar-width:thin;scrollbar-color:var(--c-b2) transparent}
.cli .c-nav-grupo{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--c-t4);padding:18px 12px 8px;white-space:nowrap}
.cli .c-nav-grupo:first-child{padding-top:4px}
.cli .c-link{position:relative;display:flex;align-items:center;gap:13px;height:44px;flex:none;padding:0 12px;border-radius:12px;border:none;width:100%;
  background:transparent;color:var(--c-t2);font:500 14.5px var(--body);text-align:left;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}
.cli .c-link > i:first-child{width:20px;text-align:center;font-size:15px;color:var(--c-t4);flex:none;transition:color .15s}
.cli .c-link > span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.cli .c-link:hover{background:var(--c-s2);color:var(--c-t1)}
.cli .c-link:hover > i:first-child{color:var(--c-t2)}
.cli .c-link.active{background:color-mix(in srgb,var(--amarillo) 18%,#fff);color:var(--c-t1);font-weight:600;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--amarillo) 70%,#fff)}
.cli .c-link.active::before{content:"";position:absolute;left:-14px;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--amarillo)}
.cli .c-link.active > i:first-child{color:var(--c-acc-t)}
.cli .c-link > i.fa-whatsapp{color:#1fb855!important}
.cli .c-ext{margin-left:auto;font-size:11px;color:var(--c-t4)}
.cli .c-cuenta{margin-left:auto;min-width:22px;height:22px;padding:0 7px;border-radius:999px;display:inline-grid;place-items:center;font:700 11.5px var(--display);background:var(--amarillo);color:var(--c-ink)}
.cli .c-side-pie{border-top:1px solid var(--c-b1);padding-top:12px;margin-top:10px;display:flex;flex-direction:column;gap:8px}
.cli .c-promo{position:relative;isolation:isolate;padding:14px 14px 13px;border-radius:16px;background:linear-gradient(140deg,var(--bg),var(--bg-2));color:#fff;overflow:hidden}
.cli .c-promo::after{content:"";position:absolute;z-index:-1;right:-36px;top:-40px;width:130px;height:130px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--amarillo) 38%,transparent),transparent 70%)}
.cli .c-promo-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--amarillo);color:var(--c-ink);font-size:13px;margin-bottom:9px}
.cli .c-promo b{display:block;font:700 14.5px var(--display)}
.cli .c-promo p{font-size:12.5px;color:var(--fg-soft);margin:3px 0 9px;line-height:1.45}
.cli .c-promo a{font:600 12.5px var(--display);color:var(--amarillo);display:inline-flex;align-items:center;gap:6px}
.cli .c-promo a:hover{text-decoration:underline}
.cli .c-volver{height:40px;font-size:13.5px}
@media (max-height:820px){ .cli .c-promo{display:none} }

/* ---------- encabezado ---------- */
.cli .c-main{min-width:0;display:flex;flex-direction:column;color:var(--c-t1)}
.cli .c-top{position:sticky;top:0;z-index:50;height:var(--c-top-h);display:flex;align-items:center;gap:14px;padding:0 28px;
  background:rgba(255,255,255,.86);backdrop-filter:saturate(160%) blur(14px);-webkit-backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid var(--c-b1);transition:box-shadow .2s}
.cli .c-top.con-sombra{box-shadow:0 8px 28px color-mix(in srgb,var(--c-t1) 6%,transparent)}
.cli .c-top-menu,.cli .c-top-marca{display:none}
.cli .c-top-marca img{width:30px;height:30px}
.cli .c-migas{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--c-t4);white-space:nowrap;min-width:0;overflow:hidden}
.cli .c-migas a{color:var(--c-t3);transition:color .15s}
.cli .c-migas a:hover{color:var(--c-t1)}
.cli .c-migas b{color:var(--c-t1);font-weight:600;overflow:hidden;text-overflow:ellipsis}
.cli .c-migas i{font-size:9px;color:var(--c-t4)}
.cli .c-top-acc{margin-left:auto;display:flex;align-items:center;gap:10px}
.cli .c-top-wa{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--c-b2);background:#fff;color:var(--c-t1);font:600 13.5px var(--display);transition:border-color .15s,box-shadow .15s}
.cli .c-top-wa i{color:#1fb855;font-size:17px}
.cli .c-top-wa:hover{border-color:var(--c-b3);box-shadow:0 6px 16px color-mix(in srgb,var(--c-t1) 6%,transparent)}
/* carrito y cuenta del inicio, en claro */
.cli .cart-btn{background:#fff;border:1px solid var(--c-b2);color:var(--c-t1)}
.cli .cart-btn:hover{border-color:var(--c-acc);background:var(--c-acc-claro)}
.cli .cart-badge{box-shadow:0 2px 6px color-mix(in srgb,var(--c-t1) 20%,transparent)}
.cli .px-login{color:var(--c-t1);background:#fff;border:1px solid var(--c-b2);box-shadow:0 2px 8px color-mix(in srgb,var(--c-t1) 6%,transparent)}
.cli .px-login:hover{background:#fff;border-color:var(--c-t1);transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--azul)}
.cli .px-login .lbl small{color:var(--c-t3)}
.cli .px-login-g{box-shadow:0 1px 4px color-mix(in srgb,var(--c-t1) 18%,transparent)}
.cli .px-acc-btn{background:#fff;border:1px solid var(--c-b2);color:var(--c-t2)}
.cli .px-acc-btn:hover,.cli .px-acc-btn[aria-expanded="true"]{border-color:var(--c-acc);background:var(--c-acc-claro)}
.cli .px-acc-nm{color:var(--c-t1)}
.cli .px-punto{border-color:#fff}
.cli .px-menu{background:#fff;border-color:var(--c-b1);color:var(--c-t1);box-shadow:0 24px 60px color-mix(in srgb,var(--c-t1) 16%,transparent),0 4px 14px color-mix(in srgb,var(--c-t1) 8%,transparent)}
.cli .px-menu .px-menu-head{background:radial-gradient(240px 120px at 100% 0,color-mix(in srgb,var(--amarillo) 22%,transparent),transparent 70%),radial-gradient(200px 120px at 0 100%,color-mix(in srgb,var(--azul) 12%,transparent),transparent 70%),var(--c-s1)}
.cli .px-menu .px-menu-head .nm{color:var(--c-t1)}
.cli .px-menu .px-menu-head .em{color:var(--c-t3)}
.cli .px-menu .px-menu-head .px-punto{border-color:var(--c-s1)}
.cli .px-rol{background:color-mix(in srgb,var(--amarillo) 20%,transparent);color:var(--c-acc-t)}
.cli .px-rol.r-cliente{background:color-mix(in srgb,var(--azul) 12%,transparent);color:var(--c-azul-t)}
.cli .px-rol.r-disenador{background:color-mix(in srgb,var(--rosa) 12%,transparent);color:var(--c-rosa-t)}
.cli .px-rol.r-vendedor{background:color-mix(in srgb,var(--verde) 14%,transparent);color:var(--c-verde-t)}
.cli .px-menu .px-mi{color:var(--c-t2)}
.cli .px-mi-ic{background:var(--c-s2);color:var(--c-t2)}
.cli .px-menu .px-mi:hover,.cli .px-menu .px-mi:focus-visible{background:var(--c-s2);color:var(--c-t1)}
.cli .px-menu-sep{background:var(--c-b1)}
.cli .px-menu .px-ext{color:var(--c-t4)!important}
.cli .px-menu #pxLogout{color:#d93636}
.cli .px-menu #pxLogout .px-mi-ic{background:rgba(229,72,77,.1);color:#d93636}
.cli .px-menu #pxLogout:hover,.cli .px-menu #pxLogout:focus-visible{background:rgba(229,72,77,.07);color:#b42323}

/* ---------- contenido ---------- */
.cli .c-contenido{width:100%;max-width:1480px;margin:0 auto;padding:26px 32px 32px;min-width:0;flex:1}
.cli .c-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin-bottom:22px}
.cli .c-head-tx{min-width:0}
.cli .c-eyebrow{display:inline-flex;align-items:center;gap:8px;font:700 11px var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--c-ink);background:var(--amarillo);border-radius:999px;padding:7px 13px}
.cli .c-head h1{font:700 clamp(24px,2.4vw,32px)/1.15 var(--display);color:var(--c-t1);margin:12px 0 6px;letter-spacing:-.015em}
.cli .c-head p{color:var(--c-t3);font-size:15px;max-width:62ch}
.cli .c-garantias{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.cli .c-garantias li{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 13px;border-radius:999px;background:#fff;border:1px solid var(--c-b1);font-size:13px;font-weight:500;color:var(--c-t2);white-space:nowrap}
.cli .c-garantias i{color:var(--c-verde-t)}

/* ---------- el configurador dentro del taller: estudio (vista previa a la izquierda, pasos a la derecha) ---------- */
.cli .taller-config{padding:0;background:none;scroll-margin-top:calc(var(--c-top-h) + 16px)}
.cli .taller-config > .container{max-width:none;padding:0;margin:0}
.cli .config-wrap{grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:24px}
.cli .config-preview{order:-1;top:calc(var(--c-top-h) + 18px)}
.cli .config.light .config-panel{border-color:var(--c-b1);box-shadow:0 1px 2px color-mix(in srgb,var(--c-t1) 4%,transparent),0 14px 36px color-mix(in srgb,var(--c-t1) 6%,transparent)}

/* ---------- ayuda ---------- */
.cli .c-ayuda{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:24px;margin-top:28px;scroll-margin-top:calc(var(--c-top-h) + 16px)}
.cli .c-ayuda-pasos,.cli .c-faq{background:#fff;border:1px solid var(--c-b1);border-radius:22px;padding:26px 26px 22px;box-shadow:0 1px 2px color-mix(in srgb,var(--c-t1) 3%,transparent)}
.cli .c-ayuda h2{font:700 20px/1.25 var(--display);color:var(--c-t1);margin:14px 0 18px;letter-spacing:-.01em}
.cli .c-faq h2{margin-top:0;margin-bottom:8px}
.cli .c-ayuda ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px;position:relative}
.cli .c-ayuda ol::before{content:"";position:absolute;left:15px;top:16px;bottom:16px;width:2px;background:linear-gradient(var(--amarillo),var(--c-b1))}
.cli .c-ayuda li{position:relative;display:flex;gap:14px;align-items:flex-start}
.cli .c-n{width:32px;height:32px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--c-t1);color:var(--amarillo);font:700 13px var(--display);box-shadow:0 0 0 4px #fff}
.cli .c-ayuda li b{font:600 15px var(--display);color:var(--c-t1)}
.cli .c-ayuda li p{font-size:13.5px;color:var(--c-t3);margin-top:3px;line-height:1.5}
.cli .c-faq details{border-bottom:1px solid var(--c-b1)}
.cli .c-faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 2px;font:600 14.5px var(--display);color:var(--c-t1);border-radius:8px}
.cli .c-faq summary::-webkit-details-marker{display:none}
.cli .c-faq summary::after{content:"";flex:none;width:26px;height:26px;border-radius:50%;background:var(--c-s2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 2v8M2 6h8' stroke='%233a3d48' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/11px no-repeat;transition:transform .2s,background-color .2s}
.cli .c-faq details[open] summary::after{transform:rotate(45deg);background-color:color-mix(in srgb,var(--amarillo) 30%,transparent)}
.cli .c-faq summary:hover{color:var(--c-t1)}
.cli .c-faq details p{font-size:14px;color:var(--c-t2);line-height:1.65;padding:0 40px 16px 2px}
.cli .c-pie{display:flex;justify-content:space-between;gap:8px 20px;flex-wrap:wrap;margin-top:28px;padding-top:18px;border-top:1px solid var(--c-b1);font-size:12.5px;color:var(--c-t4)}
.cli .c-pie a{color:var(--c-t3)}
.cli .c-pie a:hover{color:var(--c-t1)}

/* avisos y carrito: siguen oscuros (no heredan el texto oscuro del panel) */
.cli .toast,.cli .cart-drawer{color:var(--fg)}
.cli .c-overlay{display:none}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .cli .c-shell{grid-template-columns:minmax(0,1fr)}
  .cli .c-side{position:fixed;left:0;top:0;bottom:0;width:min(300px,86vw);z-index:1300;transform:translateX(-102%);visibility:hidden;
    box-shadow:0 0 60px color-mix(in srgb,var(--bg) 28%,transparent);transition:transform .26s cubic-bezier(.2,.7,.2,1),visibility 0s linear .26s}
  .cli .c-side.open{transform:none;visibility:visible;transition:transform .26s cubic-bezier(.2,.7,.2,1)}
  .cli .c-side-cerrar{display:inline-grid}
  .cli .c-overlay{display:block;position:fixed;inset:0;z-index:1290;background:color-mix(in srgb,var(--bg) 45%,transparent);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .2s}
  .cli .c-overlay.open{opacity:1;pointer-events:auto}
  .cli .c-top-menu{display:inline-grid;margin-left:-8px}
  .cli .c-top{padding:0 20px}
  .cli .c-contenido{padding:22px 22px 28px}
}
@media (max-width:1000px){
  .cli .config-wrap{gap:18px}
  .cli .c-ayuda{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:760px){
  body.cli{--c-top-h:60px}
  .cli .c-top{gap:8px;padding:0 14px}
  .cli .c-migas{display:none}
  .cli .c-top-marca{display:inline-flex}
  .cli .c-top-acc{gap:8px}
  .cli .c-top-wa{width:44px;padding:0;justify-content:center}
  .cli .c-top-wa span{display:none}
  .cli .c-contenido{padding:18px 16px 24px}
  .cli .c-head{margin-bottom:16px}
  .cli .c-head p{font-size:14px}
  .cli .c-garantias{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px;padding:0 16px 2px;scrollbar-width:none;max-width:calc(100% + 32px)}
  .cli .c-garantias::-webkit-scrollbar{display:none}
  .cli .c-ayuda-pasos,.cli .c-faq{padding:20px 18px 16px;border-radius:18px}
  .cli .c-faq details p{padding-right:4px}
  .cli .c-pie{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){
  .cli .c-side,.cli .c-overlay,.cli .c-faq summary::after{transition:none}
}

/* =====================================================================
   MI CUENTA (cuenta.js) dentro del panel del cliente, en claro
   ===================================================================== */
.pag-cuenta .c-contenido{max-width:1200px}
.cli .app-main{background:none}
.cli .c-top-taller i{color:var(--c-acc)}
.cli .app-head{margin-bottom:22px}
.cli .app-head h1{background:none;-webkit-text-fill-color:currentColor;color:var(--c-t1);font:700 clamp(24px,2.4vw,32px)/1.15 var(--display);letter-spacing:-.015em}
.cli .app-head p{color:var(--c-t3);font-size:15px;margin-top:6px}
.cli .ac-cards{gap:14px;margin-bottom:22px}
.cli .ac-card{background:#fff;border-color:var(--c-b1);box-shadow:0 1px 2px color-mix(in srgb,var(--c-t1) 4%,transparent)}
.cli .ac-card::after{background:radial-gradient(120% 80% at 100% 0,color-mix(in srgb,var(--amarillo) 10%,transparent),transparent 60%)}
.cli .ac-card:hover{border-color:var(--c-b2);box-shadow:0 14px 32px color-mix(in srgb,var(--c-t1) 8%,transparent)}
.cli .ac-card.hl{background:linear-gradient(160deg,color-mix(in srgb,var(--amarillo) 26%,#fff),#fff 70%);border-color:color-mix(in srgb,var(--c-acc) 40%,transparent)}
.cli .ac-card .lbl{color:var(--c-t3)}
.cli .ac-card .lbl i{color:var(--c-acc-t);background:color-mix(in srgb,var(--amarillo) 22%,transparent);border-color:transparent}
.cli .ac-card:nth-child(2) .lbl i{color:var(--c-azul-t);background:color-mix(in srgb,var(--azul) 12%,transparent)}
.cli .ac-card:nth-child(3) .lbl i{color:var(--c-verde-t);background:color-mix(in srgb,var(--verde) 15%,transparent)}
.cli .ac-card:nth-child(4) .lbl i{color:var(--c-rosa-t);background:color-mix(in srgb,var(--rosa) 12%,transparent)}
.cli .ac-card .v{color:var(--c-t1)}
.cli .panel{background:#fff;border-color:var(--c-b1);border-radius:20px;box-shadow:0 1px 2px color-mix(in srgb,var(--c-t1) 3%,transparent)}
.cli .panel h2{color:var(--c-t1)}
.cli .panel .sub{color:var(--c-t3)}
/* pedidos: filas de lista dentro del panel (no tarjetas dentro de la tarjeta) */
.cli .panel .data-row{margin:0;padding:14px 10px;border:none;border-bottom:1px solid var(--c-b1);border-radius:0;background:none;color:var(--c-t1)}
.cli .panel .data-row:last-of-type{border-bottom:none}
.cli .panel .data-row:hover{transform:none;box-shadow:none;background:var(--c-s2)}
.cli .data-row .th{background:var(--c-s2);border-color:var(--c-b1);color:var(--c-acc-t)}
.cli .data-row .main .t{color:var(--c-t1)}
.cli .data-row .main .s{color:var(--c-t3)}
.cli .data-row .right{color:var(--c-t1)}
.cli .tag-estado{border-color:transparent}
.cli .tag-estado.warn{color:var(--c-acc-t);background:color-mix(in srgb,var(--amarillo) 20%,transparent)}
.cli .tag-estado.warn .dot{background:var(--c-acc)}
.cli .tag-estado.ok{color:var(--c-verde-t);background:color-mix(in srgb,var(--verde) 15%,transparent)}
.cli .tag-estado.ok .dot{background:var(--verde)}
.cli .tag-estado.info{color:var(--c-azul-t);background:color-mix(in srgb,var(--azul) 10%,transparent)}
.cli .tag-estado.info .dot{background:var(--azul)}
.cli .tag-estado.mut{color:var(--c-t3);background:var(--c-s2)}
.cli .tag-estado.mut .dot{background:var(--c-t4)}
.cli .frm label{color:var(--c-t2)}
.cli .frm input,.cli .frm select,.cli .frm textarea{background:#fff;border-color:var(--c-b2);color:var(--c-t1)}
.cli .frm input:hover,.cli .frm select:hover{border-color:var(--c-b3)}
.cli .frm input:focus,.cli .frm select:focus,.cli .frm textarea:focus{background:#fff;border-color:var(--azul);box-shadow:0 0 0 3px color-mix(in srgb,var(--azul) 15%,transparent)}
.cli .frm input:disabled{background:var(--c-s1);color:var(--c-t3);opacity:1}
.cli .empty-state{color:var(--c-t3);border-color:var(--c-b2);background:var(--c-s1)}
.cli .empty-state i{color:var(--c-b3)}
.cli .empty-state a{color:var(--c-acc-t)!important;font-weight:600}
.cli .coupon{background:var(--c-acc-claro);border-color:color-mix(in srgb,var(--c-acc) 45%,transparent)}
.cli .coupon .code{color:var(--c-acc-t)}
.cli .coupon .desc{color:var(--c-t3)}
.cli .coupon .copy{background:#fff;border-color:var(--c-b2);color:var(--c-t2)}
.cli .coupon .copy:hover{border-color:var(--c-acc);color:var(--c-acc-t)}
.cli .app-main .btn-ghost{background:#fff;border-color:var(--c-b2);color:var(--c-t1)}
.cli .app-main .btn-ghost:hover{border-color:var(--c-b3)}
/* entrada sin sesión y carga */
.cli .spa-login .box{background:#fff;border-color:var(--c-b1);box-shadow:0 24px 60px color-mix(in srgb,var(--c-t1) 8%,transparent);color:var(--c-t1)}
.cli .spa-login p{color:var(--c-t3)}
.cli .spa-login .btn-google{border:1px solid var(--c-b2)}
.cli .spa-login .btn-google:hover{box-shadow:0 12px 26px color-mix(in srgb,var(--c-t1) 10%,transparent)}
.cli .spa-login a{color:var(--c-t3)!important}
@media (max-width:760px){
  .cli .app-main{padding:18px 16px 24px}
  .cli .panel{padding:18px 14px;border-radius:18px}
  .cli .panel .data-row{padding:12px 4px}
}