/* ===========================================================================
   Panel del vendedor (WCFM · Store Manager) con el diseño oficial de Nalt.
   Todo va bajo #wcfm-main-contentainer para no tocar nada fuera del panel.
   WCFM pinta con selectores de id y colores fijos, por eso se usa !important
   donde su regla es más fuerte.
   =========================================================================== */

#wcfm-main-contentainer {
    --wcfm-ritmo: 180ms;
    font-family: var(--nalt-fuente);
    color: var(--color-texto);
    background: var(--color-fondo);
    border-radius: var(--nalt-radio-lg);
    overflow: hidden;
    margin: var(--nalt-espacio-3) auto var(--nalt-espacio-5);
}
#wcfm-main-contentainer h1, #wcfm-main-contentainer h2, #wcfm-main-contentainer h3, #wcfm-main-contentainer h4 { font-family: var(--nalt-fuente-titulo); color: var(--color-texto); }

/* Los íconos del panel usan una fuente ligera sin glifos: se fuerza la sólida */
#wcfm-main-contentainer .wcfmfa, #wcfm-main-contentainer .wcfmfa::before, #wcfm-main-contentainer i[class*="fa-"], #wcfm-main-contentainer span[class*="fa-"] { font-weight: 900 !important; }

/* --- Menú lateral --- */
#wcfm_menu, #wcfm_menu .wcfm_menu_logo { background: var(--nalt-negro) !important; }
#wcfm_menu .wcfm_menu_logo h4 { font-family: var(--nalt-fuente-titulo); font-weight: 800; letter-spacing: .01em; color: var(--nalt-crema) !important; }
#wcfm_menu .wcfm_menu_logo img { border-radius: var(--nalt-radio-pill); }
#wcfm_menu .wcfm_menu_items { width: auto !important; margin: 2px var(--nalt-espacio-2); }
#wcfm_menu a.wcfm_menu_item { display: flex; align-items: center; gap: var(--nalt-espacio-3); min-height: 48px; padding: 0 var(--nalt-espacio-3) !important; border-radius: var(--nalt-radio-sm); color: var(--nalt-crema) !important; font-weight: 600; text-decoration: none; transition: background-color var(--wcfm-ritmo) var(--nalt-ease-out), color var(--wcfm-ritmo) var(--nalt-ease-out); }
#wcfm_menu a.wcfm_menu_item span.wcfmfa { color: var(--nalt-jade-sobre-oscuro) !important; width: 1.4em; text-align: center; }
#wcfm_menu a.wcfm_menu_item span.text { color: inherit !important; }
@media (hover: hover) and (pointer: fine) {
    #wcfm_menu a.wcfm_menu_item:hover { background: rgba(242, 245, 241, .1) !important; }
}
#wcfm_menu a.wcfm_menu_item.active, #wcfm_menu a.wcfm_menu_item.active:hover { background: var(--nalt-naranja) !important; color: var(--nalt-negro) !important; }
#wcfm_menu a.wcfm_menu_item.active span.wcfmfa { color: var(--nalt-negro) !important; }
#wcfm_menu a.wcfm_menu_item:focus-visible { outline: 3px solid var(--nalt-jade-sobre-oscuro); outline-offset: -3px; }

/* --- Cabecera del panel --- */
#wcfm-main-contentainer .wcfm-page-headig { display: flex; align-items: center; gap: var(--nalt-espacio-3); min-height: 60px; padding: 0 var(--nalt-espacio-4); background: var(--nalt-negro) !important; border-bottom: 3px solid var(--nalt-naranja); }
#wcfm-main-contentainer .wcfm-page-headig .wcfmfa { color: var(--nalt-jade-sobre-oscuro) !important; }
#wcfm-main-contentainer .wcfm-page-heading-text { font-family: var(--nalt-fuente-titulo); font-weight: 800; color: var(--nalt-naranja) !important; }
#wcfm-main-contentainer .wcfm-store-name-heading-text a { color: var(--nalt-crema) !important; font-weight: 700; }
#wcfm-main-contentainer .wcfm_header_panel { float: none !important; height: auto !important; width: auto !important; margin: 0 0 0 auto !important; display: flex; align-items: center; gap: var(--nalt-espacio-2); }
#wcfm-main-contentainer .wcfm_header_panel a { float: none !important; position: relative; top: 0 !important; margin: 0 !important; height: 44px !important; }
#wcfm-main-contentainer .wcfm_header_panel .unread_notification_count { position: absolute; top: 2px; right: 0; }
#wcfm-main-contentainer .wcfm_header_panel img { width: 36px; height: 36px; border-radius: var(--nalt-radio-pill); object-fit: cover; }
#wcfm-main-contentainer .wcfm_menu_toggler { float: none !important; cursor: pointer; }
#wcfm-main-contentainer .wcfm_header_panel a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border-radius: var(--nalt-radio-pill); color: var(--nalt-crema) !important; transition: background-color var(--wcfm-ritmo) var(--nalt-ease-out); }
@media (hover: hover) and (pointer: fine) {
    #wcfm-main-contentainer .wcfm_header_panel a:hover { background: rgba(242, 245, 241, .12); }
}
#wcfm-main-contentainer .wcfm_header_panel .unread_notification_count { background: var(--nalt-rosa) !important; color: #fff !important; font-weight: 800; }

/* --- Área de contenido --- */
#wcfm-content { background: var(--color-fondo); }
#wcfm-main-contentainer .wcfm-collapse-content { padding: var(--nalt-espacio-4); background: var(--color-fondo); }
#wcfm-main-contentainer .wcfm-container, #wcfm-main-contentainer .wcfm_welcomebox_header, #wcfm-main-contentainer .wcfm_dashboard_stats_block, #wcfm-main-contentainer .wcfm_dashboard_wc_reports_sales, #wcfm-main-contentainer .wcfm_dashboard_wc_status > div { background: var(--color-fondo-tarjeta) !important; border: 1px solid var(--color-borde) !important; border-radius: var(--nalt-radio-lg) !important; box-shadow: var(--nalt-sombra-tarjeta) !important; }
#wcfm-main-contentainer .wcfm-content { background: none; }

/* Bienvenida */
#wcfm-main-contentainer .wcfm_welcomebox_header { border-top: 6px solid var(--nalt-naranja) !important; padding: var(--nalt-espacio-4); }
#wcfm-main-contentainer .wcfm_welcomebox_header h2, #wcfm-main-contentainer .wcfm_welcomebox_header h3, #wcfm-main-contentainer .wcfm_welcomebox_header .wcfm_welcomebox_heading { color: var(--nalt-naranja-texto) !important; font-family: var(--nalt-fuente-titulo); font-weight: 800; }

/* Tarjetas de números del resumen */
#wcfm-main-contentainer .wcfm_dashboard_stats_block { overflow: hidden; transition: transform var(--wcfm-ritmo) var(--nalt-ease-out); }
#wcfm-main-contentainer .wcfm_dashboard_stats_block a { display: flex; align-items: center; color: var(--color-texto) !important; text-decoration: none; }
#wcfm-main-contentainer .wcfm_dashboard_stats_block a:active { transform: scale(.98); }
#wcfm-main-contentainer .wcfm_dashboard_stats_block a { min-height: 76px; }
#wcfm-main-contentainer .wcfm_dashboard_stats_block a > span.wcfmfa { display: flex !important; align-items: center; justify-content: center; align-self: stretch; flex: none; width: 76px !important; height: auto !important; line-height: 1 !important; background: var(--nalt-naranja) !important; color: var(--nalt-negro) !important; }
#wcfm-main-contentainer .wcfm_dashboard_stats_block a > div { flex: 1; padding: var(--nalt-espacio-2) var(--nalt-espacio-3) !important; font-size: var(--nalt-texto-xs); color: var(--color-texto-tenue) !important; }
#wcfm-main-contentainer .wcfm_dashboard_stats_block strong, #wcfm-main-contentainer .wcfm_dashboard_stats_block strong * { font-size: var(--nalt-texto-lg); color: var(--color-texto) !important; }
#wcfm-main-contentainer .wcfm_dashboard_stats_block:nth-child(2n) a > span.wcfmfa { background: var(--nalt-jade) !important; color: #fff !important; }
#wcfm-main-contentainer .wcfm_dashboard_stats_block:nth-child(3n) a > span.wcfmfa { background: var(--nalt-dorado) !important; color: var(--nalt-negro) !important; }
#wcfm-main-contentainer .wcfm_dashboard_stats_block:nth-child(4n) a > span.wcfmfa { background: var(--nalt-negro) !important; color: var(--nalt-naranja) !important; }
#wcfm-main-contentainer .wcfm_dashboard_stats_block strong { font-family: var(--nalt-fuente-titulo); font-weight: 800; }

/* Títulos de bloque y pestañas */
#wcfm-main-contentainer .page_collapsible, #wcfm-main-contentainer .wcfm-tabWrap .page_collapsible { background: var(--nalt-negro) !important; color: var(--nalt-crema) !important; border: 0 !important; border-radius: var(--nalt-radio-sm) !important; font-family: var(--nalt-fuente-titulo); font-weight: 700; }
#wcfm-main-contentainer .page_collapsible .wcfmfa { color: var(--nalt-naranja) !important; }
#wcfm-main-contentainer .page_collapsible.collapse-open { background: var(--nalt-jade-oscuro) !important; }

/* --- Campos de formulario --- */
#wcfm-main-contentainer input.wcfm-text, #wcfm-main-contentainer input[type="text"], #wcfm-main-contentainer input[type="email"], #wcfm-main-contentainer input[type="number"], #wcfm-main-contentainer input[type="tel"], #wcfm-main-contentainer input[type="password"], #wcfm-main-contentainer input[type="search"], #wcfm-main-contentainer select, #wcfm-main-contentainer textarea { min-height: 44px; padding: var(--nalt-espacio-2) var(--nalt-espacio-3); border: 1px solid var(--color-borde) !important; border-radius: var(--nalt-radio-sm) !important; background: var(--color-fondo-tarjeta) !important; color: var(--color-texto) !important; box-shadow: none !important; font-family: var(--nalt-fuente); transition: border-color var(--wcfm-ritmo) var(--nalt-ease-out); }
#wcfm-main-contentainer input:focus-visible, #wcfm-main-contentainer select:focus-visible, #wcfm-main-contentainer textarea:focus-visible { outline: 3px solid var(--nalt-jade-claro); outline-offset: 1px; border-color: var(--nalt-jade) !important; }
#wcfm-main-contentainer p.wcfm_title, #wcfm-main-contentainer label.wcfm_title { font-weight: 700; color: var(--color-texto); }

/* --- Botones --- */
#wcfm-main-contentainer input.wcfm_submit_button, #wcfm-main-contentainer a.wcfm_submit_button, #wcfm-main-contentainer button.wcfm_submit_button, #wcfm-main-contentainer .wcfm_add_new_product, #wcfm-main-contentainer .add_new_wcfm_ele_dashboard, #wcfm-main-contentainer a.add_new_wcfm_ele_dashboard { display: inline-flex; align-items: center; justify-content: center; gap: var(--nalt-espacio-2); min-height: 48px; padding: 0 var(--nalt-espacio-4) !important; border: 0 !important; border-radius: var(--nalt-radio-md) !important; background: var(--nalt-naranja) !important; color: var(--nalt-negro) !important; font-family: var(--nalt-fuente); font-weight: 800; text-shadow: none !important; box-shadow: none !important; cursor: pointer; transition: transform 160ms var(--nalt-ease-out), filter var(--wcfm-ritmo) var(--nalt-ease-out); }
#wcfm-main-contentainer input.wcfm_submit_button:active, #wcfm-main-contentainer a.wcfm_submit_button:active, #wcfm-main-contentainer button.wcfm_submit_button:active, #wcfm-main-contentainer .add_new_wcfm_ele_dashboard:active { transform: scale(.97); }
@media (hover: hover) and (pointer: fine) {
    #wcfm-main-contentainer input.wcfm_submit_button:hover, #wcfm-main-contentainer a.wcfm_submit_button:hover, #wcfm-main-contentainer .add_new_wcfm_ele_dashboard:hover { filter: brightness(1.06); }
}
#wcfm-main-contentainer .wcfm_submit_button:focus-visible, #wcfm-main-contentainer .add_new_wcfm_ele_dashboard:focus-visible { outline: 3px solid var(--nalt-jade-claro); outline-offset: 2px; }
#wcfm-main-contentainer .wcfm_product_popup_button_wrapper a, #wcfm_product_popup_button_wrapper a { background: var(--nalt-naranja) !important; color: var(--nalt-negro) !important; }

/* --- Tablas (pedidos, productos, clientes…) --- */
#wcfm-main-contentainer table.dataTable, #wcfm-main-contentainer table.display { width: 100% !important; border-collapse: separate; border-spacing: 0; font-size: var(--nalt-texto-sm); }
#wcfm-main-contentainer table.dataTable thead th, #wcfm-main-contentainer table.display thead th { background: var(--nalt-negro) !important; color: var(--nalt-crema) !important; border: 0 !important; font-family: var(--nalt-fuente-titulo); font-weight: 700; padding: var(--nalt-espacio-3) !important; }
#wcfm-main-contentainer table.dataTable tbody td { border-bottom: 1px solid var(--color-borde) !important; padding: var(--nalt-espacio-3) !important; color: var(--color-texto); background: var(--color-fondo-tarjeta); vertical-align: middle; }
#wcfm-main-contentainer table.dataTable tbody tr:nth-child(even) td { background: color-mix(in srgb, var(--nalt-crema) 55%, var(--color-fondo-tarjeta)); }
@media (hover: hover) and (pointer: fine) {
    #wcfm-main-contentainer table.dataTable tbody tr:hover td { background: var(--nalt-jade-claro); }
}
#wcfm-main-contentainer table.dataTable tbody td a { color: var(--nalt-jade-oscuro); font-weight: 700; }
#wcfm-main-contentainer .dataTables_wrapper .dataTables_filter input, #wcfm-main-contentainer .dataTables_wrapper .dataTables_length select { min-height: 40px; }
#wcfm-main-contentainer .dataTables_wrapper .dataTables_paginate .paginate_button { min-width: 40px; min-height: 40px; border: 1px solid var(--color-borde) !important; border-radius: var(--nalt-radio-sm) !important; background: var(--color-fondo-tarjeta) !important; color: var(--color-texto) !important; }
#wcfm-main-contentainer .dataTables_wrapper .dataTables_paginate .paginate_button.current { background: var(--nalt-naranja) !important; border-color: var(--nalt-naranja) !important; color: var(--nalt-negro) !important; font-weight: 800; }
#wcfm-main-contentainer .wcfm-action-icon, #wcfm-main-contentainer a.wcfm-action-icon { color: var(--nalt-jade-oscuro) !important; }

#wcfm-main-contentainer a.wcfm_import_export, #wcfm-main-contentainer a.wcfm_screen_manager, #wcfm-main-contentainer a.wcfm_wp_admin_view { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border-radius: var(--nalt-radio-sm); }
#wcfm-main-contentainer a.wcfm_import_export { background: var(--nalt-negro) !important; color: var(--nalt-crema) !important; }
#wcfm-main-contentainer table.dataTable tfoot th, #wcfm-main-contentainer table.dataTable tfoot td { background: var(--nalt-crema) !important; color: var(--color-texto) !important; border-top: 2px solid var(--nalt-negro) !important; font-weight: 700; }
#wcfm-main-contentainer .dataTables_wrapper .dataTables_processing { background: var(--color-fondo-tarjeta) !important; color: var(--color-texto) !important; border-radius: var(--nalt-radio-sm); font-weight: 700; }

/* Estado de pedidos */
#wcfm-main-contentainer .order-status, #wcfm-main-contentainer mark.order-status { border-radius: var(--nalt-radio-pill); font-weight: 700; }

/* Aviso de bloque vacío y mensajes */
#wcfm-main-contentainer .wcfm-message, #wcfm-main-contentainer .wcfm-warn-message { border-radius: var(--nalt-radio-sm); font-weight: 600; }

/* --- Botón flotante "nuevo producto" --- */
#wcfm-main-contentainer .wcfm_product_popup_button_wrapper a, .wcfm_product_popup_button_wrapper a { border-radius: var(--nalt-radio-pill) !important; box-shadow: var(--nalt-sombra-tarjeta) !important; }

/* --- Pantallas chicas --- */
@media (max-width: 782px) {
    #wcfm-main-contentainer { border-radius: 0; margin-top: 0; }
    #wcfm-main-contentainer .wcfm-collapse-content { padding: var(--nalt-espacio-3); }
    #wcfm-main-contentainer .wcfm-page-headig { padding: 0 var(--nalt-espacio-3); }
    #wcfm-main-contentainer .wcfm_dashboard_stats_block { width: 100% !important; margin-bottom: var(--nalt-espacio-3); }
    /* El menú pasa de columna lateral a una tira que se desliza, arriba del contenido */
    #wcfm-main-contentainer #wcfm-content { flex-direction: column; }
    #wcfm_menu { position: static !important; display: flex !important; width: 100% !important; height: auto !important; gap: var(--nalt-espacio-1); padding: var(--nalt-espacio-2); overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
    #wcfm_menu::-webkit-scrollbar { display: none; }
    #wcfm_menu .wcfm_menu_logo { display: none !important; }
    #wcfm_menu .wcfm_menu_items { flex: none; margin: 0 !important; }
    #wcfm_menu a.wcfm_menu_item { white-space: nowrap; min-height: 44px; }
    #wcfm-main-contentainer .wcfm_menu_toggler { display: none !important; }
}

/* --- Menos movimiento si el sistema lo pide --- */
@media (prefers-reduced-motion: reduce) {
    #wcfm-main-contentainer * { transition-duration: 0ms !important; }
}