:root {
    --ria-brand:#129bd1;
    --ria-navy:#141047;
    --ria-primary:#066987;
    --ria-primary-hover:#05566f;
    --ria-primary-pressed:#044455;
    --ria-selected:#e8f5fa;
    --ria-canvas:#f5f7fa;
    --ria-panel:#fff;
    --ria-muted-surface:#f1f5f9;
    --ria-text:#172b4d;
    --ria-secondary:#475569;
    --ria-muted:#64748b;
    --ria-border:#d8e1ea;
    --ria-control:#64748b;
    --ria-success:#15803d;
    --ria-success-text:#166534;
    --ria-success-surface:#f0fdf4;
    --ria-success-border:#bbf7d0;
    --ria-danger:#b91c1c;
    --ria-font:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
    --ria-space-1:4px;
    --ria-space-2:8px;
    --ria-space-4:16px;
    --ria-space-6:24px;
    --ria-space-8:32px;
    --ria-radius:8px;
    --ria-header-height:4rem;
    --ria-feedback-time:120ms
}

.ria-workspace,.ria-public {
    --bs-body-color:var(--ria-text);
    --bs-body-bg:var(--ria-canvas);
    --bs-body-font-family:var(--ria-font);
    --bs-primary:#066987;
    --bs-primary-rgb:6,105,135;
    --bs-link-color:var(--ria-primary);
    --bs-link-hover-color:var(--ria-primary-hover);
    --bs-border-color:var(--ria-border);
    font-family:var(--ria-font);
    color:var(--ria-text);
    background:var(--ria-canvas);
    font-size:1rem;
    line-height:1.5;
    margin:0
}

.ria-workspace h1,.ria-public h1 {
    font-size:1.75rem;
    line-height:1.3;
    font-weight:600;
    letter-spacing:-.025em
}

.ria-workspace h2,.ria-public h2 {
    font-size:1.25rem;
    font-weight:600
}

.ria-workspace h3 {
    font-size:1rem;
    font-weight:600
}

.ria-workspace a:not(.btn),.ria-public a:not(.btn) {
    color:var(--ria-primary);
    text-underline-offset:3px
}

.ria-workspace a:not(.btn):hover,.ria-public a:not(.btn):hover {
    color:var(--ria-primary-hover)
}

.ria-workspace :focus-visible,.ria-public :focus-visible {
    outline:3px solid var(--ria-primary);
    outline-offset:3px;
    box-shadow:none
}

.ria-skip {
    position:fixed;
    top:-100px;
    left:16px;
    background:var(--ria-panel);
    padding:12px;
    z-index:1100
}

.ria-skip:focus {
    top:12px
}

.ria-sidebar {
    --bs-offcanvas-width:248px;
    background:var(--ria-navy)!important;
    color:white
}

.ria-brand {
    height:96px;
    background:var(--ria-panel);
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:24px
}

.ria-sidebar .ria-brand {
    height:var(--ria-header-height);
    min-height:var(--ria-header-height);
    flex-shrink:0;
    padding:8px 24px;
    border-bottom:1px solid var(--ria-border)
}

.ria-brand a {
    display:flex;
    align-items:center;
    gap:16px;
    text-decoration:none;
    color:var(--ria-text)
}

.ria-navigation {
    display:grid;
    gap:8px
}

.ria-workspace .ria-navigation a {
    color:white;
    display:flex;
    align-items:center;
    gap:12px;
    min-height:48px;
    padding:12px;
    border-radius:6px;
    text-decoration:none;
    border-left:3px solid transparent
}

.ria-workspace .ria-navigation a:hover,.ria-workspace .ria-navigation a.active {
    background:#302c63;
    color:white
}

.ria-workspace .ria-navigation a.active {
    border-left-color:var(--ria-brand);
    font-weight:600
}

.ria-navigation i {
    width:20px;
    text-align:center
}

.ria-work-area {
    min-height:100vh;
    display:flex;
    flex-direction:column
}

.ria-topbar {
    min-height:var(--ria-header-height);
    background:var(--ria-panel);
    border-bottom:1px solid var(--ria-border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:8px 24px
}

.ria-topbar-label {
    color:var(--ria-secondary);
    font-size:.875rem
}

.ria-account-actions {
    display:flex;
    gap:12px;
    align-items:center;
    flex-wrap:wrap
}

.ria-account-link {
    display:flex;
    gap:8px;
    align-items:center;
    text-decoration:none;
    min-height:44px
}

.ria-account-link span {
    overflow-wrap:anywhere;
    font-size:.875rem
}

.ria-main {
    padding:24px;
    flex:1;
    min-width:0
}

.ria-footer {
    padding:16px 24px;
    display:flex;
    justify-content:space-between;
    font-size:.75rem;
    color:var(--ria-secondary);
    gap:16px
}

.ria-page-header {
    margin-bottom:24px
}

.ria-page-header h1 {
    margin-bottom:8px
}

.ria-description {
    margin:0;
    color:var(--ria-secondary);
    max-width:68ch
}

.ria-workspace .breadcrumb {
    font-size:.75rem;
    margin-bottom:16px
}

.ria-header-row {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin-bottom:24px
}

.ria-header-row .ria-page-header {
    margin:0
}

.ria-panel {
    background:var(--ria-panel);
    border:1px solid var(--ria-border);
    border-radius:var(--ria-radius);
    padding:24px;
    margin-bottom:24px;
    min-width:0
}

.ria-panel-heading {
    margin-bottom:24px
}

.ria-toolbar {
    display:flex;
    flex-wrap:wrap;
    align-items:flex-end;
    gap:16px;
    margin-bottom:24px
}

.ria-search {
    flex:1;
    min-width:200px;
    max-width:480px
}

.ria-toolbar label,.ria-workspace .form-label {
    font-size:.875rem;
    font-weight:600;
    margin-bottom:8px
}

.ria-toolbar .form-select {
    min-width:160px
}

.ria-count {
    font-size:.875rem;
    color:var(--ria-secondary);
    margin:0 0 12px
}

.ria-table-region {
    overflow-x:auto
}

.ria-workspace .table {
    --bs-table-color:var(--ria-text);
    --bs-table-bg:var(--ria-panel);
    --bs-table-border-color:var(--ria-border);
    font-size:.875rem;
    margin:0
}

.ria-workspace .table th {
    background:var(--ria-muted-surface);
    font-weight:600;
    white-space:nowrap
}

.ria-workspace .table td,.ria-workspace .table th {
    padding:12px 16px;
    vertical-align:middle
}

.ria-row-actions {
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap
}

.ria-empty {
    text-align:center;
    padding:48px 24px
}

.ria-empty>i {
    font-size:2rem;
    color:var(--ria-primary);
    margin-bottom:16px
}

.ria-empty p {
    color:var(--ria-secondary)
}

.ria-workspace .btn,.ria-public .btn {
    min-height:40px;
    padding:9px 16px;
    border-radius:6px;
    font-size:.875rem;
    font-weight:600;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    transition:background-color var(--ria-feedback-time),border-color var(--ria-feedback-time);
    white-space:normal
}

.ria-workspace .btn-primary,.ria-public .btn-primary {
    --bs-btn-bg:var(--ria-primary);
    --bs-btn-border-color:var(--ria-primary);
    --bs-btn-color:#fff;
    --bs-btn-hover-bg:var(--ria-primary-hover);
    --bs-btn-hover-border-color:var(--ria-primary-hover);
    --bs-btn-hover-color:#fff;
    --bs-btn-active-bg:var(--ria-primary-pressed);
    --bs-btn-active-border-color:var(--ria-primary-pressed);
    --bs-btn-active-color:#fff;
    --bs-btn-disabled-bg:var(--ria-primary);
    --bs-btn-disabled-border-color:var(--ria-primary);
    color:white
}

.ria-workspace .btn-outline-secondary {
    --bs-btn-color:var(--ria-secondary);
    --bs-btn-border-color:var(--ria-control);
    --bs-btn-hover-bg:var(--ria-muted-surface);
    --bs-btn-hover-color:var(--ria-text);
    --bs-btn-hover-border-color:var(--ria-secondary);
    --bs-btn-active-bg:var(--ria-border);
    --bs-btn-active-color:var(--ria-text);
    --bs-btn-active-border-color:var(--ria-secondary)
}

.ria-workspace .btn-danger {
    --bs-btn-bg:var(--ria-danger);
    --bs-btn-border-color:var(--ria-danger);
    --bs-btn-hover-bg:#991b1b;
    --bs-btn-hover-border-color:#991b1b;
    --bs-btn-active-bg:#7f1d1d;
    --bs-btn-active-border-color:#7f1d1d;
    color:white
}

.ria-workspace .btn-link {
    color:var(--ria-primary)
}

.ria-workspace .text-danger {
    color:var(--ria-danger)!important
}

.ria-workspace .text-primary {
    color:var(--ria-primary)!important
}

.ria-workspace .form-control,.ria-workspace .form-select {
    background-color:transparent;
    min-height:44px;
    border-color:var(--ria-control);
    border-radius:6px;
    color:var(--ria-text);
    font-size:1rem
}

.ria-workspace .form-control:focus,.ria-workspace .form-select:focus {
    border-color:var(--ria-primary);
    box-shadow:0 0 0 3px #06698726
}

.ria-workspace .form-check-input:checked {
    background-color:var(--ria-primary);
    border-color:var(--ria-primary)
}

.ria-workspace .form-check-input[type="checkbox"] {
    background-color:transparent;
    border-color:var(--ria-control)
}

.ria-workspace .form-check-input[type="checkbox"]:checked {
    border-color:var(--ria-primary);
    --bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23066987' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m5 10 3 3 7-7'/%3e%3c/svg%3e")
}

.ria-workspace .form-check-input[type="checkbox"]:indeterminate {
    background-color:transparent;
    border-color:var(--ria-primary);
    --bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23066987' stroke-linecap='round' stroke-width='3' d='M5 10h10'/%3e%3c/svg%3e")
}

.ria-workspace .e-input-group,
.ria-workspace .e-input-group.e-control-wrapper,
.ria-workspace .e-input-group .e-input {
    background-color:transparent
}

.ria-workspace .form-select option {
    background-color:var(--ria-panel);
    color:var(--ria-text)
}

.ria-workspace .form-text {
    color:var(--ria-secondary)
}

.ria-workspace .input-validation-error {
    border-color:var(--ria-danger)
}

.ria-workspace .field-validation-error {
    display:block;
    margin-top:8px;
    font-size:.875rem
}

.ria-workspace .validation-summary-valid {
    display:none
}

.ria-workspace .validation-summary-errors {
    padding:16px;
    border:1px solid var(--ria-danger);
    border-radius:6px;
    background:#fef2f2;
    margin-bottom:24px
}

.ria-workspace .validation-summary-errors ul {
    margin:0;
    padding-left:20px
}

.ria-form-width {
    max-width:1120px
}

.ria-form-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px 16px
}

.ria-span-full {
    grid-column:1/-1
}

.ria-form-section+.ria-form-section {
    margin-top:32px;
    border-top:1px solid var(--ria-border);
    padding-top:24px
}

.ria-form-section h2 {
    margin-bottom:16px
}

.ria-form-actions {
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    border-top:1px solid var(--ria-border);
    padding-top:24px;
    margin-top:24px
}

.ria-details-grid {
    display:grid;
    grid-template-columns:minmax(0,1fr) 340px;
    gap:24px;
    align-items:start
}

.ria-facts {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px 16px;
    margin:0
}

.ria-facts dt {
    color:var(--ria-secondary);
    font-size:.75rem;
    font-weight:500;
    margin-bottom:4px
}

.ria-facts dd {
    margin:0;
    overflow-wrap:anywhere;
    font-variant-numeric:tabular-nums
}

.ria-badge {
    display:inline-flex;
    gap:6px;
    align-items:center;
    font-size:.75rem;
    font-weight:600;
    padding:4px 10px;
    border:1px solid var(--ria-border);
    border-radius:4px;
    background:var(--ria-muted-surface);
    color:var(--ria-secondary)
}

.ria-qr-panel {
    text-align:center
}

.ria-qr-preview {
    display:flex;
    justify-content:center;
    padding:16px 0
}

.ria-qr-panel .btn {
    width:100%;
    margin-bottom:8px
}

.ria-qr-panel p {
    font-size:.875rem;
    color:var(--ria-secondary)
}

.ria-qr-export {
    position:absolute;
    left:-10000px;
    top:0;
    width:1024px;
    height:1024px;
    pointer-events:none
}

.ria-feedback {
    border-radius:6px
}

.ria-workspace .alert-success {
    color:#166534;
    background:#f0fdf4;
    border-color:#bbf7d0
}

.ria-workspace .alert-danger {
    color:var(--ria-danger);
    background:#fef2f2;
    border-color:#fecaca
}

.ria-workspace .e-control,.ria-workspace .e-grid,.ria-workspace .e-toast {
    font-family:var(--ria-font)
}

.ria-workspace .e-grid {
    border-color:var(--ria-border);
    border-radius:6px
}

.ria-workspace .e-grid .e-headercell {
    background:var(--ria-muted-surface);
    color:var(--ria-secondary);
    height:48px
}

.ria-workspace .e-grid .e-rowcell {
    color:var(--ria-text);
    font-size:.875rem;
    padding:12px 16px;
    overflow-wrap:anywhere
}

.ria-workspace .e-grid .ria-certificate-row .e-rowcell:not(:has(.ria-grid-actions)) {
    cursor:pointer;
}
.ria-workspace .e-grid .ria-certificate-details-link {
    color:inherit;
    text-decoration:none;
}
.ria-workspace .e-grid .e-row:hover .e-rowcell {
    background:var(--ria-selected)
}

.ria-workspace .e-grid .e-pager .e-currentitem {
    background:var(--ria-primary);
    color:white
}

.ria-workspace .e-grid .e-rowcell .btn {
    font-size:.75rem;
    padding:8px 10px;
    min-height:40px
}

.ria-workspace .e-grid .e-rowcell .ria-row-actions {
    flex-wrap:nowrap
}

.ria-workspace .e-grid .e-focused {
    outline:2px solid var(--ria-primary);
    outline-offset:-2px
}

.ria-workspace .e-grid .e-pager {
    color:var(--ria-secondary)
}

.ria-auth-page {
    background:var(--ria-canvas);
    min-height:100vh;
    padding:32px 16px
}

.ria-auth-brand {
    max-width:560px;
    margin:0 auto 24px
}

.ria-auth-frame {
    max-width:560px;
    margin:auto;
    background:var(--ria-panel);
    border:1px solid var(--ria-border);
    border-radius:12px;
    padding:32px
}

.ria-auth-frame>.row {
    display:block
}

.ria-auth-frame .row>[class*=col-] {
    width:100%
}

.ria-auth-frame h1 {
    margin-bottom:24px
}

.ria-auth-frame h2 {
    font-size:1rem;
    color:var(--ria-secondary);
    margin-bottom:24px
}

.ria-auth-frame .form-floating {
    margin-bottom:16px
}

.ria-auth-frame .form-floating>.form-control {
    min-height:58px
}

.ria-auth-frame .form-floating>label {
    color:var(--ria-secondary)
}

.ria-auth-frame hr {
    color:var(--ria-border);
    opacity:1
}

.ria-manage-grid {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:24px
}

.ria-workspace .nav-pills .nav-link {
    color:var(--ria-secondary);
    min-height:44px;
    display:flex;
    align-items:center
}

.ria-workspace .nav-pills .nav-link.active {
    background:var(--ria-selected);
    color:var(--ria-primary);
    font-weight:600
}

.ria-account-content {
    max-width:760px
}

.ria-account-content>.row>[class*=col-] {
    width:100%
}

.ria-account-content .btn {
    margin-top:8px
}

.ria-public-wrap {
    max-width:760px;
    margin:32px auto;
    padding:0 16px
}

.ria-public-brand {
    text-align:center;
    padding:24px
}

.ria-public-brand img {
    max-width:100%;
    max-height:96px;
    object-fit:contain
}

.ria-public-status {
    display:flex;
    align-items:center;
    gap:8px;
    font-weight:600;
    color:var(--ria-success);
    margin-bottom:16px
}

.ria-public-status.ria-not-found {
    color:var(--ria-danger)
}

.ria-public .ria-facts {
    margin-top:24px
}

.ria-public-footer {
    text-align:center;
    color:var(--ria-secondary);
    font-size:.75rem;
    padding:16px
}

@media(min-width:992px) {
    .ria-sidebar {
        position:fixed;
        inset:0 auto 0 0;
        width:248px!important;
        height:100vh!important;
        display:flex!important;
        flex-direction:column
    }

    .ria-sidebar .offcanvas-body {
        flex:1;
        flex-direction:column!important
    }

    .ria-work-area {
        margin-left:248px
    }

}

@media(max-width:991.98px) {
    .ria-details-grid {
        grid-template-columns:minmax(0,1fr)
    }

    .ria-qr-panel {
        max-width:540px
    }

    .ria-topbar-label {
        display:none
    }

    .ria-manage-grid {
        grid-template-columns:1fr
    }

    .ria-sidebar .offcanvas-body {
        flex:1
    }

    .ria-workspace .btn {
        min-height:44px
    }

}

@media(max-width:575.98px) {
    .ria-main {
        padding:16px
    }

    .ria-topbar {
        padding:8px 16px;
        align-items:flex-start
    }

    .ria-account-actions {
        gap:8px;
        justify-content:flex-end
    }

    .ria-account-link span {
        max-width:160px
    }

    .ria-header-row {
        align-items:stretch;
        flex-direction:column;
        gap:16px
    }

    .ria-panel {
        padding:16px
    }

    .ria-workspace h1,.ria-public h1 {
        font-size:1.5rem
    }

    .ria-form-grid,.ria-facts {
        grid-template-columns:minmax(0,1fr)
    }

    .ria-toolbar>* {
        width:100%;
        max-width:none
    }

    .ria-form-actions .btn {
        flex:1
    }

    .ria-auth-frame {
        padding:24px 16px
    }

    .ria-public-wrap {
        margin-top:16px
    }

    .ria-auth-page {
        padding-top:16px
    }

}

@media(prefers-reduced-motion:reduce) {
    .ria-workspace *,.ria-public * {
        animation:none!important;
        transition:none!important;
        scroll-behavior:auto!important
    }

}

@media print {
    .ria-sidebar,.ria-topbar,.ria-footer,.ria-form-actions,.ria-qr-panel,.ria-skip {
        display:none!important
    }

    .ria-work-area {
        margin:0
    }

    .ria-main {
        padding:0
    }

    .ria-panel {
        break-inside:avoid;
        border:0
    }

    .ria-public {
        background:white
    }

    .ria-public-wrap {
        max-width:none;
        margin:0;
        padding:0
    }

    .ria-public .ria-panel {
        padding:0
    }

    .ria-public .ria-facts {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }

}

.ria-workspace .ria-navigation a:focus-visible {
    outline-color: #6bdace;
}

.ria-account-content .ria-field > label {
    display: block;
    margin-bottom: var(--ria-space-2);
}

.ria-workspace .ria-qr-panel .btn:disabled {
    cursor: wait;
}

@media (max-width: 767.98px) {
    .ria-grid-scroll-hint {
        display: none;
    }
    .ria-workspace .e-grid.e-row-responsive .e-rowcell .ria-row-actions {
        flex-direction: column;
        align-items: stretch;
        gap: var(--ria-space-2);
    }
    .ria-workspace .e-grid.e-row-responsive .e-rowcell .btn {
        min-height: 44px;
        width: 100%;
    }
}

.ria-record-drawer {
    --bs-offcanvas-width: min(760px, 100vw);
    color: var(--ria-text);
    background: var(--ria-panel);
}
.ria-record-drawer .offcanvas-header,
.ria-workspace .modal-header {
    justify-content: space-between;
    border-bottom: 1px solid var(--ria-border);
    padding: var(--ria-space-6);
    gap: var(--ria-space-4);
}
.ria-record-drawer .offcanvas-header h2 {
    margin: 0;
}
.ria-record-drawer .offcanvas-body {
    padding: 0;
}
.ria-overlay-form,
.ria-drawer-record {
    padding: var(--ria-space-6);
}
.ria-record-drawer .ria-overlay-form {
    min-height: 100%;
}
.ria-record-drawer .ria-form-actions {
    position: sticky;
    bottom: 0;
    background: var(--ria-panel);
    padding: var(--ria-space-4) 0;
    margin-bottom: 0;
    z-index: 1;
}
.ria-workspace .modal-content {
    border-color: var(--ria-border);
    border-radius: 12px;
}
.ria-workspace .modal-body {
    padding: var(--ria-space-6);
}
.ria-workspace .modal-body > .ria-overlay-form {
    padding: 0;
}
.ria-discard-confirm {
    margin: var(--ria-space-4) var(--ria-space-6) 0;
    flex-shrink: 0;
}
.ria-drawer-qr {
    border-top: 1px solid var(--ria-border);
    margin-top: var(--ria-space-8);
    padding-top: var(--ria-space-6);
}
#ria-drawer-qr-preview {
    margin: var(--ria-space-4) auto;
}
.ria-overlay-loading {
    padding: var(--ria-space-6);
    color: var(--ria-secondary);
}
.ria-workspace button.ria-more-actions {
    color: var(--ria-secondary);
    border-color: var(--ria-control);
    background: var(--ria-panel);
}
.ria-workspace button.ria-more-actions:hover {
    background: var(--ria-muted-surface);
}
@media (max-width: 575.98px) {
    .ria-record-drawer {
        --bs-offcanvas-width: 100vw;
    }
    .ria-record-drawer .offcanvas-header,
    .ria-workspace .modal-header,
    .ria-workspace .modal-body,
    .ria-overlay-form,
    .ria-drawer-record {
        padding: var(--ria-space-4);
    }
    .ria-record-drawer .ria-form-actions {
        position: static;
    }
    .ria-record-drawer .ria-form-actions .btn {
        flex-basis: 100%;
    }
    .ria-record-drawer .ria-row-actions {
        flex-direction: column;
        align-items: stretch;
    }
}

.ria-workspace .btn-close {
    width: 44px;
    height: 44px;
    padding: 12px;
    margin: 0;
    flex-shrink: 0;
}
.ria-workspace #ria-workspace-toast {
    top: calc(var(--ria-header-height) + var(--ria-space-2)) !important;
    right: var(--ria-space-4) !important;
    max-width: calc(100vw - 32px);
}
.ria-workspace .e-toast-container .e-toast.e-toast-success {
    background-color: var(--ria-success-surface);
    border-color: var(--ria-success-border);
}
.ria-workspace .e-toast-container .e-toast.e-toast-success .e-toast-content,
.ria-workspace .e-toast-container .e-toast.e-toast-success .e-toast-title,
.ria-workspace .e-toast-container .e-toast.e-toast-success .e-toast-close-icon {
    color: var(--ria-success-text);
}
.ria-workspace .e-toast-container .e-toast-close-icon {
    min-width: 44px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ria-app-logo {
    display: block;
    width: 152px;
    max-width: 100%;
    height: auto;
}
