/** * Dark Mode Styles für soord * * Aktiviert durch: * - data-theme="dark" auf * - Oder automatisch bei @media (prefers-color-scheme: dark) wenn data-theme="auto" */ /* ========================================= CSS Custom Properties (Variablen) ========================================= */ :root { /* Light Mode (Default) */ --bg-body: #f8f9fa; --bg-card: #ffffff; --bg-navbar: #0d6efd; --bg-footer: #f8f9fa; --bg-input: #ffffff; --bg-dropdown: #ffffff; --bg-modal: #ffffff; --bg-table-stripe: rgba(0, 0, 0, 0.05); --bg-hover: rgba(0, 0, 0, 0.075); --text-primary: #212529; --text-secondary: #6c757d; --text-muted: #6c757d; --text-link: #0d6efd; --border-color: #dee2e6; --border-color-light: #e9ecef; --shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); --shadow-md: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); --alert-bg-success: #d1e7dd; --alert-bg-danger: #f8d7da; --alert-bg-warning: #fff3cd; --alert-bg-info: #cff4fc; } /* Dark Mode Variablen */ [data-theme="dark"] { --bg-body: #1a1a2e; --bg-card: #16213e; --bg-navbar: #0f3460; --bg-footer: #16213e; --bg-input: #1f2940; --bg-dropdown: #16213e; --bg-modal: #16213e; --bg-table-stripe: rgba(255, 255, 255, 0.05); --bg-hover: rgba(255, 255, 255, 0.1); --text-primary: #e4e6eb; --text-secondary: #b0b3b8; --text-muted: #8a8d91; --text-link: #58a6ff; --border-color: #3a3f4b; --border-color-light: #2d323e; --shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.3); --shadow-md: 0 0.5rem 1rem rgba(0, 0, 0, 0.4); --alert-bg-success: #0f3d2c; --alert-bg-danger: #3d1f23; --alert-bg-warning: #3d3519; --alert-bg-info: #0d3340; } /* Classic Girl Variablen */ [data-theme="classic-girl"] { --bg-body: #fff0f5; --bg-card: #ffffff; --bg-navbar: #e91e8c; --bg-footer: #fff0f5; --bg-input: #ffffff; --bg-dropdown: #ffffff; --bg-modal: #ffffff; --bg-table-stripe: rgba(233, 30, 140, 0.05); --bg-hover: rgba(233, 30, 140, 0.08); --text-primary: #212529; --text-secondary: #6c757d; --text-muted: #6c757d; --text-link: #d6196e; --border-color: #f0c0d8; --border-color-light: #f8d7e8; --shadow-sm: 0 0.125rem 0.25rem rgba(233, 30, 140, 0.1); --shadow-md: 0 0.5rem 1rem rgba(233, 30, 140, 0.15); --alert-bg-success: #d1e7dd; --alert-bg-danger: #f8d7da; --alert-bg-warning: #fff3cd; --alert-bg-info: #fce4f0; } /* Classic Boy Variablen */ [data-theme="classic-boy"] { --bg-body: #f0f5ff; --bg-card: #ffffff; --bg-navbar: #1a6dd4; --bg-footer: #f0f5ff; --bg-input: #ffffff; --bg-dropdown: #ffffff; --bg-modal: #ffffff; --bg-table-stripe: rgba(26, 109, 212, 0.05); --bg-hover: rgba(26, 109, 212, 0.08); --text-primary: #212529; --text-secondary: #6c757d; --text-muted: #6c757d; --text-link: #1558a8; --border-color: #b8d4f0; --border-color-light: #d4e6f8; --shadow-sm: 0 0.125rem 0.25rem rgba(26, 109, 212, 0.1); --shadow-md: 0 0.5rem 1rem rgba(26, 109, 212, 0.15); --alert-bg-success: #d1e7dd; --alert-bg-danger: #f8d7da; --alert-bg-warning: #fff3cd; --alert-bg-info: #dbeafe; } /* Rainbow Variablen */ [data-theme="rainbow"] { --bg-body: #fefefe; --bg-card: #ffffff; --bg-navbar: #8b5cf6; --bg-footer: #fefefe; --bg-input: #ffffff; --bg-dropdown: #ffffff; --bg-modal: #ffffff; --bg-table-stripe: rgba(139, 92, 246, 0.04); --bg-hover: rgba(139, 92, 246, 0.08); --text-primary: #212529; --text-secondary: #6c757d; --text-muted: #6c757d; --text-link: #7c3aed; --border-color: #e0d4f5; --border-color-light: #ede9fe; --shadow-sm: 0 0.125rem 0.25rem rgba(139, 92, 246, 0.1); --shadow-md: 0 0.5rem 1rem rgba(139, 92, 246, 0.15); --alert-bg-success: #d1e7dd; --alert-bg-danger: #f8d7da; --alert-bg-warning: #fff3cd; --alert-bg-info: #ede9fe; } /* ========================================= Dark Mode Styles ========================================= */ [data-theme="dark"] { color-scheme: dark; } /* Body */ [data-theme="dark"] body { background-color: var(--bg-body); color: var(--text-primary); } /* Navbar */ [data-theme="dark"] .navbar { background-color: var(--bg-navbar) !important; } [data-theme="dark"] .navbar-dark .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.85); } /* Cards */ [data-theme="dark"] .card { background-color: var(--bg-card); border-color: var(--border-color); color: var(--text-primary); } [data-theme="dark"] .card-header { background-color: rgba(255, 255, 255, 0.05); border-color: var(--border-color); color: var(--text-primary); } [data-theme="dark"] .card-footer { background-color: rgba(255, 255, 255, 0.03); border-color: var(--border-color); } /* Text */ [data-theme="dark"] .text-dark { color: var(--text-primary) !important; } [data-theme="dark"] .text-muted { color: var(--text-muted) !important; } [data-theme="dark"] .text-secondary { color: var(--text-secondary) !important; } [data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3, [data-theme="dark"] h4, [data-theme="dark"] h5, [data-theme="dark"] h6 { color: var(--text-primary); } [data-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item) { color: var(--text-link); } /* Forms */ [data-theme="dark"] .form-control, [data-theme="dark"] .form-select { background-color: var(--bg-input); border-color: var(--border-color); color: var(--text-primary); } [data-theme="dark"] .form-control:focus, [data-theme="dark"] .form-select:focus { background-color: var(--bg-input); border-color: #58a6ff; color: var(--text-primary); box-shadow: 0 0 0 0.25rem rgba(88, 166, 255, 0.25); } [data-theme="dark"] .form-control::placeholder { color: var(--text-muted); } [data-theme="dark"] .form-label { color: var(--text-primary); } [data-theme="dark"] .form-text { color: var(--text-muted); } [data-theme="dark"] .form-check-input { background-color: var(--bg-input); border-color: var(--border-color); } [data-theme="dark"] .form-check-input:checked { background-color: #0d6efd; border-color: #0d6efd; } [data-theme="dark"] .input-group-text { background-color: var(--bg-card); border-color: var(--border-color); color: var(--text-primary); } /* Tables */ [data-theme="dark"] .table { color: var(--text-primary); border-color: var(--border-color); } [data-theme="dark"] .table > :not(caption) > * > * { background-color: transparent; border-color: var(--border-color); color: var(--text-primary); } [data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * { background-color: var(--bg-table-stripe); color: var(--text-primary); } [data-theme="dark"] .table-hover > tbody > tr:hover > * { background-color: var(--bg-hover); color: var(--text-primary); } [data-theme="dark"] .table thead { border-color: var(--border-color); } [data-theme="dark"] .table thead th { background-color: rgba(255, 255, 255, 0.05); color: var(--text-primary); } /* Crawler items table – sticky header needs solid background */ [data-theme="dark"] .items-table th { background-color: var(--bg-body) !important; } /* Dropdowns */ [data-theme="dark"] .dropdown-menu { background-color: var(--bg-dropdown); border-color: var(--border-color); } [data-theme="dark"] .dropdown-item { color: var(--text-primary); } [data-theme="dark"] .dropdown-item:hover, [data-theme="dark"] .dropdown-item:focus { background-color: var(--bg-hover); color: var(--text-primary); } [data-theme="dark"] .dropdown-divider { border-color: var(--border-color); } /* Modals */ [data-theme="dark"] .modal-content { background-color: var(--bg-modal); border-color: var(--border-color); color: var(--text-primary); } [data-theme="dark"] .modal-header { border-color: var(--border-color); } [data-theme="dark"] .modal-footer { border-color: var(--border-color); } [data-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); } /* Alerts */ [data-theme="dark"] .alert-success { background-color: var(--alert-bg-success); border-color: #0d503c; color: #75d9a3; } [data-theme="dark"] .alert-danger { background-color: var(--alert-bg-danger); border-color: #5c2b31; color: #f5a3ab; } [data-theme="dark"] .alert-warning { background-color: var(--alert-bg-warning); border-color: #5c5019; color: #f5d98a; } [data-theme="dark"] .alert-info { background-color: var(--alert-bg-info); border-color: #0d4d66; color: #7dd3fc; } /* List Groups */ [data-theme="dark"] .list-group-item { background-color: var(--bg-card); border-color: var(--border-color); color: var(--text-primary); } [data-theme="dark"] .list-group-item:hover { background-color: var(--bg-hover); } [data-theme="dark"] .list-group-item.active { background-color: #0d6efd; border-color: #0d6efd; } /* Badges */ [data-theme="dark"] .badge.bg-light { background-color: var(--bg-card) !important; color: var(--text-primary) !important; } [data-theme="dark"] .badge.bg-secondary { background-color: #4a5568 !important; } /* Pagination */ [data-theme="dark"] .page-link { background-color: var(--bg-card); border-color: var(--border-color); color: var(--text-link); } [data-theme="dark"] .page-link:hover { background-color: var(--bg-hover); border-color: var(--border-color); color: var(--text-link); } [data-theme="dark"] .page-item.disabled .page-link { background-color: var(--bg-body); border-color: var(--border-color); color: var(--text-muted); } [data-theme="dark"] .page-item.active .page-link { background-color: #0d6efd; border-color: #0d6efd; } /* Breadcrumbs */ [data-theme="dark"] .breadcrumb { background-color: var(--bg-card); } [data-theme="dark"] .breadcrumb-item a { color: var(--text-link); } [data-theme="dark"] .breadcrumb-item.active { color: var(--text-muted); } /* Footer */ [data-theme="dark"] .fixed-bottom.bg-light, [data-theme="dark"] footer.bg-light { background-color: var(--bg-footer) !important; border-top: 1px solid var(--border-color); } [data-theme="dark"] .footer-icon-link { text-decoration: none !important; } [data-theme="dark"] .footer-icon-gray { background: linear-gradient(145deg, #2d323e, #3a3f4b); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4); } [data-theme="dark"] .footer-icon-gray .text-secondary { color: #e4e6eb !important; } [data-theme="dark"] .footer-icon-shadow-gray { text-shadow: 0 2px 8px rgba(255, 255, 255, 0.3); } /* Borders */ [data-theme="dark"] .border { border-color: var(--border-color) !important; } [data-theme="dark"] .border-bottom { border-color: var(--border-color) !important; } [data-theme="dark"] .border-top { border-color: var(--border-color) !important; } /* Background utilities */ [data-theme="dark"] .bg-white { background-color: var(--bg-card) !important; } [data-theme="dark"] .bg-light { background-color: var(--bg-body) !important; } /* Gallery */ [data-theme="dark"] .gallery-main-container, [data-theme="dark"] .gallery-thumb { background-color: var(--bg-body) !important; } [data-theme="dark"] .gallery-thumb.active { border-color: #58a6ff !important; } /* Autocomplete */ [data-theme="dark"] .autocomplete-list { background-color: var(--bg-dropdown); border-color: var(--border-color); } [data-theme="dark"] .autocomplete-list .list-group-item { background-color: var(--bg-dropdown); } /* Container Path */ [data-theme="dark"] .container-path { background: linear-gradient(135deg, #4a5568 0%, #2d3748 100%); } /* Stats Card - keep gradient but adjust */ [data-theme="dark"] .stats-card { background: linear-gradient(135deg, #7c3aed 0%, #db2777 100%); } /* Statistiken-Kachel auf Dashboard */ .card-statistics { background-color: #c2703a; } [data-theme="dark"] .card-statistics { background-color: #c2703a !important; } /* Search Box */ [data-theme="dark"] .search-box { background: var(--bg-input); color: var(--text-primary); } /* Tree View (Crawler) */ [data-theme="dark"] .tree-node { color: var(--text-primary); } [data-theme="dark"] .tree-node:hover { background-color: var(--bg-hover); } [data-theme="dark"] .tree-node.selected { background-color: rgba(13, 110, 253, 0.2); } /* Scrollbar */ [data-theme="dark"] ::-webkit-scrollbar { width: 10px; height: 10px; } [data-theme="dark"] ::-webkit-scrollbar-track { background: var(--bg-body); } [data-theme="dark"] ::-webkit-scrollbar-thumb { background: #4a5568; border-radius: 5px; } [data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #5a6578; } /* Dashboard Tile Close Button */ .tile-close-btn { position: absolute; top: 0.25rem; right: 0.25rem; width: 1.5rem; height: 1.5rem; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(0, 0, 0, 0.3); color: white; font-size: 0.7rem; opacity: 0; transition: opacity 0.2s; cursor: pointer; z-index: 10; } .dashboard-tile:hover .tile-close-btn { opacity: 1; } .tile-close-btn:hover { background: rgba(0, 0, 0, 0.6); } /* Smooth transition for theme switching */ html.theme-transition, html.theme-transition *, html.theme-transition *::before, html.theme-transition *::after { transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease !important; } /* ===== Onboarding Wizard ===== */ .onboarding-step-dot { width: 10px; height: 10px; border-radius: 50%; background: #dee2e6; transition: background-color 0.3s ease; } .onboarding-step-dot.active { background: #0d6efd; } .onboarding-layout-card { cursor: pointer; transition: border-color 0.2s ease, box-shadow 0.2s ease; border: 2px solid transparent; } .onboarding-layout-card:hover { border-color: #86b7fe; box-shadow: 0 0 0 0.15rem rgba(13, 110, 253, 0.15); } .onboarding-layout-card.selected { border-color: #0d6efd; box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25); } .onboarding-cabinet-card { cursor: pointer; transition: border-color 0.2s ease, transform 0.15s ease; border: 1px solid #dee2e6; } .onboarding-cabinet-card:hover { border-color: #86b7fe; } .onboarding-cabinet-card.onboarding-adding { transform: scale(0.95); opacity: 0.7; } .onboarding-room-item { cursor: pointer; border: 1px solid #dee2e6; transition: background-color 0.2s ease, border-color 0.2s ease; } .onboarding-room-item:hover { background: rgba(13, 110, 253, 0.05); } .onboarding-room-item.active { background: rgba(13, 110, 253, 0.1); border-color: #0d6efd; } .onboarding-remove-cabinet { cursor: pointer; font-weight: bold; opacity: 0.7; } .onboarding-remove-cabinet:hover { opacity: 1; } /* Dark mode overrides */ [data-theme="dark"] .onboarding-layout-card { border-color: #495057; background: #2b3035 !important; } [data-theme="dark"] .onboarding-layout-card:hover { border-color: #6ea8fe; } [data-theme="dark"] .onboarding-layout-card.selected { border-color: #6ea8fe; box-shadow: 0 0 0 0.2rem rgba(110, 168, 254, 0.25); } [data-theme="dark"] .onboarding-cabinet-card { border-color: #495057; background: #2b3035 !important; } [data-theme="dark"] .onboarding-cabinet-card:hover { border-color: #6ea8fe; } [data-theme="dark"] .onboarding-room-item { border-color: #495057; } [data-theme="dark"] .onboarding-room-item:hover { background: rgba(110, 168, 254, 0.1); } [data-theme="dark"] .onboarding-room-item.active { background: rgba(110, 168, 254, 0.15); border-color: #6ea8fe; } [data-theme="dark"] .onboarding-step-dot { background: #495057; } [data-theme="dark"] .onboarding-step-dot.active { background: #6ea8fe; } [data-theme="dark"] #onboardingWizard .modal-content { background: #212529 !important; } /* ===== Daily Code Display ===== */ .daily-code-display { letter-spacing: 0.15em; } /* ===== Chat Modals ===== */ .chat-modal-list { max-height: 60vh; overflow-y: auto; } .chat-modal-messages { height: 45vh; overflow-y: auto; } .chat-thread-item { cursor: pointer; transition: background-color 0.15s ease; } .chat-thread-item:hover { background-color: rgba(13, 110, 253, 0.06); } .chat-thread-header { background-color: #f8f9fa; } .chat-contact-item { transition: background-color 0.15s ease; } .chat-contact-item:hover { background-color: rgba(13, 110, 253, 0.06); } .chat-avatar-placeholder { width: 40px; height: 40px; min-width: 40px; font-weight: 600; font-size: 1rem; color: #6c757d; } .chat-avatar-placeholder-sm { width: 32px; height: 32px; min-width: 32px; font-weight: 600; font-size: 0.85rem; color: #6c757d; } /* Message bubbles */ .chat-msg { display: flex; flex-direction: column; } .chat-msg-own { align-items: flex-end; } .chat-msg-other { align-items: flex-start; } .chat-bubble { max-width: 75%; padding: 0.5rem 0.75rem; border-radius: 1rem; word-break: break-word; } .chat-msg-own .chat-bubble { background-color: #0d6efd; color: #fff; border-bottom-right-radius: 0.25rem; } .chat-msg-other .chat-bubble { background-color: #e9ecef; color: #212529; border-bottom-left-radius: 0.25rem; } .chat-msg-time { font-size: 0.7rem; color: #6c757d; margin-top: 2px; padding: 0 0.25rem; } .chat-modal-input .form-control { border-radius: 0; } .chat-modal-input .btn:first-child { border-radius: 1.5rem 0 0 1.5rem; } .chat-modal-input .btn:last-child { border-radius: 0 1.5rem 1.5rem 0; } /* Emoji Picker */ .emoji-popup { position: absolute; bottom: 100%; left: 0; z-index: 1070; width: 320px; background: #fff; border: 1px solid #dee2e6; border-radius: 0.5rem; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15); margin-bottom: 0.25rem; } .emoji-tabs { display: flex; border-bottom: 1px solid #dee2e6; padding: 0.25rem; gap: 2px; overflow-x: auto; } .emoji-tab { background: none; border: none; padding: 0.25rem 0.35rem; font-size: 1.1rem; cursor: pointer; border-radius: 0.25rem; line-height: 1; flex-shrink: 0; } .emoji-tab:hover { background: #e9ecef; } .emoji-tab.active { background: #d0e2ff; } .emoji-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 2px; padding: 0.4rem; max-height: 220px; overflow-y: auto; } .emoji-item { background: none; border: none; font-size: 1.3rem; padding: 0.2rem; cursor: pointer; border-radius: 0.25rem; line-height: 1; text-align: center; } .emoji-item:hover { background: #e9ecef; } .chat-unread-badge { font-size: 0.65rem; vertical-align: top; } .contacts-collapse-icon { transition: transform 0.2s ease; font-size: 0.7rem; } /* Dark mode overrides for chat */ [data-theme="dark"] .chat-thread-item:hover { background-color: rgba(110, 168, 254, 0.1); } [data-theme="dark"] .chat-thread-header { background-color: #2b3035; } [data-theme="dark"] .chat-contact-item:hover { background-color: rgba(110, 168, 254, 0.1); } [data-theme="dark"] .chat-msg-other .chat-bubble { background-color: #343a40; color: #e9ecef; } [data-theme="dark"] .chat-msg-own .chat-bubble { background-color: #0d6efd; color: #fff; } [data-theme="dark"] .chat-avatar-placeholder, [data-theme="dark"] .chat-avatar-placeholder-sm { background-color: #343a40 !important; color: #adb5bd !important; } [data-theme="dark"] .emoji-popup { background: #2b3035; border-color: #495057; } [data-theme="dark"] .emoji-tabs { border-color: #495057; } [data-theme="dark"] .emoji-tab:hover, [data-theme="dark"] .emoji-item:hover { background: #495057; } [data-theme="dark"] .emoji-tab.active { background: #0d6efd; } [data-theme="dark"] #contactsModal .modal-content, [data-theme="dark"] #directMessagesModal .modal-content, [data-theme="dark"] #marketplaceMessagesModal .modal-content { background: #212529 !important; } /* ========================================= Container Tree Select (Advanced Search) ========================================= */ .ct-select { position: relative; } .ct-trigger { cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ct-panel { display: none; position: absolute; top: 100%; left: 0; right: 0; z-index: 1050; background: var(--bg-dropdown, #fff); border: 1px solid var(--border-color, #dee2e6); border-radius: 0.375rem; max-height: 300px; overflow-y: auto; padding: 0.25rem; box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); margin-top: 2px; } .ct-panel.show { display: block; } .ct-item { display: flex; align-items: center; padding: 0.25rem 0.5rem; border-radius: 0.25rem; cursor: pointer; font-size: 0.875rem; } .ct-item:hover { background: var(--bg-hover, rgba(0, 0, 0, 0.075)); } .ct-item.selected { background: rgba(13, 110, 253, 0.1); font-weight: 500; } .ct-toggle { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; cursor: pointer; flex-shrink: 0; } .ct-toggle i { font-size: 0.65rem; transition: transform 0.15s; color: var(--text-secondary, #6c757d); } .ct-toggle:hover i { color: var(--text-primary, #212529); } .ct-toggle-spacer { display: inline-block; width: 20px; flex-shrink: 0; } .ct-children { display: none; padding-left: 20px; } .ct-children.show { display: block; } .ct-item-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ct-clear-btn { position: absolute; right: 28px; top: 50%; transform: translateY(-50%); border: none; background: transparent; color: #6c757d; font-size: 0.75rem; padding: 2px 6px; opacity: 0; cursor: pointer; z-index: 2; } .ct-select:hover .ct-clear-btn { opacity: 1; } .ct-clear-btn:hover { color: #dc3545; } /* Dark mode overrides */ [data-theme="dark"] .ct-panel { background: var(--bg-dropdown) !important; border-color: var(--border-color) !important; box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.4); } [data-theme="dark"] .ct-item:hover { background: var(--bg-hover) !important; } [data-theme="dark"] .ct-item.selected { background: rgba(13, 110, 253, 0.2) !important; } [data-theme="dark"] .ct-toggle:hover i { color: var(--text-primary) !important; } /* Organization Cards */ [data-theme="dark"] .org-card { background: var(--card-bg) !important; border-color: var(--border-color) !important; } [data-theme="dark"] .org-card.border-primary { border-color: #0d6efd !important; } /* Organization Switcher */ [data-theme="dark"] .org-switcher-name { color: rgba(255, 255, 255, 0.85) !important; } [data-theme="dark"] #orgSwitcherDropdown + .dropdown-menu .dropdown-item.active { background-color: rgba(13, 110, 253, 0.2) !important; color: #fff !important; } /* Marketplace listing images */ .marketplace-listing-img { max-height: 200px; object-fit: contain; background-color: #f8f9fa; } .marketplace-swipe-img { max-height: 500px; object-fit: contain; background-color: #f8f9fa; } [data-theme="dark"] .marketplace-listing-img, [data-theme="dark"] .marketplace-swipe-img { background-color: #2b3035 !important; } /* ========================================= Marketplace Swipe Modal ========================================= */ .swipe-slide { min-height: 250px; } .swipe-image-container { width: 100%; max-height: 400px; overflow: hidden; display: flex; align-items: center; justify-content: center; background-color: #f8f9fa; } .swipe-modal-img { max-width: 100%; max-height: 400px; object-fit: contain; } .swipe-img-placeholder { width: 100%; height: 250px; display: flex; align-items: center; justify-content: center; background-color: #f8f9fa; } .swipe-description { white-space: pre-wrap; max-height: 200px; overflow-y: auto; } .swipe-nav-btn { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; z-index: 10; opacity: 0.7; border: none; } .swipe-nav-btn:hover { opacity: 1; } .marketplace-card { cursor: pointer; transition: box-shadow 0.15s ease; } .marketplace-card:hover { box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important; } /* Mobile: Pfeile ausblenden, kleinere Bildhoehe */ @media (max-width: 767.98px) { .swipe-image-container { max-height: 300px; } .swipe-modal-img { max-height: 300px; } .swipe-nav-btn { display: none !important; } } /* Dark Mode: Swipe Modal */ [data-theme="dark"] .swipe-image-container, [data-theme="dark"] .swipe-img-placeholder { background-color: #2b3035 !important; } [data-theme="dark"] .swipe-modal-img { background-color: #2b3035 !important; } [data-theme="dark"] .swipe-nav-btn { background-color: rgba(30, 30, 30, 0.7) !important; color: #e4e6eb !important; border-color: transparent !important; } [data-theme="dark"] .marketplace-card:hover { box-shadow: 0 0.5rem 1rem rgba(255, 255, 255, 0.08) !important; } /* ========================================= L12: CSP-compliant utility classes (replacing inline style="" attributes) ========================================= */ /* QR code image max-width (2fa_setup, profile) */ .img-qr-code { max-width: 250px; } /* Feature icon background circle opacity (about.html) */ .icon-circle-faded { opacity: 0.1; } /* Trademark superscript styling (base_vergleich navbar) */ .trademark-sup { font-size: 0.6em; vertical-align: super; } /* Checkbox column width in tables (add_item, item_templates) */ .col-checkbox { width: 40px; } /* Card with fixed 133px width for image thumbnails */ .card-thumb-sm { width: 133px; } /* Chat avatar border (chat_conversation header) */ .chat-avatar-border { border: 2px solid #dee2e6; } [data-theme="dark"] .chat-avatar-border { border-color: var(--border-color) !important; } /* Chat message bubble max-width 70% (chat_conversation, chat_thread) */ .chat-bubble-max { max-width: 70%; } /* Chat timestamp styling (chat_conversation) */ .chat-timestamp { font-size: 0.7em; } .chat-timestamp-own { font-size: 0.7em; color: white; opacity: 0.85; } .chat-timestamp-other { font-size: 0.7em; color: #6c757d; } [data-theme="dark"] .chat-timestamp-other { color: var(--text-muted) !important; } /* Chat thread message container (chat_thread) */ .chat-thread-container { height: 60vh; overflow-y: auto; } /* Large emoji icon (chat_thread empty state) */ .icon-3rem { font-size: 3rem; } /* Image gallery "no image" placeholder (image_gallery.html) */ .gallery-placeholder { background: #f8f9fa; border-radius: 0.5rem; } [data-theme="dark"] .gallery-placeholder { background: var(--bg-body) !important; } /* Library field search input (item_templates.html) */ .input-w-150 { width: 150px; } /* Scrollable containers with max-height */ .scroll-container-sm { max-height: 200px; overflow-y: auto; } .scroll-container-md { max-height: 300px; overflow-y: auto; } /* Table column widths (item_template_form) */ .col-w-50pct { width: 50%; } .col-w-25pct { width: 25%; } .col-w-100 { width: 100px; } /* Marketplace listing image cover (marketplace_new_listing) */ .img-cover-md { height: 150px; object-fit: cover; } /* Pre-wrap text (marketplace_swipe) */ .text-prewrap { white-space: pre-wrap; } /* Profile avatar clickable wrapper */ .profile-avatar-wrapper { display: inline-block; cursor: pointer; position: relative; } /* Profile avatar image */ .profile-avatar-img { width: 100px; height: 100px; min-width: 100px; max-width: 100px; min-height: 100px; max-height: 100px; object-fit: cover; border: 3px solid #dee2e6; } [data-theme="dark"] .profile-avatar-img { border-color: var(--border-color) !important; } /* Profile QR hidden placeholder */ .profile-qr-placeholder { max-width: 200px; height: 200px; display: flex; align-items: center; justify-content: center; } /* Avatar modal scrollable container */ .avatar-select-container { max-height: 200px; overflow-y: auto; } /* Avatar option styling */ .avatar-option-style { cursor: pointer; padding: 3px; border: 3px solid transparent; border-radius: 50%; } /* Avatar preset image sizing */ .avatar-preset-img { width: 50px; height: 50px; border-radius: 50%; } /* Avatar SVG default sizing */ .avatar-svg-default { width: 50px; height: 50px; } /* Profile QR code image */ .profile-qr-code { max-width: 200px; } /* Avatar option hover/selected */ .avatar-option-style:hover { border-color: #6c757d !important; } .avatar-option-style.selected { border-color: #0d6efd !important; } /* Clickable avatar hover effect */ .avatar-clickable { transition: transform 0.2s ease; } .avatar-clickable:hover { transform: scale(1.05); } .avatar-clickable:hover img { border-color: #0d6efd !important; } /* Avatar overlay (camera icon on hover) */ .avatar-overlay { position: absolute; top: 0; left: 0; width: 100px; height: 100px; background: rgba(0, 0, 0, 0.5); border-radius: 50%; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.2s ease; } .avatar-overlay i { color: white; font-size: 24px; } .avatar-clickable:hover .avatar-overlay { opacity: 1; } /* Container Autocomplete */ .autocomplete-wrapper { position: relative; } .autocomplete-wrapper .autocomplete-list .ca-tree-item { position: relative; } .autocomplete-wrapper .autocomplete-list .ca-ancestors { font-size: 0.7rem; line-height: 1.1; color: #6c757d; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .autocomplete-wrapper .autocomplete-list .ca-leaf { font-size: 0.85rem; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .autocomplete-wrapper .autocomplete-list .ca-tree-item:hover { background-color: #f1f3f5; } .autocomplete-wrapper .autocomplete-list .ca-tree { display: flex; flex-direction: column; } .autocomplete-wrapper .autocomplete-list { font-size: 0.85rem; } .autocomplete-wrapper .ca-clear-btn { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); border: none; background: transparent; color: #6c757d; font-size: 1rem; line-height: 1; padding: 2px 4px; opacity: 0; cursor: pointer; } .autocomplete-wrapper:hover .ca-clear-btn { opacity: 1; } .autocomplete-wrapper .ca-clear-btn:hover { color: #343a40; } .ca-meta { position: sticky; bottom: 0; background: #fff; border-top: 1px solid rgba(0,0,0,.125); z-index: 1; } [data-theme="dark"] .autocomplete-wrapper .autocomplete-list .ca-tree-item:hover { background-color: var(--bg-hover); } [data-theme="dark"] .ca-meta { background: var(--bg-card); border-top-color: var(--border-color); } /* View item form with no margin (view_item.html) */ /* Using Bootstrap m-0 instead */ /* ========================================= Unassigned Items Cards (unassigned_items.html) ========================================= */ .unassigned-item-card { transition: transform 0.2s, box-shadow 0.2s; border-left: 4px solid #ffc107; } .unassigned-item-card:hover { transform: translateY(-2px); box-shadow: 0 4px 15px rgba(255, 193, 7, 0.2); } .unassigned-card-hidden { opacity: 0; transform: translateY(20px); } .unassigned-card-animate { transition: all 0.3s ease; opacity: 1; transform: translateY(0); } [data-theme="dark"] .unassigned-item-card { border-left-color: #ffc107; background-color: var(--bg-card) !important; } [data-theme="dark"] .unassigned-item-card:hover { box-shadow: 0 4px 15px rgba(255, 193, 7, 0.15); } /* Grid-View Cards (Orte + Gegenstaende Kachelansicht) */ [data-theme="dark"] .grid-view-card { background-color: var(--bg-card) !important; } [data-theme="dark"] .grid-view-card:hover { box-shadow: 0 4px 15px rgba(255, 255, 255, 0.08); } [data-theme="dark"] .grid-view-card .img-thumb-200 { background: var(--bg-card) !important; } /* ========================================= Classic Girl Theme Overrides ========================================= */ /* Body */ [data-theme="classic-girl"] body { background-color: var(--bg-body); } /* Navbar */ [data-theme="classic-girl"] .navbar, [data-theme="classic-girl"] .navbar.bg-primary { background-color: var(--bg-navbar) !important; } /* Links */ [data-theme="classic-girl"] a { color: var(--text-link); } [data-theme="classic-girl"] a:hover { color: #b8155c; } /* Buttons: Primary → Pink */ [data-theme="classic-girl"] .btn-primary { background-color: #e91e8c; border-color: #e91e8c; color: #fff; } [data-theme="classic-girl"] .btn-primary:hover, [data-theme="classic-girl"] .btn-primary:focus { background-color: #d1177d; border-color: #c4146f; color: #fff; } [data-theme="classic-girl"] .btn-primary:active { background-color: #b8125f; border-color: #a61058; } [data-theme="classic-girl"] .btn-outline-primary { color: #e91e8c; border-color: #e91e8c; } [data-theme="classic-girl"] .btn-outline-primary:hover, [data-theme="classic-girl"] .btn-outline-primary:focus, [data-theme="classic-girl"] .btn-outline-primary:active { background-color: #e91e8c; border-color: #e91e8c; color: #fff; } /* Badges */ [data-theme="classic-girl"] .badge.bg-primary { background-color: #e91e8c !important; } /* Cards */ [data-theme="classic-girl"] .card { border-color: var(--border-color); } [data-theme="classic-girl"] .card-header { background-color: #fff5f9; border-color: var(--border-color); } /* Tables */ [data-theme="classic-girl"] .table-striped > tbody > tr:nth-of-type(odd) { background-color: var(--bg-table-stripe); } /* Forms */ [data-theme="classic-girl"] .form-control:focus, [data-theme="classic-girl"] .form-select:focus { border-color: #e91e8c; box-shadow: 0 0 0 0.25rem rgba(233, 30, 140, 0.25); } [data-theme="classic-girl"] .form-check-input:checked { background-color: #e91e8c; border-color: #e91e8c; } /* Pagination */ [data-theme="classic-girl"] .page-link { color: #e91e8c; } [data-theme="classic-girl"] .page-item.active .page-link { background-color: #e91e8c; border-color: #e91e8c; color: #fff; } /* Nav tabs/pills */ [data-theme="classic-girl"] .nav-link.active, [data-theme="classic-girl"] .nav-pills .nav-link.active { background-color: #e91e8c; color: #fff; } [data-theme="classic-girl"] .nav-link { color: #e91e8c; } /* Dropdown */ [data-theme="classic-girl"] .dropdown-item:hover, [data-theme="classic-girl"] .dropdown-item:focus { background-color: #fff0f5; color: #d6196e; } [data-theme="classic-girl"] .dropdown-item.active, [data-theme="classic-girl"] .dropdown-item:active { background-color: #e91e8c; color: #fff; } /* Progress bars */ [data-theme="classic-girl"] .progress-bar { background-color: #e91e8c; } /* List groups */ [data-theme="classic-girl"] .list-group-item.active { background-color: #e91e8c; border-color: #e91e8c; } /* Breadcrumb */ [data-theme="classic-girl"] .breadcrumb-item a { color: #e91e8c; } /* Scrollbar */ [data-theme="classic-girl"] ::-webkit-scrollbar-thumb { background-color: #f0a0c8; } [data-theme="classic-girl"] ::-webkit-scrollbar-thumb:hover { background-color: #e91e8c; } /* Text utilities */ [data-theme="classic-girl"] .text-primary { color: #e91e8c !important; } [data-theme="classic-girl"] .bg-primary { background-color: #e91e8c !important; } /* Border utilities */ [data-theme="classic-girl"] .border-primary { border-color: #e91e8c !important; } /* Footer */ [data-theme="classic-girl"] .fixed-bottom.bg-light, [data-theme="classic-girl"] footer.bg-light { background-color: #fff0f5 !important; border-top: 1px solid var(--border-color); } [data-theme="classic-girl"] .footer-icon-link { text-decoration: none !important; } [data-theme="classic-girl"] .footer-icon-blue { background: linear-gradient(145deg, #e91e8c, #f472b6); box-shadow: 0 4px 12px rgba(233, 30, 140, 0.33); } [data-theme="classic-girl"] .footer-icon-gray { background: linear-gradient(145deg, #fce4ec, #f8bbd0); box-shadow: 0 4px 12px rgba(233, 30, 140, 0.2); } [data-theme="classic-girl"] .footer-icon-green { background: linear-gradient(145deg, #e91e8c, #f472b6); box-shadow: 0 4px 12px rgba(233, 30, 140, 0.33); } [data-theme="classic-girl"] .footer-icon-shadow-blue, [data-theme="classic-girl"] .footer-icon-shadow-green { text-shadow: 0 2px 8px rgba(233, 30, 140, 0.6); } [data-theme="classic-girl"] .footer-icon-shadow-gray { text-shadow: 0 2px 8px rgba(233, 30, 140, 0.4); } /* Dashboard-Kacheln */ [data-theme="classic-girl"] .dashboard-tile .card.bg-info { background-color: #e91e8c !important; } [data-theme="classic-girl"] .dashboard-tile .card.bg-primary { background-color: #d6196e !important; } [data-theme="classic-girl"] .dashboard-tile .card.bg-warning { background-color: #f472b6 !important; } [data-theme="classic-girl"] .dashboard-tile .card.bg-success { background-color: #c4146f !important; } [data-theme="classic-girl"] .dashboard-tile .card-statistics { background-color: #b8125f !important; } /* btn-success / bg-success → Theme-Pink */ [data-theme="classic-girl"] .btn-success { background-color: #c4146f; border-color: #c4146f; color: #fff; } [data-theme="classic-girl"] .btn-success:hover, [data-theme="classic-girl"] .btn-success:focus { background-color: #a61058; border-color: #8f0e4c; color: #fff; } [data-theme="classic-girl"] .btn-success:active { background-color: #8f0e4c; border-color: #7a0c42; } [data-theme="classic-girl"] .bg-success { background-color: #c4146f !important; } /* ========================================= Classic Boy Theme Overrides ========================================= */ /* Body */ [data-theme="classic-boy"] body { background-color: var(--bg-body); } /* Navbar */ [data-theme="classic-boy"] .navbar, [data-theme="classic-boy"] .navbar.bg-primary { background-color: var(--bg-navbar) !important; } /* Links */ [data-theme="classic-boy"] a { color: var(--text-link); } [data-theme="classic-boy"] a:hover { color: #0f4680; } /* Buttons: Primary → Blau */ [data-theme="classic-boy"] .btn-primary { background-color: #1a6dd4; border-color: #1a6dd4; color: #fff; } [data-theme="classic-boy"] .btn-primary:hover, [data-theme="classic-boy"] .btn-primary:focus { background-color: #1558a8; border-color: #124d96; color: #fff; } [data-theme="classic-boy"] .btn-primary:active { background-color: #104388; border-color: #0e3a76; } [data-theme="classic-boy"] .btn-outline-primary { color: #1a6dd4; border-color: #1a6dd4; } [data-theme="classic-boy"] .btn-outline-primary:hover, [data-theme="classic-boy"] .btn-outline-primary:focus, [data-theme="classic-boy"] .btn-outline-primary:active { background-color: #1a6dd4; border-color: #1a6dd4; color: #fff; } /* Badges */ [data-theme="classic-boy"] .badge.bg-primary { background-color: #1a6dd4 !important; } /* Cards */ [data-theme="classic-boy"] .card { border-color: var(--border-color); } [data-theme="classic-boy"] .card-header { background-color: #f0f5ff; border-color: var(--border-color); } /* Tables */ [data-theme="classic-boy"] .table-striped > tbody > tr:nth-of-type(odd) { background-color: var(--bg-table-stripe); } /* Forms */ [data-theme="classic-boy"] .form-control:focus, [data-theme="classic-boy"] .form-select:focus { border-color: #1a6dd4; box-shadow: 0 0 0 0.25rem rgba(26, 109, 212, 0.25); } [data-theme="classic-boy"] .form-check-input:checked { background-color: #1a6dd4; border-color: #1a6dd4; } /* Pagination */ [data-theme="classic-boy"] .page-link { color: #1a6dd4; } [data-theme="classic-boy"] .page-item.active .page-link { background-color: #1a6dd4; border-color: #1a6dd4; color: #fff; } /* Nav tabs/pills */ [data-theme="classic-boy"] .nav-link.active, [data-theme="classic-boy"] .nav-pills .nav-link.active { background-color: #1a6dd4; color: #fff; } [data-theme="classic-boy"] .nav-link { color: #1a6dd4; } /* Dropdown */ [data-theme="classic-boy"] .dropdown-item:hover, [data-theme="classic-boy"] .dropdown-item:focus { background-color: #f0f5ff; color: #1558a8; } [data-theme="classic-boy"] .dropdown-item.active, [data-theme="classic-boy"] .dropdown-item:active { background-color: #1a6dd4; color: #fff; } /* Progress bars */ [data-theme="classic-boy"] .progress-bar { background-color: #1a6dd4; } /* List groups */ [data-theme="classic-boy"] .list-group-item.active { background-color: #1a6dd4; border-color: #1a6dd4; } /* Breadcrumb */ [data-theme="classic-boy"] .breadcrumb-item a { color: #1a6dd4; } /* Scrollbar */ [data-theme="classic-boy"] ::-webkit-scrollbar-thumb { background-color: #93c5fd; } [data-theme="classic-boy"] ::-webkit-scrollbar-thumb:hover { background-color: #1a6dd4; } /* Text utilities */ [data-theme="classic-boy"] .text-primary { color: #1a6dd4 !important; } [data-theme="classic-boy"] .bg-primary { background-color: #1a6dd4 !important; } /* Border utilities */ [data-theme="classic-boy"] .border-primary { border-color: #1a6dd4 !important; } /* Footer */ [data-theme="classic-boy"] .fixed-bottom.bg-light, [data-theme="classic-boy"] footer.bg-light { background-color: #f0f5ff !important; border-top: 1px solid var(--border-color); } [data-theme="classic-boy"] .footer-icon-link { text-decoration: none !important; } [data-theme="classic-boy"] .footer-icon-blue { background: linear-gradient(145deg, #1a6dd4, #60a5fa); box-shadow: 0 4px 12px rgba(26, 109, 212, 0.33); } [data-theme="classic-boy"] .footer-icon-gray { background: linear-gradient(145deg, #dbeafe, #bfdbfe); box-shadow: 0 4px 12px rgba(26, 109, 212, 0.2); } [data-theme="classic-boy"] .footer-icon-green { background: linear-gradient(145deg, #0e3a76, #1558a8); box-shadow: 0 4px 12px rgba(14, 58, 118, 0.33); } [data-theme="classic-boy"] .footer-icon-shadow-blue, [data-theme="classic-boy"] .footer-icon-shadow-green { text-shadow: 0 2px 8px rgba(26, 109, 212, 0.6); } [data-theme="classic-boy"] .footer-icon-shadow-gray { text-shadow: 0 2px 8px rgba(26, 109, 212, 0.4); } /* Dashboard-Kacheln */ [data-theme="classic-boy"] .dashboard-tile .card.bg-info { background-color: #1a6dd4 !important; } [data-theme="classic-boy"] .dashboard-tile .card.bg-primary { background-color: #1558a8 !important; } [data-theme="classic-boy"] .dashboard-tile .card.bg-warning { background-color: #60a5fa !important; } [data-theme="classic-boy"] .dashboard-tile .card.bg-success { background-color: #124d96 !important; } [data-theme="classic-boy"] .dashboard-tile .card-statistics { background-color: #0e3a76 !important; } /* btn-success / bg-success → Theme-Blau */ [data-theme="classic-boy"] .btn-success { background-color: #124d96; border-color: #124d96; color: #fff; } [data-theme="classic-boy"] .btn-success:hover, [data-theme="classic-boy"] .btn-success:focus { background-color: #0e3a76; border-color: #0b2d5e; color: #fff; } [data-theme="classic-boy"] .btn-success:active { background-color: #0b2d5e; border-color: #092349; } [data-theme="classic-boy"] .bg-success { background-color: #124d96 !important; } /* ========================================= Rainbow Theme Overrides ========================================= */ /* Body */ [data-theme="rainbow"] body { background-color: var(--bg-body); } /* Navbar — Regenbogen-Gradient */ [data-theme="rainbow"] .navbar, [data-theme="rainbow"] .navbar.bg-primary { background: linear-gradient(90deg, #ef4444, #f97316, #eab308, #22c55e, #3b82f6, #6366f1, #8b5cf6) !important; } /* Links */ [data-theme="rainbow"] a { color: var(--text-link); } [data-theme="rainbow"] a:hover { color: #6d28d9; } /* Buttons: Primary → Violett */ [data-theme="rainbow"] .btn-primary { background-color: #8b5cf6; border-color: #8b5cf6; color: #fff; } [data-theme="rainbow"] .btn-primary:hover, [data-theme="rainbow"] .btn-primary:focus { background-color: #7c3aed; border-color: #6d28d9; color: #fff; } [data-theme="rainbow"] .btn-primary:active { background-color: #6d28d9; border-color: #5b21b6; } [data-theme="rainbow"] .btn-outline-primary { color: #8b5cf6; border-color: #8b5cf6; } [data-theme="rainbow"] .btn-outline-primary:hover, [data-theme="rainbow"] .btn-outline-primary:focus, [data-theme="rainbow"] .btn-outline-primary:active { background-color: #8b5cf6; border-color: #8b5cf6; color: #fff; } /* Badges */ [data-theme="rainbow"] .badge.bg-primary { background: linear-gradient(90deg, #ef4444, #f97316, #eab308, #22c55e, #3b82f6, #8b5cf6) !important; } /* Cards */ [data-theme="rainbow"] .card { border-color: var(--border-color); } [data-theme="rainbow"] .card-header { background-color: #faf5ff; border-color: var(--border-color); } /* Tables */ [data-theme="rainbow"] .table-striped > tbody > tr:nth-of-type(odd) { background-color: var(--bg-table-stripe); } /* Forms */ [data-theme="rainbow"] .form-control:focus, [data-theme="rainbow"] .form-select:focus { border-color: #8b5cf6; box-shadow: 0 0 0 0.25rem rgba(139, 92, 246, 0.25); } [data-theme="rainbow"] .form-check-input:checked { background-color: #8b5cf6; border-color: #8b5cf6; } /* Pagination */ [data-theme="rainbow"] .page-link { color: #8b5cf6; } [data-theme="rainbow"] .page-item.active .page-link { background-color: #8b5cf6; border-color: #8b5cf6; color: #fff; } /* Nav tabs/pills */ [data-theme="rainbow"] .nav-link.active, [data-theme="rainbow"] .nav-pills .nav-link.active { background-color: #8b5cf6; color: #fff; } [data-theme="rainbow"] .nav-link { color: #8b5cf6; } /* Dropdown */ [data-theme="rainbow"] .dropdown-item:hover, [data-theme="rainbow"] .dropdown-item:focus { background-color: #faf5ff; color: #7c3aed; } [data-theme="rainbow"] .dropdown-item.active, [data-theme="rainbow"] .dropdown-item:active { background-color: #8b5cf6; color: #fff; } /* Progress bars — Regenbogen */ [data-theme="rainbow"] .progress-bar { background: linear-gradient(90deg, #ef4444, #f97316, #eab308, #22c55e, #3b82f6, #8b5cf6); } /* List groups */ [data-theme="rainbow"] .list-group-item.active { background-color: #8b5cf6; border-color: #8b5cf6; } /* Breadcrumb */ [data-theme="rainbow"] .breadcrumb-item a { color: #8b5cf6; } /* Scrollbar — Regenbogen */ [data-theme="rainbow"] ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #ef4444, #f97316, #eab308, #22c55e, #3b82f6, #8b5cf6); } [data-theme="rainbow"] ::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #dc2626, #ea580c, #ca8a04, #16a34a, #2563eb, #7c3aed); } /* Text utilities */ [data-theme="rainbow"] .text-primary { color: #8b5cf6 !important; } [data-theme="rainbow"] .bg-primary { background-color: #8b5cf6 !important; } /* Border utilities */ [data-theme="rainbow"] .border-primary { border-color: #8b5cf6 !important; } /* Footer */ [data-theme="rainbow"] .fixed-bottom.bg-light, [data-theme="rainbow"] footer.bg-light { background-color: #fefefe !important; border-top: 2px solid transparent; border-image: linear-gradient(90deg, #ef4444, #f97316, #eab308, #22c55e, #3b82f6, #8b5cf6) 1; } [data-theme="rainbow"] .footer-icon-link { text-decoration: none !important; } [data-theme="rainbow"] .footer-icon-blue { background: linear-gradient(145deg, #3b82f6, #60a5fa); box-shadow: 0 4px 12px rgba(59, 130, 246, 0.33); } [data-theme="rainbow"] .footer-icon-gray { background: linear-gradient(145deg, #eab308, #fde047); box-shadow: 0 4px 12px rgba(234, 179, 8, 0.33); } [data-theme="rainbow"] .footer-icon-gray .text-secondary { color: #ffffff !important; } [data-theme="rainbow"] .footer-icon-green { background: linear-gradient(145deg, #8b5cf6, #a78bfa); box-shadow: 0 4px 12px rgba(139, 92, 246, 0.33); } [data-theme="rainbow"] .footer-icon-shadow-blue { text-shadow: 0 2px 8px rgba(59, 130, 246, 0.6); } [data-theme="rainbow"] .footer-icon-shadow-gray { text-shadow: 0 2px 8px rgba(234, 179, 8, 0.6); } [data-theme="rainbow"] .footer-icon-shadow-green { text-shadow: 0 2px 8px rgba(139, 92, 246, 0.6); } /* Dashboard-Kacheln — jede Kachel eine Regenbogenfarbe */ [data-theme="rainbow"] .dashboard-tile .card.bg-info { background-color: #ef4444 !important; } [data-theme="rainbow"] .dashboard-tile .card-statistics { background-color: #f97316 !important; } [data-theme="rainbow"] .dashboard-tile .card.bg-primary { background-color: #22c55e !important; } [data-theme="rainbow"] .dashboard-tile .card.bg-warning { background-color: #3b82f6 !important; } [data-theme="rainbow"] .dashboard-tile .card.bg-success { background-color: #8b5cf6 !important; } /* btn-success / bg-success → Theme-Violett */ [data-theme="rainbow"] .btn-success { background-color: #22c55e; border-color: #22c55e; color: #fff; } [data-theme="rainbow"] .btn-success:hover, [data-theme="rainbow"] .btn-success:focus { background-color: #16a34a; border-color: #15803d; color: #fff; } [data-theme="rainbow"] .btn-success:active { background-color: #15803d; border-color: #166534; } [data-theme="rainbow"] .bg-success { background-color: #22c55e !important; }