/* RoPrint — overrides finos sobre MudBlazor. Mantiene la API de Mud
   pero alinea colores y micro-detalles a la marca. */

/* === Tipografía base de Mud === */
.mud-typography,
.mud-input-label,
.mud-input-control input,
.mud-select-input,
.mud-button {
    font-family: var(--rp-font-ui);
}

.mud-typography-h1,
.mud-typography-h2 {
    font-family: var(--rp-font-display);
    letter-spacing: 0.04em;
    font-weight: 400;
}

/* === MudButton === */
.mud-button {
    border-radius: var(--rp-radius-md);
    text-transform: none;
    font-weight: 600;
    letter-spacing: 0;
}

.mud-button-filled.mud-button-filled-primary {
    background-color: var(--rp-brand-green);
    color: #fff;
}

.mud-button-filled.mud-button-filled-primary:hover {
    background-color: var(--rp-brand-forest);
}

.mud-button-outlined.mud-button-outlined-primary {
    border-color: var(--rp-brand-green);
    color: var(--rp-brand-green);
    border-width: 1.5px;
}

.mud-button-outlined.mud-button-outlined-primary:hover {
    background-color: var(--rp-brand-lime-soft);
    border-color: var(--rp-brand-green);
}

.mud-button-text.mud-button-text-primary {
    color: var(--rp-brand-green);
}

/* === MudPaper / cards === */
.mud-paper {
    border-radius: var(--rp-radius-md);
}

.mud-paper.mud-elevation-0 {
    border: 1px solid var(--rp-line);
}

/* === MudTable === */
.mud-table-root {
    background-color: var(--rp-surface);
    border-radius: var(--rp-radius-md);
    box-shadow: var(--rp-shadow-sm);
}

.mud-table-root .mud-table-head {
    background-color: var(--rp-surface-2);
}

.mud-table-root .mud-table-head .mud-table-cell {
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.06em;
    font-weight: 600;
    color: var(--rp-ink-muted);
    border-bottom: 1px solid var(--rp-line);
}

.mud-table-root .mud-table-body .mud-table-row:nth-of-type(even) > .mud-table-cell {
    background-color: color-mix(in srgb, var(--rp-surface-2) 50%, transparent);
}

.mud-table-root .mud-table-body .mud-table-row:hover > .mud-table-cell {
    background-color: color-mix(in srgb, var(--rp-brand-lime-soft) 30%, transparent);
}

.mud-table-root .mud-table-body .mud-table-cell {
    border-bottom: 1px solid var(--rp-line);
    color: var(--rp-ink);
}

.mud-table-root .mud-table-foot .mud-table-cell {
    background-color: var(--rp-surface-2);
    font-weight: 600;
}

/* === MudChip === */
.mud-chip {
    border-radius: var(--rp-radius-sm);
    font-weight: 500;
    letter-spacing: 0.02em;
}

/* === Inputs === */
.mud-input-outlined .mud-input-outlined-border {
    border-radius: var(--rp-radius-sm);
}

.mud-input.mud-input-outlined.mud-focused .mud-input-outlined-border {
    border-color: var(--rp-brand-green);
    border-width: 1.5px;
}

.mud-input-label.mud-input-label-animated.mud-input-label-text-primary,
.mud-input-label.mud-input-label-animated.mud-input-label-text-primary.mud-input-label-shrink {
    color: var(--rp-brand-green);
}

/* === Tabs activos === */
.mud-tabs .mud-tab.mud-tab-active {
    color: var(--rp-brand-forest);
}

.mud-tabs .mud-tab-slider {
    background-color: var(--rp-brand-lime);
    height: 3px;
}

/* === Focus accesible === */
*:focus-visible {
    outline: 2px solid var(--rp-brand-green);
    outline-offset: 2px;
}

/* MudIconButton tiene su propio focus, lo dejamos pero refinamos color. */
.mud-icon-button:focus-visible {
    outline-color: var(--rp-brand-lime);
}

/* === Selección de texto === */
::selection {
    background-color: var(--rp-brand-lime-soft);
    color: var(--rp-ink);
}

/* === Dialogs y overlays === */
.mud-dialog {
    border-radius: var(--rp-radius-lg);
}

/* === StatusChip (componente custom) === */
.rp-status-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: var(--rp-radius-sm);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.4;
    white-space: nowrap;
}

.rp-status-chip::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: currentColor;
    opacity: 0.85;
}

.rp-status--neutral { background: color-mix(in srgb, var(--rp-ink-muted) 16%, transparent); color: var(--rp-ink-muted); }
.rp-status--info    { background: var(--rp-info-soft); color: var(--rp-info); }
.rp-status--success { background: var(--rp-success-soft); color: var(--rp-success); }
.rp-status--warning { background: var(--rp-warning-soft); color: var(--rp-warning); }
.rp-status--danger  { background: var(--rp-danger-soft); color: var(--rp-danger); }
.rp-status--ink     { background: color-mix(in srgb, var(--rp-ink) 10%, transparent); color: var(--rp-ink); }

/* === KpiCard === */
.rp-kpi {
    background-color: var(--rp-surface);
    border: 1px solid var(--rp-line);
    border-radius: var(--rp-radius-md);
    padding: 20px 24px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: var(--rp-shadow-sm);
}

.rp-kpi__label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
    color: var(--rp-ink-muted);
}

.rp-kpi__value {
    font-family: var(--rp-font-display);
    letter-spacing: 0.04em;
    font-size: 40px;
    line-height: 1;
    color: var(--rp-ink);
}

.rp-kpi__caption {
    font-size: 12px;
    color: var(--rp-ink-muted);
}

/* === PageHeader === */
.rp-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 24px 0 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--rp-line);
    flex-wrap: wrap;
}

.rp-page-header__title {
    font-family: var(--rp-font-display);
    letter-spacing: 0.04em;
    font-size: 32px;
    line-height: 1.1;
    color: var(--rp-ink);
    margin: 0;
}

.rp-page-header__subtitle {
    color: var(--rp-ink-muted);
    font-size: 14px;
    margin-top: 4px;
}

.rp-page-header__actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* === EmptyState === */
.rp-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 64px 24px;
    gap: 12px;
    color: var(--rp-ink-muted);
}

.rp-empty__icon {
    font-size: 56px;
    color: var(--rp-ink-muted);
    opacity: 0.6;
}

.rp-empty__title {
    font-size: 18px;
    font-weight: 600;
    color: var(--rp-ink);
}

.rp-empty__message {
    font-size: 14px;
    max-width: 360px;
}

/* === Sticky totals panel del QuoteEditor === */
.rp-totals-panel {
    background: var(--rp-surface);
    border: 1px solid var(--rp-line);
    border-radius: var(--rp-radius-md);
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    box-shadow: var(--rp-shadow-sm);
}

.rp-totals-panel__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 14px;
    color: var(--rp-ink-muted);
}

.rp-totals-panel__row strong {
    color: var(--rp-ink);
    font-weight: 600;
}

.rp-totals-panel__total {
    font-family: var(--rp-font-display);
    letter-spacing: 0.04em;
    font-size: 36px;
    line-height: 1;
    color: var(--rp-brand-forest);
}

.rp-totals-panel__divider {
    height: 1px;
    background: var(--rp-line);
    margin: 4px 0;
}
