import { FONT_FAMILY_SANS } from '../../../designTokens';

/** Caja de icono empresa (mismo criterio que RelacionLaboralCard). */
export const VISTA_DATOS_DETALLE_EMPRESA_ICON_BOX_STYLE = {
  width: 40,
  height: 40,
  minWidth: 40,
  borderRadius: 8,
  background: '#BDE4E9',
  display: 'flex',
  alignItems: 'center',
  justifyContent: 'center',
  boxSizing: 'border-box',
  flexShrink: 0,
};

export const VISTA_DATOS_DETALLE_EMPRESA_NOMBRE_STYLE = {
  fontFamily: FONT_FAMILY_SANS,
  fontWeight: 600,
  fontStyle: 'normal',
  fontSize: '20px',
  lineHeight: '30px',
  letterSpacing: 0,
  color: '#29474C',
  margin: 0,
};

/** Tipografía base filas metadata — IBM Plex Sans Medium 14/21, tracking 1%. */
export const VISTA_DATOS_DETALLE_ROW_TEXT_STYLE = {
  fontFamily: FONT_FAMILY_SANS,
  fontWeight: 500,
  fontStyle: 'normal',
  fontSize: '14px',
  lineHeight: '21px',
  letterSpacing: '0.01em',
  margin: 0,
};

/** Label de fila metadata (izquierda). */
export const VISTA_DATOS_DETALLE_ROW_LABEL_STYLE = {
  ...VISTA_DATOS_DETALLE_ROW_TEXT_STYLE,
  color: '#6B7280',
  flex: '1 1 auto',
  minWidth: 0,
  wordBreak: 'break-word',
  overflowWrap: 'break-word',
};

/** Valor de fila metadata (derecha). */
export const VISTA_DATOS_DETALLE_ROW_VALUE_STYLE = {
  ...VISTA_DATOS_DETALLE_ROW_TEXT_STYLE,
  color: '#29474C',
  textAlign: 'right',
  flex: '1 1 auto',
  minWidth: 0,
  wordBreak: 'break-word',
  overflowWrap: 'break-word',
};

export const VISTA_DATOS_DETALLE_DIVIDER_STYLE = {
  border: 'none',
  borderTop: '1px solid #E5E7EB',
  margin: '12px 0',
  width: '100%',
};

export const VISTA_DATOS_DETALLE_STAT_VALUE_STYLE = {
  fontFamily: FONT_FAMILY_SANS,
  fontWeight: 600,
  fontStyle: 'normal',
  fontSize: '32px',
  lineHeight: '40px',
  letterSpacing: 0,
  color: '#6D3856',
  margin: 0,
  textAlign: 'center',
};

export const VISTA_DATOS_DETALLE_STAT_LABEL_STYLE = {
  fontFamily: FONT_FAMILY_SANS,
  fontWeight: 400,
  fontStyle: 'normal',
  fontSize: '14px',
  lineHeight: '21px',
  letterSpacing: '0.01em',
  color: '#29474C',
  margin: '4px 0 0 0',
  textAlign: 'center',
};

/** Línea entre metadata (período) y bloque de números. */
export const VISTA_DATOS_DETALLE_STATS_DIVIDER_STYLE = {
  border: 'none',
  borderTop: '1px solid #E5E7EB',
  margin: 0,
  width: '100%',
  flexShrink: 0,
};

/** Contenedor de stats anclado al pie del panel (sin scroll interno). */
export const VISTA_DATOS_DETALLE_STATS_WRAP_STYLE = {
  marginTop: 'auto',
  flexShrink: 0,
  width: '100%',
  display: 'flex',
  flexDirection: 'column',
  justifyContent: 'flex-end',
  alignItems: 'center',
  gap: 12,
  paddingTop: 12,
  boxSizing: 'border-box',
};

/** Bloque superior: cabecera + metadata (altura natural, sin scroll). */
export const VISTA_DATOS_DETALLE_MAIN_STYLE = {
  flex: '0 0 auto',
  width: '100%',
  boxSizing: 'border-box',
};

export const VISTA_DATOS_DETALLE_STATS_GRID_STYLE = {
  display: 'flex',
  flexDirection: 'row',
  justifyContent: 'center',
  alignItems: 'flex-end',
  gap: 40,
  width: 'auto',
  maxWidth: '100%',
};
