/* REGOS semantic colors. Tokens are shared with auth-service/docs/design. */
html { background: var(--app-bg); color: var(--app-text); }
html[data-theme="light"] { color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }
body.catalog-shell { background: var(--app-bg); color: var(--app-text); --bs-body-color: var(--app-text); --bs-body-bg: var(--app-bg); --bs-border-color: var(--app-border); --bs-secondary-color: var(--app-muted); }
.catalog-shell ::selection { background: var(--app-selection-bg); color: var(--app-selection-text); }
.catalog-shell .catalog-navbar-light, .catalog-shell .site-footer { background: var(--app-bg); }
.catalog-shell :is(.text-dark, .text-body, .text-black) { color: var(--app-text) !important; }
.catalog-shell :is(.text-muted, .text-secondary, .link-secondary) { color: var(--app-muted) !important; }
.catalog-shell :is(.text-primary, .link-primary) { color: var(--app-link) !important; }
.catalog-shell .integration-description a, .catalog-shell .btn-link { color: var(--app-link); }
.catalog-shell .bg-white { background-color: var(--app-surface) !important; }
.catalog-shell .bg-light { background-color: var(--app-surface-alt) !important; }
.catalog-shell .text-success { color: var(--app-success) !important; }
.catalog-shell .text-danger { color: var(--app-danger) !important; }
.catalog-shell .bg-success.bg-opacity-10 { background-color: var(--app-success-bg) !important; }
.catalog-shell .card { color: var(--app-text); background: var(--app-surface); border: 0; box-shadow: none; }
.catalog-shell .card-header { background: transparent; color: var(--app-text); }
.catalog-shell .border { border-color: var(--app-border) !important; }
.catalog-shell :is(.modal-content, .dropdown-menu, .toast) { background: var(--app-surface); color: var(--app-text); border: 0; box-shadow: var(--app-floating-shadow); }
.catalog-shell :is(.modal-header, .modal-footer) { border-color: var(--app-border); }
.catalog-shell .dropdown-item { color: var(--app-text); }
.catalog-shell .dropdown-item:is(:hover, :focus) { background: var(--app-hover); color: var(--app-text); }
.catalog-shell .dropdown-item.active { background: var(--app-selected-bg); color: var(--app-selected-text); }
.catalog-shell :is(.form-control, .form-select) { color: var(--app-text); background-color: var(--app-field); border-color: var(--app-field-border); }
.catalog-shell :is(.form-control, .form-select):focus { border-color: var(--app-focus); box-shadow: none; outline: var(--app-focus-ring); outline-offset: 2px; }
.catalog-shell .form-control::placeholder { color: var(--app-muted); opacity: 1; }
.catalog-shell .list-group-item { background: var(--app-surface); color: var(--app-text); border-color: var(--app-border); }
.catalog-shell .list-group-item-action:is(:hover, :focus) { background: var(--app-hover); color: var(--app-text); }
.catalog-shell .btn-success { background: var(--app-primary); border-color: var(--app-primary); color: var(--app-on-action); }
.catalog-shell .btn-success:hover { background: var(--app-primary-hover); border-color: var(--app-primary-hover); }
.catalog-shell :is(.btn-light, .btn-outline-secondary) { background: var(--app-surface-alt); border-color: transparent; color: var(--app-text); }
.catalog-shell :is(.btn-light, .btn-outline-secondary):hover { background: var(--app-hover); color: var(--app-text); }
.catalog-shell :is(button, a):focus-visible { outline: var(--app-focus-ring); outline-offset: var(--app-focus-offset); }
.catalog-shell .breadcrumb-item + .breadcrumb-item::before { color: var(--app-muted); }
.catalog-shell .app-badge-iap, .catalog-shell .integration-hero .app-badge-iap { background: var(--app-info-bg); color: var(--app-info); border: 0; }
.catalog-shell .app-badge-free, .catalog-shell .integration-hero .app-badge-free { background: var(--app-surface-alt); color: var(--app-muted); border: 0; }
.catalog-shell .category-chip-active { background: var(--app-selected-bg); color: var(--app-selected-text); }
.catalog-shell .category-chip-active::after { content: '✓'; margin-left: 4px; }
.catalog-shell .category-chip-active:hover { background: var(--app-hover); color: var(--app-text); }
.catalog-shell :is(.category-chip-default, .filter-pill-inactive, .filter-sort-btn) { background: var(--app-surface-alt); color: var(--app-text); }
.catalog-shell .filter-pill-active { background: var(--app-selected-bg); color: var(--app-selected-text); }
.catalog-shell .marketplace .app-card { background: transparent; }
.catalog-shell .marketplace .app-card:hover { background: var(--app-surface-alt); }
.catalog-shell .integration-details :is(.integration-hero, .integration-section, .screenshots-card) { background: transparent; }
.catalog-shell .integration-details .sidebar-card { background: var(--app-surface-alt); }
.catalog-shell .developer-card-title { color: var(--app-text); }
.catalog-shell .catalog-search-panel { border: 0; box-shadow: var(--app-floating-shadow); }
.catalog-shell .catalog-search-field { background: transparent; }
.catalog-shell #catalog-query { background: transparent; border: 0; box-shadow: none; outline: none; }
.catalog-shell .catalog-search-result:hover { background: var(--app-hover); }
.catalog-shell :is(.skeleton-card, .user-review-card, .feedback-reply-card) { background: var(--app-surface); border-color: var(--app-border); color: var(--app-text); }
.catalog-shell :is(.skeleton-block, .progress) { background: var(--app-surface-alt); }
.catalog-shell .page-link { background: var(--app-surface); color: var(--app-link); border-color: var(--app-border); }
.catalog-shell .page-item.active .page-link { background: var(--app-selected-bg); color: var(--app-selected-text); }
.catalog-shell .screenshots-glide .glide__slide img { background: var(--app-surface); border: 0; box-shadow: none; }
.catalog-shell .integration-sticky-light { border: 0; box-shadow: var(--app-floating-shadow); }
[data-theme="dark"] .catalog-shell .btn-close { filter: invert(1) grayscale(1) brightness(2); }

/* Detail hierarchy and readable catalog metadata in both themes. */
.integration-heading-icon { align-self: center; }
.integration-details .integration-logo { padding: 0; background: transparent; border: 0; box-shadow: none; }
.catalog-shell .integration-details .integration-reviews { margin-top: 40px; padding: 24px; background: var(--app-surface-alt); }
.integration-reviews .reviews-empty { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.integration-reviews .reviews-empty > p { margin: 0; text-align: left !important; }
.integration-reviews .reviews-empty > .d-flex { margin-top: 0 !important; }

.catalog-shell .app-meta { color: var(--app-muted); }
.catalog-shell { --catalog-selected-bg: var(--app-selected-bg); --catalog-selected-text: #234880; }
[data-theme="dark"] .catalog-shell { --catalog-selected-bg: var(--app-info-bg); --catalog-selected-text: var(--app-info); }
.catalog-shell :is(.category-chip-active, .filter-pill-active) { background: var(--catalog-selected-bg); color: var(--catalog-selected-text); box-shadow: inset 0 0 0 1px var(--app-focus); }
.catalog-shell :is(.category-chip-active, .filter-pill-active):hover { background: var(--catalog-selected-bg); color: var(--catalog-selected-text); }
.catalog-shell .filter-pill-active::after { content: '✓'; margin-left: 4px; }
/* A subdued neutral backing keeps both dark and light transparent artwork readable. */
.catalog-shell :is(.catalog-app-icon, .integration-logo img, .developer-card-logo img, .catalog-search-result img) { background: var(--app-artwork-bg); }
[data-theme="dark"] .catalog-shell img[src$="/integration-placeholder.svg"] { content: url('/img/integration-placeholder-dark.svg'); background: var(--app-surface-alt); }
/* Match the hosted document's normal color scheme to keep its canvas transparent. */
.catalog-shell :is(.regos-hosted-trigger, .regos-hosted-panel) { color-scheme: light; background: transparent; }
.site-footer .footer-container { padding-inline: 24px; }
.site-footer .ro-app-button { width: auto; flex: 0 0 auto; }
.site-footer .ro-app-button img { width: auto; height: 64px; min-width: 120px; max-height: none; }
.header-preferences-toggle { display: none; }
@media (min-width: 992px) {
    .header-preferences-menu.dropdown-menu { display: flex; position: static; gap: 12px; align-items: center; padding: 0; margin: 0; min-width: 0; background: transparent; box-shadow: none; }
}
@media (max-width: 991.98px) {
    .catalog-navbar-light > .container-fluid { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 4px; }
    .catalog-navbar-light .navbar-mobile-back { grid-column: 1; grid-row: 1; width: 32px; min-height: 44px; margin: 0 !important; }
    .catalog-navbar-light .navbar-brand { grid-column: 2; grid-row: 1; }
    .catalog-navbar-light .navbar-mobile-back[hidden] + .navbar-brand { grid-column: 1 / 3; }
    .catalog-navbar-light .catalog-nav-actions { grid-column: 3; grid-row: 1; gap: 2px; }
    .catalog-navbar-light .header-search-row { grid-column: 1 / -1; grid-row: 2; }
    .catalog-navbar-light .catalog-nav-actions #langDropdown { padding-inline: 6px !important; }
    .header-preferences-toggle { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 44px; border: 0; border-radius: 50%; background: transparent; color: var(--app-muted); }
    .header-preferences-toggle:hover { background: var(--app-hover); }
    .header-preferences-menu.show { display: flex; align-items: center; gap: 12px; min-width: 140px; padding: 12px; }
}
@media (max-width: 374.98px) {
    .catalog-navbar-light { padding-inline: 12px; }
    .catalog-navbar-light .navbar-brand svg { width: 56px; }
    .catalog-navbar-light .navbar-mobile-back { width: 24px; }
    .catalog-navbar-light :is(.header-search-toggle, .header-preferences-toggle) { width: 32px; }
}
@media (max-width: 767.98px) {
    .catalog-shell .integration-details .integration-reviews { margin-top: 32px; padding: 16px; }
    .site-footer .footer-container { padding-inline: 12px; }
    .catalog-shell:has(.marketplace) .site-footer .footer-container { padding-inline: 24px; }
}

.theme-picker { position: relative; flex-shrink: 0; }
.theme-toggle { display: inline-flex; width: 42px; height: 42px; padding: 0; align-items: center; justify-content: center; border: 0; border-radius: 50%; background: transparent; color: var(--app-muted); }
.theme-toggle:hover, .theme-toggle[aria-expanded="true"] { background: var(--app-hover); color: var(--app-text); }
.theme-toggle svg { display: none; width: 21px; height: 21px; }
[data-theme-preference="system"] .theme-icon-system, [data-theme-preference="light"] .theme-icon-sun, [data-theme-preference="dark"] .theme-icon-moon { display: block; }
.theme-menu { position: absolute; top: calc(100% + 8px); right: 0; z-index: 50; min-width: 180px; padding: 6px; border: 0; border-radius: var(--app-inset-radius); background: var(--app-surface); color: var(--app-text); box-shadow: var(--app-floating-shadow); }
.theme-menu button { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; min-height: 44px; padding: 10px 12px; border: 0; border-radius: var(--app-control-radius); background: transparent; color: inherit; text-align: left; }
.theme-menu button + button { margin-top: 4px; }
.theme-menu button:hover { background: var(--app-hover); }
.theme-menu button[aria-checked="true"] { background: var(--app-selected-bg); color: var(--app-selected-text); }
.theme-menu button[aria-checked="true"]::after { content: '✓'; }
@media (max-width: 767.98px) { .theme-toggle { width: 38px; height: 38px; } }
@media (prefers-reduced-motion: reduce) {
    .catalog-shell *, .catalog-shell *::before, .catalog-shell *::after { transition-duration: 0s !important; animation-duration: 0s !important; scroll-behavior: auto !important; }
}

/* Shared review layout on the integration page and in the reviews dialog. */
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) .review-summary {
    display: grid; grid-template-columns: 180px minmax(0, 1fr); align-items: center; gap: 24px;
}
.catalog-shell .review-summary-score .display-4 { font-size: 48px; line-height: 1.15; margin-bottom: 8px; }
.catalog-shell .review-summary .progress { background: var(--app-border); border-radius: 8px; overflow: hidden; }
.catalog-shell .review-summary-bars { min-width: 0; }
.catalog-shell .reviews-list { list-style: none; margin: 0; padding: 0; }
.catalog-shell :where(.integration-reviews, #allFeedbacksModal) .review-item { padding: 20px 0; border-bottom: 1px solid var(--app-border); }
.catalog-shell :where(.integration-reviews, #allFeedbacksModal) .review-item:first-child { padding-top: 0; }
.catalog-shell :where(.integration-reviews, #allFeedbacksModal) .review-item:last-child { border-bottom: 0; padding-bottom: 0; }
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) :is(.feedback-slide, .feedback-reply-wrap, .feedback-body-text, .feedback-reply-text) { min-height: 0; }
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) :is(.feedback-body-text, .feedback-reply-text) { color: var(--app-text) !important; line-height: 1.6; overflow-wrap: anywhere; }
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) .feedback-reply-card {
    margin-top: 12px; margin-left: 0; padding: 12px 16px; border-radius: 0 12px 12px 0;
    background: var(--app-bg); border: 0; border-left: 2px solid var(--app-field-border);
}
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) .feedback-reply-head { flex-wrap: wrap; color: var(--app-muted); }
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) .feedback-author { color: var(--app-text); overflow-wrap: anywhere; }
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) .review-star-empty { color: var(--app-muted); opacity: .55; }
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) .feedback-text-wrap { padding-right: 0; }
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) .feedback-toggle { position: static; margin-top: 4px; min-height: 32px; height: auto; width: auto; line-height: 1.4; color: var(--app-link); }
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) .feedback-votes { margin-top: 12px !important; }
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) .feedback-vote-link { min-width: 44px; min-height: 36px; height: auto; color: var(--app-muted); opacity: 1; }
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) .feedback-vote-link:hover { color: var(--app-text); }
.catalog-shell :is(.integration-reviews, #allFeedbacksModal) .feedback-slide > .d-flex:first-child,
.catalog-shell #allFeedbacksModal .review-item > .d-flex:first-child { flex-wrap: wrap; column-gap: 16px; row-gap: 4px; }
.catalog-shell .review-count { white-space: nowrap; }
.catalog-shell #allFeedbacksModal .modal-header { flex-shrink: 0; background: var(--app-surface); }
.catalog-shell #allFeedbacksModal .modal-body { overscroll-behavior: contain; }
@media (max-width: 575.98px) {
    .catalog-shell :is(.integration-reviews, #allFeedbacksModal) .review-summary { grid-template-columns: 1fr; gap: 16px; }
    .catalog-shell :where(.integration-reviews, #allFeedbacksModal) .review-item .feedback-author { margin-right: 12px; }
    .catalog-shell :is(.integration-reviews, #allFeedbacksModal) .feedback-reply-card { margin-left: 0; }
}

.catalog-shell .reviews-preview .reviews-list { display: grid; gap: 16px; }
.catalog-shell .integration-reviews .reviews-preview .review-item { height: auto; padding: 20px; border: 0; background: var(--app-surface); border-radius: 16px; }
.catalog-shell .reviews-preview .feedback-reply-card { background: var(--app-surface-alt); }
.catalog-shell .feedback-reply-wrap:empty { display: none; }
@media (max-width: 575.98px) {
    .catalog-shell .integration-reviews .reviews-preview .review-item { padding: 16px; }
}
