.frasman-wrap .frasman-title span { color: #C8102E; font-weight: 400; }
.frasman-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin: 16px 0; }
.frasman-strip__item { background: #fff; border: 1px solid #c3c4c7; border-left-width: 4px; padding: 10px 12px; display: grid; grid-template-columns: 12px 1fr; gap: 4px 8px; align-items: center; }
.frasman-strip__dot { width: 10px; height: 10px; border-radius: 50%; background: #50575e; }
.frasman-strip__label { font-size: 12px; text-transform: uppercase; letter-spacing: .02em; color: #50575e; }
.frasman-strip__value { grid-column: 2; font-size: 13px; color: #1d2327; }
.frasman-strip__hint { grid-column: 2; font-size: 11px; color: #50575e; }
.frasman-status--ok      { border-left-color: #00a32a; } .frasman-status--ok .frasman-strip__dot      { background: #00a32a; }
.frasman-status--warning { border-left-color: #dba617; } .frasman-status--warning .frasman-strip__dot { background: #dba617; }
.frasman-status--error   { border-left-color: #d63638; } .frasman-status--error .frasman-strip__dot   { background: #d63638; }
.frasman-status--neutral { border-left-color: #c3c4c7; }
.frasman-allgood { color: #00a32a; font-weight: 600; }
.frasman-counters { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin: 16px 0 24px; }
.frasman-counter { display: flex; flex-direction: column; background: #fff; border: 1px solid #c3c4c7; padding: 14px 16px; text-decoration: none; color: #1d2327; transition: border-color 150ms; }
.frasman-counter:hover { border-color: #A30C24; color: #1d2327; }
.frasman-counter:focus-visible { border-color: #C8102E; outline: 2px solid #C8102E; outline-offset: 1px; color: #1d2327; }
.frasman-counter__n { font-size: 28px; font-weight: 600; line-height: 1.1; }
.frasman-counter__l { font-size: 12px; color: #50575e; margin-top: 4px; }
.frasman-counter--error .frasman-counter__n { color: #d63638; }
.frasman-table--compact { max-width: 900px; }
/* Tile del neto de Mercado Libre (Inicio). Mismo lenguaje visual que los contadores. */
.frasman-nettile { display: inline-flex; flex-direction: column; background: #fff; border: 1px solid #c3c4c7; padding: 14px 16px; margin: 0 0 16px; }
.frasman-nettile__l { font-size: 12px; color: #50575e; }
.frasman-nettile__n { font-size: 28px; font-weight: 600; line-height: 1.2; }
.frasman-nettile__s { font-size: 12px; color: #50575e; }
.frasman-quicklinks .button { margin-right: 8px; }
.frasman-tecnico-header { background: #7A1A2E; color: #fff; padding: 12px 16px; margin: 0 0 16px; }
.frasman-tecnico-header h1 { color: #fff; margin: 0; }
/* Red de contención: un aviso no puede heredar el color de texto de ningún
   contenedor (p.ej. la banda bordó de arriba) aunque el marcador
   wp-header-end falle o WP core cambie dónde reubica los avisos. Un aviso
   ilegible es peor que ninguno. Incluye #frasman-tecnico-out, que es .notice. */
.frasman-wrap .notice,
.frasman-wrap .notice pre { color: #1d2327; }
.frasman-wrap .nav-tab-wrapper { margin: 0 0 16px; }
/* Badges: tono = color semántico WP del spec (ok #00a32a, warning #dba617, error #d63638, info #72aee6, neutro #50575e).
   Fondo = tinte claro del tono; texto = variante oscura accesible (4.5:1 sobre el tinte), porque #72aee6 y #dba617 como
   texto no cumplen contraste. Derivados: ok #edfaef/#00a32a · warning #fcf9e8/#996800 · error #fcf0f1/#d63638 ·
   info #f0f6fc/#2271b1 (azul del admin WP) · neutro #f0f0f1/#50575e. */
.frasman-badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 3px; font-size: 12px; line-height: 18px; background: #f0f0f1; color: #1d2327; }
.frasman-badge svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; }
.frasman-badge--active { background: #edfaef; color: #00a32a; } .frasman-badge--paused { background: #fcf9e8; color: #996800; }
.frasman-badge--under_review { background: #fcf9e8; color: #996800; }
.frasman-badge--error { background: #fcf0f1; color: #d63638; } .frasman-badge--pending, .frasman-badge--unpublished { background: #f0f6fc; color: #2271b1; }
.frasman-badge--web_only, .frasman-badge--closed, .frasman-badge--inactive { background: #f0f0f1; color: #50575e; }
/* Tonos semánticos del estado de envío (Frasman_Admin_Orders_Table::shipment_label), mismos derivados de arriba. */
.frasman-badge--ok { background: #edfaef; color: #00a32a; } .frasman-badge--info { background: #f0f6fc; color: #2271b1; }
.frasman-badge--warning { background: #fcf9e8; color: #996800; } .frasman-badge--neutral { background: #f0f0f1; color: #50575e; }
@media (prefers-reduced-motion: reduce) { .frasman-counter { transition: none; } }
/* Kill switch: rojo de error de WP (#d63638) sobre el botón y sobre el nodo de la admin bar. */
.frasman-kill { background: #d63638; border-color: #d63638; color: #fff; }
.frasman-kill:hover, .frasman-kill:focus { background: #b32d2e; border-color: #b32d2e; color: #fff; }
#wpadminbar .frasman-kill-notice > .ab-item { background: #d63638; color: #fff; font-weight: 600; }

/* Modo espejo: ámbar de warning de WP (#dba617), no rojo de error: es un modo elegido, no una falla. */
#wpadminbar .frasman-mirror-notice > .ab-item { background: #dba617; color: #1d2327; font-weight: 600; }

/* Tarjetas de acción (pestañas Acciones y Zona de riesgo). */
.frasman-card { background: #fff; border: 1px solid #c3c4c7; padding: 14px 16px; margin: 0 0 12px; max-width: 720px; }
.frasman-card h3 { margin: 0 0 4px; }
.frasman-card__lead { margin: 0 0 10px; color: #50575e; }
.frasman-card details { margin-top: 10px; }
.frasman-card details summary { cursor: pointer; color: #2271b1; }
.frasman-card--danger { border-left: 4px solid #d63638; background: #fcf0f1; }
.frasman-scroll-x { overflow-x: auto; }
/* Foco visible (E): pestañas, TODOS los botones y enlaces-botón del panel, y los
   <summary> de las tarjetas. Un <details> pelado no es focusable en ningún
   navegador (solo su <summary>), así que no tiene regla propia. */
.frasman-wrap .nav-tab:focus-visible,
.frasman-wrap .button:focus-visible,
.frasman-card details summary:focus-visible {
    outline: 2px solid #C8102E;
    outline-offset: 1px;
}

/* Actividad reciente del widget del Escritorio de WordPress (lista chica,
   sin la tabla completa): sin viñetas, una línea divisoria fina entre filas,
   mismo vocabulario tipográfico que .frasman-strip__hint. */
.frasman-widget-activity { margin: 8px 0; padding: 0; list-style: none; }
.frasman-widget-activity li { padding: 4px 0; border-bottom: 1px solid #f0f0f1; font-size: 12px; color: #1d2327; }
.frasman-widget-activity li:last-child { border-bottom: none; }

/* Pestaña Historial de la ficha de producto */
.frasman-history__item { border-bottom: 1px solid #e0e0e0; padding: 8px 0; }
.frasman-history__head { margin: 0 0 4px; }
.frasman-history__body { margin-top: 8px; }
.frasman-history__fields { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-bottom: 8px; }
.frasman-history__diff { margin-bottom: 8px; max-width: 640px; }
.frasman-history__status { margin-left: 8px; }
