/* Shared component contracts. Existing Bootstrap markup is supported during migration. */
html[data-rd-design] {
    color-scheme: light;
    scroll-padding-block-start: 80px;
}
html[data-rd-design] body {
    font-family: var(--ui-font)!important;
    font-size: 14px;
    line-height: 1.65;
    color: var(--ui-text);
    background: var(--ui-bg);
    letter-spacing: normal;
    -webkit-font-smoothing: antialiased;
}
html[data-rd-design] :where(button,input,select,textarea) {
    font-family: var(--ui-font);
    font-size: 14px;
    line-height: 1.5;
    max-width: 100%;
}
html[data-rd-design] :where(h1,h2,h3,h4,h5,h6) {
    color: var(--ui-text);
    font-weight: 700;
    line-height: 1.6;
    letter-spacing: normal;
    overflow-wrap: anywhere;
}
html[data-rd-design] :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible {
    outline: 2px solid var(--ui-brand-hover)!important;
    outline-offset: 3px;
    box-shadow: var(--ui-focus);
    scroll-margin-block: 90px;
}
html[data-rd-design] :where(a,button) {
    touch-action: manipulation;
}
html[data-rd-design] :where(p,td,th,label,summary) {
    overflow-wrap: anywhere;
}
html[data-rd-design] :where(.text-muted,.text-secondary,.form-text) {
    color: var(--ui-muted)!important;
}
html[data-rd-design] .ui-skip {
    position: fixed;
    inset-block-start: 8px;
    inset-inline-start: 8px;
    z-index: 2000;
    transform: translateY(-150%);
    background: var(--ui-brand);
    color: #fff;
    padding: 12px;
    border-radius: 8px;
}
html[data-rd-design] .ui-skip:focus {
    transform: none;
}
html[data-rd-design] :is(.btn,.ui-button,.rt-btn,.rt-pro-btn,.hero-btn,.rdr-btn,.qi-btn) {
    min-height: var(--ui-control);
    padding: 8px 14px;
    border-radius: var(--ui-radius-control)!important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    box-shadow: none!important;
    white-space: normal;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: background-color var(--ui-motion-fast),border-color var(--ui-motion-fast);
    text-decoration: none;
}
html[data-rd-design] :is(.btn-primary,.ui-button--primary,.rt-btn-primary,.rt-pro-btn-dark,.rdr-btn-primary,.tax-primary,.hero-btn.primary,.hero-btn.success) {
    background: var(--ui-brand)!important;
    color: var(--ui-on-brand)!important;
    border: 1px solid var(--ui-brand)!important;
}
html[data-rd-design] :is(.btn-primary,.ui-button--primary,.rt-btn-primary,.rdr-btn-primary):hover {
    background: var(--ui-brand-hover)!important;
    border-color: var(--ui-brand-hover)!important;
    transform: none;
}
html[data-rd-design] :is(.btn-outline-primary,.btn-outline-secondary,.ui-button--secondary,.btn-light) {
    background: var(--ui-surface)!important;
    border: 1px solid var(--ui-border)!important;
    color: var(--ui-text)!important;
}
html[data-rd-design] :is(.btn-danger,.ui-button--danger) {
    background: var(--ui-danger)!important;
    border-color: var(--ui-danger)!important;
    color: #fff!important;
}
html[data-rd-design] :is(.btn-outline-danger) {
    color: var(--ui-danger)!important;
    background: var(--ui-surface)!important;
    border-color: #e6b9b4!important;
}
html[data-rd-design] :is(button:disabled,.btn.disabled,[aria-disabled=true]) {
    opacity: .55;
    cursor: not-allowed;
    box-shadow: none!important;
}
html[data-rd-design] :is(.form-control,.form-select,.ui-input) {
    min-height: var(--ui-control);
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-control)!important;
    background-color: var(--ui-surface);
    color: var(--ui-text);
    font-size: 14px;
    font-weight: 400;
    box-shadow: none;
    padding: 9px 12px;
    line-height: 1.5;
    min-width: 0;
}
html[data-rd-design] textarea.form-control {
    min-height: 90px;
    resize: vertical;
}
html[data-rd-design] :is(.form-control,.form-select):focus {
    border-color: var(--ui-brand);
    box-shadow: var(--ui-focus);
}
html[data-rd-design] :is(.form-control,.form-select):disabled {
    background: var(--ui-surface-muted);
    color: var(--ui-muted);
}
html[data-rd-design] label {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.7;
}
html[data-rd-design] .form-text {
    font-size: 12px;
    line-height: 1.7;
}
html[data-rd-design] :is(input[type=checkbox],input[type=radio]) {
    accent-color: var(--ui-brand);
    min-width: 18px;
    min-height: 18px;
    flex-shrink: 0;
}
html[data-rd-design] :is(.is-invalid,[aria-invalid=true]) {
    border-color: var(--ui-danger)!important;
}
html[data-rd-design] .ui-field-error {
    color: var(--ui-danger);
    font-size: 12px;
    line-height: 1.7;
    margin-block: 6px 0;
}
.ui-field {
    display: grid;
    gap: 6px;
}
.ui-field__label {
    display: flex;
    gap: 6px;
    align-items: center;
}
.ui-required {
    color: var(--ui-danger);
    font-size: 12px;
}
html[data-rd-design] :is(.card,.rd-panel,.rt-card,.rt-pro-card,.ac-panel,.ui-panel,.rdr-panel,.tax-card,.qi-card,.error-card) {
    background: var(--ui-surface);
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-panel)!important;
    box-shadow: none!important;
    backdrop-filter: none!important;
    min-width: 0;
}
html[data-rd-design] :is(.card-header,.card-footer,.rd-panel-header,.tax-card-head) {
    background: var(--ui-surface);
    border-color: var(--ui-border);
    padding: 14px 16px;
}
html[data-rd-design] .card-body {
    padding: 16px;
}
.ui-panel {
    padding: 16px;
}
.ui-panel__title {
    font-size: 18px;
    margin: 0 0 12px;
}
.ui-page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-block-end: 20px;
}
.ui-page-header h1 {
    font-size: var(--ui-title);
    margin: 0;
}
.ui-page-header p {
    color: var(--ui-muted);
    font-size: 14px;
    margin: 4px 0 0;
}
.ui-page-header__actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ui-breadcrumbs {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    list-style: none;
    margin: 0 0 12px;
    padding: 0;
    font-size: 12px;
    color: var(--ui-muted);
}
.ui-breadcrumbs a {
    color: var(--ui-brand-hover);
}
html[data-rd-design] :is(.badge,.ui-badge,.tax-status) {
    font-size: 12px;
    line-height: 1.6;
    font-weight: 600;
    white-space: normal;
    overflow-wrap: anywhere;
    border-radius: 6px!important;
    padding: 3px 8px;
}
html[data-rd-design] :is(.text-bg-success,.bg-success,.ui-badge--success) {
    color: var(--ui-success)!important;
    background: var(--ui-success-soft)!important;
}
html[data-rd-design] :is(.text-bg-danger,.bg-danger,.ui-badge--danger) {
    color: var(--ui-danger)!important;
    background: var(--ui-danger-soft)!important;
}
html[data-rd-design] :is(.text-bg-warning,.bg-warning,.ui-badge--warning) {
    color: var(--ui-warning)!important;
    background: var(--ui-warning-soft)!important;
}
html[data-rd-design] :is(.text-bg-secondary,.bg-secondary,.ui-badge--neutral) {
    color: var(--ui-muted)!important;
    background: var(--ui-surface-muted)!important;
}
html[data-rd-design] :is(.alert,.ui-alert,.rd-flash,.rt-flash) {
    padding: 12px 16px;
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-control);
    font-size: 14px;
    line-height: 1.8;
    box-shadow: none;
}
html[data-rd-design] :is(.alert-danger,.ui-alert--danger,.rd-flash-danger) {
    background: var(--ui-danger-soft);
    color: var(--ui-danger);
    border-color: #efc9c5;
}
html[data-rd-design] :is(.alert-success,.ui-alert--success,.rd-flash-success) {
    background: var(--ui-success-soft);
    color: var(--ui-success);
    border-color: #b7d8c4;
}
.ui-alert--warning {
    background: var(--ui-warning-soft);
    color: var(--ui-warning);
}
html[data-rd-design] :is(.table-responsive,.ui-table-scroll) {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    border-radius: var(--ui-radius-control);
    scrollbar-width: thin;
    scrollbar-color: #9badb9 transparent;
}
html[data-rd-design] table {
    font-size: 14px;
    border-collapse: collapse;
    color: var(--ui-text);
    font-variant-numeric: tabular-nums;
}
html[data-rd-design] :is(.table,table.ui-table) {
    margin-block-end: 0;
    --bs-table-color: var(--ui-text);
    --bs-table-bg: transparent;
    --bs-table-striped-bg: #f8fafb;
    --bs-table-hover-bg: #f0f7f6;
    --bs-table-border-color: var(--ui-border);
}
html[data-rd-design] :is(.table,table.ui-table) :is(th,td) {
    padding: 12px;
    line-height: 1.65;
    vertical-align: middle;
    border-bottom: 1px solid var(--ui-border);
    box-shadow: none;
}
html[data-rd-design] :is(.table,table.ui-table) thead th {
    font-size: 12px;
    font-weight: 600;
    background: var(--ui-surface-muted);
    color: var(--ui-muted);
    white-space: normal;
}
html[data-rd-design] :is(.table,table.ui-table) tbody tr:hover {
    background: #f0f7f6;
}
.ui-sort {
    all: unset;
    cursor: pointer;
    display: inline-flex;
    gap: 8px;
    align-items: center;
    min-height: 32px;
}
.ui-sort::after {
    content: '↕';
    font-size: 14px;
    color: var(--ui-muted);
}
.ui-table-hint {
    font-size: 12px;
    color: var(--ui-muted);
    margin-block: 8px;
}
.ui-money {
    display: inline-flex;
    gap: 5px;
    align-items: baseline;
    flex-wrap: wrap;
    font-variant-numeric: tabular-nums;
    unicode-bidi: isolate;
}
.ui-money__value {
    direction: ltr;
    unicode-bidi: isolate;
    font-weight: 700;
}
.ui-money__unit {
    font-size: 12px;
    color: var(--ui-muted);
}
html[data-rd-design] :is(.pagination,.pagination-links) {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    align-items: center;
}
html[data-rd-design] .page-link {
    min-width: 40px;
    min-height: 40px;
    border-radius: 6px!important;
    color: var(--ui-brand-hover);
    border-color: var(--ui-border);
    display: grid;
    place-items: center;
}
html[data-rd-design] .page-item.active .page-link {
    color: #fff;
    background: var(--ui-brand);
    border-color: var(--ui-brand);
}
html[data-rd-design] :is(.modal-content,dialog) {
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-dialog)!important;
    box-shadow: var(--ui-shadow-float);
    background: var(--ui-surface);
    max-width: calc(100vw - 24px);
    max-height: calc(100dvh - 24px);
    color: var(--ui-text);
}
html[data-rd-design] .modal-dialog {
    margin: 12px auto;
    max-width: min(640px,calc(100vw - 24px));
}
.modal-dialog-scrollable .modal-body {
    overscroll-behavior: contain;
}
html[data-rd-design] .modal-content {
    overflow-y: auto;
}
.modal-header,.modal-footer {
    gap: 8px;
    flex-wrap: wrap;
}
html[data-rd-design] .dropdown-menu {
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-control);
    box-shadow: var(--ui-shadow-float);
    max-width: calc(100vw - 24px);
    max-height: min(70dvh,480px);
    overflow-y: auto;
    font-size: 14px;
    background: #fff;
}
html[data-rd-design] .dropdown-item {
    padding: 10px 14px;
    white-space: normal;
    color: var(--ui-text);
}
html[data-rd-design] :is(.rd-empty,.rt-empty,.ui-empty,.tax-empty) {
    padding: 28px 16px;
    text-align: center;
    color: var(--ui-muted);
    font-size: 14px;
    line-height: 1.9;
}
.ui-empty h2 {
    font-size: 18px;
    margin: 8px 0;
}
.ui-empty p {
    max-width: 44ch;
    margin: 0 auto 12px;
}
.ui-skeleton {
    background: var(--ui-surface-muted);
    border-radius: 6px;
    min-height: 20px;
    animation: ui-pulse 1.6s ease-in-out infinite;
}
@keyframes ui-pulse {
    50% {
        opacity: .5;
    }
}
.ui-network-banner {
    position: fixed;
    inset-inline: 16px;
    inset-block-end: 88px;
    z-index: 2000;
    padding: 12px 16px;
    border: 1px solid #e5c38e;
    background: var(--ui-warning-soft);
    color: var(--ui-warning);
    border-radius: 8px;
    box-shadow: var(--ui-shadow-float);
}
html[data-rd-design] [hidden] {
    display: none!important;
}
@media(pointer:coarse) {
    html[data-rd-design] :is(.btn,.ui-button,.rt-btn,.page-link,summary,.dropdown-item) {
        min-height: var(--ui-touch);
    }
}
@media(max-width:767.98px) {
    html[data-rd-design] :is(.form-control,.form-select,.ui-input) {
        font-size: 16px;
        min-height: 44px;
    }
    .ui-page-header {
        align-items: flex-start;
        gap: 12px;
    }
    .ui-page-header h1 {
        font-size: 22px;
    }
    .ui-page-header__actions {
        width: 100%;
    }
    .ui-page-header__actions>* {
        flex: 1;
    }
    .ui-panel {
        padding: 12px;
    }
    html[data-rd-design] .input-group {
        flex-wrap: wrap;
    }
    html[data-rd-design] table :is(th,td) {
        font-size: 13px;
    }
}
@media(prefers-reduced-motion:reduce) {
    html[data-rd-design] *,html[data-rd-design] *::before,html[data-rd-design] *::after {
        animation: none!important;
        transition: none!important;
        scroll-behavior: auto!important;
    }
}
@media print {
    html[data-rd-design] body {
        background: #fff!important;
        color: #000!important;
    }
    html[data-rd-design] :is(.ui-skip,.ui-network-banner,.ui-table-hint,.ui-breadcrumbs) {
        display: none!important;
    }
    html[data-rd-design] :is(.table-responsive,.ui-table-scroll) {
        overflow: visible!important;
    }
    html[data-rd-print] :is(button,input,td,th) {
        font-size: inherit!important;
    }
}
.ui-drawer-lock {
    overflow: hidden;
}
.ui-error-summary a {
    color: inherit;
    text-decoration: underline;
}
.ui-error-summary ul {
    margin-block: 8px 0;
    padding-inline-start: 20px;
}
@media(min-width:768px) {
    html[data-rd-design] .modal-lg {
        max-width: min(800px,calc(100vw - 32px));
    }
    html[data-rd-design] .modal-xl {
        max-width: min(1140px,calc(100vw - 32px));
    }
}
html[data-rd-design] :is(.form-control,.form-select,.ui-input) {
    border-color: var(--ui-control-border);
}
html[data-rd-design] :is(.form-control,.form-select):focus {
    border-color: var(--ui-brand);
}
html[data-rd-design] .btn-outline-info {
    color: var(--ui-info);
    border-color: var(--ui-info);
}
html[data-rd-design] .btn-outline-warning {
    color: var(--ui-warning);
    border-color: var(--ui-warning);
}
html[data-rd-design] .btn-outline-success {
    color: var(--ui-success);
    border-color: var(--ui-success);
}
html[data-rd-design] .btn-info {
    background: var(--ui-info);
    border-color: var(--ui-info);
    color: var(--ui-on-brand);
}
html[data-rd-design] .btn-outline-info:hover {
    background: var(--ui-info);
    color: var(--ui-on-brand);
}
html[data-rd-design] .btn-outline-warning:hover {
    background: var(--ui-warning);
    color: var(--ui-on-brand);
}
html[data-rd-design] .btn-outline-success:hover {
    background: var(--ui-success);
    color: var(--ui-on-brand);
}
html[data-rd-design] .form-select {
    padding-inline-end: 36px;
}
html[data-rd-design][data-admin-theme="dark"] :is(.btn-success,.btn-danger,.ui-button--primary,.ui-button--danger) {
    color: var(--ui-on-brand)!important;
}
/* Filled status badges use readable foregrounds in both supported themes. */
html[data-rd-design] .badge:is(.bg-info,.bg-warning,.bg-success,.bg-danger) {
    color: var(--ui-on-brand)!important;
}
