/* =====================================================================
   LB Subastas — tokens de diseño
   =====================================================================
   Extraídos del handoff (docs/design_handoff_lb_subastas/).

   REGLA DEL PROYECTO: éste es el ÚNICO archivo con valores literales de
   color, tipografía y espaciado. Un hex hardcodeado en cualquier otro
   lado es un bug.
   ===================================================================== */

:root {
  /* --- Colores de marca ------------------------------------------ */
  --verde: #2E7D32;              /* acciones, precios, bordes destacados */
  --verde-texto: #2F542E;        /* links, subtítulos sobre verde claro */
  --verde-claro: #EAF3DE;        /* fondo del hero */
  --verde-claro-rayas: #DCEAD0;  /* trama diagonal del hero */
  --verde-whatsapp: #639922;     /* botón "Consultar por WhatsApp" en línea */
  --verde-whatsapp-marca: #25D366; /* SÓLO el botón flotante circular */
  --verde-punto-inactivo: #C9D9BF; /* punto apagado del carrusel del hero */

  /* --- Neutros ---------------------------------------------------- */
  --fondo: #F6F5F3;              /* fondo general y franja superior */
  --blanco: #ffffff;
  --fondo-imagen: #f5f5f4;       /* placeholder de imagen en las cards */
  --texto: #222222;              /* texto principal, y fondo del footer */
  --texto-secundario: #6b6b68;
  --texto-terciario: #9b9b97;    /* metadata, categoría en la card */
  --texto-aviso: #4a4a47;        /* franja superior del header */
  --texto-footer: #c9c9c6;
  --borde: #A5A59B;              /* bordes de card y separadores */
  --borde-suave: #e5e5e2;        /* separadores internos, filas de tabla */
  --borde-total: #cfe3f6;        /* línea sobre el total del desglose */
  --fondo-carga: #fafaf9;        /* caja de subida vacía (DNI, banners) */
  --fondo-panel-suave: #F3F3F2;  /* bloques anchos de Nosotros y Vender */
  --deshabilitado-fondo: #e5e5e2;
  --deshabilitado-texto: #9b9b97;
  --borde-punteado: #d1d1cd;

  /* --- Badges ----------------------------------------------------- */
  --badge-destacada-fondo: #FAEEDA;
  --badge-destacada-texto: #633806;
  --badge-vivo-fondo: #FCEBEB;   /* también "finaliza hoy" */
  --badge-vivo-texto: #791F1F;
  --badge-clasificado-fondo: #EAF3DE;
  --badge-clasificado-texto: #27500A;

  /* --- Tipografía ------------------------------------------------- */
  --fuente: 'Cabin', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --fuente-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  /*
    ESCALA TIPOGRÁFICA — subida respecto del handoff, por decisión del
    cliente (28/07/2026).

    El diseño venía con 14px de base y bajaba hasta 10px en metadatos.
    En pantalla real resultaba incómodo de leer, sobre todo el desglose
    de precios y las fichas técnicas, que es justo donde la persona
    necesita detenerse antes de ofertar plata.

    Se sube todo un escalón, con 16px de base, que es el mínimo cómodo
    aceptado en web y el tamaño por defecto de los navegadores. Se
    mantienen las PROPORCIONES entre niveles para no romper la jerarquía
    del diseño: sigue habiendo la misma distancia relativa entre un
    metadato, un cuerpo y un título.

    Queda registrado que esto se aparta del handoff a propósito: si
    mañana el diseño se actualiza, la escala nueva va acá y en ningún
    otro lado.
  */
  --texto-base: 16px;
  --linea-base: 1.6;

  --tam-metadata: 12px;
  --tam-secundario: 13px;
  --tam-aviso: 14px;
  --tam-card: 15px;
  --tam-cuerpo: 16px;
  --tam-seccion: 17px;   /* precios y títulos de sección */
  --tam-titulo: 21px;
  --tam-hero: 26px;

  --peso-normal: 400;
  --peso-medio: 600;
  --peso-fuerte: 700;

  /* --- Layout ----------------------------------------------------- */
  --ancho-contenido: 1320px;   /* header, footer y fondos van full-bleed */
  --padding-lateral: 24px;

  /* --- Radios ----------------------------------------------------- */
  --radio-card: 10px;
  --radio-boton: 7px;
  --radio-badge: 6px;
  --radio-input: 7px;

  /* --- Espaciado -------------------------------------------------- */
  --gap-cards: 14px;
  --gap-chico: 6px;
  --gap-medio: 10px;
  --gap-grande: 18px;

  /* --- Alturas ---------------------------------------------------- */
  --alto-logo-header: 38px;
  --alto-logo-footer: 44px;
  --alto-avatar: 32px;
  --alto-boton: 34px;
  --alto-input: 38px;

  /* --- Otros ------------------------------------------------------ */
  --sombra-panel: 0 1px 3px rgba(0, 0, 0, 0.06);
  --sombra-modal: 0 12px 40px rgba(0, 0, 0, 0.18);
  --transicion: 140ms ease;
  --z-header: 50;
  --z-flotante: 60;
  --z-modal: 100;

  /* Punto de corte a mobile. Sale del propio prototipo, que cambia a
     layout mobile por debajo de 860px. */
  --bp-mobile: 860px;
}
