/**
 * Delequipo — Skin Base (Verde Claro)
 * common.css
 *
 * Variables de color, tipografía y estilos compartidos
 * que aplican a toda la plataforma: paneles, producto, mi-cuenta, etc.
 *
 * @package DelequipoCore
 */

/* ───────────────────────────────────────────
   VARIABLES DE COLOR
   ─────────────────────────────────────────── */

:root {
    /* Primarios */
    --deleq-primary: #16a34a;
    --deleq-primary-dark: #15803d;
    --deleq-primary-light: #bbf7d0;
    --deleq-primary-bg: #f0fdf4;

    /* Neutros */
    --deleq-text: #1a1a1a;
    --deleq-text-secondary: #666666;
    --deleq-text-muted: #999999;
    --deleq-border: #e0e0e0;
    --deleq-border-light: #f0f0f0;
    --deleq-bg: #ffffff;
    --deleq-bg-soft: #fafafa;
    --deleq-bg-hover: #f5f5f5;

    /* Estados */
    --deleq-success: #16a34a;
    --deleq-success-bg: #d4edda;
    --deleq-warning: #d97706;
    --deleq-warning-bg: #fff3cd;
    --deleq-danger: #dc2626;
    --deleq-danger-bg: #fce4e4;
    --deleq-info: #0066cc;
    --deleq-info-bg: #e0f0ff;

    /* Sombras */
    --deleq-shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
    --deleq-shadow-md: 0 4px 12px rgba(0,0,0,0.08);
    --deleq-shadow-lg: 0 8px 24px rgba(0,0,0,0.12);

    /* Bordes */
    --deleq-radius-sm: 8px;
    --deleq-radius-md: 12px;
    --deleq-radius-lg: 16px;
    --deleq-radius-full: 9999px;

    /* Tipografía */
    --deleq-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --deleq-font-size-xs: 11px;
    --deleq-font-size-sm: 13px;
    --deleq-font-size-base: 15px;
    --deleq-font-size-lg: 17px;
    --deleq-font-size-xl: 20px;
    --deleq-font-size-2xl: 24px;
}

/* ───────────────────────────────────────────
   RESET BASE PARA PANELES
   ─────────────────────────────────────────── */

.deleq-gest-wrap,
.deleq-prov-wrap,
.deleq-mi-cuenta,
.deleq-groupbuy-panel {
    font-family: var(--deleq-font);
    color: var(--deleq-text);
    line-height: 1.5;
}

/* ───────────────────────────────────────────
   BOTONES
   ─────────────────────────────────────────── */

/* Primario */
.deleq-btn,
.deleq-gest-btn-approve,
.deleq-gest-btn-approve-product {
    padding: 10px 20px;
    border: none;
    border-radius: var(--deleq-radius-sm);
    background: var(--deleq-primary);
    color: #fff;
    font-size: var(--deleq-font-size-base);
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, transform 0.1s;
    font-family: var(--deleq-font);
}

.deleq-btn:hover,
.deleq-gest-btn-approve:hover,
.deleq-gest-btn-approve-product:hover {
    background: var(--deleq-primary-dark);
}

.deleq-btn:active {
    transform: scale(0.98);
}

/* Secundario */
.deleq-btn-small,
.deleq-gest-btn-small {
    padding: 8px 16px;
    border: 1px solid var(--deleq-border);
    border-radius: var(--deleq-radius-sm);
    background: var(--deleq-bg);
    color: var(--deleq-text);
    font-size: var(--deleq-font-size-sm);
    cursor: pointer;
    transition: background 0.15s;
    font-family: var(--deleq-font);
}

.deleq-btn-small:hover,
.deleq-gest-btn-small:hover {
    background: var(--deleq-bg-hover);
}

/* Peligro */
.deleq-btn-danger,
.deleq-gest-btn-reject,
.deleq-gest-btn-reject-product,
.deleq-gest-btn-show-reject,
.deleq-gest-btn-show-takedown,
.deleq-gest-btn-confirm-reject,
.deleq-gest-btn-confirm-takedown {
    background: var(--deleq-danger);
    color: #fff;
    border: none;
}

.deleq-btn-danger:hover,
.deleq-gest-btn-reject:hover,
.deleq-gest-btn-reject-product:hover,
.deleq-gest-btn-show-reject:hover,
.deleq-gest-btn-show-takedown:hover {
    background: #b91c1c;
}

/* ───────────────────────────────────────────
   CARDS
   ─────────────────────────────────────────── */

.deleq-gest-card,
.deleq-prov-card {
    border: 1px solid var(--deleq-border);
    border-radius: var(--deleq-radius-lg);
    padding: 20px;
    background: var(--deleq-bg);
    cursor: pointer;
    display: flex;
    gap: 14px;
    align-items: center;
    transition: box-shadow 0.15s, transform 0.1s;
}

.deleq-gest-card:hover,
.deleq-prov-card:hover {
    box-shadow: var(--deleq-shadow-md);
    transform: translateY(-1px);
}

.deleq-gest-card:active,
.deleq-prov-card:active {
    transform: translateY(0);
}

.deleq-gest-card-title,
.deleq-prov-card-title {
    font-size: var(--deleq-font-size-lg);
    font-weight: 700;
    color: var(--deleq-text);
}

.deleq-gest-card-count,
.deleq-prov-card-count {
    font-size: var(--deleq-font-size-sm);
    color: var(--deleq-text-muted);
    margin-top: 2px;
}

/* Cards pequeñas */
.deleq-prov-card-small {
    border: 1px solid var(--deleq-border);
    border-radius: var(--deleq-radius-md);
    padding: 14px 20px;
    background: var(--deleq-bg);
    cursor: pointer;
    display: flex;
    gap: 8px;
    align-items: center;
    transition: box-shadow 0.15s;
}

.deleq-prov-card-small:hover {
    box-shadow: var(--deleq-shadow-sm);
}

/* ───────────────────────────────────────────
   BADGES DE ESTADO
   ─────────────────────────────────────────── */

/* Genéricos */
.deleq-gest-badge,
.deleq-prov-badge {
    color: var(--deleq-danger);
    font-weight: 600;
}

/* Badges de pedido */
.status-pending,
.deleq-mc-status-pending,
.deleq-prov-status-pending {
    background: var(--deleq-warning-bg);
    color: var(--deleq-warning);
}

.status-on-hold,
.deleq-mc-status-on-hold,
.deleq-prov-status-open,
.deleq-gb-open {
    background: var(--deleq-info-bg);
    color: var(--deleq-info);
}

.status-processing,
.deleq-mc-status-processing,
.deleq-prov-status-immediate {
    background: var(--deleq-success-bg);
    color: var(--deleq-primary-dark);
}

.status-completed,
.deleq-mc-status-completed,
.deleq-prov-status-closed {
    background: #d1e7dd;
    color: #0f5132;
}

.status-groupbuy-open,
.deleq-mc-status-groupbuy-open {
    background: var(--deleq-info-bg);
    color: var(--deleq-info);
}

.status-groupbuy-failed,
.deleq-mc-status-groupbuy-failed,
.deleq-prov-status-failed,
.deleq-prov-status-rejected,
.deleq-gb-failed {
    background: var(--deleq-danger-bg);
    color: var(--deleq-danger);
}

.deleq-gest-badge-ok,
.deleq-gb-closed {
    background: var(--deleq-success-bg);
    color: var(--deleq-primary-dark);
}

/* ───────────────────────────────────────────
   BARRAS DE PROGRESO
   ─────────────────────────────────────────── */

.deleq-gb-progress-bar,
.deleq-prov-progress-bar,
.deleq-mc-progress-bar {
    height: 12px;
    background: var(--deleq-border-light);
    border-radius: var(--deleq-radius-full);
    overflow: hidden;
}

.deleq-gb-progress-fill,
.deleq-prov-progress-fill,
.deleq-mc-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--deleq-primary), #4ade80);
    border-radius: var(--deleq-radius-full);
    transition: width 0.5s ease;
    min-width: 2%;
}

/* ───────────────────────────────────────────
   INPUTS Y FORMULARIOS
   ─────────────────────────────────────────── */

.deleq-prov-field input[type="text"],
.deleq-prov-field input[type="number"],
.deleq-prov-field input[type="datetime-local"],
.deleq-prov-field textarea,
.deleq-prov-field select,
.deleq-gest-search-box input,
.deleq-gest-note-text,
.deleq-gest-reject-reason,
.deleq-gest-takedown-reason {
    border: 1px solid var(--deleq-border);
    border-radius: var(--deleq-radius-sm);
    font-family: var(--deleq-font);
    font-size: var(--deleq-font-size-base);
    transition: border-color 0.15s;
}

.deleq-prov-field input:focus,
.deleq-prov-field textarea:focus,
.deleq-prov-field select:focus,
.deleq-gest-search-box input:focus,
.deleq-gest-note-text:focus {
    border-color: var(--deleq-primary);
    outline: none;
    box-shadow: 0 0 0 3px var(--deleq-primary-light);
}

/* ───────────────────────────────────────────
   FILTROS (TABS)
   ─────────────────────────────────────────── */

.deleq-gest-filter {
    padding: 6px 14px;
    border: 1px solid var(--deleq-border);
    border-radius: var(--deleq-radius-full);
    background: var(--deleq-bg);
    font-size: var(--deleq-font-size-sm);
    cursor: pointer;
    font-weight: 500;
    transition: all 0.15s;
    color: var(--deleq-text-secondary);
}

.deleq-gest-filter.active {
    background: var(--deleq-primary);
    color: #fff;
    border-color: var(--deleq-primary);
}

.deleq-gest-filter:hover:not(.active) {
    background: var(--deleq-primary-bg);
    border-color: var(--deleq-primary-light);
    color: var(--deleq-primary-dark);
}

/* ───────────────────────────────────────────
   LINKS Y TEXTOS
   ─────────────────────────────────────────── */

.deleq-gest-back,
.deleq-prov-back {
    color: var(--deleq-primary);
    font-weight: 500;
}

.deleq-gest-back:hover,
.deleq-prov-back:hover {
    color: var(--deleq-primary-dark);
}

.deleq-mc-order-detail-link,
.deleq-mc-file-list li a,
.deleq-gest-file-list li a,
.deleq-prov-file-list li a {
    color: var(--deleq-primary);
}

.deleq-mc-order-detail-link:hover,
.deleq-mc-file-list li a:hover,
.deleq-gest-file-list li a:hover,
.deleq-prov-file-list li a:hover {
    color: var(--deleq-primary-dark);
}

/* ───────────────────────────────────────────
   CARDS DE PEDIDO Y REVIEW
   ─────────────────────────────────────────── */

.deleq-gest-order-card,
.deleq-prov-order-card,
.deleq-mc-order,
.deleq-mc-commitment,
.deleq-gest-review-card,
.deleq-gest-published-card,
.deleq-prov-product-card {
    border: 1px solid var(--deleq-border);
    border-radius: var(--deleq-radius-md);
    background: var(--deleq-bg);
    transition: box-shadow 0.15s;
}

.deleq-gest-order-card:hover,
.deleq-prov-order-card:hover,
.deleq-mc-order:hover,
.deleq-prov-product-card:hover {
    box-shadow: var(--deleq-shadow-sm);
}

/* ───────────────────────────────────────────
   VIEW HEADERS
   ─────────────────────────────────────────── */

.deleq-gest-view-header,
.deleq-prov-view-header {
    border-bottom: 2px solid var(--deleq-primary-light);
}

/* ───────────────────────────────────────────
   SECCIÓN MI CUENTA — LINKS RÁPIDOS
   ─────────────────────────────────────────── */

.deleq-mc-link {
    border: 1px solid var(--deleq-border);
    border-radius: var(--deleq-radius-sm);
    background: var(--deleq-bg);
    transition: all 0.15s;
}

.deleq-mc-link:hover {
    background: var(--deleq-primary-bg);
    border-color: var(--deleq-primary-light);
    color: var(--deleq-primary-dark);
}

/* ───────────────────────────────────────────
   SECCIÓN TÍTULOS
   ─────────────────────────────────────────── */

.deleq-mc-section-title {
    border-bottom-color: var(--deleq-primary-light);
}

/* ───────────────────────────────────────────
   COMMITMENT QTY BADGE
   ─────────────────────────────────────────── */

.deleq-mc-commitment-qty,
.deleq-gb-pres-price {
    color: var(--deleq-primary);
    background: var(--deleq-primary-bg);
}

/* ───────────────────────────────────────────
   PRESENTACIONES FRONTEND
   ─────────────────────────────────────────── */

.deleq-gb-pres-card {
    border: 1px solid var(--deleq-border);
    border-radius: var(--deleq-radius-md);
    background: var(--deleq-bg);
}

.deleq-gb-pres-committed {
    color: var(--deleq-primary);
    background: var(--deleq-primary-bg);
}

.deleq-gb-total-wrap {
    background: var(--deleq-bg-soft);
    border-radius: var(--deleq-radius-md);
}

.deleq-participant-qty {
    color: var(--deleq-primary);
}

/* ───────────────────────────────────────────
   COUNTDOWN
   ─────────────────────────────────────────── */

.deleq-gb-countdown {
    background: var(--deleq-warning-bg);
    color: var(--deleq-warning);
    border-radius: var(--deleq-radius-md);
}

/* ───────────────────────────────────────────
   UPLOAD BOTONES
   ─────────────────────────────────────────── */

.deleq-mc-upload-btn {
    background: var(--deleq-primary);
    color: #fff;
    border: none;
    border-radius: var(--deleq-radius-sm);
}

.deleq-mc-upload-btn:hover {
    background: var(--deleq-primary-dark);
}

/* ───────────────────────────────────────────
   SEARCH BUTTON
   ─────────────────────────────────────────── */

.deleq-gest-search-box button,
#deleq-gest-search-btn {
    background: var(--deleq-primary);
    color: #fff;
    border: none;
    border-radius: var(--deleq-radius-md);
}

.deleq-gest-search-box button:hover {
    background: var(--deleq-primary-dark);
}

/* ───────────────────────────────────────────
   REJECT NOTICE (PROVEEDOR)
   ─────────────────────────────────────────── */

.deleq-prov-reject-notice {
    background: #fff5f5;
    border-color: #f0d0d0;
    border-radius: var(--deleq-radius-md);
}

.deleq-prov-product-rejected {
    border-color: #f0c0c0;
    background: #fefafa;
}

/* ───────────────────────────────────────────
   CROP MODAL
   ─────────────────────────────────────────── */

.deleq-prov-crop-content {
    border-radius: var(--deleq-radius-lg);
}

/* ───────────────────────────────────────────
   WOOCOMMERCE MI CUENTA — MENÚ LATERAL
   ─────────────────────────────────────────── */

.woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 10px 16px;
    color: var(--deleq-text-secondary);
    text-decoration: none;
    border-radius: var(--deleq-radius-sm);
    transition: all 0.15s;
    font-size: var(--deleq-font-size-base);
}

.woocommerce-MyAccount-navigation ul li a:hover {
    background: var(--deleq-primary-bg);
    color: var(--deleq-primary-dark);
}

.woocommerce-MyAccount-navigation ul li.is-active a {
    background: var(--deleq-primary);
    color: #fff;
    font-weight: 600;
}

/* ───────────────────────────────────────────
   WOOCOMMERCE — BOTONES GLOBALES
   ─────────────────────────────────────────── */

.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    background-color: var(--deleq-primary) !important;
    color: #fff !important;
    border: none !important;
    border-radius: var(--deleq-radius-sm) !important;
    font-family: var(--deleq-font);
    font-weight: 600;
    transition: background 0.15s;
}

.woocommerce button.button:hover,
.woocommerce a.button:hover,
.woocommerce input.button:hover {
    background-color: var(--deleq-primary-dark) !important;
}

/* ───────────────────────────────────────────
   QTY BUTTONS (PRESENTACIONES FRONTEND)
   ─────────────────────────────────────────── */

.deleq-qty-minus,
.deleq-qty-plus {
    border-color: var(--deleq-border);
    background: var(--deleq-bg-soft);
    color: var(--deleq-text);
}

.deleq-qty-minus:hover,
.deleq-qty-plus:hover {
    background: var(--deleq-primary-bg);
    border-color: var(--deleq-primary-light);
    color: var(--deleq-primary);
}

/* ───────────────────────────────────────────
   BOTONES SOLICITAR ROL
   ─────────────────────────────────────────── */

.deleq-request-role {
    padding: 10px 18px !important;
    border: 2px solid var(--deleq-primary) !important;
    border-radius: 10px !important;
    background: var(--deleq-primary-bg) !important;
    color: var(--deleq-primary-dark) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer;
    transition: all 0.15s;
}

.deleq-request-role:hover {
    background: var(--deleq-primary) !important;
    color: #fff !important;
}

/* ─── Menú dinámico (Entrar / usuario / rol / campanita) ─── */
/* Todos los ítems del menú principal como pills uniformes (estilo del usuario) */
.main-navigation .primary-menu-container > ul,
.header-navigation .header-menu-container > ul,
.site-header .primary-menu-container > ul {
    gap: 8px;
    align-items: center;
}
.main-navigation .primary-menu-container > ul > li > a:not(.deleq-nav-bell),
.header-navigation .header-menu-container > ul > li > a:not(.deleq-nav-bell),
.site-header .primary-menu-container > ul > li > a:not(.deleq-nav-bell) {
    color: #1f2937 !important;
    font-weight: 600;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 999px;
    padding: 7px 16px !important;
    line-height: 1.2;
}
.main-navigation .primary-menu-container > ul > li > a:not(.deleq-nav-bell):hover,
.header-navigation .header-menu-container > ul > li > a:not(.deleq-nav-bell):hover,
.site-header .primary-menu-container > ul > li > a:not(.deleq-nav-bell):hover {
    border-color: #16a34a;
    color: #15803d !important;
}
/* Entrar: la misma pill, pero verde (resalta sin desentonar) */
.main-navigation .primary-menu-container > ul > li > a.deleq-nav-entrar,
.header-navigation .header-menu-container > ul > li > a.deleq-nav-entrar,
.site-header .primary-menu-container > ul > li > a.deleq-nav-entrar,
a.deleq-nav-entrar {
    background: #16a34a !important;
    border-color: #16a34a !important;
    color: #fff !important;
    font-weight: 700;
}
.main-navigation .primary-menu-container > ul > li > a.deleq-nav-entrar:hover,
.header-navigation .header-menu-container > ul > li > a.deleq-nav-entrar:hover,
.site-header .primary-menu-container > ul > li > a.deleq-nav-entrar:hover,
a.deleq-nav-entrar:hover {
    background: #15803d !important;
    border-color: #15803d !important;
    color: #fff !important;
}
.deleq-nav-user {
    white-space: nowrap;
    max-width: 190px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    vertical-align: middle;
}
.deleq-nav-bell-item {
    position: relative;
}
.deleq-nav-bell {
    font-size: 17px;
    text-decoration: none !important;
    position: relative;
}
/* WP convierte el emoji 🔔 en <img class="emoji"> de 1em. En el header (al lado
   de la hamburguesa) el font-size heredado colapsa y el ícono queda de pocos px.
   Le fijamos tamaño en px SOLO dentro de la campanita; el resto de los emojis del
   sitio (Twemoji) quedan intactos. El móvil lo agranda un poco más abajo. */
.deleq-nav-bell img.emoji {
    width: 20px !important;
    height: 20px !important;
    vertical-align: middle;
    margin: 0;
}
.deleq-nav-bell-badge {
    position: absolute;
    top: -6px;
    right: -8px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: #dc2626;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
    border-radius: 9px;
    box-sizing: border-box;
}
.deleq-nav-bell-pop {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 9999;
    width: 300px;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.12);
    padding: 0;
    font-size: 13px;
    color: #444;
    line-height: 1.4;
    overflow: hidden;
}
.deleq-nav-bell-pop.deleq-pop-open {
    display: block;
}
/* Pestañas del popover */
.deleq-bell-tabs {
    display: flex;
    border-bottom: 1px solid #eee;
}
.deleq-bell-tab {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 11px 8px;
    border: none;
    background: #f9fafb;
    color: #6b7280;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.deleq-bell-tab:hover {
    background: #f3f4f6;
}
.deleq-bell-tab-active {
    background: #fff;
    color: #111827;
}
.deleq-bell-tab-count {
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    background: #e5e7eb;
    color: #374151;
    font-size: 11px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
    border-radius: 9px;
    box-sizing: border-box;
}
.deleq-bell-tab-active .deleq-bell-tab-count {
    background: #16a34a;
    color: #fff;
}
.deleq-bell-panel {
    padding: 14px 14px 16px;
}
.deleq-bell-soon {
    margin: 0;
    color: #9ca3af;
    font-size: 13px;
    line-height: 1.5;
    text-align: center;
}
/* Lista de notificaciones (A.2) */
.deleq-bell-list {
    max-height: 320px;
    overflow-y: auto;
}
.deleq-bell-empty {
    margin: 0;
    padding: 8px 4px;
    color: #9ca3af;
    font-size: 13px;
    text-align: center;
}
.deleq-notif-item {
    position: relative;
    padding: 10px 30px 10px 4px;
    border-bottom: 1px solid #f3f4f6;
}
.deleq-notif-item:last-child { border-bottom: none; }
.deleq-notif-unread {
    background: #f0f9ff;
    margin: 0 -14px;
    padding-left: 18px;
    padding-right: 44px;
}
/* La X de descartar: discreta, en la esquina. Reset para que NO herede
   el estilo de botón del tema (Kadence la pintaba azul y gigante). */
.deleq-notif-x {
    position: absolute;
    top: 6px;
    right: 4px;
    width: 22px;
    height: 22px;
    min-width: 0;
    padding: 0;
    margin: 0;
    border: none;
    background: none;
    box-shadow: none;
    color: #b0b4ba;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    cursor: pointer;
    border-radius: 4px;
}
.deleq-notif-x:hover {
    color: #6b7280;
    background: #f3f4f6;
}
.deleq-notif-title {
    font-weight: 600;
    color: #111827;
    font-size: 13px;
    margin-bottom: 2px;
}
.deleq-notif-msg {
    color: #4b5563;
    font-size: 12.5px;
    line-height: 1.4;
}
.deleq-notif-foot {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 5px;
}
.deleq-notif-time {
    color: #9ca3af;
    font-size: 11px;
}
.deleq-notif-cta {
    color: #2563eb;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
}
.deleq-notif-cta:hover { text-decoration: underline; }
/* "Ver todas": reset también para que no herede botón del tema */
.deleq-bell-vertodas {
    display: block;
    width: 100%;
    margin: 8px 0 0;
    padding: 9px;
    border: none;
    border-top: 1px solid #eee;
    background: none;
    box-shadow: none;
    color: #2563eb;
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 0;
}
.deleq-bell-vertodas:hover { background: #f9fafb; }
/* Toast fugaz */
.deleq-toast {
    position: fixed;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    z-index: 100000;
    background: #111827;
    color: #fff;
    padding: 10px 18px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 6px 18px rgba(0,0,0,0.2);
    opacity: 0;
    transition: opacity 0.25s, transform 0.25s;
    pointer-events: none;
}
.deleq-toast-show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* Campanita junto a la hamburguesa (solo mobile) */
.deleq-bell-mobile {
    display: none;
    position: relative;
    margin-right: 10px;
    align-items: center;
}
@media (max-width: 1024px) {
    .deleq-bell-mobile {
        display: inline-flex;
    }
    /* Tamaño explícito del ícono en mobile (si no, hereda algo diminuto del
       contexto de la hamburguesa y queda de pocos px) */
    .deleq-bell-mobile .deleq-nav-bell {
        font-size: 20px;
        line-height: 1;
        display: inline-flex;
        align-items: center;
        position: relative;
    }
    /* Ícono-imagen del emoji en la campanita mobile (ver nota arriba) */
    .deleq-bell-mobile .deleq-nav-bell img.emoji {
        width: 22px !important;
        height: 22px !important;
    }
    /* En mobile, la campanita del cajón se oculta (vive al lado de la hamburguesa) */
    li.deleq-nav-bell-item {
        display: none !important;
    }
    /* El popover NO se ancla a la campanita (se saldría por la izquierda).
       Se fija respecto a la pantalla, con ancho que siempre entra. */
    .deleq-bell-mobile .deleq-nav-bell-pop {
        position: fixed;
        top: 64px;
        left: 50%;
        right: auto;
        transform: translateX(-50%);
        width: calc(100vw - 24px);
        max-width: 340px;
    }
}

/* Ícono usuario junto a la hamburguesa (solo mobile) */
.deleq-user-mobile {
    display: none;
    position: relative;
    margin-right: 10px;
    align-items: center;
}
@media (max-width: 1024px) {
    .deleq-user-mobile {
        display: inline-flex;
    }
    /* En mobile, el ítem usuario del cajón se oculta (vive al lado de la hamburguesa) */
    li.deleq-nav-user-item {
        display: none !important;
    }
}

/* Ícono usuario deslogueado: mismo pill verde que tenía el botón "Entrar" */
.deleq-nav-user-anon {
    background: #16a34a !important;
    color: #fff !important;
}
.deleq-nav-user-anon:hover {
    background: #15803d !important;
}

/* ── Fix: campanita en desktop SIN fondo cuadrado ──
   Kadence (o algun reset del tema) le aplica un BG/borde al item del menu.
   Como :not(.deleq-nav-bell) ya la excluye del pill general, le aseguramos
   explicitamente que vaya transparente y sin caja en desktop. */
.main-navigation .primary-menu-container > ul > li > a.deleq-nav-bell,
.header-navigation .header-menu-container > ul > li > a.deleq-nav-bell,
.site-header .primary-menu-container > ul > li > a.deleq-nav-bell {
    background: transparent !important;
    border: none !important;
    padding: 4px 6px !important;
    line-height: 1;
}
.deleq-nav-bell-item {
    background: transparent !important;
}

/* ── Fix: icono 👤 redondo en MOBILE (cuando vive al lado de la hamburguesa) ──
   En desktop el icono hereda el pill rounded del menu (.primary-menu-container > ul > li > a),
   pero en mobile el JS lo inyecta FUERA del menu (en .deleq-user-mobile),
   entonces no hereda el border-radius y queda cuadrado. Forzamos circular. */
.deleq-user-mobile .deleq-nav-user {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50% !important;
    padding: 0 !important;
    font-size: 16px;
    line-height: 1;
    box-sizing: border-box;
}


/* ───────────────────────────────────────────
   SUBIDA DE ARCHIVOS — UX UNIFICADA
   Un solo botón + un solo input (sin capture): el sistema operativo ofrece
   cámara/galería/archivos. Robusto en todo viewport (no depende de breakpoint).
   ─────────────────────────────────────────── */

.deleq-upload-mobile-btns {
    display: none; /* legacy: ya no se usa, se deja por compatibilidad */
}

/* ───────────────────────────────────────────
   NOTA DE PEDIDO — bloque del detail de la card
   (proveedor y gestor; el comprador no lo ve)
   ─────────────────────────────────────────── */
.deleq-nota-block {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px dashed #d1d5db;
}
.deleq-nota-btn {
    text-decoration: none;
    white-space: nowrap;
}
/* El botón principal lleva ícono; los chips A4/A5 van más compactos */
.deleq-nota-fmts {
    display: flex;
    gap: 8px;
    margin-top: 8px;
}
.deleq-nota-fmts .deleq-nota-btn {
    min-width: 46px;
    text-align: center;
}
.deleq-nota-toggle {
    display: block;
    margin-top: 8px;
    padding: 0;
    background: none;
    border: none;
    color: #2563eb;
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
}
.deleq-nota-toggle:hover { text-decoration: underline; }
.deleq-nota-hint {
    margin-top: 8px;
    font-size: 11.5px;
    color: #9ca3af;
    line-height: 1.4;
}

/* Confirmación inline al reimprimir nota de un pedido completado */
.deleq-nota-confirm {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    padding: 10px 12px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 8px;
}
.deleq-nota-confirm-msg {
    font-size: 12.5px;
    color: #92400e;
    flex: 1 1 auto;
    min-width: 160px;
}
.deleq-nota-confirm-no {
    background: none;
    border: none;
    color: #6b7280;
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    padding: 6px 10px;
}
.deleq-nota-confirm-no:hover { color: #374151; }