:root {
    --serena-teal: #0f5b66;
    --serena-teal-deep: #08464f;
    --serena-teal-dark: #072f36;
    --serena-gold: #c7a37f;
    --serena-paper: #fbf8f3;
    --serena-paper-soft: #f5ede3;
    --serena-ink: #17353b;
    --serena-dark-bg: #0d1518;
    --serena-dark-surface: #162125;
    --serena-dark-surface-2: #1c282d;
    --serena-dark-border: rgba(199, 163, 127, 0.18);
    --serena-dark-text: #f5f1ea;
    --serena-dark-muted: rgba(245, 241, 234, 0.72);
}

html:not(.dark) .fi-body {
    background: linear-gradient(180deg, #f8f4ee 0%, #f5ede3 100%);
    color: var(--serena-ink);
}

html:not(.dark) .fi-simple-layout,
html:not(.dark) .fi-layout {
    background: linear-gradient(180deg, #f8f4ee 0%, #f5ede3 100%);
}

html:not(.dark) .fi-sidebar {
    background: linear-gradient(180deg, var(--serena-teal-deep), var(--serena-teal));
}

html:not(.dark) .fi-logo,
html:not(.dark) .fi-sidebar-header .fi-logo,
html:not(.dark) .fi-topbar .fi-logo {
    color: #ffffff;
}

html:not(.dark) .fi-sidebar-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

html:not(.dark) .fi-sidebar-group-label,
html:not(.dark) .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-item-btn,
html:not(.dark) .fi-sidebar-group-btn,
html:not(.dark) .fi-sidebar-group-collapse-btn,
html:not(.dark) .fi-sidebar-group-dropdown-trigger-btn,
html:not(.dark) .fi-sidebar .fi-icon {
    color: rgba(255, 255, 255, 0.92);
}

html:not(.dark) .fi-sidebar-item,
html:not(.dark) .fi-sidebar-item-btn,
html:not(.dark) .fi-sidebar-group,
html:not(.dark) .fi-sidebar-group-btn,
html:not(.dark) .fi-sidebar-group-items {
    color: rgba(255, 255, 255, 0.92);
}

html:not(.dark) .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-group-label {
    color: rgba(255, 255, 255, 0.92) !important;
}

html:not(.dark) .fi-sidebar .fi-icon,
html:not(.dark) .fi-sidebar-item .fi-icon,
html:not(.dark) .fi-sidebar-group .fi-icon {
    color: rgba(255, 255, 255, 0.92) !important;
}

html:not(.dark) .fi-sidebar-item-btn:hover,
html:not(.dark) .fi-sidebar-group-btn:hover,
html:not(.dark) .fi-sidebar-item-button:hover,
html:not(.dark) .fi-sidebar-group-button:hover {
    background: rgba(255, 255, 255, 0.12) !important;
}

html:not(.dark) .fi-topbar-item-btn:hover {
    background: rgba(255, 255, 255, 0.08);
}

html:not(.dark) .fi-sidebar-item-btn:hover .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-group-btn:hover .fi-sidebar-group-label,
html:not(.dark) .fi-sidebar-item-btn:hover .fi-icon,
html:not(.dark) .fi-sidebar-group-btn:hover .fi-icon {
    color: #ffffff !important;
}

html:not(.dark) .fi-sidebar-item-active .fi-sidebar-item-button,
html:not(.dark) .fi-sidebar-item.fi-active > .fi-sidebar-item-btn,
html:not(.dark) .fi-sidebar-item.fi-active > .fi-sidebar-item-button,
html:not(.dark) .fi-sidebar-item-has-active-child-items > .fi-sidebar-item-btn {
    background: #f3eee6 !important;
    color: #17353b !important;
    box-shadow: none;
}

html:not(.dark) .fi-sidebar-item-active .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-item.fi-active > .fi-sidebar-item-button .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-item-has-active-child-items > .fi-sidebar-item-btn .fi-sidebar-item-label,
html:not(.dark) .fi-sidebar-item-active .fi-icon,
html:not(.dark) .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-icon,
html:not(.dark) .fi-sidebar-item.fi-active > .fi-sidebar-item-button .fi-icon,
html:not(.dark) .fi-sidebar-item-has-active-child-items > .fi-sidebar-item-btn .fi-icon {
    color: #17353b !important;
}

html:not(.dark) .fi-topbar {
    background: rgba(251, 248, 243, 0.96);
    border-bottom: 1px solid rgba(23, 53, 59, 0.08);
}

html:not(.dark) .fi-header-heading,
html:not(.dark) .fi-simple-header-heading,
html:not(.dark) .fi-breadcrumbs,
html:not(.dark) .fi-topbar-item-label,
html:not(.dark) .fi-topbar .fi-icon,
html:not(.dark) .fi-page-sub-navigation-sidebar-item-label {
    color: #111111;
}

html:not(.dark) .fi-simple-header-subheading,
html:not(.dark) .fi-header-subheading {
    color: rgba(17, 17, 17, 0.72);
}

html:not(.dark) .fi-section,
html:not(.dark) .fi-ta,
html:not(.dark) .fi-modal-window,
html:not(.dark) .fi-dropdown-panel,
html:not(.dark) .fi-in-wi-stats-overview-stat,
html:not(.dark) .fi-wi-widget {
    border-color: rgba(199, 163, 127, 0.2);
}

html.dark .fi-body {
    background: linear-gradient(180deg, #0b1215 0%, #111b1f 100%);
    color: var(--serena-dark-text);
}

html.dark .fi-simple-layout,
html.dark .fi-layout {
    background: linear-gradient(180deg, #0b1215 0%, #111b1f 100%);
}

html.dark .fi-sidebar {
    background: linear-gradient(180deg, #07181d, #0a2a31);
}

html.dark .fi-sidebar-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

html.dark .fi-sidebar-group-label,
html.dark .fi-sidebar-item-label,
html.dark .fi-sidebar-item-btn,
html.dark .fi-sidebar-group-btn,
html.dark .fi-sidebar-group-collapse-btn,
html.dark .fi-sidebar-group-dropdown-trigger-btn,
html.dark .fi-sidebar .fi-icon,
html.dark .fi-sidebar-item,
html.dark .fi-sidebar-group,
html.dark .fi-sidebar-group-items {
    color: rgba(245, 241, 234, 0.9) !important;
}

html.dark .fi-sidebar-item-btn:hover,
html.dark .fi-sidebar-group-btn:hover,
html.dark .fi-sidebar-item-button:hover,
html.dark .fi-sidebar-group-button:hover {
    background: rgba(255, 255, 255, 0.08) !important;
}

html.dark .fi-sidebar-item-active .fi-sidebar-item-button,
html.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-btn,
html.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-button,
html.dark .fi-sidebar-item-has-active-child-items > .fi-sidebar-item-btn {
    background: rgba(199, 163, 127, 0.18) !important;
    color: #ffffff !important;
}

html.dark .fi-sidebar-item-active .fi-sidebar-item-label,
html.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-label,
html.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-button .fi-sidebar-item-label,
html.dark .fi-sidebar-item-has-active-child-items > .fi-sidebar-item-btn .fi-sidebar-item-label,
html.dark .fi-sidebar-item-active .fi-icon,
html.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-icon,
html.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-button .fi-icon,
html.dark .fi-sidebar-item-has-active-child-items > .fi-sidebar-item-btn .fi-icon {
    color: #ffffff !important;
}

html.dark .fi-topbar {
    background: rgba(13, 21, 24, 0.94);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

html.dark .fi-header-heading,
html.dark .fi-simple-header-heading,
html.dark .fi-breadcrumbs,
html.dark .fi-topbar-item-label,
html.dark .fi-topbar .fi-icon,
html.dark .fi-page-sub-navigation-sidebar-item-label,
html.dark .fi-ta-header-toolbar,
html.dark .fi-ta-header-cell-label,
html.dark .fi-ta-text,
html.dark .fi-fo-field-label,
html.dark .fi-section-header-heading {
    color: var(--serena-dark-text) !important;
}

html.dark .fi-simple-header-subheading,
html.dark .fi-header-subheading,
html.dark .fi-ta-empty-state-description,
html.dark .fi-fo-field-helper-text,
html.dark .fi-dropdown-list-item-label {
    color: var(--serena-dark-muted) !important;
}

html.dark .fi-section,
html.dark .fi-ta,
html.dark .fi-modal-window,
html.dark .fi-dropdown-panel,
html.dark .fi-in-wi-stats-overview-stat,
html.dark .fi-wi-widget,
html.dark .fi-dropdown-list,
html.dark .fi-simple-main-ctn,
html.dark .fi-section-content-ctn {
    background: var(--serena-dark-surface);
    border-color: var(--serena-dark-border);
}

html.dark .fi-dropdown-panel,
html.dark .fi-dropdown-list,
html.dark .fi-user-menu {
    background: var(--serena-dark-surface-2) !important;
    border-color: var(--serena-dark-border) !important;
}

html.dark .fi-dropdown-list-item-btn,
html.dark .fi-topbar-item-btn,
html.dark .fi-icon-btn,
html.dark .fi-input,
html.dark .fi-select-input,
html.dark .fi-textarea,
html.dark .fi-input-wrp,
html.dark .fi-fo-rich-editor-toolbar,
html.dark .fi-fo-rich-editor,
html.dark .tiptap {
    color: var(--serena-dark-text) !important;
}

html.dark .fi-input-wrp,
html.dark .fi-select-input,
html.dark .fi-textarea,
html.dark .fi-fo-rich-editor,
html.dark .fi-fo-rich-editor-toolbar {
    background: #111b1f !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}

html.dark .fi-dropdown-list-item-btn:hover,
html.dark .fi-topbar-item-btn:hover,
html.dark .fi-icon-btn:hover {
    background: rgba(255, 255, 255, 0.08) !important;
}

html.dark .fi-ta-row,
html.dark .fi-ta-cell,
html.dark .fi-ta-header-cell,
html.dark .fi-ta-header,
html.dark .fi-ta-content,
html.dark .fi-pagination,
html.dark .fi-pagination-overview {
    border-color: rgba(255, 255, 255, 0.07) !important;
}

html.dark .fi-ac-btn-action,
html.dark .fi-btn:not(.fi-btn-color-primary):not(.fi-color-danger) {
    border-color: rgba(255, 255, 255, 0.12);
    color: var(--serena-dark-text);
}

.fi-input-wrp:focus-within {
    box-shadow: 0 0 0 1px rgba(15, 91, 102, 0.28);
}

.fi-btn-color-primary {
    background: #08464f;
    color: #fff;
}

.fi-btn.fi-color-primary,
.fi-btn-color-primary,
button.fi-btn.fi-color-primary,
.fi-ac-btn-action {
    background: #08464f !important;
    color: #ffffff !important;
}

.fi-btn.fi-color-primary:hover,
.fi-btn-color-primary:hover,
button.fi-btn.fi-color-primary:hover,
.fi-ac-btn-action:hover {
    background: #0f5b66 !important;
    color: #ffffff !important;
}

.fi-btn.fi-color-primary:focus-visible,
.fi-btn-color-primary:focus-visible,
button.fi-btn.fi-color-primary:focus-visible,
.fi-ac-btn-action:focus-visible {
    box-shadow: 0 0 0 2px rgba(8, 70, 79, 0.22) !important;
}

.serena-publish-toggle .fi-fo-field-label,
.serena-publish-toggle .fi-fo-field-label-ctn {
    justify-content: flex-end;
    flex-direction: row-reverse;
}

.serena-publish-toggle .fi-fo-field-label-content {
    text-align: right;
}

.serena-publish-toggle {
    padding-top: 2rem;
}

.fi-btn-color-primary:hover {
    filter: brightness(1.05);
}

.fi-link,
.fi-ac-link {
    color: var(--serena-teal);
}

html.dark .fi-link,
html.dark .fi-ac-link {
    color: #72c5d2;
}
html.dark .fi-ta {
    overflow: hidden;
    border-radius: 1rem;
}

html.dark .fi-ta-ctn,
html.dark .fi-ta-content,
html.dark .fi-ta-header-ctn,
html.dark .fi-ta-header-toolbar,
html.dark .fi-ta-empty-state,
html.dark .fi-section-content,
html.dark .fi-section-content-ctn {
    background: var(--serena-dark-surface) !important;
}

html.dark .fi-ta-header-ctn,
html.dark .fi-ta-header-toolbar {
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
}

html.dark .fi-ta-content,
html.dark .fi-ta-empty-state {
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
}

html.dark .fi-topbar .fi-dropdown-trigger,
html.dark .fi-topbar .fi-user-menu-trigger,
html.dark .fi-topbar .fi-avatar,
html.dark .fi-topbar .fi-icon-btn {
    background: transparent !important;
    box-shadow: none !important;
}

html.dark .fi-wi-widget,
html.dark .fi-in-wi-stats-overview-stat,
html.dark .fi-section,
html.dark .fi-card,
html.dark [class*="fi-wi"],
html.dark [class*="stats-overview"] {
    overflow: hidden;
    border-radius: 1rem;
    background: var(--serena-dark-surface) !important;
    background-clip: padding-box;
}

html.dark .fi-wi-widget > *,
html.dark .fi-in-wi-stats-overview-stat > *,
html.dark .fi-section > *,
html.dark .fi-card > * {
    background: transparent !important;
}

html.dark .fi-main,
html.dark .fi-main-ctn,
html.dark .fi-page,
html.dark .fi-resource-list-records-page,
html.dark .fi-dashboard-page {
    background: transparent !important;
}

.site-content-form > .fi-tabs {
    width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 0.25rem;
    overflow: visible;
}

.site-content-form .fi-fo-repeater-item-header-label {
    min-width: 0;
    overflow-wrap: anywhere;
}

.site-photo-upload-prompt {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    min-height: 96px;
}

.site-photo-upload-icon {
    width: 32px;
    height: 32px;
    color: var(--serena-teal);
}

html.dark .site-photo-upload-icon {
    color: var(--serena-dark-text);
}

@media (max-width: 640px) {
    .site-content-form .fi-fo-repeater-item-header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.75rem;
    }

    .site-content-form .fi-fo-repeater-item-header-label {
        grid-column: 1 / -1;
        grid-row: 1;
    }

    .site-content-form .fi-fo-repeater-item-header-end-actions {
        grid-column: 2;
    }
}
