.mud-link {
    color: var(--mudlink-text-color) !important;
}

/* Theme-specific overrides */
[data-theme="light"] {
    --mudlink-text-color: var(--mud-palette-primary);
    --mudpaper-border-color: #9b9b9b;

    /* CalqCmd page — contrast band colors (light theme) */
    --calq-band-dark-bg: #f0f2f5;
    --calq-band-dark-card-bg: #ffffff;
    --calq-band-dark-card-border: rgba(90, 147, 241, 0.2);
    --calq-band-dark-heading: #1a1a2e;
    --calq-band-dark-subtext: #555;
    --calq-band-dark-code-bg: #f7f8fa;
    --calq-band-dark-code-text: #1a1a2e;
    --calq-band-tint-bg: rgba(90, 147, 241, 0.06);
    --calq-card-border: rgba(90, 147, 241, 0.2);
    --calq-card-border-accent: #5A93F1;
    --calq-label-muted: #777;
    --calq-copy-btn: #5A93F1;
    --calq-pricing-open-border: #4caf50;
    --calq-pricing-comm-border: #5A93F1;
    --calq-diagram-label-bg: #ffffff;
    --calq-diagram-tint-label-bg: #f6f8fe;
}

[data-theme="dark"] {
    --mudlink-text-color: #95B8F4;
    --mudpaper-border-color: var(--mud-palette-surface);

    /* CalqCmd page — contrast band colors (dark theme) */
    --calq-band-dark-bg: #1a1b23;
    --calq-band-dark-card-bg: #24252e;
    --calq-band-dark-card-border: rgba(80, 140, 240, 0.25);
    --calq-band-dark-heading: #e0e0e0;
    --calq-band-dark-subtext: #a0a0a0;
    --calq-band-dark-code-bg: #1a1b23;
    --calq-band-dark-code-text: #c0c0c0;
    --calq-band-tint-bg: rgba(80, 140, 240, 0.04);
    --calq-card-border: rgba(80, 140, 240, 0.15);
    --calq-card-border-accent: #508CF0;
    --calq-label-muted: #999;
    --calq-copy-btn: #508CF0;
    --calq-pricing-open-border: #4caf50;
    --calq-pricing-comm-border: #508CF0;
    --calq-diagram-label-bg: #202128;
    --calq-diagram-tint-label-bg: #1f2130;
}

.mud-button,
.mud-button-root {
    border-radius: 8px !important;
}

.mud-paper,
.mud-paper-root {
    border-radius: 8px !important;
    border: 1px solid var(--mudpaper-border-color) !important;
}

/* Heading font weight overrides - make headings thinner */
.mud-typography-h1,
.mud-typography-h2,
.mud-typography-h3,
.mud-typography-h4,
h1,
h2,
h3,
h4 {
    font-weight: 300 !important;
}

.text-center {
    text-align: center;
    width: 100%;
}

/* CalqCmd page — section band overrides (no border, no radius) */
.calq-band.mud-paper {
    border: none !important;
    border-radius: 0 !important;
}

.calq-band-hero.mud-paper {
    border: none !important;
    border-radius: 8px 8px 0 0 !important;
}

.calq-band-cta.mud-paper {
    border: none !important;
    border-radius: 0 0 8px 8px !important;
}

/* CalqCmd page — inner cards that need their own border style */
.calq-card.mud-paper {
    border: 1px solid var(--calq-card-border) !important;
    border-radius: 8px !important;
}

.calq-card-accent-top.mud-paper {
    border: 1px solid var(--calq-card-border) !important;
    border-top: 3px solid var(--calq-card-border-accent) !important;
    border-radius: 8px !important;
}

.calq-card-accent-left.mud-paper {
    border: 1px solid var(--calq-card-border) !important;
    border-left: 3px solid var(--calq-card-border-accent) !important;
    border-radius: 8px !important;
}

.calq-card-dark.mud-paper {
    border: 1px solid var(--calq-band-dark-card-border) !important;
    border-radius: 8px !important;
}

.calq-card-dark-orange.mud-paper {
    border: 1px solid rgba(255, 152, 0, 0.2) !important;
    border-radius: 8px !important;
}

.calq-pricing-open.mud-paper {
    border: 2px solid var(--calq-pricing-open-border) !important;
    border-radius: 8px !important;
}

.calq-pricing-comm.mud-paper {
    border: 2px solid var(--calq-pricing-comm-border) !important;
    border-radius: 8px !important;
}

.calq-code-block.mud-paper {
    border: none !important;
    border-radius: 6px !important;
}

.calq-instructions.mud-paper {
    border: none !important;
    border-radius: 6px !important;
}

/* Mobile: remove body and section padding for full-width layout */
@media (max-width: 600px) {
    /* Remove MudMainContent side padding */
    #main-content.mud-main-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Remove MudContainer horizontal padding */
    #main-content .mud-container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Section bands: remove horizontal padding, keep vertical */
    .calq-band.mud-paper,
    .calq-band-hero.mud-paper,
    .calq-band-cta.mud-paper {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    /* Scale down headings on mobile */
    .mud-typography-h3 {
        font-size: 1.5rem !important;
    }

    .mud-typography-h4 {
        font-size: 1.25rem !important;
    }

    .mud-typography-h5 {
        font-size: 1.1rem !important;
    }

    /* Kill padding on card wrappers around tables */
    .responsive-table-wrapper .calq-card.mud-paper,
    .calq-card.mud-paper:has(.responsive-table-wrapper),
    .responsive-table-wrapper .mud-paper {
        padding: 4px !important;
    }
}

/* ============================================================ */
/* Responsive Table — stacked card layout on mobile             */
/* ============================================================ */

/* Desktop: normal table display */
.responsive-table-wrapper table {
    width: 100%;
}

/* Mobile: transform table into stacked cards */
@media (max-width: 768px) {
    .responsive-table-wrapper {
        width: 100%;
    }

    .responsive-table-wrapper .mud-simple-table {
        overflow-x: visible !important;
    }

    .responsive-table-wrapper .mud-table-container {
        overflow-x: visible !important;
    }

    .responsive-table-wrapper table {
        display: block !important;
        width: 100% !important;
        border: none !important;
        table-layout: auto !important;
    }

    .responsive-table-wrapper thead {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        overflow: hidden !important;
    }

    .responsive-table-wrapper thead tr {
        display: none !important;
    }

    .responsive-table-wrapper thead th {
        display: none !important;
    }

    .responsive-table-wrapper tbody {
        display: block !important;
        width: 100% !important;
    }

    .responsive-table-wrapper tbody tr {
        display: block !important;
        border: 1px solid var(--calq-card-border) !important;
        border-radius: 6px !important;
        padding: 6px 8px;
        margin-bottom: 8px;
        background: var(--mud-palette-surface);
        width: 100% !important;
    }

    .responsive-table-wrapper tbody tr:hover {
        background: var(--mud-palette-surface);
    }

    .responsive-table-wrapper tbody td {
        display: block !important;
        padding: 6px 0 !important;
        border-bottom: 1px solid var(--calq-card-border);
        width: 100% !important;
        position: relative;
        box-sizing: border-box;
        font-size: 0.85rem;
    }

    .responsive-table-wrapper tbody td:last-child {
        border-bottom: none;
    }

    /* Remove float from SVG icons inside mobile cards */
    .responsive-table-wrapper tbody td svg,
    .responsive-table-wrapper tbody td .mud-icon-root {
        float: none !important;
        display: inline !important;
        vertical-align: middle;
        margin-right: 4px !important;
    }

    .responsive-table-wrapper tbody td::before {
        content: attr(data-label);
        display: block;
        font-weight: 600;
        font-size: 0.75rem;
        color: var(--mud-palette-text-secondary);
        margin-bottom: 2px;
        text-transform: uppercase;
        letter-spacing: 0.02em;
    }

    /* First cell (row label) — card header style */
    .responsive-table-wrapper tbody td:first-child {
        display: block !important;
        padding: 4px 0 6px 0 !important;
        border-bottom: 2px solid var(--calq-card-border-accent) !important;
        margin-bottom: 0;
        font-weight: 700;
        font-size: 0.9rem;
        text-align: left;
    }

    .responsive-table-wrapper tbody td:first-child::before {
        display: none;
    }
}