/*
 * RoboMecs Operations Portal — Shared Typography
 * Approved: 26 July 2026
 * Primary typeface: Inter
 *
 * This stylesheet is intentionally loaded after module/shared styles.
 * It provides one readable typography system without changing business logic,
 * page structure, colors, spacing, routes, or JavaScript behavior.
 */

:root {
    --rm-font-family: Inter, Arial, Helvetica, sans-serif;

    --rm-text-xs: 13px;
    --rm-text-sm: 14px;
    --rm-text-base: 15px;
    --rm-text-md: 16px;
    --rm-text-lg: 18px;
    --rm-text-xl: 24px;
    --rm-text-2xl: 28px;

    --rm-weight-normal: 400;
    --rm-weight-medium: 500;
    --rm-weight-semibold: 600;
    --rm-weight-bold: 700;

    --rm-line-normal: 1.5;
    --rm-line-compact: 1.35;
}

html,
body {
    font-family: var(--rm-font-family) !important;
}

body {
    font-size: var(--rm-text-base) !important;
    line-height: var(--rm-line-normal);
    font-weight: var(--rm-weight-normal);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

button,
input,
select,
textarea,
option {
    font-family: var(--rm-font-family) !important;
    font-size: var(--rm-text-base) !important;
    line-height: 1.4;
}

label,
legend,
.rm-form-label,
.rm-field-label {
    font-size: var(--rm-text-xs) !important;
    font-weight: var(--rm-weight-semibold) !important;
    line-height: var(--rm-line-compact);
}

button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.rm-btn,
.btn,
.rm-action-button,
.rm-icon-action,
.rm-detail-action,
.rm-register-action {
    font-size: var(--rm-text-sm) !important;
    font-weight: var(--rm-weight-semibold) !important;
    line-height: var(--rm-line-compact);
}

nav,
.rm-nav-item,
.rm-group-head,
.rm-submenu-link,
.rm-sidebar a,
.rm-sidebar button {
    font-size: var(--rm-text-sm) !important;
    font-weight: var(--rm-weight-semibold) !important;
}

table,
.rm-table,
.data-table,
.rm-register-table,
.rm-detail-table,
.rm-design-table {
    font-size: var(--rm-text-sm) !important;
}

th,
.rm-table th,
.data-table th,
.rm-register-table th,
.rm-detail-table th,
.rm-design-table th {
    font-size: var(--rm-text-xs) !important;
    font-weight: var(--rm-weight-semibold) !important;
    line-height: var(--rm-line-compact);
}

td,
.rm-table td,
.data-table td,
.rm-register-table td,
.rm-detail-table td,
.rm-design-table td {
    font-size: var(--rm-text-sm) !important;
    line-height: 1.45;
}

small,
.rm-muted,
.muted,
.rm-help-text,
.rm-form-help,
.rm-form-error,
.rm-card-subtitle,
.rm-page-subtitle,
.page-subtitle,
.rm-detail-muted,
.rm-register-secondary,
.rm-subtle,
.rm-design-subtle {
    font-size: var(--rm-text-xs) !important;
    line-height: 1.45;
}

.rm-badge,
.rm-pill,
.badge,
.status-pill,
.role-pill,
.rm-status,
.rm-status-pill,
.rm-detail-status,
.rm-register-status {
    font-size: var(--rm-text-xs) !important;
    font-weight: var(--rm-weight-semibold) !important;
    line-height: var(--rm-line-compact);
}

h1,
h2,
h3,
h4,
h5,
h6,
strong,
b {
    font-weight: var(--rm-weight-bold);
}

.rm-page-title,
.page-title,
.rm-detail-page-title,
.rm-register-title {
    font-size: clamp(26px, 2.2vw, 28px) !important;
    font-weight: var(--rm-weight-bold) !important;
    line-height: 1.2;
}

.rm-card-title,
.rm-section-title,
.rm-detail-card-title,
.rm-register-card-title {
    font-size: var(--rm-text-md) !important;
    font-weight: var(--rm-weight-bold) !important;
    line-height: 1.3;
}

.rm-metric-value,
.rm-kpi-value,
.rm-stat-value,
.rm-detail-metric-value {
    font-weight: var(--rm-weight-bold) !important;
}

code,
pre,
kbd,
samp,
.rm-design-code,
.rm-mc-pattern,
.rm-mc-locked {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
}

/*
 * Targeted compatibility normalization for old inline declarations.
 * These selectors only affect explicit legacy typography attributes.
 */
[style*="font-size:8px"],
[style*="font-size: 8px"],
[style*="font-size:9px"],
[style*="font-size: 9px"],
[style*="font-size:10px"],
[style*="font-size: 10px"],
[style*="font-size:11px"],
[style*="font-size: 11px"],
[style*="font-size:12px"],
[style*="font-size: 12px"] {
    font-size: var(--rm-text-xs) !important;
}

[style*="font-weight:800"],
[style*="font-weight: 800"],
[style*="font-weight:850"],
[style*="font-weight: 850"],
[style*="font-weight:900"],
[style*="font-weight: 900"],
[style*="font-weight:950"],
[style*="font-weight: 950"] {
    font-weight: var(--rm-weight-bold) !important;
}
