/**
 * Invoice Hungry — system-wide design tokens
 * Derived from the product style guide (primary / secondary / tertiary / neutral,
 * Space Grotesk + Outfit, surfaces and button patterns).
 *
 * Use the --ih-* variables in any theme CSS. Prefer these over one-off hex values.
 */

:root {
    /* -------------------------------------------------------------------------
     * Color — Primary (base #34B2CC)
     * ------------------------------------------------------------------------- */
    --ih-primary-50: #ecf9fc;
    --ih-primary-100: #d0f0f7;
    --ih-primary-200: #a3e0ef;
    --ih-primary-300: #6ccadf;
    --ih-primary-400: #45bdd6;
    --ih-primary-500: #34b2cc;
    --ih-primary-600: #2a99b0;
    --ih-primary-700: #237a8a;
    --ih-primary-800: #1d6472;
    --ih-primary-900: #164552;
    --ih-primary-500-rgb: 52, 178, 204;

    /* -------------------------------------------------------------------------
     * Color — Secondary (base #2A9BAF)
     * ------------------------------------------------------------------------- */
    --ih-secondary-50: #ecf8fa;
    --ih-secondary-100: #d0eef3;
    --ih-secondary-200: #a3dde6;
    --ih-secondary-300: #6bc4d4;
    --ih-secondary-400: #3faebf;
    --ih-secondary-500: #2a9baf;
    --ih-secondary-600: #24899c;
    --ih-secondary-700: #1d6f7e;
    --ih-secondary-800: #185a66;
    --ih-secondary-900: #123d45;
    --ih-secondary-500-rgb: 42, 155, 175;

    /* -------------------------------------------------------------------------
     * Color — Tertiary (base #1A5F6B) — emphasis, “primary” solid buttons
     * ------------------------------------------------------------------------- */
    --ih-tertiary-50: #e8f4f6;
    --ih-tertiary-100: #c5e4e9;
    --ih-tertiary-200: #9fd0d9;
    --ih-tertiary-300: #6fb0bd;
    --ih-tertiary-400: #3d8a9a;
    --ih-tertiary-500: #1a5f6b;
    --ih-tertiary-600: #155a65;
    --ih-tertiary-700: #124d56;
    --ih-tertiary-800: #0f4048;
    --ih-tertiary-900: #0a2a30;
    --ih-tertiary-500-rgb: 26, 95, 107;

    /* -------------------------------------------------------------------------
     * Color — Neutral (base #64748B)
     * ------------------------------------------------------------------------- */
    --ih-neutral-50: #f8fafc;
    --ih-neutral-100: #f1f5f9;
    --ih-neutral-200: #e2e8f0;
    --ih-neutral-300: #cbd5e1;
    --ih-neutral-400: #94a3b8;
    --ih-neutral-500: #64748b;
    --ih-neutral-600: #475569;
    --ih-neutral-700: #334155;
    --ih-neutral-800: #1e293b;
    --ih-neutral-900: #0f172a;
    --ih-neutral-500-rgb: 100, 116, 139;

    /* -------------------------------------------------------------------------
     * Semantic
     * ------------------------------------------------------------------------- */
    --ih-color-text: var(--ih-neutral-700);
    --ih-color-text-muted: var(--ih-neutral-500);
    --ih-color-headline: var(--ih-neutral-900);
    --ih-color-on-primary-solid: #ffffff;
    --ih-color-danger: #dc2626;
    --ih-color-danger-hover: #b91c1c;
    --ih-color-danger-rgb: 220, 38, 38;
    --ih-color-success: #16a34a;
    --ih-color-success-rgb: 22, 163, 74;

    --ih-surface-page: #f2f3f5;
    --ih-surface-subtle: var(--ih-neutral-100);
    --ih-surface-soft: var(--ih-surface-subtle);
    --ih-surface-card: #ffffff;
    --ih-border-default: var(--ih-neutral-200);
    --ih-border-strong: var(--ih-neutral-300);

    /* -------------------------------------------------------------------------
     * Typography
     * ------------------------------------------------------------------------- */
    --ih-font-headline: "Space Grotesk", system-ui, sans-serif;
    --ih-font-body: "Outfit", system-ui, -apple-system, sans-serif;
    --ih-font-label: var(--ih-font-body);
    --ih-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

    --ih-text-headline: var(--ih-color-headline);
    --ih-text-body: var(--ih-color-text);
    --ih-text-label: var(--ih-color-text-muted);

    --ih-font-size-xs: 0.75rem;
    --ih-font-size-sm: 0.875rem;
    --ih-font-size-base: 1rem;
    --ih-font-size-lg: 1.125rem;
    --ih-font-size-xl: 1.25rem;
    --ih-font-size-2xl: 1.5rem;
    --ih-font-size-3xl: 1.875rem;

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

    --ih-line-tight: 1.25;
    --ih-line-normal: 1.5;
    --ih-line-relaxed: 1.625;

    /* -------------------------------------------------------------------------
     * Radius & shadow
     * ------------------------------------------------------------------------- */
    --ih-radius-sm: 0.375rem;
    --ih-radius-md: 0.5rem;
    --ih-radius-lg: 0.75rem;
    --ih-radius-xl: 1rem;
    --ih-radius-pill: 9999px;

    --ih-shadow-card: 0 1px 2px rgba(15, 23, 42, 0.05), 0 4px 14px rgba(15, 23, 42, 0.06);
    --ih-shadow-elevated: 0 8px 24px rgba(15, 23, 42, 0.08);

    /* -------------------------------------------------------------------------
     * Spacing scale (rem)
     * ------------------------------------------------------------------------- */
    --ih-space-1: 0.25rem;
    --ih-space-2: 0.5rem;
    --ih-space-3: 0.75rem;
    --ih-space-4: 1rem;
    --ih-space-5: 1.25rem;
    --ih-space-6: 1.5rem;
    --ih-space-8: 2rem;
    --ih-space-10: 2.5rem;

    /* -------------------------------------------------------------------------
     * Component tokens — buttons (guide: primary = dark teal solid)
     * ------------------------------------------------------------------------- */
    --ih-btn-font-weight: var(--ih-font-weight-medium);
    --ih-btn-padding-y: var(--ih-space-2);
    --ih-btn-padding-x: var(--ih-space-4);
    --ih-btn-radius: var(--ih-radius-md);

    --ih-btn-primary-bg: var(--ih-tertiary-500);
    --ih-btn-primary-bg-hover: var(--ih-tertiary-600);
    --ih-btn-primary-color: var(--ih-color-on-primary-solid);

    --ih-btn-secondary-bg: var(--ih-neutral-200);
    --ih-btn-secondary-bg-hover: var(--ih-neutral-300);
    --ih-btn-secondary-color: var(--ih-neutral-900);

    --ih-btn-inverted-bg: var(--ih-neutral-900);
    --ih-btn-inverted-bg-hover: var(--ih-neutral-800);
    --ih-btn-inverted-color: #ffffff;

    --ih-btn-outline-bg: transparent;
    --ih-btn-outline-border: var(--ih-neutral-900);
    --ih-btn-outline-color: var(--ih-neutral-900);
    --ih-btn-outline-hover-bg: var(--ih-neutral-100);

    /* Inputs / search bar */
    --ih-input-bg: var(--ih-neutral-100);
    --ih-input-border: transparent;
    --ih-input-radius: var(--ih-radius-md);
    --ih-input-padding-y: var(--ih-space-2);
    --ih-input-padding-x: var(--ih-space-3);

    /* Progress / accent bars */
    --ih-progress-track: var(--ih-primary-100);
    --ih-progress-fill: var(--ih-tertiary-500);

    /* Focus ring (keyboard) */
    --ih-focus-ring: 0 0 0 3px rgba(var(--ih-primary-500-rgb), 0.35);

    /* -------------------------------------------------------------------------
     * Legacy compatibility aliases (existing app/admin/auth CSS)
     * ------------------------------------------------------------------------- */
    --bs-primary: var(--ih-tertiary-500);
    --bs-success: #16a34a;
    --bs-info: var(--ih-secondary-500);
    --bs-warning: #f59e0b;
    --bs-danger: var(--ih-color-danger);

    --bf-primary: var(--ih-tertiary-500);
    --bf-body-bg: var(--ih-surface-page);
    --bf-black: var(--ih-neutral-900);
    --bf-blue: var(--ih-primary-500);
    --bf-grey: var(--ih-neutral-500);
    --bf-light-grey: var(--ih-neutral-300);
    --bf-white: #ffffff;
    --bf-success: #16a34a;

    --bf-sidebar-bg: var(--ih-tertiary-800);
    --bf-sidebar-bg-active: var(--ih-tertiary-700);
    --bf-sidebar-subnav-bg-active: var(--ih-tertiary-600);
    --bf-sidebar-text: var(--ih-primary-100);

    --info: var(--ih-secondary-500);
    --warning: #f59e0b;
    --danger: var(--ih-color-danger);
    --dark: var(--ih-neutral-900);

    --blue: var(--ih-primary-500);
    --red: var(--ih-color-danger);
    --orange: #f59e0b;
    --light: var(--ih-neutral-100);
    --inverse: var(--ih-neutral-900);
    --indigo: var(--ih-secondary-500);
    --purple: var(--ih-tertiary-500);
    --pink: var(--ih-primary-500);
    --yellow: #facc15;
    --green: #16a34a;
    --teal: var(--ih-secondary-500);
    --lime: #84cc16;
    --cyan: #06b6d4;
    --white: #ffffff;
    --gray: var(--ih-neutral-500);
    --gray-dark: var(--ih-neutral-800);

    --blue-rgb: var(--ih-primary-500-rgb);
    --red-rgb: var(--ih-color-danger-rgb);
    --orange-rgb: 245, 158, 11;
    --light-rgb: 241, 245, 249;
    --dark-rgb: 15, 23, 42;
    --inverse-rgb: 15, 23, 42;
    --indigo-rgb: var(--ih-secondary-500-rgb);
    --purple-rgb: var(--ih-tertiary-500-rgb);
    --pink-rgb: var(--ih-primary-500-rgb);
    --yellow-rgb: 250, 204, 21;
    --green-rgb: 22, 163, 74;
    --teal-rgb: var(--ih-secondary-500-rgb);
    --lime-rgb: 132, 204, 22;
    --cyan-rgb: 6, 182, 212;
    --white-rgb: 255, 255, 255;
    --gray-rgb: var(--ih-neutral-500-rgb);
    --gray-dark-rgb: 30, 41, 59;
}

/* -----------------------------------------------------------------------------
 * Base typography helpers
 * ----------------------------------------------------------------------------- */
.ih-headline,
h1.ih-headline,
h2.ih-headline,
h3.ih-headline {
    font-family: var(--ih-font-headline);
    color: var(--ih-text-headline);
    font-weight: var(--ih-font-weight-semibold);
    line-height: var(--ih-line-tight);
}

.ih-page-title,
h1.ih-page-title {
    font-family: var(--ih-font-headline);
    font-size: var(--ih-font-size-lg);
    font-weight: var(--ih-font-weight-semibold);
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: var(--ih-color-headline);
    margin: 0;
}

body {
    font-family: var(--ih-font-body);
    color: var(--ih-color-text);
    background: var(--ih-surface-page);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--ih-font-headline);
    color: var(--ih-color-headline);
}

.ih-body {
    font-family: var(--ih-font-body);
    color: var(--ih-text-body);
    font-size: var(--ih-font-size-base);
    line-height: var(--ih-line-normal);
}

.ih-label {
    font-family: var(--ih-font-label);
    color: var(--ih-text-label);
    font-size: var(--ih-font-size-sm);
    font-weight: var(--ih-font-weight-medium);
}

/* -----------------------------------------------------------------------------
 * Surfaces
 * ----------------------------------------------------------------------------- */
.ih-page-bg {
    background-color: var(--ih-surface-page);
}

.ih-card {
    background: var(--ih-surface-card);
    border-radius: var(--ih-radius-md);
    box-shadow: var(--ih-shadow-card);
    border: none;
}

/* -----------------------------------------------------------------------------
 * Admin component vocabulary (DESIGN.md content-card, data-table, kpi-card)
 * ----------------------------------------------------------------------------- */
.ih-section-kicker {
    font-family: var(--ih-font-body);
    font-size: 0.75rem;
    font-weight: var(--ih-font-weight-semibold);
    line-height: 1.43;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ih-color-text-muted);
    margin-bottom: 0.25rem;
}

.ih-display,
h1.ih-display,
h2.ih-display,
h3.ih-display {
    font-family: var(--ih-font-headline);
    font-weight: var(--ih-font-weight-semibold);
    color: var(--ih-color-headline);
    line-height: var(--ih-line-tight);
}

.ih-data-card {
    background: var(--ih-surface-card);
    border-radius: var(--ih-radius-md);
    box-shadow: var(--ih-shadow-card);
    border: none;
    overflow: hidden;
}

.ih-data-card .card-header {
    background: var(--ih-surface-card);
    border-bottom: 1px solid var(--ih-border-default);
}

.ih-data-card .card-title,
.ih-data-card h5 {
    font-family: var(--ih-font-headline);
    font-weight: var(--ih-font-weight-semibold);
    font-size: 1.125rem;
    color: var(--ih-color-headline);
}

.ih-data-table thead th {
    font-family: var(--ih-font-body);
    font-weight: var(--ih-font-weight-semibold);
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ih-color-text-muted);
    border-bottom: 1px solid var(--ih-border-default);
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.ih-data-table tbody td {
    font-family: var(--ih-font-body);
    font-size: 0.875rem;
    font-weight: var(--ih-font-weight-normal);
    line-height: 1.5;
    vertical-align: middle;
}

.ih-data-table tbody tr:hover {
    background-color: rgba(var(--ih-primary-500-rgb), 0.05);
}

.ih-data-table tbody .badge {
    font-size: 0.75rem;
    font-weight: var(--ih-font-weight-semibold);
}

.ih-metric-card {
    background: var(--ih-surface-card);
    border-radius: var(--ih-radius-xl);
    box-shadow: var(--ih-shadow-card);
    border: none;
}

.ih-metric-card__icon {
    width: 52px;
    height: 52px;
    border-radius: var(--ih-radius-md);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.25rem;
}

.ih-metric-card__icon--primary {
    background-color: rgba(var(--ih-tertiary-500-rgb), 0.12);
    color: var(--ih-tertiary-500);
}

.ih-metric-card__icon--secondary {
    background-color: rgba(var(--ih-secondary-500-rgb), 0.12);
    color: var(--ih-secondary-500);
}

.ih-metric-card__icon--accent {
    background-color: rgba(var(--ih-primary-500-rgb), 0.12);
    color: var(--ih-primary-500);
}

.ih-metric-card__icon--danger {
    background-color: rgba(var(--ih-color-danger-rgb), 0.12);
    color: var(--ih-color-danger);
}

.ih-metric-card__value {
    font-family: var(--ih-font-body);
    font-size: 0.875rem;
    font-weight: var(--ih-font-weight-semibold);
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
    color: var(--ih-color-headline);
    margin: 0;
}

.ih-metric-card__label {
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-xs);
    font-weight: var(--ih-font-weight-semibold);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ih-color-text-muted);
    margin: 0 0 var(--ih-space-2);
}

.ih-metric-card__value--lg {
    font-family: var(--ih-font-headline);
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--ih-color-headline);
    margin: 0;
}

.ih-metric-card__delta {
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-xs);
    color: var(--ih-color-text-muted);
    margin: var(--ih-space-2) 0 0;
}

.ih-metric-card__delta--up {
    color: var(--ih-color-success);
}

.ih-metric-card__delta--down {
    color: var(--ih-color-danger);
}

.ih-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ih-space-3);
}

@media (max-width: 767.98px) {
    .ih-detail-grid {
        grid-template-columns: 1fr;
    }
}

.ih-detail-field {
    padding: var(--ih-space-4);
    background: var(--ih-surface-soft);
    border: 1px solid var(--ih-border-default);
    border-radius: var(--ih-radius-md);
}

.ih-detail-field__value {
    font-family: var(--ih-font-body);
    font-size: 0.875rem;
    font-weight: var(--ih-font-weight-semibold);
    line-height: 1.4;
    color: var(--ih-color-headline);
    margin: 0;
}

.ih-detail-field__value--empty {
    font-weight: var(--ih-font-weight-normal);
    color: var(--ih-color-text-muted);
}

.ih-detail-grid--with-span .ih-detail-field--span {
    grid-column: 1 / -1;
}

/* -----------------------------------------------------------------------------
 * Document detail (credit notes and similar financial documents)
 * Asymmetric identity / total split — not a 3-up metric-card row.
 * ----------------------------------------------------------------------------- */
.ih-doc-view {
    --ih-doc-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

.ih-doc-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(15rem, 0.9fr);
    gap: var(--ih-space-8);
    align-items: stretch;
    margin-bottom: var(--ih-space-8);
    animation: ih-doc-enter 0.45s var(--ih-doc-ease) both;
}

.ih-doc-hero__identity {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: var(--ih-space-1);
}

.ih-doc-hero__client {
    font-family: var(--ih-font-headline);
    font-size: var(--ih-font-size-2xl);
    font-weight: var(--ih-font-weight-semibold);
    line-height: var(--ih-line-tight);
    letter-spacing: -0.02em;
    color: var(--ih-color-headline);
    margin: 0 0 var(--ih-space-5);
}

.ih-doc-hero__client a {
    color: inherit;
    text-decoration: none;
}

.ih-doc-hero__client a:hover,
.ih-doc-hero__client a:focus-visible {
    color: var(--ih-tertiary-600);
    text-decoration: none;
}

.ih-doc-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--ih-space-4) var(--ih-space-6);
}

.ih-doc-meta__value {
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-sm);
    font-weight: var(--ih-font-weight-semibold);
    line-height: 1.4;
    color: var(--ih-color-headline);
    margin: 0;
}

.ih-doc-meta__value a {
    color: var(--ih-primary-600);
    text-decoration: none;
}

.ih-doc-meta__value a:hover,
.ih-doc-meta__value a:focus-visible {
    color: var(--ih-tertiary-600);
    text-decoration: underline;
}

.ih-doc-meta__value--empty {
    font-weight: var(--ih-font-weight-normal);
    color: var(--ih-color-text-muted);
}

.ih-doc-total {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 100%;
    padding: var(--ih-space-6);
    border-radius: var(--ih-radius-xl);
    background: var(--ih-tertiary-50);
    border: 1px solid rgba(var(--ih-tertiary-500-rgb), 0.14);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        var(--ih-shadow-card);
}

.ih-doc-total__amount {
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-3xl);
    font-weight: var(--ih-font-weight-semibold);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.03em;
    line-height: 1.1;
    color: var(--ih-tertiary-700);
    margin: 0 0 var(--ih-space-4);
}

.ih-doc-total__rows {
    display: grid;
    gap: var(--ih-space-2);
    padding-top: var(--ih-space-3);
    border-top: 1px solid rgba(var(--ih-tertiary-500-rgb), 0.16);
}

.ih-doc-total__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--ih-space-3);
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-sm);
    color: var(--ih-color-text-muted);
}

.ih-doc-total__row span:last-child {
    font-variant-numeric: tabular-nums;
    font-weight: var(--ih-font-weight-semibold);
    color: var(--ih-color-headline);
}

.ih-doc-lines {
    animation: ih-doc-enter 0.45s var(--ih-doc-ease) 0.08s both;
}

.ih-doc-lines .ih-data-table {
    margin-bottom: 0;
}

.ih-doc-lines .ih-data-table tbody td {
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
}

.ih-doc-lines__sku {
    color: var(--ih-color-text-muted);
    font-size: var(--ih-font-size-xs);
    font-style: italic;
    margin-top: 0.15rem;
}

.ih-doc-empty {
    padding: var(--ih-space-8) var(--ih-space-4);
    text-align: left;
    color: var(--ih-color-text-muted);
    background: var(--ih-surface-subtle);
    border-radius: var(--ih-radius-md);
}

.ih-doc-empty p {
    margin: 0;
    max-width: 42ch;
}

.ih-doc-notes {
    margin-top: var(--ih-space-6);
    padding: var(--ih-space-5) var(--ih-space-5) var(--ih-space-5) var(--ih-space-5);
    border-radius: var(--ih-radius-md);
    background: var(--ih-surface-subtle);
    border-left: 3px solid var(--ih-tertiary-500);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
    animation: ih-doc-enter 0.45s var(--ih-doc-ease) 0.16s both;
}

.ih-doc-notes p {
    margin: 0;
    color: var(--ih-color-text);
    max-width: 65ch;
}

@keyframes ih-doc-enter {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 767.98px) {
    .ih-doc-hero {
        grid-template-columns: 1fr;
        gap: var(--ih-space-5);
        margin-bottom: var(--ih-space-6);
    }

    .ih-doc-hero__client {
        font-size: var(--ih-font-size-xl);
        margin-bottom: var(--ih-space-4);
    }

    .ih-doc-meta {
        grid-template-columns: 1fr;
        gap: var(--ih-space-3);
    }

    .ih-doc-total {
        padding: var(--ih-space-5);
    }

    .ih-doc-total__amount {
        font-size: var(--ih-font-size-2xl);
    }

    .ih-doc-view .ih-page-actions .btn {
        min-height: 44px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ih-doc-hero,
    .ih-doc-lines,
    .ih-doc-notes {
        animation: none;
    }
}

/* -----------------------------------------------------------------------------
 * Financial reports — split settlement (mix / net panel + account books)
 * ----------------------------------------------------------------------------- */
.ih-fin-report__filters {
    display: grid;
    grid-template-columns: minmax(0, 12.5rem) minmax(0, 12.5rem) auto;
    gap: var(--ih-space-3) var(--ih-space-4);
    align-items: end;
    padding-bottom: var(--ih-space-6);
    margin-bottom: var(--ih-space-6);
    border-bottom: 1px solid var(--ih-border-default);
}

.ih-fin-report__filters--narrow {
    grid-template-columns: minmax(0, 12.5rem) auto;
}

.ih-fin-report__field .form-label {
    margin-bottom: var(--ih-space-2);
}

.ih-fin-report__submit {
    display: flex;
    align-items: flex-end;
    gap: var(--ih-space-2);
}

.ih-fin-report__lead {
    font-family: var(--ih-font-headline);
    font-size: var(--ih-font-size-xl);
    font-weight: var(--ih-font-weight-semibold);
    line-height: var(--ih-line-tight);
    letter-spacing: -0.02em;
    color: var(--ih-color-headline);
    margin: 0 0 var(--ih-space-5);
}

.ih-fin-report__quiet {
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-sm);
    color: var(--ih-color-text-muted);
    margin: var(--ih-space-3) 0 0;
}

.ih-mix-bar {
    display: flex;
    height: 0.5rem;
    border-radius: var(--ih-radius-pill);
    overflow: hidden;
    background: var(--ih-neutral-100);
}

.ih-mix-bar--empty {
    background: var(--ih-neutral-100);
}

.ih-mix-bar__seg {
    display: block;
    height: 100%;
    transform-origin: left center;
    animation: ih-mix-fill 0.7s var(--ih-doc-ease) var(--ih-mix-delay, 0s) both;
}

.ih-mix-bar__seg--primary,
.ih-mix-bar__seg--output {
    background: var(--ih-tertiary-500);
}

.ih-mix-bar__seg--accent,
.ih-mix-bar__seg--input {
    background: var(--ih-primary-500);
}

.ih-mix-bar__legend {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ih-space-2) var(--ih-space-3);
    margin-top: var(--ih-space-3);
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-sm);
    color: var(--ih-color-text-muted);
}

.ih-mix-bar__swatch {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: var(--ih-radius-pill);
    flex-shrink: 0;
}

.ih-mix-bar__swatch--primary,
.ih-mix-bar__swatch--output {
    background: var(--ih-tertiary-500);
}

.ih-mix-bar__swatch--accent,
.ih-mix-bar__swatch--input {
    background: var(--ih-primary-500);
}

.ih-fin-report__legs {
    display: grid;
    gap: 0;
    margin-top: var(--ih-space-6);
    border-top: 1px solid var(--ih-border-default);
}

.ih-fin-report__leg {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--ih-space-4);
    align-items: baseline;
    padding: var(--ih-space-4) 0;
    border-bottom: 1px solid var(--ih-border-default);
    animation: ih-doc-enter 0.45s var(--ih-doc-ease) calc(0.12s + (var(--index, 0) * 80ms)) both;
}

.ih-fin-report__leg:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.ih-fin-report__leg--total {
    border-bottom: 0;
    padding-bottom: 0;
    margin-top: var(--ih-space-1);
    border-top: 1px solid var(--ih-border-default);
    font-weight: var(--ih-font-weight-semibold);
}

.ih-fin-report__leg-copy {
    min-width: 0;
}

.ih-fin-report__account {
    display: block;
    color: var(--ih-color-headline);
    text-decoration: none;
    font-weight: var(--ih-font-weight-semibold);
    overflow-wrap: anywhere;
}

.ih-fin-report__account:hover,
.ih-fin-report__account:focus-visible {
    color: var(--ih-tertiary-600);
    text-decoration: none;
}

.ih-fin-report__amount {
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-base);
    font-weight: var(--ih-font-weight-semibold);
    font-variant-numeric: tabular-nums;
    color: var(--ih-color-headline);
    text-decoration: none;
    white-space: nowrap;
}

a.ih-fin-report__amount:hover,
a.ih-fin-report__amount:focus-visible {
    color: var(--ih-tertiary-600);
}

.ih-fin-report__books {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: var(--ih-space-8);
    padding-top: var(--ih-space-8);
    margin-top: var(--ih-space-2);
    border-top: 1px solid var(--ih-border-default);
    animation: ih-doc-enter 0.45s var(--ih-doc-ease) 0.16s both;
}

.ih-fin-report__book-title {
    font-family: var(--ih-font-headline);
    font-size: var(--ih-font-size-lg);
    font-weight: var(--ih-font-weight-semibold);
    line-height: var(--ih-line-tight);
    color: var(--ih-color-headline);
    margin: 0 0 var(--ih-space-1);
}

.ih-fin-report__book .ih-fin-report__legs {
    margin-top: var(--ih-space-4);
}

.ih-fin-report__status {
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-sm);
    margin: 0 0 var(--ih-space-3);
    color: var(--ih-color-text-muted);
}

.ih-fin-report__status--alert {
    color: var(--ih-color-danger);
}

.ih-doc-total__amount--muted {
    color: var(--ih-color-text-muted);
}

.ih-doc-total__row--net {
    padding-top: var(--ih-space-2);
    margin-top: var(--ih-space-1);
    border-top: 1px solid rgba(var(--ih-tertiary-500-rgb), 0.16);
    color: var(--ih-color-headline);
}

.ih-fin-report .ih-empty-state--start {
    text-align: start;
    margin-left: 0;
    margin-right: 0;
    max-width: 36rem;
}

@keyframes ih-mix-fill {
    from {
        transform: scaleX(0);
        opacity: 0.35;
    }

    to {
        transform: scaleX(1);
        opacity: 1;
    }
}

@media (max-width: 767.98px) {
    .ih-fin-report__filters,
    .ih-fin-report__filters--narrow,
    .ih-fin-report__books {
        grid-template-columns: 1fr;
        gap: var(--ih-space-4);
    }

    .ih-fin-report__field .form-control,
    .ih-fin-report__submit .btn {
        min-height: 44px;
        width: 100%;
    }

    .ih-fin-report__lead {
        font-size: var(--ih-font-size-lg);
        margin-bottom: var(--ih-space-4);
    }

    .ih-fin-report__books {
        padding-top: var(--ih-space-6);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ih-mix-bar__seg,
    .ih-fin-report__leg,
    .ih-fin-report__books {
        animation: none;
    }
}

.ih-entity-avatar {
    width: 3rem;
    height: 3rem;
    border-radius: var(--ih-radius-md);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-family: var(--ih-font-headline);
    font-size: 0.875rem;
    font-weight: var(--ih-font-weight-semibold);
    letter-spacing: 0.04em;
    color: var(--ih-tertiary-500);
    background: rgba(var(--ih-tertiary-500-rgb), 0.12);
}

.ih-client-view .ih-client-tabs {
    margin-bottom: 0;
    padding-inline: 0.25rem;
}

.ih-client-view .ih-admin-box,
.ih-client-view .ih-table-panel {
    margin-top: -1px;
}

.ih-client-linked-user {
    padding: var(--ih-space-4);
    background: rgba(var(--ih-color-success-rgb, 22, 163, 74), 0.06);
    border: 1px solid rgba(var(--ih-color-success-rgb, 22, 163, 74), 0.18);
    border-radius: var(--ih-radius-md);
}

.ih-client-upcoming__table thead th {
    font-size: var(--ih-font-size-xs);
    font-weight: var(--ih-font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ih-color-text-muted);
    border-bottom-color: var(--ih-border-default);
}

.ih-icon-action {
    color: var(--ih-primary-500);
}

.ih-icon-action--danger {
    color: var(--ih-color-danger);
}

.ih-tabular {
    font-variant-numeric: tabular-nums;
}

/* -----------------------------------------------------------------------------
 * Buttons (namespaced to avoid clashing with Bootstrap)
 * ----------------------------------------------------------------------------- */
.ih-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--ih-space-2);
    font-family: var(--ih-font-body);
    font-weight: var(--ih-btn-font-weight);
    font-size: var(--ih-font-size-sm);
    line-height: 1.25;
    padding: var(--ih-btn-padding-y) var(--ih-btn-padding-x);
    border-radius: var(--ih-btn-radius);
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
    transition:
        background-color 0.15s ease,
        border-color 0.15s ease,
        color 0.15s ease,
        box-shadow 0.15s ease;
}

.ih-btn:focus-visible {
    outline: none;
    box-shadow: var(--ih-focus-ring);
}

.ih-btn-primary {
    background-color: var(--ih-btn-primary-bg);
    color: var(--ih-btn-primary-color);
}

.ih-btn-primary:hover {
    background-color: var(--ih-btn-primary-bg-hover);
    color: var(--ih-btn-primary-color);
}

.ih-btn-secondary {
    background-color: var(--ih-btn-secondary-bg);
    color: var(--ih-btn-secondary-color);
}

.ih-btn-secondary:hover {
    background-color: var(--ih-btn-secondary-bg-hover);
    color: var(--ih-btn-secondary-color);
}

.ih-btn-inverted {
    background-color: var(--ih-btn-inverted-bg);
    color: var(--ih-btn-inverted-color);
}

.ih-btn-inverted:hover {
    background-color: var(--ih-btn-inverted-bg-hover);
    color: var(--ih-btn-inverted-color);
}

.ih-btn-outline {
    background-color: var(--ih-btn-outline-bg);
    border-color: var(--ih-btn-outline-border);
    color: var(--ih-btn-outline-color);
}

.ih-btn-outline:hover {
    background-color: var(--ih-btn-outline-hover-bg);
    color: var(--ih-btn-outline-color);
}

.ih-btn-danger {
    background-color: var(--ih-color-danger);
    color: #fff;
    border-color: var(--ih-color-danger);
}

.ih-btn-danger:hover {
    background-color: var(--ih-color-danger-hover);
    color: #fff;
}

.ih-btn-icon {
    width: 2.25rem;
    height: 2.25rem;
    padding: 0;
    border-radius: var(--ih-radius-pill);
}

.ih-btn-icon.ih-btn-primary {
    background-color: var(--ih-tertiary-500);
}

.ih-btn-icon.ih-btn-danger {
    background-color: var(--ih-color-danger);
}

/* -----------------------------------------------------------------------------
 * Form controls
 * ----------------------------------------------------------------------------- */
.ih-input,
.ih-input-search {
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-sm);
    color: var(--ih-color-text);
    background: var(--ih-input-bg);
    border: 1px solid var(--ih-input-border);
    border-radius: var(--ih-input-radius);
    padding: var(--ih-input-padding-y) var(--ih-input-padding-x);
    width: 100%;
    max-width: 100%;
    transition:
        box-shadow 0.15s ease,
        border-color 0.15s ease;
}

.ih-input::placeholder,
.ih-input-search::placeholder {
    color: var(--ih-color-text-muted);
}

.ih-input:focus,
.ih-input-search:focus {
    outline: none;
    border-color: var(--ih-primary-400);
    box-shadow: var(--ih-focus-ring);
}

.ih-input-search {
    padding-left: 2.5rem;
    background-repeat: no-repeat;
    background-position: 0.75rem 50%;
    background-size: 1rem 1rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2364748b' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E");
}

/* -----------------------------------------------------------------------------
 * Progress strips (loading / meter)
 * ----------------------------------------------------------------------------- */
.ih-progress {
    height: 0.5rem;
    border-radius: var(--ih-radius-pill);
    background: var(--ih-progress-track);
    overflow: hidden;
}

.ih-progress-bar {
    height: 100%;
    border-radius: var(--ih-radius-pill);
    background: var(--ih-progress-fill);
    transition: width 0.3s ease;
}

/* -----------------------------------------------------------------------------
 * Pills / chips (accent)
 * ----------------------------------------------------------------------------- */
.ih-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--ih-space-2);
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-sm);
    font-weight: var(--ih-font-weight-medium);
    padding: var(--ih-space-1) var(--ih-space-3);
    border-radius: var(--ih-radius-pill);
    background: var(--ih-primary-100);
    color: var(--ih-tertiary-600);
}

/* -----------------------------------------------------------------------------
 * Tab / bottom nav shell (light pill on pale bg)
 * ----------------------------------------------------------------------------- */
.ih-nav-pill {
    display: inline-flex;
    align-items: center;
    gap: var(--ih-space-2);
    padding: var(--ih-space-2);
    background: var(--ih-neutral-100);
    border-radius: var(--ih-radius-pill);
}

.ih-nav-pill .ih-nav-pill-active {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--ih-radius-pill);
    background: var(--ih-tertiary-500);
    color: #fff;
}

/* -----------------------------------------------------------------------------
 * Trusted device verification method icons
 * ----------------------------------------------------------------------------- */
.ih-device-verified-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    vertical-align: middle;
}

.ih-device-verified-icon svg {
    width: 1.25rem;
    height: 1.25rem;
}

.ih-device-verified-icon--auto {
    color: var(--ih-neutral-500);
}

.ih-device-verified-icon--email {
    color: var(--ih-primary-500);
}

.ih-device-verified-icon--totp {
    color: var(--ih-color-warning, #b45309);
}

.ih-device-verified-icon--passkey {
    color: var(--ih-color-success, #15803d);
}

.ih-device-verified-preview .ih-device-verified-icon {
    width: 2.5rem;
    height: 2.5rem;
}

.ih-device-verified-preview .ih-device-verified-icon svg {
    width: 1.75rem;
    height: 1.75rem;
}

.ih-device-verified-preview__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.375rem;
    min-width: 5rem;
}

.ih-device-verified-preview__label {
    font-size: var(--ih-font-size-xs);
    color: var(--ih-neutral-600);
}

/* -----------------------------------------------------------------------------
 * API keys page — DESIGN.md content-card / alert-warning / data-table
 * ----------------------------------------------------------------------------- */
.ih-api-keys {
    --ih-api-keys-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

.ih-api-keys .btn {
    transition:
        transform 0.2s var(--ih-api-keys-ease),
        background-color 0.2s var(--ih-api-keys-ease),
        border-color 0.2s var(--ih-api-keys-ease),
        color 0.2s var(--ih-api-keys-ease);
}

.ih-api-keys .btn:active {
    transform: scale(0.98);
}

.ih-api-keys-intro {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(12rem, 0.7fr);
    gap: 1.25rem 2.5rem;
    align-items: start;
    margin-bottom: 1.5rem;
}

.ih-api-keys-intro__text {
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-sm);
    line-height: var(--ih-line-relaxed);
    color: var(--ih-color-text-muted);
    max-width: 65ch;
}

.ih-api-keys-docs {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
}

.ih-api-keys-doc-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-sm);
    font-weight: var(--ih-font-weight-medium);
    color: var(--ih-primary-700);
    text-decoration: none;
    transition: color 0.2s var(--ih-api-keys-ease), transform 0.2s var(--ih-api-keys-ease);
}

.ih-api-keys-doc-link:hover,
.ih-api-keys-doc-link:focus-visible {
    color: var(--ih-tertiary-600);
    text-decoration: none;
}

.ih-api-keys-doc-link:active {
    transform: scale(0.98);
}

.ih-api-keys-doc-link i {
    font-size: 0.75rem;
    opacity: 0.7;
}

.ih-api-secret-once {
    margin-bottom: 1.5rem;
    padding: 1.25rem 1.5rem;
    border-radius: var(--ih-radius-lg);
    background: var(--ih-warning-subtle, #fef3c7);
    color: var(--ih-warning-deep, #b45309);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45);
}

.ih-api-secret-once .ih-section-kicker {
    color: var(--ih-warning-deep, #b45309);
}

.ih-api-secret-once__title {
    font-family: var(--ih-font-headline);
    font-size: var(--ih-font-size-base);
    font-weight: var(--ih-font-weight-semibold);
    color: var(--ih-color-headline);
    margin: 0 0 0.75rem;
}

.ih-api-secret-once__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: stretch;
    margin-bottom: 0.75rem;
}

.ih-api-secret-once__value {
    display: block;
    margin: 0;
    padding: 0.7rem 0.9rem;
    font-family: var(--ih-font-mono);
    font-size: var(--ih-font-size-sm);
    line-height: 1.4;
    word-break: break-all;
    user-select: all;
    color: var(--ih-color-headline);
    background: var(--ih-surface-card);
    border-radius: var(--ih-radius-md);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.ih-api-secret-once__hint {
    font-size: var(--ih-font-size-sm);
    color: var(--ih-color-text-muted);
}

.ih-api-secret-once__hint code {
    font-family: var(--ih-font-mono);
    font-size: 0.8125rem;
}

.ih-api-copy-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    white-space: nowrap;
}

.ih-api-keys-mint {
    padding: 0.375rem;
    margin-bottom: 1.5rem;
    border-radius: var(--ih-radius-lg);
    background: rgba(var(--ih-neutral-500-rgb), 0.06);
}

.ih-api-keys-mint__inner {
    padding: 1.25rem 1.5rem 1.5rem;
    background: var(--ih-surface-card);
    border-radius: var(--ih-radius-md);
    box-shadow: var(--ih-shadow-card);
}

.ih-api-keys-mint__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 1rem 1.25rem;
    align-items: start;
}

.ih-api-keys-field {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.ih-api-keys-field .form-label {
    margin-bottom: 0;
}

.ih-api-keys-mint__submit {
    grid-column: 1 / -1;
}

.ih-api-keys-mint__btn {
    min-height: 2.375rem;
}

.ih-api-keys-subscribe {
    margin-bottom: 1.5rem;
    padding: 0.85rem 1rem;
    border-radius: var(--ih-radius-md);
    background: var(--ih-primary-50);
    color: var(--ih-tertiary-700);
    font-size: var(--ih-font-size-sm);
}

.ih-api-keys .ih-table-panel__body {
    padding-top: 1.25rem;
}

.ih-api-keys-name {
    font-family: var(--ih-font-body);
    font-weight: var(--ih-font-weight-semibold);
    color: var(--ih-color-headline);
}

.ih-api-secret-mask {
    display: inline-block;
    padding: 0.1875rem 0.5rem;
    font-family: var(--ih-font-mono);
    font-size: 0.8125rem;
    letter-spacing: 0.04em;
    color: var(--ih-neutral-600);
    background: var(--ih-neutral-100);
    border-radius: var(--ih-radius-sm);
}

.ih-api-example-label {
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-sm);
    color: var(--ih-color-text-muted);
    margin: 0 0 0.65rem;
}

.ih-api-example {
    position: relative;
    padding: 1.25rem 1.5rem;
    border-radius: var(--ih-radius-lg);
    background: var(--ih-tertiary-800);
    color: var(--ih-primary-100);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.ih-api-example pre,
.ih-api-example code {
    margin: 0;
    font-family: var(--ih-font-mono);
    font-size: 0.8125rem;
    line-height: 1.55;
    color: var(--ih-primary-100);
    background: transparent;
    white-space: pre-wrap;
    word-break: break-all;
}

.ih-api-example__copy {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.7rem;
    border: 1px solid rgba(208, 240, 247, 0.28);
    border-radius: var(--ih-radius-md);
    background: rgba(15, 64, 72, 0.45);
    color: var(--ih-primary-100);
    font-family: var(--ih-font-body);
    font-size: var(--ih-font-size-xs);
    font-weight: var(--ih-font-weight-semibold);
    cursor: pointer;
    transition:
        transform 0.2s var(--ih-api-keys-ease),
        background-color 0.2s var(--ih-api-keys-ease),
        border-color 0.2s var(--ih-api-keys-ease);
}

.ih-api-example__copy:hover,
.ih-api-example__copy:focus-visible {
    background: rgba(15, 64, 72, 0.75);
    border-color: rgba(208, 240, 247, 0.5);
    color: var(--ih-primary-100);
}

.ih-api-example__copy:active {
    transform: scale(0.98);
}

.ih-api-example pre {
    padding-right: 6.5rem;
}

.ih-ip-chip {
    display: inline-block;
    padding: 0.1875rem 0.625rem;
    font-size: var(--ih-font-size-xs);
    font-weight: var(--ih-font-weight-medium);
    line-height: 1.25;
    border-radius: var(--ih-radius-sm);
    white-space: nowrap;
    font-family: var(--ih-font-mono);
    color: var(--ih-tertiary-500);
    background-color: var(--ih-tertiary-50);
}

.ih-ip-allowlist {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
}

.ih-ip-allowlist__display {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.375rem;
}

.ih-ip-allowlist__edit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    min-height: 2rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--ih-neutral-400);
    cursor: pointer;
    line-height: 1;
    border-radius: var(--ih-radius-sm);
    transition: color 0.2s var(--ih-api-keys-ease, cubic-bezier(0.16, 1, 0.3, 1));
}

.ih-ip-allowlist__edit:hover,
.ih-ip-allowlist__edit:focus-visible {
    color: var(--ih-color-headline);
}

.ih-ip-allowlist__edit:focus-visible {
    outline: none;
    box-shadow: var(--ih-focus-ring);
}

.ih-ip-allowlist__edit i {
    font-size: 0.75rem;
}

.ih-ip-allowlist__form {
    width: 100%;
    max-width: 18rem;
}

.ih-ip-allowlist__form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.4rem;
}

.ih-ip-input {
    font-family: var(--ih-font-mono);
}

@media (max-width: 767.98px) {
    .ih-api-keys-intro,
    .ih-api-keys-mint__grid,
    .ih-api-secret-once__row {
        grid-template-columns: minmax(0, 1fr);
    }

    .ih-api-keys-docs {
        align-items: flex-start;
    }

    .ih-api-keys-mint__inner,
    .ih-api-secret-once,
    .ih-api-example {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .ih-api-keys-mint__btn,
    .ih-api-secret-once .ih-api-copy-btn,
    .ih-api-keys-field .form-control {
        min-height: 44px;
    }

    .ih-ip-allowlist__edit {
        min-width: 44px;
        min-height: 44px;
    }

    .ih-api-example__copy {
        min-height: 44px;
        min-width: 44px;
        padding: 0.5rem 0.85rem;
    }

    .ih-api-example__copy {
        position: static;
        margin-bottom: 0.75rem;
    }

    .ih-api-example pre {
        padding-right: 0;
    }
}
