:root {
    /* Tabler border-radius variables */
    --tblr-border-radius: 4px;
    --tblr-border-radius-sm: 4px;
    --tblr-border-radius-lg: 4px;
    --tblr-border-radius-xl: 4px;
    --tblr-border-radius-xxl: 4px;
    --tblr-border-radius-pill: 4px;
}

.page-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: radial-gradient( circle at top left, rgba(32, 107, 196, 0.08), transparent 28% ), linear-gradient( 180deg, #f8fafc 0%, #ffffff 100% );
}

.page-content {
    flex: 1;
    width: 100%;
    padding: 2rem 0;
}

    .page-content > * {
        max-width: 1200px;
        margin-inline: auto;
        padding-inline: 1rem;
    }

.app-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    backdrop-filter: blur(12px);
    background-color: rgba(255, 255, 255, 0.85);
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.06);
}

.app-footer {
    background-color: rgba(255, 255, 255, 0.9);
}

/* Cards */
.card,
.card-header,
.card-body,
.card-footer,
.card-img,
.card-img-top,
.card-img-bottom {
    border-radius: 4px !important;
}

/* Buttons */
.btn,
.btn-group,
.btn-group-sm,
.btn-group-lg {
    border-radius: 4px !important;
}

    .btn-group > .btn,
    .btn-group-vertical > .btn {
        border-radius: 4px !important;
    }

/* Forms */
.form-control,
.form-select,
.form-check-input,
.form-file-text,
.form-file-button,
.input-group-text {
    border-radius: 4px !important;
}

.input-group > .form-control,
.input-group > .form-select,
.input-group > .input-group-text,
.input-group > .btn {
    border-radius: 4px !important;
}

/* Dropdowns and menus */
.dropdown-menu,
.dropdown-item,
.navbar-nav .dropdown-menu,
.ts-dropdown,
.choices__inner,
.choices__list--dropdown {
    border-radius: 4px !important;
}

/* Modals and offcanvas */
.modal-content,
.modal-header,
.modal-body,
.modal-footer,
.offcanvas {
    border-radius: 4px !important;
}

/* Alerts and notifications */
.alert,
.toast,
.toast-header,
.toast-body,
.notification {
    border-radius: 4px !important;
}

/* Badges and status elements */
.badge,
.status,
.tag {
    border-radius: 4px !important;
}

/* Navigation */
.nav-link,
.nav-tabs,
.nav-tabs .nav-link,
.nav-pills .nav-link,
.list-group,
.list-group-item,
.pagination,
.page-link,
.breadcrumb {
    border-radius: 4px !important;
}

/* Tables */
.table-responsive,
.table-vcenter,
.datagrid {
    border-radius: 4px !important;
}

/* Progress bars */
.progress,
.progress-bar {
    border-radius: 4px !important;
}

/* Accordions */
.accordion,
.accordion-item,
.accordion-header,
.accordion-button,
.accordion-body {
    border-radius: 4px !important;
}

/* Popovers and tooltips */
.popover,
.popover-header,
.popover-body,
.tooltip-inner {
    border-radius: 4px !important;
}

/* Images, placeholders and thumbnails */
.img-thumbnail,
.avatar,
.placeholder {
    border-radius: 4px !important;
}

/* Tabler-specific components */
.steps,
.step-item,
.timeline-event-card,
.empty,
.ribbon,
.datagrid-item,
.kanban-item,
.navbar,
.subheader {
    border-radius: 4px !important;
}

/* Override all standard rounded utility classes */
.rounded,
.rounded-0,
.rounded-1,
.rounded-2,
.rounded-3,
.rounded-4,
.rounded-5,
.rounded-top,
.rounded-end,
.rounded-bottom,
.rounded-start,
.rounded-pill,
.rounded-circle {
    border-radius: 4px !important;
}

/* Blazor error UI */
#blazor-error-ui {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    border-radius: 4px 4px 0 0;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }