/*
 * [2026-10-20] "Estilo de estados de Fluxus" (Propuesta 2 aprobada por el
 * dueño): los estados de Mi Panel, Mi cuenta, la compra de paquetes y los
 * avisos del sistema (sitio y administrador) con la paleta real de
 * fluxusdigital.com.mx - negro #0D0D0D, blanco, piedra #6E6E64, arena
 * #F4F3EF y dorado #D4AF37, letra Kanit. Sin verdes ni rojos:
 *  - Todo bien (guardado, activo, en linea, pagado, ▲): negro solido, texto
 *    blanco y toque dorado (circulo ✓ dorado, punto dorado, numeros dorados).
 *  - Error (no se pudo, vencido, fallido, rechazado, ▼): blanco con borde
 *    negro grueso y "!" / "×" negro.
 *  - Atencion (por vencer, agotado, pendiente): dorado suave, borde dorado,
 *    texto dorado oscuro y "!".
 *  - Aviso / inactivo / neutro: arena y piedra.
 *
 * SOLO estilo: no cambia textos, logica ni marcado (las pantallas siguen
 * con sus clases de siempre; aqui se les da el aspecto nuevo). Se carga
 * DESPUES de flq-messages.css (plg_system_flqdebrand en todo Joomla y
 * TemplateFlqBlankDesignHelper::messagesCssTag() en las paginas propias).
 * Opcion: Componentes > Fluques > Opciones > "Estilo de estados de Fluxus"
 * (status_fluxus_style); apagada = no se carga este archivo y todo vuelve
 * al aspecto anterior.
 *
 * Especificidad: ":root body" delante de cada regla gana a las reglas de
 * cada plantilla (incluidas sus variantes oscuras "[data-bs-theme=dark] .x")
 * sin usar !important.
 * Claro / oscuro: data-bs-theme / data-theme / data-color-scheme del <html>
 * (o el del sistema en las paginas que lo piden: data-flq-msg-scheme="auto",
 * compra de paquetes body.flq-wp).
 */

:root {
    --fst-black: #0d0d0d;
    --fst-white: #ffffff;
    --fst-stone: #6e6e64;
    --fst-sand: #f4f3ef;
    --fst-gold: #d4af37;
    --fst-gold-soft: #f6eccb;
    --fst-line: rgba(13, 13, 13, .12);
    --fst-font: "Kanit", system-ui, -apple-system, "Segoe UI", sans-serif;

    /* Todo bien */
    --fst-ok-bg: #0d0d0d;   --fst-ok-fg: #ffffff;   --fst-ok-bd: #0d0d0d;   --fst-ok-accent: #d4af37;
    /* Error */
    --fst-bad-bg: #ffffff;  --fst-bad-fg: #0d0d0d;  --fst-bad-bd: #0d0d0d;
    /* Atencion (texto 6.1:1 sobre el dorado suave) */
    --fst-warn-bg: #f6eccb; --fst-warn-fg: #6b5410; --fst-warn-bd: #d4af37;
    /* Aviso / inactivo (texto 5.8:1 sobre arena) */
    --fst-info-bg: #f4f3ef; --fst-info-fg: #5f5f56; --fst-info-bd: rgba(13, 13, 13, .12); --fst-info-ic: #6e6e64;
    /* Textos sueltos sobre blanco: positivo dorado oscuro (6:1), negativo tinta */
    --fst-pos-text: #7a5f0e;
    --fst-neg-text: #0d0d0d;
    /* Tarjetas del dashboard */
    --fst-card-bg: #0d0d0d; --fst-card-bd: #0d0d0d; --fst-card-fg: #ffffff; --fst-card-muted: #c9c8bf;
    --fst-card-alert-bg: #ffffff; --fst-card-alert-fg: #0d0d0d; --fst-card-alert-bd: #0d0d0d;
    --fst-bar: #0d0d0d;
    --fst-shadow: 0 10px 30px rgba(13, 13, 13, .16);
    /* Etiquetas de los avisos (LISTO, NO SE PUDO...): dorado sobre negro 9:1, tinta, dorado oscuro 6:1, piedra 5.8:1 */
    --fst-lc-ok: #d4af37; --fst-lc-bad: #0d0d0d; --fst-lc-warn: #6b5410; --fst-lc-info: #5f5f56;
}

html[data-bs-theme="dark"],
html[data-color-scheme="dark"],
html[data-theme="dark"] {
    --fst-line: rgba(255, 255, 255, .14);
    --fst-ok-bg: #000000;   --fst-ok-fg: #ffffff;   --fst-ok-bd: rgba(212, 175, 55, .55); --fst-ok-accent: #d4af37;
    --fst-bad-bg: transparent; --fst-bad-fg: #f5f5f0; --fst-bad-bd: #f5f5f0;
    --fst-warn-bg: #2b2412; --fst-warn-fg: #e9d48f; --fst-warn-bd: #d4af37;
    --fst-info-bg: rgba(255, 255, 255, .07); --fst-info-fg: #c9c8bf; --fst-info-bd: rgba(255, 255, 255, .14); --fst-info-ic: #8c8c82;
    --fst-pos-text: #d4af37;
    --fst-neg-text: #f5f5f0;
    --fst-card-bg: #000000; --fst-card-bd: rgba(212, 175, 55, .35); --fst-card-fg: #ffffff; --fst-card-muted: #c9c8bf;
    --fst-card-alert-bg: transparent; --fst-card-alert-fg: #f5f5f0; --fst-card-alert-bd: #f5f5f0;
    --fst-bar: #d4af37;
    --fst-shadow: 0 12px 34px rgba(0, 0, 0, .5);
    --fst-lc-ok: #d4af37; --fst-lc-bad: #f5f5f0; --fst-lc-warn: #e9d48f; --fst-lc-info: #c9c8bf;
}

@media (prefers-color-scheme: dark) {
    html[data-flq-msg-scheme="auto"]:not([data-theme="light"]),
    html:has(> body.flq-wp):not([data-theme="light"]) {
        --fst-line: rgba(255, 255, 255, .14);
        --fst-ok-bg: #000000;   --fst-ok-fg: #ffffff;   --fst-ok-bd: rgba(212, 175, 55, .55); --fst-ok-accent: #d4af37;
        --fst-bad-bg: transparent; --fst-bad-fg: #f5f5f0; --fst-bad-bd: #f5f5f0;
        --fst-warn-bg: #2b2412; --fst-warn-fg: #e9d48f; --fst-warn-bd: #d4af37;
        --fst-info-bg: rgba(255, 255, 255, .07); --fst-info-fg: #c9c8bf; --fst-info-bd: rgba(255, 255, 255, .14); --fst-info-ic: #8c8c82;
        --fst-pos-text: #d4af37;
        --fst-neg-text: #f5f5f0;
        --fst-bar: #d4af37;
        --fst-shadow: 0 12px 34px rgba(0, 0, 0, .5);
        --fst-lc-ok: #d4af37; --fst-lc-bad: #f5f5f0; --fst-lc-warn: #e9d48f; --fst-lc-info: #c9c8bf;
    }
}

/* =====================================================================
   1) Avisos del sistema (barra nativa de Joomla, sitio y administrador)
   ===================================================================== */

html:has(link[href*="flq-messages.css"]) body #system-message-container joomla-alert,
html:has(link[href*="flq-messages.css"]) body #system-message-container .alert {
    --flqm-bg: var(--fst-info-bg);
    --fst-lbl: var(--fst-lbl-info, "Aviso");
    --fst-lbl-c: var(--fst-lc-info);
    --flqm-fg: var(--fst-black);
    --fst-ic-bg: var(--fst-info-ic);
    --fst-ic-fg: var(--fst-white);
    --fst-bd: 1px solid var(--fst-info-bd);
    border: var(--fst-bd);
    border-radius: 12px;
    padding: 12px 10px 12px 14px;
    align-items: center;
    font-size: .9rem;
    font-weight: 700;
}

html:has(link[href*="flq-messages.css"]) body #system-message-container joomla-alert[type="success"],
html:has(link[href*="flq-messages.css"]) body #system-message-container .alert-success {
    --flqm-bg: var(--fst-ok-bg);
    --fst-lbl: var(--fst-lbl-ok, "Listo");
    --fst-lbl-c: var(--fst-lc-ok);
    --flqm-fg: var(--fst-ok-fg);
    --fst-ic-bg: var(--fst-ok-accent);
    --fst-ic-fg: var(--fst-black);
    --fst-bd: 1px solid var(--fst-ok-bd);
}

html:has(link[href*="flq-messages.css"]) body #system-message-container joomla-alert[type="danger"],
html:has(link[href*="flq-messages.css"]) body #system-message-container .alert-danger,
html:has(link[href*="flq-messages.css"]) body #system-message-container .alert-error {
    --flqm-bg: var(--fst-bad-bg);
    --fst-lbl: var(--fst-lbl-bad, "No se pudo");
    --fst-lbl-c: var(--fst-lc-bad);
    --flqm-fg: var(--fst-bad-fg);
    --fst-ic-bg: var(--fst-bad-fg);
    --fst-ic-fg: var(--fst-white);
    --fst-bd: 2px solid var(--fst-bad-bd);
}

html:has(link[href*="flq-messages.css"]) body #system-message-container joomla-alert[type="warning"],
html:has(link[href*="flq-messages.css"]) body #system-message-container .alert-warning {
    --flqm-bg: var(--fst-warn-bg);
    --fst-lbl: var(--fst-lbl-warn, "Atención");
    --fst-lbl-c: var(--fst-lc-warn);
    --flqm-fg: var(--fst-black);
    --fst-ic-bg: var(--fst-gold);
    --fst-ic-fg: var(--fst-black);
    --fst-bd: 1px solid var(--fst-warn-bd);
}

/* Oscuro: fondos OPACOS (los avisos flotan encima del contenido) y texto claro */
html:has(link[href*="flq-messages.css"]):is([data-bs-theme="dark"], [data-color-scheme="dark"], [data-theme="dark"]) body #system-message-container :is(joomla-alert, .alert) {
    --flqm-bg: #1f1f1d;
    --flqm-fg: #f5f5f0;
}
html:has(link[href*="flq-messages.css"]):is([data-bs-theme="dark"], [data-color-scheme="dark"], [data-theme="dark"]) body #system-message-container :is(joomla-alert[type="success"], .alert-success) {
    --flqm-bg: #000000;
    --flqm-fg: #ffffff;
}
html:has(link[href*="flq-messages.css"]):is([data-bs-theme="dark"], [data-color-scheme="dark"], [data-theme="dark"]) body #system-message-container :is(joomla-alert[type="danger"], .alert-danger, .alert-error) {
    --flqm-bg: #161616;
    --fst-ic-fg: var(--fst-black);
}
html:has(link[href*="flq-messages.css"]):is([data-bs-theme="dark"], [data-color-scheme="dark"], [data-theme="dark"]) body #system-message-container :is(joomla-alert[type="warning"], .alert-warning) {
    --flqm-bg: #2b2412;
}
@media (prefers-color-scheme: dark) {
    html:has(link[href*="flq-messages.css"]):is([data-flq-msg-scheme="auto"], :has(> body.flq-wp)):not([data-theme="light"]) body #system-message-container :is(joomla-alert, .alert) {
        --flqm-bg: #1f1f1d;
        --flqm-fg: #f5f5f0;
    }
    html:has(link[href*="flq-messages.css"]):is([data-flq-msg-scheme="auto"], :has(> body.flq-wp)):not([data-theme="light"]) body #system-message-container :is(joomla-alert[type="success"], .alert-success) {
        --flqm-bg: #000000;
        --flqm-fg: #ffffff;
    }
    html:has(link[href*="flq-messages.css"]):is([data-flq-msg-scheme="auto"], :has(> body.flq-wp)):not([data-theme="light"]) body #system-message-container :is(joomla-alert[type="danger"], .alert-danger, .alert-error) {
        --flqm-bg: #161616;
        --fst-ic-fg: var(--fst-black);
    }
    html:has(link[href*="flq-messages.css"]):is([data-flq-msg-scheme="auto"], :has(> body.flq-wp)):not([data-theme="light"]) body #system-message-container :is(joomla-alert[type="warning"], .alert-warning) {
        --flqm-bg: #2b2412;
    }
}

/* (gana a la regla del modo flotante de flq-messages.css). Toda esta
   seccion solo actua si la pagina carga flq-messages.css (opcion
   messages_fluxus_style): sin ella, la barra nativa de Joomla queda igual. */
html:has(link[href*="flq-messages.css"]) body #system-message-container joomla-alert,
html:has(link[href*="flq-messages.css"]) body #system-message-container .alert {
    border: var(--fst-bd);
}

html.flq-msg-float body #system-message-container > * {
    box-shadow: var(--fst-shadow);
}

html:has(link[href*="flq-messages.css"]) body #system-message-container joomla-alert .alert-heading > span:not(.visually-hidden),
html:has(link[href*="flq-messages.css"]) body #system-message-container .alert .alert-heading > span:not(.visually-hidden) {
    width: 26px;
    height: 26px;
    background: var(--fst-ic-bg);
    color: var(--fst-ic-fg);
    font: 800 14px/1 "Segoe UI", system-ui, -apple-system, sans-serif;
}

html:has(link[href*="flq-messages.css"]) body #system-message-container joomla-alert .joomla-alert--close,
html:has(link[href*="flq-messages.css"]) body #system-message-container .alert .joomla-alert--close,
html:has(link[href*="flq-messages.css"]) body #system-message-container .alert .btn-close {
    opacity: .7;
    color: var(--flqm-fg);
    margin: -4px -2px -4px 4px;
}

/* =====================================================================
   2) Avisos propios de cada pantalla (mismas colas que flq-messages.css
      + las de cupones, correo, Mi cuenta y membresias)
   ===================================================================== */

:root body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-rca-alert, .flq-ms-alert, .flq-mo-membership-msg) {
    --fst-ic: "i";
    --fst-lbl: var(--fst-lbl-info, "Aviso");
    --fst-lbl-c: var(--fst-lc-info);
    --fst-ic-bg: var(--fst-info-ic);
    --fst-ic-fg: var(--fst-white);
    position: relative;
    box-sizing: border-box;
    max-width: 100%;
    padding: 11px 14px 11px 46px;
    border: 1px solid var(--fst-info-bd);
    border-radius: 12px;
    background: var(--fst-info-bg);
    color: var(--fst-black);
    font-weight: 700;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

:root body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-rca-alert, .flq-ms-alert, .flq-mo-membership-msg):not(:empty)::before {
    content: var(--fst-ic);
    position: absolute;
    left: 12px;
    top: 9px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--fst-ic-bg);
    color: var(--fst-ic-fg);
    font: 800 14px/1 "Segoe UI", system-ui, -apple-system, sans-serif;
}

:root body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-rca-alert, .flq-ms-alert, .flq-mo-membership-msg) a {
    color: inherit;
}

html[data-bs-theme="dark"] body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-rca-alert, .flq-ms-alert, .flq-mo-membership-msg),
html[data-theme="dark"] body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-rca-alert, .flq-ms-alert, .flq-mo-membership-msg) {
    color: #f5f5f0;
}

/* Todo bien */
:root body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg):is([class*="-msg-message"], [class*="-msg-success"], [class*="msg--message"], [class*="msg--success"]),
:root body .flq-mo-alert:not(.is-error):not(.is-warning),
:root body :is(.flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-ms-alert).is-ok,
:root body .flq-rca-alert:not(.is-error):not(.is-warning),
:root body .flq-mo-membership-msg:not(.is-error) {
    --fst-ic: "\2713";
    --fst-lbl: var(--fst-lbl-ok, "Listo");
    --fst-lbl-c: var(--fst-lc-ok);
    --fst-ic-bg: var(--fst-ok-accent);
    --fst-ic-fg: var(--fst-black);
    background: var(--fst-ok-bg);
    border-color: var(--fst-ok-bd);
    color: var(--fst-ok-fg);
}

/* Error */
:root body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg):is([class*="-msg-error"], [class*="-msg-danger"], [class*="msg--error"], [class*="msg--danger"]),
:root body .flq-svc-msg-warning,
:root body .flq-mo-alert.is-error,
:root body :is(.flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-rca-alert, .flq-ms-alert, .flq-mo-membership-msg).is-error {
    --fst-ic: "!";
    --fst-lbl: var(--fst-lbl-bad, "No se pudo");
    --fst-lbl-c: var(--fst-lc-bad);
    --fst-ic-bg: var(--fst-bad-fg);
    --fst-ic-fg: var(--fst-bad-bg);
    background: var(--fst-bad-bg);
    border: 2px solid var(--fst-bad-bd);
    color: var(--fst-bad-fg);
}

html[data-bs-theme="dark"] body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-rca-alert, .flq-ms-alert, .flq-mo-membership-msg),
html[data-theme="dark"] body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-rca-alert, .flq-ms-alert, .flq-mo-membership-msg) {
    --fst-bad-bg: #161616;
}

/* Atencion */
:root body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg):is([class*="-msg-warning"], [class*="msg--warning"]):not(.flq-svc-msg-warning),
:root body .flq-dm-msg-notice,
:root body .flq-mo-alert.is-warning,
:root body :is(.flq-rca-alert, .flq-ms-alert).is-warning,
:root body .flq-ms-alert.is-warn {
    --fst-ic: "!";
    --fst-lbl: var(--fst-lbl-warn, "Atención");
    --fst-lbl-c: var(--fst-lc-warn);
    --fst-ic-bg: var(--fst-gold);
    --fst-ic-fg: var(--fst-black);
    background: var(--fst-warn-bg);
    border: 1px solid var(--fst-warn-bd);
    color: var(--fst-black);
}

html[data-bs-theme="dark"] body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-rca-alert, .flq-ms-alert):is([class*="-msg-warning"], [class*="msg--warning"], .flq-dm-msg-notice, .is-warning, .is-warn),
html[data-theme="dark"] body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-rca-alert, .flq-ms-alert):is([class*="-msg-warning"], [class*="msg--warning"], .flq-dm-msg-notice, .is-warning, .is-warn) {
    color: var(--fst-warn-fg);
}

/* =====================================================================
   3) Etiquetas de estado (pastillas)
   ===================================================================== */

/* Forma comun de las pastillas con estado */
:root body :is(
    .flq-blog-badge.is-published, .flq-blog-badge.is-unpublished,
    .flq-bkg-badge, .flq-cbc-req-status.is-approved, .flq-cbc-req-status.is-denied,
    .flq-cup-pill, .flq-dash-badge, .flq-dm-badge.is-ok, .flq-dm-badge.is-pending, .flq-dm-badge.is-warn,
    .flq-ead-badge, .flq-mem-badge, .flq-mo-badge, .flq-ord-badge, .flq-prod-card-stock,
    .flq-rca-badge, .flq-sk-badge, .flq-svc-badge.is-ok, .flq-svc-badge.is-pending, .flq-svc-badge.is-warn,
    .flq-fs-tag.is-money, .flq-fs-tag.is-bad, .flq-pay-badge.is-voided, .flq-wa-chip.is-ai, .flq-wa-chip.is-wait,
    .flq-bt-badge
),
:root body.flq-wp .badge.ok {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    box-sizing: border-box;
    max-width: 100%;
    border: 1px solid var(--fst-info-bd);
    border-radius: 999px;
    padding: 3px 10px;
    background: var(--fst-info-bg);
    color: var(--fst-info-fg);
    font-family: var(--fst-font);
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .07em;
    line-height: 1.3;
    text-transform: uppercase;
    vertical-align: middle;
    white-space: nowrap;
}

/* Todo bien: negro solido + punto dorado */
:root body :is(
    .flq-blog-badge.is-published, .flq-bkg-badge.is-confirmed, .flq-cbc-req-status.is-approved,
    .flq-cup-pill.is-active, .flq-dash-badge-ok, .flq-dm-badge.is-ok, .flq-ead-badge.is-active,
    .flq-mem-badge.is-paid, .flq-mo-badge.is-paid, .flq-ord-badge.is-paid, .flq-ord-badge.is-delivered,
    .flq-prod-card-stock.is-ok, .flq-prod-card-stock.is-unlimited, .flq-rca-badge.is-active,
    .flq-sk-badge.is-sent, .flq-svc-badge.is-ok, .flq-fs-tag.is-money, .flq-wa-chip.is-ai,
    .flq-bt-badge.is-confirmed
),
:root body.flq-wp .badge.ok {
    background: var(--fst-ok-bg);
    border-color: var(--fst-ok-bd);
    color: var(--fst-ok-fg);
    opacity: 1;
}

:root body :is(
    .flq-blog-badge.is-published, .flq-bkg-badge.is-confirmed, .flq-cbc-req-status.is-approved,
    .flq-cup-pill.is-active, .flq-dash-badge-ok, .flq-dm-badge.is-ok, .flq-ead-badge.is-active,
    .flq-mem-badge.is-paid, .flq-mo-badge.is-paid, .flq-ord-badge.is-paid, .flq-ord-badge.is-delivered,
    .flq-prod-card-stock.is-ok, .flq-prod-card-stock.is-unlimited, .flq-rca-badge.is-active,
    .flq-sk-badge.is-sent, .flq-svc-badge.is-ok, .flq-fs-tag.is-money, .flq-wa-chip.is-ai,
    .flq-bt-badge.is-confirmed
)::before,
:root body.flq-wp .badge.ok::before {
    content: "";
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--fst-ok-accent);
}

/* Error: blanco con borde negro grueso + "×" */
:root body :is(
    .flq-bkg-badge.is-cancelled, .flq-cbc-req-status.is-denied, .flq-cup-pill.is-expired, .flq-dash-badge-fail,
    .flq-dm-badge.is-warn, .flq-svc-badge.is-warn, .flq-ead-badge.is-danger, .flq-mem-badge.is-expired,
    .flq-mo-badge.is-failed, .flq-ord-badge.is-failed, .flq-prod-card-stock.is-out, .flq-rca-badge.is-danger,
    .flq-sk-badge.is-failed, .flq-fs-tag.is-bad, .flq-pay-badge.is-voided,
    .flq-bt-badge.is-cancelled, .flq-bt-badge.is-expired
) {
    background: var(--fst-bad-bg);
    border: 2px solid var(--fst-bad-bd);
    padding: 2px 9px;
    color: var(--fst-bad-fg);
    opacity: 1;
}

:root body :is(
    .flq-bkg-badge.is-cancelled, .flq-cbc-req-status.is-denied, .flq-cup-pill.is-expired, .flq-dash-badge-fail,
    .flq-dm-badge.is-warn, .flq-svc-badge.is-warn, .flq-ead-badge.is-danger, .flq-mem-badge.is-expired,
    .flq-mo-badge.is-failed, .flq-ord-badge.is-failed, .flq-prod-card-stock.is-out, .flq-rca-badge.is-danger,
    .flq-sk-badge.is-failed, .flq-fs-tag.is-bad, .flq-pay-badge.is-voided,
    .flq-bt-badge.is-cancelled, .flq-bt-badge.is-expired
)::before {
    content: "\00d7";
    font-weight: 800;
    font-size: 1.15em;
    line-height: 1;
}

/* Atencion: dorado suave + "!" */
:root body :is(
    .flq-bkg-badge.is-pending, .flq-cup-pill.is-exhausted, .flq-dash-badge-warn, .flq-dm-badge.is-pending,
    .flq-svc-badge.is-pending, .flq-ead-badge.is-simulated, .flq-ead-badge.is-pending-cancel, .flq-ead-badge.is-warn,
    .flq-mem-badge.is-warn, .flq-mo-badge.is-pending, .flq-mo-badge.is-warn, .flq-ord-badge.is-pending-pay,
    .flq-ord-badge.is-pending, .flq-prod-card-stock.is-low, .flq-rca-badge.is-warn, .flq-wa-chip.is-wait,
    .flq-bt-badge.is-pending
) {
    background: var(--fst-warn-bg);
    border: 1px solid var(--fst-warn-bd);
    color: var(--fst-warn-fg);
    opacity: 1;
}

:root body :is(
    .flq-bkg-badge.is-pending, .flq-cup-pill.is-exhausted, .flq-dash-badge-warn, .flq-dm-badge.is-pending,
    .flq-svc-badge.is-pending, .flq-ead-badge.is-simulated, .flq-ead-badge.is-pending-cancel, .flq-ead-badge.is-warn,
    .flq-mem-badge.is-warn, .flq-mo-badge.is-pending, .flq-mo-badge.is-warn, .flq-ord-badge.is-pending-pay,
    .flq-ord-badge.is-pending, .flq-prod-card-stock.is-low, .flq-rca-badge.is-warn, .flq-wa-chip.is-wait,
    .flq-bt-badge.is-pending
)::before {
    content: "!";
    font-weight: 800;
}

/* Aviso / inactivo / neutro: arena y piedra (incluye pastillas base sin estado) */
:root body :is(
    .flq-bkg-badge.is-completed, .flq-bkg-badge.is-no-show, .flq-blog-badge.is-unpublished,
    .flq-cup-pill.is-inactive, .flq-cup-pill.is-reserved, .flq-dash-badge-info, .flq-dash-badge-muted,
    .flq-ead-badge.is-inactive, .flq-mem-badge.is-unpaid, .flq-mem-badge.is-auto, .flq-ord-badge.is-shipped,
    .flq-sk-badge.is-pending
) {
    background: var(--fst-info-bg);
    border: 1px solid var(--fst-info-bd);
    color: var(--fst-info-fg);
    opacity: 1;
}

/* Metodo de pago (categorias, no estado): sin verde ni ambar */
:root body .flq-pay-badge.is-cash { background: var(--fst-info-bg); }
:root body .flq-pay-badge.is-invoice { background: var(--fst-warn-bg); border-color: var(--fst-warn-bd); color: var(--fst-warn-fg); }

/* Puntos de estado (Conversaciones, Automatizaciones) */
:root body .flq-wa-state.is-open::before { background: var(--fst-gold); box-shadow: 0 0 0 2px var(--fst-black); }
:root body .flq-auto__pill[data-state="open"]::before { background: var(--fst-gold); box-shadow: 0 0 0 2px var(--fst-black); }
:root body :is(.flq-auto__pill[data-state="connecting"], .flq-auto__pill[data-state="qr"])::before { background: var(--fst-gold-soft); box-shadow: inset 0 0 0 2px var(--fst-gold); }
:root body :is(.flq-auto__pill[data-state="error"], .flq-auto__pill[data-state="close"])::before { background: var(--fst-white); box-shadow: inset 0 0 0 2px var(--fst-black); }
:root body .flq-wa-chrow header em.is-on { background: var(--fst-ok-bg); color: var(--fst-ok-fg); }
:root body .flq-wa-actions .is-ai-on { border-color: var(--fst-black); box-shadow: inset 0 0 0 1px var(--fst-gold); }
:root body .flq-wa-count { background: var(--fst-ok-bg); color: var(--fst-ok-fg); box-shadow: 0 0 0 1.5px var(--fst-gold); }
:root body .flq-wa-rec i { background: var(--fst-black); box-shadow: 0 0 0 2px var(--fst-gold); }
:root body .flq-mem-auto-status.is-on { background: var(--fst-ok-bg); color: var(--fst-ok-fg); }
html[data-bs-theme="dark"] body :is(.flq-wa-state.is-open, .flq-auto__pill[data-state="open"])::before { box-shadow: none; }
html[data-bs-theme="dark"] body .flq-wa-rec i { background: var(--fst-gold); }

/* Pasos de la compra de paquetes */
/* (hecho: negro con texto dorado; el paso actual sigue negro con texto blanco) */
:root body.flq-wp .step.done { background: var(--fst-ok-bg); color: var(--fst-ok-accent); box-shadow: inset 0 0 0 1px var(--fst-ok-bd); }

/* =====================================================================
   4) Cajas de aviso dentro de las pantallas
   ===================================================================== */

/* Error: blanco + borde negro grueso */
:root body :is(.flq-dash-overdue-alert, .flq-cbc-low.is-empty, .flq-dash-ai-low.is-empty, .flq-fs-status.is-bad, .flq-dm-note.is-warn, .flq-dm-confirm, .flq-ead-no-domain, .flq-confirm-account-fail),
:root body.flq-wp .box.bad {
    background: var(--fst-bad-bg);
    border: 2px solid var(--fst-bad-bd);
    color: var(--fst-bad-fg);
}

:root body .flq-dash-panel-alert { border: 2px solid var(--fst-bad-bd); }
:root body .flq-dash-panel-alert .flq-dash-panel-icon { color: var(--fst-bad-fg); }

/* Atencion: dorado suave */
:root body :is(.flq-cbc-low:not(.is-empty), .flq-dash-ai-low:not(.is-empty), .flq-wa-alert, .flq-blog-nocategory, .flq-soc-not-configured, .flq-dm-note:not(.is-warn), .flq-svc-note, .flq-rca-dns, .flq-cr-soon, .flq-wm-draft-notice, .flq-mo-auto.is-warn),
:root body.flq-wp .box.warn {
    background: var(--fst-warn-bg);
    border: 1px solid var(--fst-warn-bd);
    color: var(--fst-warn-fg);
}

:root body :is(.flq-dm-note, .flq-svc-note) { border-left-width: 3px; }

/* Todo bien: negro + texto blanco */
:root body :is(.flq-mo-auto:not(.is-warn)),
:root body.flq-wp .box.ok {
    background: var(--fst-ok-bg);
    border: 1px solid var(--fst-ok-bd);
    color: var(--fst-ok-fg);
}

:root body.flq-wp .box.ok a { color: inherit; }

/* Aviso: arena */
:root body .flq-mo-note-box { background: var(--fst-info-bg); border: 1px solid var(--fst-info-bd); color: var(--fst-black); }
html[data-bs-theme="dark"] body .flq-mo-note-box { color: #f5f5f0; }

/* =====================================================================
   5) Textos sueltos de estado
   ===================================================================== */

:root body :is(.flq-cbc-history-amount.is-plus, .flq-perf-sub.is-done, .flq-mem-wa-status.is-ok, .flq-mf-note, .flq-mo-note, .flq-cr-save, .flq-ead-save-note),
:root body.flq-wp .free {
    color: var(--fst-pos-text);
    font-weight: 700;
}

:root body :is(.flq-cbc-history-amount.is-minus, .flq-fs-neg, .flq-dash-overdue-tag, .flq-mem-wa-status.is-bad, .flq-mo-error, .flq-mf-error, .flq-pay-error, .flq-ms-error, .flq-confirm-pass-warn, .flq-rca-row-error, .flq-wa-error, .flq-wa-dialog .flq-wa-derr, .flq-mem-danger, .flq-pay-danger) {
    color: var(--fst-neg-text);
    font-weight: 700;
}

:root body :is(.flq-cup-warn, .flq-ead-sub-detail.flq-ead-sub-warn, .flq-rca-note.is-warn, .flq-dash-storageaddon-sub-warn) {
    color: var(--fst-warn-fg);
}

/* Botones y enlaces de borrar / cancelar: tinta con borde, nunca rojo */
:root body :is(.flq-cup-btn-danger, .flq-team-rm-go) {
    background: var(--fst-bad-bg);
    color: var(--fst-bad-fg);
    box-shadow: inset 0 0 0 2px var(--fst-bad-bd);
}

:root body :is(.flq-cup-link-danger, .flq-blog-list-row button, .flq-prod-card-row button, .flq-mo-link--danger, .flq-mo-cancel summary, .flq-pay-void summary, .flq-team-rm[open] summary, .flq-dash-team-remove:hover, .flq-rca-remove:hover, .flq-cr-iconbtn:hover, .flq-ead-icon-btn.is-danger:hover) {
    color: var(--fst-neg-text);
}

:root body .flq-cup-link-danger:hover { background: var(--fst-sand); }
:root body :is(.flq-team-rm[open] summary, .flq-dash-team-remove:hover) { border-color: var(--fst-bad-bd); }
:root body :is(.flq-cr-iconbtn:hover, .flq-ead-icon-btn.is-danger:hover) { background: var(--fst-info-bg); }

:root body :is(.flq-mo-danger-btn, .flq-dm button.is-danger, .flq-soc-btn-danger, .flq-rca-btn--danger, .flq-mem-void button, .flq-pay-void button, .flq-ead-btn-deny) {
    background: transparent;
    color: var(--fst-neg-text);
    border: 1.5px solid var(--fst-bad-bd);
}

:root body .flq-ord-quick-btn { background: var(--fst-bad-bg); color: var(--fst-bad-fg); box-shadow: inset 0 0 0 1.5px var(--fst-bad-bd); }
:root body .flq-ord-quick-btn:hover { background: var(--fst-info-bg); }
:root body .flq-ead-btn-approve { background: var(--fst-ok-bg); color: var(--fst-ok-fg); box-shadow: inset 0 0 0 1px var(--fst-ok-bd); }
:root body :is(.flq-rca-row [aria-invalid="true"], .flq-rca-row .is-invalid) { border-color: var(--fst-bad-bd); box-shadow: inset 0 0 0 1px var(--fst-bad-bd); }

/* Iconos grandes de resultado (paginas de confirmacion y Mi cuenta) */
:root body :is(.flq-confirm-icon--ok, .flq-ms-icon.is-ok, .flq-mo-receipt-icon.is-ok) {
    background: var(--fst-ok-bg);
    color: var(--fst-ok-accent);
    box-shadow: inset 0 0 0 1px var(--fst-ok-bd);
}

:root body :is(.flq-confirm-icon--fail, .flq-ms-icon.is-bad, .flq-mo-receipt-icon.is-bad) {
    background: var(--fst-bad-bg);
    color: var(--fst-bad-fg);
    box-shadow: inset 0 0 0 3px var(--fst-bad-bd);
}

:root body :is(.flq-confirm-icon--pending, .flq-ms-icon.is-wait) {
    background: var(--fst-warn-bg);
    color: var(--fst-warn-fg);
    box-shadow: inset 0 0 0 1.5px var(--fst-warn-bd);
}

/* Barras e interruptores */
:root body .flq-dash-fill.is-full { background: var(--fst-bar); }
:root body .flq-dash-track:has(> .flq-dash-fill.is-full) { box-shadow: inset 0 0 0 1.5px var(--fst-black); }
:root body .flq-cup-progress span { background: var(--fst-bar); }
:root body .flq-cup-switch input:checked + .flq-cup-switch-track { background: var(--fst-bar); }

/* Calendario de citas: libre / ocupado / lleno */
:root body .flq-bkg-calendar-cell.is-light { background: var(--fst-sand); }
:root body .flq-bkg-calendar-cell.is-light .flq-bkg-calendar-count { background: var(--fst-ok-bg); color: var(--fst-ok-fg); }
:root body .flq-bkg-calendar-cell.is-busy { background: var(--fst-warn-bg); box-shadow: inset 0 0 0 1px var(--fst-warn-bd); }
:root body .flq-bkg-calendar-cell.is-busy .flq-bkg-calendar-count { background: var(--fst-gold); color: var(--fst-black); }
:root body .flq-bkg-calendar-cell.is-full { background: var(--fst-bad-bg); box-shadow: inset 0 0 0 2px var(--fst-bad-bd); }
:root body .flq-bkg-calendar-cell.is-full .flq-bkg-calendar-count { background: var(--fst-bad-fg); color: var(--fst-bad-bg); }
html[data-bs-theme="dark"] body .flq-bkg-calendar-cell.is-light { background: var(--fst-info-bg); }
html[data-bs-theme="dark"] body .flq-bkg-calendar-cell.is-full .flq-bkg-calendar-count { color: var(--fst-black); }

/* =====================================================================
   6) Tarjetas del dashboard (Mi Panel y Ventas de Fluxus)
   ===================================================================== */

:root body .flq-dash-card {
    background: var(--fst-card-bg);
    border: 1px solid var(--fst-card-bd);
    border-radius: 12px;
    color: var(--fst-card-fg);
}

:root body .flq-dash-card::before { display: none; }

:root body .flq-dash-card .flq-dash-card-value { color: var(--fst-card-fg); }
:root body .flq-dash-card .flq-dash-card-label,
:root body .flq-dash-card .flq-fs-card-foot { color: var(--fst-card-muted); opacity: 1; }

:root body .flq-dash-card .flq-dash-card-icon {
    color: var(--fst-gold);
    background: rgba(212, 175, 55, .14);
}

/* Cambio contra el periodo anterior: ▲ dorado, ▼ blanco con borde, igual en gris */
:root body .flq-dash-card .flq-dash-trend {
    font-family: var(--fst-font);
    font-weight: 600;
    letter-spacing: .02em;
}
:root body .flq-dash-card .flq-dash-trend.is-up { color: var(--fst-gold); background: rgba(212, 175, 55, .16); }
:root body .flq-dash-card .flq-dash-trend.is-down { color: var(--fst-black); background: var(--fst-white); }
:root body .flq-dash-card .flq-dash-trend.is-flat,
:root body .flq-dash-card .flq-dash-trend.is-new { color: var(--fst-card-muted); background: rgba(255, 255, 255, .1); }
/* (fuera de una tarjeta) */
:root body .flq-dash-trend.is-up { color: var(--fst-pos-text); background: var(--fst-gold-soft); }
:root body .flq-dash-trend.is-down { color: var(--fst-neg-text); background: transparent; box-shadow: inset 0 0 0 1.5px var(--fst-bad-bd); }
:root body .flq-dash-card .flq-dash-trend.is-down { box-shadow: none; }
:root body .flq-dash-trend.is-flat { color: var(--fst-info-fg); background: var(--fst-info-bg); }
:root body .flq-dash-card .flq-dash-trend.is-flat { color: var(--fst-card-muted); background: rgba(255, 255, 255, .1); }

/* Tarjeta que necesita atencion (pagos fallidos > 0): blanco + borde negro grueso */
:root body .flq-dash-card.flq-fs-card--failed:not(.is-zero) {
    background: var(--fst-card-alert-bg);
    border: 2px solid var(--fst-card-alert-bd);
    color: var(--fst-card-alert-fg);
}
:root body .flq-dash-card.flq-fs-card--failed:not(.is-zero) .flq-dash-card-value { color: var(--fst-card-alert-fg); }
:root body .flq-dash-card.flq-fs-card--failed:not(.is-zero) :is(.flq-dash-card-label, .flq-fs-card-foot) { color: var(--fst-stone); }
:root body .flq-dash-card.flq-fs-card--failed:not(.is-zero) .flq-dash-card-icon { color: var(--fst-white); background: var(--fst-black); }
html[data-bs-theme="dark"] body .flq-dash-card.flq-fs-card--failed:not(.is-zero) :is(.flq-dash-card-label, .flq-fs-card-foot) { color: #c9c8bf; }
html[data-bs-theme="dark"] body .flq-dash-card.flq-fs-card--failed:not(.is-zero) .flq-dash-card-icon { color: var(--fst-black); background: #f5f5f0; }

/* =====================================================================
   7) Avisos flotantes del Constructor (".flq-toast" de builder-canvas.js,
      Constructor del administrador y editor del sitio real). Solo CSS: el
      JS y su marcado no cambian.
   ===================================================================== */

:root body .flq-toast { --fst-lbl: var(--fst-lbl-info, "Aviso"); --fst-lbl-c: #5f5f56; --fst-dot-bg: var(--fst-info-ic); --fst-dot-fg: var(--fst-white); border-radius: 12px; }
:root body .flq-toast--success { --fst-lbl: var(--fst-lbl-ok, "Listo"); --fst-lbl-c: #d4af37; --flqt-bg: var(--fst-ok-bg); --flqt-fg: var(--fst-ok-fg); --fst-dot-bg: var(--fst-ok-accent); --fst-dot-fg: var(--fst-black); border: 1px solid var(--fst-ok-bd); }
:root body .flq-toast--error { --fst-lbl: var(--fst-lbl-bad, "No se pudo"); --fst-lbl-c: #0d0d0d; --flqt-bg: #ffffff; --flqt-fg: var(--fst-black); --fst-dot-bg: var(--fst-black); --fst-dot-fg: var(--fst-white); border: 2px solid var(--fst-black); }
:root body .flq-toast--warning { --fst-lbl: var(--fst-lbl-warn, "Atención"); --fst-lbl-c: #6b5410; --flqt-bg: var(--fst-gold-soft); --flqt-fg: var(--fst-black); --fst-dot-bg: var(--fst-gold); --fst-dot-fg: var(--fst-black); border: 1px solid var(--fst-gold); }
:root body .flq-toast--info { --flqt-bg: var(--fst-sand); --flqt-fg: var(--fst-black); border: 1px solid rgba(13, 13, 13, .12); }
:root body .flq-toast .flq-toast__dot { width: 22px; height: 22px; background: var(--fst-dot-bg); color: var(--fst-dot-fg); font-size: 12px; }

/* =====================================================================
   8) Etiqueta corta encima de cada AVISO (no en las pastillas):
      LISTO / NO SE PUDO / ATENCIÓN / AVISO, como la maqueta. Contenido
      generado: el texto de cada aviso no cambia. Las cadenas traducidas
      (--fst-lbl-ok/-bad/-warn/-info) las imprime PHP junto a este archivo
      (media/com_fluques/php/FlqStatusLabels.php); sin ellas queda el
      español de respaldo. Opcion status_fluxus_style apagada = sin etiquetas.
      Lectores de pantalla: la etiqueta se anuncia una vez (agrega el tipo
      de aviso en palabras, que de otro modo solo da el color/icono), salvo
      en la barra de Joomla, que ya trae su encabezado oculto ("Mensaje",
      "Error"...): ahi se oculta con el texto alternativo vacio.
   ===================================================================== */

html:has(link[href*="flq-messages.css"]) body #system-message-container :is(joomla-alert, .alert) .alert-wrapper::before,
:root body .flq-toast .flq-toast__text::before,
:root body.flq-wp .box:is(.warn, .bad)::before {
    content: var(--fst-lbl);
    display: block;
    margin: 0 0 3px;
    color: var(--fst-lbl-c);
    font: 600 10.5px/1.25 var(--fst-font);
    letter-spacing: .16em;
    text-transform: uppercase;
}

@supports (content: "a" / "") {
    html:has(link[href*="flq-messages.css"]) body #system-message-container :is(joomla-alert, .alert) .alert-wrapper::before {
        content: var(--fst-lbl) / "";
    }
}

:root body.flq-wp .box.warn { --fst-lbl: var(--fst-lbl-warn, "Atención"); --fst-lbl-c: var(--fst-lc-warn); }
:root body.flq-wp .box.bad { --fst-lbl: var(--fst-lbl-bad, "No se pudo"); --fst-lbl-c: var(--fst-lc-bad); }
:root body.flq-wp .box:is(.warn, .bad)::before { margin: 0 0 -3px; }

/* Colas propias: el icono ya usa ::before, la etiqueta va en ::after
   arriba del texto (posicion absoluta, una sola linea, sin empujar nada). */
:root body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-rca-alert, .flq-ms-alert, .flq-mo-membership-msg):not(:empty) {
    padding-top: 27px;
}

:root body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-rca-alert, .flq-ms-alert, .flq-mo-membership-msg):not(:empty)::before {
    top: 12px;
}

:root body :is(.flq-msg, .flq-wm-msg, .flq-blog-msg, .flq-bkg-msg, .flq-cbc-msg, .flq-wa-msg, .flq-dm-msg, .flq-ead-msg, .flq-mem-msg, .flq-nfcs-msg, .flq-ord-msg, .flq-pay-msg, .flq-prod-msg, .flq-svc-msg, .flq-soc-msg, .flq-cup-msg, .flq-mo-alert, .flq-cr-msg, .flq-ead-rc-msg, .flq-rca-msg, .flq-rca-alert, .flq-ms-alert, .flq-mo-membership-msg):not(:empty)::after {
    content: var(--fst-lbl);
    position: absolute;
    top: 10px;
    left: 46px;
    right: 14px;
    overflow: hidden;
    color: var(--fst-lbl-c);
    font: 600 10.5px/1.25 var(--fst-font);
    letter-spacing: .16em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

/* [2026-10-21] Pagos por transferencia bancaria (pagina del comprador, Mi cuenta y lista del administrador). */
:root body .flq-bt-badge { align-self: flex-start; }