diff --git a/docs/README.md b/docs/README.md index bb876c9..48ff528 100644 --- a/docs/README.md +++ b/docs/README.md @@ -10,7 +10,7 @@ INGROUP: Moko-Cassiopeia.Documentation REPO: https://github.com/mokoconsulting-tech/moko-cassiopeia FILE: docs/README.md - VERSION: 01.00.00 + VERSION: 03.05.00 BRIEF: Documentation index for Moko-Cassiopeia template PATH: /docs/README.md --> @@ -40,6 +40,12 @@ This directory contains comprehensive documentation for the Moko-Cassiopeia Joom * Joomla extension packaging * Multi-version testing +* **[Roadmap](ROADMAP.md)** - Version-specific roadmap + * Current features (v03.05.00) + * Feature evolution timeline + * Planned enhancements + * Development priorities + ### User Documentation For end-user documentation, installation instructions, and feature guides, see the main [README.md](../README.md) in the repository root. @@ -52,7 +58,8 @@ moko-cassiopeia/ │ ├── README.md # This file - documentation index │ ├── QUICK_START.md # Quick start guide for developers │ ├── WORKFLOW_GUIDE.md # Development workflow guide -│ └── JOOMLA_DEVELOPMENT.md # Joomla-specific development guide +│ ├── JOOMLA_DEVELOPMENT.md # Joomla-specific development guide +│ └── ROADMAP.md # Version-specific roadmap ├── src/ # Template source code │ ├── templates/ # Joomla template files │ └── media/ # Assets (CSS, JS, images) @@ -98,7 +105,7 @@ This project adheres to [MokoStandards](https://github.com/mokoconsulting-tech/M * Repository: [https://github.com/mokoconsulting-tech/moko-cassiopeia](https://github.com/mokoconsulting-tech/moko-cassiopeia) * Path: /docs/README.md * Owner: Moko Consulting -* Version: 01.00.00 +* Version: 03.05.00 * Status: Active * Effective Date: 2026-01-09 @@ -107,3 +114,4 @@ This project adheres to [MokoStandards](https://github.com/mokoconsulting-tech/M | Date | Change Summary | Author | | ---------- | ----------------------------------------------------- | --------------- | | 2026-01-09 | Initial documentation index created for MokoStandards compliance. | GitHub Copilot | +| 2026-01-27 | Updated with roadmap link and version to 03.05.01. | GitHub Copilot | diff --git a/docs/ROADMAP.md b/docs/ROADMAP.md new file mode 100644 index 0000000..7fea464 --- /dev/null +++ b/docs/ROADMAP.md @@ -0,0 +1,849 @@ + + +# Moko-Cassiopeia Roadmap (VERSION: 03.05.00) + +This document provides a comprehensive, version-specific roadmap for the Moko-Cassiopeia Joomla template, tracking feature evolution, current capabilities, and planned enhancements. + +## Table of Contents + +- [Version Timeline](#version-timeline) + - [Past Releases](#past-releases) + - [Future Roadmap (5-Year Plan)](#future-roadmap-5-year-plan) +- [Current Release (v03.05.00)](#current-release-v030500) +- [Implemented Features](#implemented-features) +- [Planned Features](#planned-features) +- [Development Priorities](#development-priorities) +- [Long-term Vision](#long-term-vision) +- [External Resources](#external-resources) + +--- + +## Version Timeline + +### Past Releases + +### v03.05.01 (2026-01-09) - Standards & Security +**Status**: Released (CHANGELOG entry exists, code files pending version update) + +**Added**: +- Dependency review workflow for vulnerability scanning +- Standards compliance workflow for MokoStandards validation +- Dependabot configuration for automated security updates +- Documentation index (`docs/README.md`) + +**Changed**: +- Removed custom CodeQL workflow (using GitHub's default setup) +- Enforced repository compliance with MokoStandards +- Improved security posture with automated scanning + +### v03.05.00 (2026-01-04) - Workflow & Governance +**Status**: Current Release (in code) + +**Added**: +- `.github/workflows` directory structure +- CODE_OF_CONDUCT.md from MokoStandards +- CONTRIBUTING.md from MokoStandards + +**Changed**: +- TODO items to be split to separate file (tracked) + +### v03.01.00 (2025-12-16) - CI/CD Foundation +**Added**: +- Initial GitHub Actions workflows + +### v03.00.00 (2025-12-09) - Font Awesome 7 Upgrade +**Updated**: +- Copyright headers to MokoCodingDefaults standards +- Fixed color style injection in `index.php` +- Upgraded Font Awesome 6 to Font Awesome 7 Free +- Added Font Awesome 7 Free style fallback + +**Removed**: +- Deprecated CODE_OF_CONDUCT.md +- Deprecated CONTRIBUTING.md + +### v02.01.05 (2025-09-04) - CSS Refinement +**Fixed**: +- Removed vmbasic.css +- Repaired template.css and colors_standard.css + +### v02.00.00 (2025-08-30) - Dark Mode & TOC +**Major Features**: +- **Dark Mode Toggle System** + - Frontend toggle switch with localStorage persistence + - Admin-configurable default mode + - CSS rules for light/dark themes + - JavaScript-powered mode switching + +- **Enhanced Template Parameters** + - Logo parameter support + - GTM container ID configuration + - Dark mode defaults in settings + - Updated metadata and copyright headers + +- **Expanded Table of Contents** + - Automatic TOC injection + - User-selectable placement (`toc-left` or `toc-right`) + - Article options integration + +**Improvements**: +- Cleaned up `index.php` (removed duplicate skip-to-content calls) +- Consolidated JavaScript asset loading +- Streamlined CSS for toggle switch +- Accessibility refinements (typography, color contrast) +- Fixed missing logo parameter in header +- Corrected stylesheet inconsistencies +- Patched redundant script includes + +### v01.00.00 - Initial Public Release +**Core Features**: +- Font Awesome 6 integration +- Bootstrap 5 helpers and utilities +- Automatic Table of Contents (TOC) utility +- Moko Expansions: Google Tag Manager / GA4 hooks +- Built on Joomla's Cassiopeia template + +--- + +### Future Roadmap (5-Year Plan) + +The following versions represent our planned annual major releases, each building upon the previous version's foundation. + +#### v04.00.00 (Q4 2027) - Enhanced Accessibility & Performance +**Status**: Planned +**Target Release**: December 2027 + +**Major Template Features**: +- **WCAG 2.1 AA Compliance** + - Full accessibility audit and remediation + - High-contrast theme options + - Screen reader optimizations + - Keyboard navigation enhancements + - ARIA landmark improvements + - Skip navigation enhancements + +- **Template Performance Optimizations** + - Critical CSS inlining for faster first paint + - Lazy loading for images and below-fold content + - WebP image support with automatic fallbacks + - Advanced asset bundling and minification + - Template asset caching (CSS/JS bundles) + +- **Enhanced Layout System** + - Additional responsive grid layouts + - Flexible module position system + - Column layout presets (2-col, 3-col, 4-col variations) + - Grid/masonry article layouts + - Sticky sidebar options + +- **Typography Enhancements** + - Advanced typography controls in template settings + - Additional font pairing presets + - Custom font upload support + - Line height and letter spacing controls + - Responsive typography scaling + +- **Developer Experience** + - Development mode enablement (unminified assets, debug output) + - Live reload during development + - Enhanced error logging and diagnostics + - Template debugging tools + - Style guide generator + +- **Content Display Features** + - Soft offline mode (category-based access during maintenance) + - Enhanced article layouts (grid, masonry, timeline) + - Image caption styling options + - Quote block styling variations + - Enhanced breadcrumb customization + +**Template Infrastructure**: +- Expanded template parameter validation +- Enhanced template override detection +- Automated template compatibility testing +- Template performance profiling tools + +--- + +#### v05.00.00 (Q4 2028) - Advanced Layouts & Template Customization +**Status**: Planned +**Target Release**: December 2028 + +**Major Template Features**: +- **Enhanced Layout Builder** + - Template-based page layout variations + - Configurable layout options via template parameters + - Layout presets library (blog, portfolio, business, magazine) + - Module position layout manager + - Visual layout preview in admin + +- **Advanced Styling System** + - Extended color palette management (unlimited custom palettes) + - CSS variable editor in template settings + - Style presets for different site types + - Border radius and spacing controls + - Box shadow and effect controls + +- **Template Component Enhancements** + - Enhanced menu styling options (mega menu support) + - Advanced header variations (transparent, sticky, minimal) + - Footer layout options (column variations, widgets) + - Sidebar styling and behavior options + - Hero section templates and variations + +- **Content Display Options** + - Article intro/full text display controls + - Category layout variations (grid, list, masonry, cards) + - Featured content sections + - Related articles display options + - Author bio box styling + +- **Responsive Design Improvements** + - Mobile-first navigation patterns + - Tablet-specific layout controls + - Responsive image sizing options + - Mobile header variations + - Touch-friendly interface elements + +- **Template Integration Features** + - Enhanced VirtueMart template overrides + - Contact form styling variations + - Search result layout options + - Error page customization + - Archive page templates + +**Template Infrastructure**: +- Joomla 6.x template compatibility (if released) +- PHP 8.2+ support +- Template child theme support +- Template preset import/export functionality + +--- + +#### v06.00.00 (Q4 2029) - Template Extensions & Advanced Features +**Status**: Planned +**Target Release**: December 2029 + +**Major Template Features**: +- **Template Marketplace & Extensions** + - Template addon system for modular features + - Community-contributed template extensions + - Template preset marketplace + - Style pack distribution system + - Template component library + +- **Advanced Module System** + - Custom module chrome options + - Module animation effects + - Module visibility controls (scroll, time-based) + - Module group management + - Module style inheritance + +- **Enhanced Media Handling** + - Background image options per page/section + - Image overlay controls + - Parallax scrolling effects + - Video background support + - Gallery template variations + +- **Template Branding Options** + - Multiple logo upload (standard, retina, mobile) + - Favicon and app icon management + - Custom loading screen/animations + - Watermark options + - Brand color scheme generator + +- **Advanced Header/Footer** + - Multiple header layout presets + - Sticky header variations and behaviors + - Header transparency controls + - Footer widget areas expansion + - Floating action buttons + +- **Content Enhancement Features** + - Reading progress indicator + - Social sharing buttons (template-integrated) + - Print-friendly styles + - Reading time estimation display + - Content table enhancements + +- **Template SEO Features** + - Schema markup templates for common types + - Open Graph tag management + - Twitter Card support + - Breadcrumb schema integration + - Meta tag template controls + +**Template Infrastructure**: +- Template versioning system +- Template backup/restore functionality +- Template A/B testing support +- Multi-language template variations +- Template documentation generator + +--- + +#### v07.00.00 (Q4 2030) - Modern Template Standards & Enhancements +**Status**: Planned +**Target Release**: December 2030 + +**Major Template Features**: +- **Modern CSS Features** + - CSS Grid layout system integration + - CSS Container Queries support + - CSS Cascade Layers implementation (layered style priority system) + - Custom properties (CSS variables) UI + - Modern filter and backdrop effects + +- **Progressive Template Features** + - Offline-capable template assets + - Service worker template integration + - App manifest generation + - Install to home screen support + - Template asset preloading strategies + +- **Animation & Interaction** + - Scroll-triggered animations + - Hover effect library + - Page transition effects + - Micro-interactions for UI elements + - Loading animation options + +- **Advanced Responsive Features** + - Container-based responsive design + - Element visibility by viewport + - Responsive navigation patterns library + - Mobile-optimized interactions + - Adaptive image loading + +- **Template Accessibility Features** + - Focus indicators customization + - Reduced motion preferences support + - High contrast mode automation + - Keyboard navigation patterns + - ARIA live regions for dynamic content + +- **Content Presentation** + - Advanced blockquote styles + - Code snippet highlighting themes + - Table styling variations + - List styling options + - Custom content block templates + +- **Template Performance** + - Resource hints (preconnect, prefetch) + - Optimal asset delivery strategies + - Image format optimization (AVIF support) + - Font loading optimization + - Template metrics dashboard + +**Template Infrastructure**: +- Template pattern library +- Design token system +- Template component documentation +- Automated template testing suite +- Template performance monitoring + +--- + +#### v08.00.00 (Q4 2031) - Next-Generation Template Features +**Status**: Conceptual +**Target Release**: December 2031 + +**Major Template Features**: +- **Advanced Layout Systems** + - Subgrid support for complex layouts + - Multi-column layout variations + - Asymmetric grid systems + - Dynamic layout switching + - Layout constraint system + +- **Enhanced Visual Customization** + - Real-time style editor + - Template style variations manager + - Custom CSS injection with validation + - Style inheritance and override system + - Visual design tokens editor + +- **Template Component Library** + - Comprehensive UI component set + - Reusable template blocks + - Component variation system + - Template snippet library + - Pattern library integration + +- **Advanced Typography System** + - Variable font support + - Advanced typographic scales + - Font pairing recommendations + - Fluid typography system + - Custom font fallback chains + +- **Template Integration Features** + - Enhanced component overrides + - Template hooks system + - Event-based template modifications + - Custom field rendering templates + - Module position API enhancements + +- **Responsive & Adaptive Design** + - Advanced breakpoint management + - Element-specific responsive controls + - Adaptive images with art direction + - Responsive typography system + - Context-aware component rendering + +- **Template Ecosystem** + - Child template framework + - Template derivative system + - Community template marketplace + - Template rating and review system + - Professional template support network + +- **Template Quality & Maintenance** + - Automated accessibility testing + - Template performance auditing + - Code quality monitoring + - Update notification system + - Template health dashboard + +**Template Infrastructure**: +- Template API for extensibility +- Template package manager +- Template development CLI tools +- Template migration utilities +- Comprehensive template documentation system + +--- + +## Current Release (v03.05.00) + +### System Requirements +- **Joomla**: 4.4.x or 5.x +- **PHP**: 8.0+ +- **Database**: MySQL/MariaDB compatible + +### Architecture +- **Base Template**: Joomla Cassiopeia +- **Enhancement Layer**: Non-invasive overrides +- **Asset Management**: Joomla Web Asset Manager (WAM) +- **Frontend Framework**: Bootstrap 5 +- **Icon Library**: Font Awesome 7 Free + +--- + +## Implemented Features + +### 🎨 Theming & Visual Design + +#### Color Palette System +- **3 Built-in Palettes**: Standard, Alternative, Custom +- **Dual Mode Support**: Separate light and dark configurations +- **Custom Palettes**: User-definable via `colors_custom.css` +- **Location**: `src/media/css/colors/{light|dark}/` + +#### Dark Mode System +- **Toggle Controls**: Switch (Light↔Dark) or Radios (Light/Dark/System) +- **Default Mode**: Admin-configurable (system, light, or dark) +- **Persistence**: localStorage for user preferences +- **Auto-Detection**: Optional system preference detection +- **Meta Tags**: `color-scheme` and `theme-color` support +- **ARIA Bridge**: Bootstrap ARIA compatibility + +#### Typography +- **Font Schemes**: + - Local: Roboto + - Web (Google Fonts): Fira Sans, Roboto + Noto Sans +- **Admin-Configurable**: Template settings dropdown + +#### Branding +- **Logo Support**: Custom logo upload +- **Site Title**: Text-based branding option +- **Site Description**: Tagline/subtitle field +- **Font Awesome Kit**: Optional custom kit integration + +### 📐 Layout & Structure + +#### Module Positions (23 Total) +**Header Area**: +- topbar, below-topbar, below-logo, menu, search, banner + +**Content Area**: +- top-a, top-b, main-top, main-bottom, breadcrumbs +- sidebar-left, sidebar-right + +**Footer Area**: +- bottom-a, bottom-b, footer-menu, footer + +**Special**: +- debug, offline-header, offline, offline-footer +- drawer-left, drawer-right + +#### Layout Options +- **Container Type**: Fluid or Static +- **Sticky Header**: Optional fixed navigation +- **Back-to-Top Button**: Scrollable page support + +### 📝 Content Features + +#### Table of Contents (TOC) +- **Automatic Generation**: From article headings +- **Placement Options**: `toc-left` or `toc-right` layouts +- **Article Integration**: Via Options → Layout dropdown +- **Responsive**: Mobile-friendly sidebar placement + +#### Article Layouts +- **Default**: Standard Cassiopeia layout +- **TOC Variants**: Left-sidebar or right-sidebar TOC +- **Custom Overrides**: Located in `html/com_content/article/` + +### 📊 Analytics & Tracking + +#### Google Tag Manager (GTM) +- **Enable/Disable**: Admin toggle +- **Container ID**: Template parameter field +- **Implementation**: Head and body script injection +- **GDPR-Ready**: Configurable consent defaults + +#### Google Analytics 4 (GA4) +- **Enable/Disable**: Admin toggle +- **Property ID**: Template parameter field +- **Universal Analytics Fallback**: Legacy UA support +- **Privacy-First**: Conditional loading based on settings + +### 🎛️ Customization & Developer Tools + +#### Custom Code Injection +- **Head Start**: Custom HTML/JS before `` +- **Head End**: Custom HTML/JS at end of `` +- **Raw HTML**: Unfiltered code injection for advanced users + +#### Drawer System +- **Left/Right Drawers**: Offcanvas menu areas +- **Icon Customization**: Font Awesome icon selection +- **Default Icons**: + - Left: `fa-solid fa-chevron-right` + - Right: `fa-solid fa-chevron-left` + +#### Asset Management +- **Joomla WAM**: Complete asset registry in `joomla.asset.json` +- **Development/Production Modes**: Minified and unminified assets +- **Dependency Management**: Automatic script/style loading + +### 🏗️ Template Overrides + +#### Component Overrides +**Content (com_content)**: +- Article layouts (default, toc-left, toc-right) +- Category layouts (blog, list) +- Featured articles + +**Contact (com_contact)**: +- Contact form layouts + +**Engage (com_engage)**: +- Comment system integration + +#### Module Overrides +**Menu (mod_menu)**: +- Metis dropdown menu +- Offcanvas navigation + +**VirtueMart**: +- Product display (`mod_virtuemart_product`) +- Shopping cart (`mod_virtuemart_cart`) +- Manufacturer display (`mod_virtuemart_manufacturer`) +- Category display (`mod_virtuemart_category`) +- Currency selector (`mod_virtuemart_currencies`) + +**Other Modules**: +- Custom HTML (`mod_custom`) +- GABble social integration (`mod_gabble`) + +**Membership System (OS Membership)**: +- Plan layouts (default, pricing tables) +- Member management interfaces + +### 🔧 Configuration Parameters + +#### Theme Tab +**General**: +- `theme_enabled` - Enable/disable theme system +- `theme_control_type` - Toggle UI type (switch/radios/none) +- `theme_default_choice` - Default mode (system/light/dark) +- `theme_auto_dark` - Auto-detect system preference +- `theme_meta_color_scheme` - Inject `color-scheme` meta tag +- `theme_meta_theme_color` - Inject `theme-color` meta tag +- `theme_bridge_bs_aria` - Bootstrap ARIA compatibility + +**Variables & Palettes**: +- `colorLightName` - Light mode color scheme +- `colorDarkName` - Dark mode color scheme + +**Typography**: +- `useFontScheme` - Font selection (local/web) + +**Branding & Icons**: +- `brand` - Show/hide branding +- `logoFile` - Logo upload path +- `siteTitle` - Site title text +- `siteDescription` - Site tagline +- `fA6KitCode` - Font Awesome kit code + +**Header & Navigation**: +- `stickyHeader` - Fixed navigation +- `backTop` - Back-to-top button + +**Toggle UI**: +- `theme_fab_enabled` - Floating action button for theme toggle +- `theme_fab_pos` - FAB position (br/bl/tr/tl) + +#### Google Tab +- `googletagmanager` - Enable GTM +- `googletagmanagerid` - GTM container ID +- `googleanalytics` - Enable GA4 +- `googleanalyticsid` - GA4 property ID + +#### Custom Code Tab +- `custom_head_start` - Custom code at head start +- `custom_head_end` - Custom code at head end + +#### Drawers Tab +- `drawerLeftIcon` - Left drawer icon (Font Awesome class) +- `drawerRightIcon` - Right drawer icon (Font Awesome class) + +#### Advanced Tab +- `fluidContainer` - Container layout (static/fluid) + +### 🛠️ Development Tools + +#### Quality Assurance +- **Codeception**: Automated testing framework +- **PHPStan**: Static analysis (level 8+) +- **PHPCS**: Code style validation (PSR-12) +- **PHPCompatibility**: PHP 8.0+ compatibility checks + +#### CI/CD Workflows +- **Dependency Review**: Vulnerability scanning +- **Standards Compliance**: MokoStandards validation +- **CodeQL**: Security analysis (GitHub default) +- **Dependabot**: Automated dependency updates + +#### Documentation +- **Quick Start**: 5-minute developer setup +- **Workflow Guide**: Git strategy, branching, releases +- **Joomla Development**: Testing, packaging, multi-version support + +--- + +## Planned Features + +### 🚧 In Development + +#### Soft Offline Mode (v2.1.5 - Mentioned) +**Status**: Planned/In Development +**Description**: Keep selected categories accessible during maintenance mode +**Use Cases**: +- Legal documents remain viewable during downtime +- Policy pages accessible for compliance +- Terms of service always available +**Configuration**: +- Admin-selectable categories +- Per-category offline access control + +#### TODO Tracking System +**Status**: Mentioned in CHANGELOG (v03.05.00) +**Description**: Separate TODO tracking file +**Purpose**: Centralized issue and feature tracking outside changelog + +### 🔮 Future Enhancements + +#### Development Mode (Commented Out) +**Status**: Code exists but disabled +**Location**: `templateDetails.xml` line 91 +**Description**: Comprehensive development mode toggle +**Potential Features**: +- Unminified asset loading +- Debug output +- Performance profiling +- Template cache bypass + +#### Potential Features (Community Requested) +*Note: These are conceptual and not yet officially planned* + +**Enhanced Accessibility**: +- WCAG 2.1 AAA compliance mode +- High-contrast themes +- Screen reader optimizations +- Keyboard navigation improvements + +**Template Layout Features**: +- Advanced responsive grid layouts +- Multiple column variations +- Custom module position system +- Layout preset library + +**Template Styling Features**: +- Extended color palette management +- Custom font upload support +- Typography scale controls +- Visual style editor + +--- + +## Development Priorities + +### Immediate Focus (v03.x - 2026) +1. **TODO Tracking System**: Implement separate file for issue tracking +2. **Soft Offline Mode**: Complete category-based offline access +3. **Security Updates**: Maintain Dependabot and CodeQL scans +4. **Documentation**: Keep docs synchronized with features +5. **Bug Fixes**: Address reported issues and edge cases + +### v04.00.00 Priorities (2027) - Template Foundation +1. **WCAG 2.1 AA Compliance**: Full template accessibility audit and implementation +2. **Template Performance**: Critical CSS, lazy loading, WebP support +3. **Layout System**: Enhanced responsive grid and module positions +4. **Development Mode**: Enable comprehensive template developer tools + +### v05.00.00 Priorities (2028) - Template Customization +1. **Layout Builder**: Template-based page layout system +2. **Styling System**: Extended color palettes and CSS variable management +3. **Template Components**: Enhanced header, footer, and menu variations +4. **Responsive Design**: Mobile-first navigation and layout improvements + +### v06.00.00 Priorities (2029) - Template Extensions +1. **Template Marketplace**: Addon system and community extensions +2. **Module System**: Advanced module chrome and animation options +3. **Media Handling**: Background images, parallax, video backgrounds +4. **Template SEO**: Schema markup templates and meta tag controls + +### v07.00.00+ Priorities (2030+) - Modern Standards +1. **Modern CSS**: Grid, Container Queries, Cascade Layers +2. **Progressive Template**: Offline-capable assets and PWA features +3. **Animation System**: Scroll-triggered effects and micro-interactions +4. **Template Performance**: Advanced optimization and monitoring + +--- + +## Long-term Vision + +### Mission Statement +Moko-Cassiopeia aims to be the **most developer-friendly, user-customizable, and standards-compliant Joomla template** while maintaining minimal core overrides for maximum upgrade compatibility. + +### Core Principles +1. **Non-Invasive**: Minimal Cassiopeia overrides +2. **Standards-First**: MokoStandards compliance +3. **Accessibility**: WCAG 2.1 compliance +4. **Performance**: Fast, optimized delivery +5. **Developer Experience**: Clear docs, easy setup, powerful tools +6. **Template-Focused**: Pure template features without complex external dependencies + +### 5-Year Strategic Roadmap (Template Features) + +#### 2027 (v04.00.00) - Accessibility & Performance +- Achieve WCAG 2.1 AA compliance for all template elements +- Implement critical template performance optimizations +- Enhance template layout system with flexible grids +- Enable comprehensive development mode for template developers + +#### 2028 (v05.00.00) - Layouts & Customization +- Launch template-based layout builder system +- Deploy extended styling and customization options +- Enhance template component variations (headers, footers, menus) +- Improve responsive design patterns for all devices + +#### 2029 (v06.00.00) - Extensions & Enhancements +- Introduce template addon and extension system +- Launch template preset marketplace +- Deploy advanced module styling and animation features +- Implement comprehensive template SEO controls + +#### 2030 (v07.00.00) - Modern Standards +- Adopt modern CSS standards (Grid, Container Queries, Cascade Layers) +- Implement progressive template features (PWA support) +- Deploy advanced animation and interaction system +- Enhance template performance monitoring and optimization + +#### 2031 (v08.00.00) - Next-Generation Template +- Advanced layout systems with subgrid support +- Comprehensive template component library +- Enhanced visual customization tools +- Template ecosystem with child themes and derivatives + +--- + +## External Resources + +### Official Links +- **Full Roadmap**: [https://mokoconsulting.tech/support/joomla-cms/moko-cassiopeia-roadmap](https://mokoconsulting.tech/support/joomla-cms/moko-cassiopeia-roadmap) +- **Repository**: [https://github.com/mokoconsulting-tech/moko-cassiopeia](https://github.com/mokoconsulting-tech/moko-cassiopeia) +- **Issue Tracker**: [GitHub Issues](https://github.com/mokoconsulting-tech/moko-cassiopeia/issues) +- **Changelog**: [CHANGELOG.md](../CHANGELOG.md) + +### Community +- **Email Support**: hello@mokoconsulting.tech +- **Contributing**: [CONTRIBUTING.md](../CONTRIBUTING.md) +- **Code of Conduct**: [CODE_OF_CONDUCT.md](../CODE_OF_CONDUCT.md) + +### Documentation +- **Quick Start**: [docs/QUICK_START.md](./QUICK_START.md) +- **Workflow Guide**: [docs/WORKFLOW_GUIDE.md](./WORKFLOW_GUIDE.md) +- **Joomla Development**: [docs/JOOMLA_DEVELOPMENT.md](./JOOMLA_DEVELOPMENT.md) +- **Main README**: [README.md](../README.md) + +--- + +## Contributing to the Roadmap + +Have ideas for future features? We welcome community input! + +**How to Suggest Features**: +1. Check the [GitHub Issues](https://github.com/mokoconsulting-tech/moko-cassiopeia/issues) for existing requests +2. Open a new issue with the `enhancement` label +3. Provide clear use cases and benefits +4. Engage in community discussion + +**Feature Evaluation Criteria**: +- Alignment with core principles +- User demand and use cases +- Technical feasibility +- Maintenance burden +- Performance impact +- Security implications + +--- + +## Metadata + +* Document: docs/ROADMAP.md +* Repository: [https://github.com/mokoconsulting-tech/moko-cassiopeia](https://github.com/mokoconsulting-tech/moko-cassiopeia) +* Path: /docs/ROADMAP.md +* Owner: Moko Consulting +* Version: 03.05.00 +* Status: Active +* Last Updated: 2026-01-27 +* Classification: Public Open Source Documentation + +## Revision History + +| Date | Change Summary | Author | +| ---------- | ----------------------------------------------------- | --------------- | +| 2026-01-27 | Initial version-specific roadmap generated from codebase scan. | GitHub Copilot | +| 2026-01-27 | Added 5-year future roadmap with annual major version releases (v04-v08). | GitHub Copilot | +| 2026-01-27 | Refocused roadmap to concentrate on template-oriented features only. | GitHub Copilot | diff --git a/src/language/en-GB/tpl_moko-cassiopeia.ini b/src/language/en-GB/tpl_moko-cassiopeia.ini index 03d6e7e..d896db4 100644 --- a/src/language/en-GB/tpl_moko-cassiopeia.ini +++ b/src/language/en-GB/tpl_moko-cassiopeia.ini @@ -1,4 +1,4 @@ -; ; Copyright (C) 2025 Moko Consulting +; Copyright (C) 2025 Moko Consulting ; ; This file is part of a Moko Consulting project. ; diff --git a/src/media/css/colors/dark/colors_alternative.css b/src/media/css/colors/dark/colors_alternative.css index a2243c7..988b0a9 100644 --- a/src/media/css/colors/dark/colors_alternative.css +++ b/src/media/css/colors/dark/colors_alternative.css @@ -185,7 +185,7 @@ --dark-border-subtle: #2b323b; /* Typography & layout */ - --body-font-family: var(--optain-cassiopeia-font-family-body, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'); + --body-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; --body-font-size: 1rem; --body-font-weight: 400; --body-line-height: 1.5; diff --git a/src/media/css/colors/dark/colors_standard.css b/src/media/css/colors/dark/colors_standard.css index d197b55..9876df2 100644 --- a/src/media/css/colors/dark/colors_standard.css +++ b/src/media/css/colors/dark/colors_standard.css @@ -186,7 +186,7 @@ --dark-border-subtle: #2b323b; /* Typography & layout */ - --body-font-family: var(--optain-cassiopeia-font-family-body, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'); + --body-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; --body-font-size: 1rem; --body-font-weight: 400; --body-line-height: 1.5; diff --git a/src/media/css/colors/light/colors_alternative.css b/src/media/css/colors/light/colors_alternative.css index 8eb6350..49b5675 100644 --- a/src/media/css/colors/light/colors_alternative.css +++ b/src/media/css/colors/light/colors_alternative.css @@ -172,7 +172,7 @@ --font-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --gradient: linear-gradient(180deg, #ffffff26, #fff0); - --body-font-family: var(--optain-cassiopeia-font-family-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); + --body-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); --body-font-size: 1rem; --body-font-weight: 400; --body-line-height: 1.5; diff --git a/src/media/css/colors/light/colors_standard.css b/src/media/css/colors/light/colors_standard.css index 0b6691a..c9daa6c 100644 --- a/src/media/css/colors/light/colors_standard.css +++ b/src/media/css/colors/light/colors_standard.css @@ -172,7 +172,7 @@ --font-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --gradient: linear-gradient(180deg, #ffffff26, #fff0); - --body-font-family: var(--optain-cassiopeia-font-family-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); + --body-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); --body-font-size: 1rem; --body-font-weight: 400; --body-line-height: 1.5; diff --git a/src/media/css/template.css b/src/media/css/template.css index a43a73a..e025344 100644 --- a/src/media/css/template.css +++ b/src/media/css/template.css @@ -38,9 +38,8 @@ .container-bottom-b, #lhc_container_v2 *, footer, - .fb-comments, - { - display: none !important; + .fb-comments { + display: none ; } } @@ -52,7 +51,7 @@ body { line-height: var(--body-line-height); color: var(--body-color); text-align: var(--body-text-align); - background-color: var(--body-bg); + background: var(--body-bg); -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } @@ -71,7 +70,7 @@ form { font-size: 2em; font-weight: bold; background-color: var(--gray-500); - padding: var(--btn-padding-y); + padding: var(--btn-padding-y) var(--btn-padding-x); color: var(--color-link); text-align: center; } @@ -95,28 +94,29 @@ form { width: 280px; } -.drawer-toggle-left { - position: fixed; - top: 250px; - left: 0px; - z-index: 1050; - background-color: var(--nav-bg-color) !important; - color: var(--nav-text-color) !important; - padding-left: calc(var(--btn-padding-x)*0.5) !important; - padding-right: calc(var(--btn-padding-x)*0.5) !important; +.drawer-toggle-left{ + position: fixed !important; + top: 250px !important; + left: 0px !important; + z-index: 1050 !important; + background-color: var(--nav-bg-color) !important; + color: var(--nav-text-color) !important; + padding-left: .5rem !important; + padding-right: .5rem !important; } -.drawer-toggle-right { - position: fixed; - top: 250px; - right: 0px; - z-index: 1050; - background-color: var(--nav-bg-color) !important; - color: var(--nav-text-color) !important; - padding-left: calc(var(--btn-padding-x)*0.5) !important; - padding-right: calc(var(--btn-padding-x)*0.5) !important; +.drawer-toggle-right{ + position: fixed !important; + top: 250px !important; + right: 0px !important; + z-index: 1050 !important; + background-color: var(--nav-bg-color) !important; + color: var(--nav-text-color) !important; + padding-left: .5rem !important; + padding-right: .5rem !important; } + .offcanvas-body { background-color: var(--offcanvas-color); } @@ -430,7 +430,7 @@ select:disabled { } [list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator { - display: none !important; + display: none ; } button, @@ -545,7 +545,7 @@ progress { } [hidden] { - display: none !important; + display: none ; } .lead { @@ -675,7 +675,7 @@ progress { .img-thumbnail { padding: 0.25rem; - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); border: 1px solid var(--border-color); border-radius: 0.25rem; max-width: 100%; @@ -785,26 +785,13 @@ progress { margin-left: calc(-0.5 * var(--gutter-x)); } -.row>* { +.row > * { -ms-flex-negative: 0; flex-shrink: 0; width: 100%; max-width: 100%; - padding-right: 0.25em; - padding-left: 0.25em; - margin-top: var(--gutter-y); -} - -.product-container { - margin-right: calc(var(--gutter-x) * .25); - margin-left: calc(var(--gutter-x) * .25); - padding-right: calc(var(--gutter-x) * .25); - padding-left: calc(var(--gutter-x) * .25); - margin-top: var(--gutter-y); - //background-color: var(--gray-200); - -webkit-border-radius: var(--border-radius); - -moz-border-radius: var(--border-radius); - border-radius: var(--border-radius); + padding-right: calc(0.25 * var(--gutter-x)); + padding-left: calc(0.25 * var(--gutter-x)); } .latest-view { @@ -2522,15 +2509,15 @@ progress { } .table-dark { - --table-color: hsl(0, 0%, 100%); + --table-color: var(--body-color); --table-bg: hsl(210, 10%, 23%); --table-border-color: #494f54; --table-striped-bg: #3f454b; - --table-striped-color: hsl(0, 0%, 100%); + --table-striped-color: var(--body-color); --table-active-bg: #494f54; - --table-active-color: hsl(0, 0%, 100%); + --table-active-color: var(--body-color); --table-active-bg: #444a4f; - --table-active-color: hsl(0, 0%, 100%); + --table-active-color: var(--body-color); color: var(--table-color); border-color: var(--table-border-color); } @@ -2613,7 +2600,7 @@ progress { font-weight: 400; line-height: 1; color: hsl(210, 11%, 15%); - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); background-clip: padding-box; border: 1px solid hsl(210, 14%, 83%); -webkit-appearance: none; @@ -2645,7 +2632,7 @@ progress { .form-control:focus { color: hsl(210, 11%, 15%); - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); border-color: #8894aa; outline: 0; -webkit-box-shadow: 0 0 0 0.25rem rgba(1, 1, 86, 0.25); @@ -2833,7 +2820,7 @@ textarea.form-control-lg { } .form-control-color::-moz-color-swatch { - border: 0 !important; + border: 0 ; border-radius: 0.25rem; } @@ -2958,7 +2945,7 @@ textarea.form-control-lg { height: 1em; margin-top: 0.25em; vertical-align: top; - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); background-repeat: no-repeat; background-position: center; background-size: contain; @@ -3098,12 +3085,12 @@ textarea.form-control-lg { } .form-range:focus::-webkit-slider-thumb { - -webkit-box-shadow: 0 0 0 1px hsl(0, 0%, 100%), 0 0 0 0.25rem rgba(1, 1, 86, 0.25); - box-shadow: 0 0 0 1px hsl(0, 0%, 100%), 0 0 0 0.25rem rgba(1, 1, 86, 0.25); + -webkit-box-shadow: 0 0 0 1px var(--body-color), 0 0 0 0.25rem rgba(1, 1, 86, 0.25); + box-shadow: 0 0 0 1px var(--body-color), 0 0 0 0.25rem rgba(1, 1, 86, 0.25); } .form-range:focus::-moz-range-thumb { - box-shadow: 0 0 0 1px hsl(0, 0%, 100%), 0 0 0 0.25rem rgba(1, 1, 86, 0.25); + box-shadow: 0 0 0 1px var(--body-color), 0 0 0 0.25rem rgba(1, 1, 86, 0.25); } .form-range::-moz-focus-outer { @@ -3461,7 +3448,7 @@ textarea.form-control-lg { padding: 0.25rem 0.5rem; margin-top: 0.1rem; font-size: 0.875rem; - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: rgba(68, 131, 68, 0.9); border-radius: 0.25rem; } @@ -3584,7 +3571,7 @@ textarea.form-control.is-valid { padding: 0.25rem 0.5rem; margin-top: 0.1rem; font-size: 0.875rem; - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: rgba(165, 31, 24, 0.9); border-radius: 0.25rem; } @@ -3885,7 +3872,7 @@ fieldset:disabled .btn { --dropdown-spacer: 0.125rem; --dropdown-font-size: 1rem; --dropdown-color: hsl(210, 11%, 15%); - --dropdown-bg: hsl(0, 0%, 100%); + --dropdown-bg: var(--body-color); --dropdown-border-color: var(--border-color-translucent); --dropdown-border-radius: 0.25rem; --dropdown-border-width: 1px; @@ -3896,7 +3883,7 @@ fieldset:disabled .btn { --dropdown-link-color: hsl(210, 11%, 15%); --dropdown-link-active-color: #1f2226; --dropdown-link-active-bg: hsl(210, 16%, 93%); - --dropdown-link-active-color: hsl(0, 0%, 100%); + --dropdown-link-active-color: var(--body-color); --dropdown-link-active-bg: hsl(240, 98%, 17%); --dropdown-link-disabled-color: hsl(210, 11%, 71%); --dropdown-item-padding-x: 1rem; @@ -4197,10 +4184,10 @@ fieldset:disabled .btn { --dropdown-border-color: var(--border-color-translucent); --dropdown-box-shadow: ; --dropdown-link-color: hsl(210, 14%, 89%); - --dropdown-link-active-color: hsl(0, 0%, 100%); + --dropdown-link-active-color: var(--body-color); --dropdown-divider-bg: var(--border-color-translucent); --dropdown-link-active-bg: rgba(255, 255, 255, 0.15); - --dropdown-link-active-color: hsl(0, 0%, 100%); + --dropdown-link-active-color: var(--body-color); --dropdown-link-active-bg: hsl(240, 98%, 17%); --dropdown-link-disabled-color: hsl(210, 11%, 71%); --dropdown-header-color: hsl(210, 11%, 71%); @@ -4392,8 +4379,8 @@ fieldset:disabled .btn { --nav-tabs-border-radius: 0.25rem; --nav-tabs-link-active-border-color: hsl(210, 16%, 93%) hsl(210, 16%, 93%) hsl(210, 14%, 89%); --nav-tabs-link-active-color: hsl(210, 9%, 31%); - --nav-tabs-link-active-bg: hsl(0, 0%, 100%); - --nav-tabs-link-active-border-color: hsl(210, 14%, 89%) hsl(210, 14%, 89%) hsl(0, 0%, 100%); + --nav-tabs-link-active-bg: var(--body-color); + --nav-tabs-link-active-border-color: hsl(210, 14%, 89%) hsl(210, 14%, 89%) var(--body-color); border-bottom: var(--nav-tabs-border-width) solid var(--nav-tabs-border-color); } @@ -4433,7 +4420,7 @@ fieldset:disabled .btn { .nav-pills { --nav-pills-border-radius: 0.25rem; - --nav-pills-link-active-color: hsl(0, 0%, 100%); + --nav-pills-link-active-color: var(--body-color); --nav-pills-link-active-bg: hsl(240, 98%, 17%); } @@ -4487,26 +4474,6 @@ fieldset:disabled .btn { } .navbar { - --navbar-padding-x: 0; - --navbar-padding-y: 0.5rem; - --navbar-color: rgba(0, 0, 0, 0.55); - --navbar-active-color: rgba(0, 0, 0, 0.7); - --navbar-disabled-color: rgba(0, 0, 0, 0.3); - --navbar-active-color: rgba(0, 0, 0, 0.9); - --navbar-brand-padding-y: 0.3125rem; - --navbar-brand-margin-end: 0; - --navbar-brand-font-size: 1.25rem; - --navbar-brand-color: rgba(0, 0, 0, 0.9); - --navbar-brand-active-color: rgba(0, 0, 0, 0.9); - --navbar-nav-link-padding-x: 0.5rem; - --navbar-toggler-padding-y: 0.25rem; - --navbar-toggler-padding-x: 0.75rem; - --navbar-toggler-font-size: 1.25rem; - --navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); - --navbar-toggler-border-color: rgba(0, 0, 0, 0.1); - --navbar-toggler-border-radius: 0.25rem; - --navbar-toggler-focus-width: 0.25rem; - --navbar-toggler-transition: box-shadow 0.15s ease-in-out; position: relative; display: -webkit-box; display: -ms-flexbox; @@ -4558,12 +4525,6 @@ fieldset:disabled .btn { } .navbar-nav { - --nav-link-padding-x: 0; - --nav-link-padding-y: 0.5rem; - --nav-link-font-weight: ; - --nav-link-color: var(--navbar-color); - --nav-link-active-color: var(--navbar-active-color); - --nav-link-disabled-color: var(--navbar-disabled-color); display: -webkit-box; display: -ms-flexbox; display: flex; @@ -4614,8 +4575,7 @@ fieldset:disabled .btn { line-height: 1; color: var(--navbar-color); background-color: transparent; - border: var(--border-width) solid var(--navbar-toggler-border-color); - border-radius: var(--navbar-toggler-border-radius); + border: 0; -webkit-transition: var(--navbar-toggler-transition); -o-transition: var(--navbar-toggler-transition); transition: var(--navbar-toggler-transition); @@ -4636,8 +4596,7 @@ fieldset:disabled .btn { .navbar-toggler:focus { text-decoration: none; outline: 0; - -webkit-box-shadow: 0 0 0 var(--navbar-toggler-focus-width); - box-shadow: 0 0 0 var(--navbar-toggler-focus-width); + color: var(--color-primary); } .navbar-toggler-icon { @@ -4645,7 +4604,6 @@ fieldset:disabled .btn { width: 1.5em; height: 1.5em; vertical-align: middle; - background-image: var(--navbar-toggler-icon-bg); background-repeat: no-repeat; background-position: center; background-size: 100%; @@ -4686,9 +4644,9 @@ fieldset:disabled .btn { } .navbar-expand-sm .navbar-collapse { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; -ms-flex-preferred-size: auto; flex-basis: auto; } @@ -4703,13 +4661,13 @@ fieldset:disabled .btn { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; - width: auto !important; - height: auto !important; - visibility: visible !important; - background-color: transparent !important; - border: 0 !important; - -webkit-transform: none !important; - transform: none !important; + width: auto ; + height: auto ; + visibility: visible ; + background-color: transparent ; + border: 0 ; + -webkit-transform: none ; + transform: none ; -webkit-transition: none; -o-transition: none; transition: none; @@ -4761,9 +4719,9 @@ fieldset:disabled .btn { } .navbar-expand-md .navbar-collapse { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; -ms-flex-preferred-size: auto; flex-basis: auto; } @@ -4778,13 +4736,13 @@ fieldset:disabled .btn { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; - width: auto !important; - height: auto !important; - visibility: visible !important; - background-color: transparent !important; - border: 0 !important; - -webkit-transform: none !important; - transform: none !important; + width: auto ; + height: auto ; + visibility: visible ; + background-color: transparent ; + border: 0 ; + -webkit-transform: none ; + transform: none ; -webkit-transition: none; -o-transition: none; transition: none; @@ -4836,9 +4794,9 @@ fieldset:disabled .btn { } .navbar-expand-lg .navbar-collapse { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; -ms-flex-preferred-size: auto; flex-basis: auto; } @@ -4853,13 +4811,13 @@ fieldset:disabled .btn { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; - width: auto !important; - height: auto !important; - visibility: visible !important; - background-color: transparent !important; - border: 0 !important; - -webkit-transform: none !important; - transform: none !important; + width: auto ; + height: auto ; + visibility: visible ; + background-color: transparent ; + border: 0 ; + -webkit-transform: none ; + transform: none ; -webkit-transition: none; -o-transition: none; transition: none; @@ -4911,9 +4869,9 @@ fieldset:disabled .btn { } .navbar-expand-xl .navbar-collapse { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; -ms-flex-preferred-size: auto; flex-basis: auto; } @@ -4928,13 +4886,13 @@ fieldset:disabled .btn { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; - width: auto !important; - height: auto !important; - visibility: visible !important; - background-color: transparent !important; - border: 0 !important; - -webkit-transform: none !important; - transform: none !important; + width: auto ; + height: auto ; + visibility: visible ; + background-color: transparent ; + border: 0 ; + -webkit-transform: none ; + transform: none ; -webkit-transition: none; -o-transition: none; transition: none; @@ -4986,9 +4944,9 @@ fieldset:disabled .btn { } .navbar-expand-xxl .navbar-collapse { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; -ms-flex-preferred-size: auto; flex-basis: auto; } @@ -5003,13 +4961,13 @@ fieldset:disabled .btn { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; - width: auto !important; - height: auto !important; - visibility: visible !important; - background-color: transparent !important; - border: 0 !important; - -webkit-transform: none !important; - transform: none !important; + width: auto ; + height: auto ; + visibility: visible ; + background-color: transparent ; + border: 0 ; + -webkit-transform: none ; + transform: none ; -webkit-transition: none; -o-transition: none; transition: none; @@ -5060,9 +5018,9 @@ fieldset:disabled .btn { } .navbar-expand .navbar-collapse { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; -ms-flex-preferred-size: auto; flex-basis: auto; } @@ -5077,13 +5035,13 @@ fieldset:disabled .btn { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; - width: auto !important; - height: auto !important; - visibility: visible !important; - background-color: transparent !important; - border: 0 !important; - -webkit-transform: none !important; - transform: none !important; + width: auto ; + height: auto ; + visibility: visible ; + background-color: transparent ; + border: 0 ; + -webkit-transform: none ; + transform: none ; -webkit-transition: none; -o-transition: none; transition: none; @@ -5104,35 +5062,7 @@ fieldset:disabled .btn { overflow-y: visible; } -.navbar-dark { - --navbar-color: rgba(255, 255, 255, 0.55); - --navbar-active-color: rgba(255, 255, 255, 0.75); - --navbar-disabled-color: rgba(255, 255, 255, 0.25); - --navbar-active-color: hsl(0, 0%, 100%); - --navbar-brand-color: hsl(0, 0%, 100%); - --navbar-brand-active-color: hsl(0, 0%, 100%); - --navbar-toggler-border-color: rgba(255, 255, 255, 0.1); - --navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); -} - .card { - --card-spacer-y: 1rem; - --card-spacer-x: 1rem; - --card-title-spacer-y: 0.5rem; - --card-border-width: 1px; - --card-border-color: var(--color-secondary); - --card-border-radius: 0.25rem; - --card-box-shadow: ; - --card-inner-border-radius: calc(0.25rem - 1px); - --card-cap-padding-y: 0.5rem; - --card-cap-padding-x: 1rem; - --card-cap-bg: rgba(0, 0, 0, 0.03); - --card-cap-color: var(--color-primary); - --card-height: ; - --card-color: ; - --card-bg: var(--nav-text-color); - --card-img-overlay-padding: 1rem; - --card-group-margin: 0.5em; position: relative; display: -webkit-box; display: -ms-flexbox; @@ -5330,7 +5260,7 @@ fieldset:disabled .btn { .accordion { --accordion-color: hsl(210, 11%, 15%); - --accordion-bg: hsl(0, 0%, 100%); + --accordion-bg: var(--body-color); --accordion-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease; --accordion-border-color: var(--border-color); --accordion-border-width: 1px; @@ -5505,7 +5435,7 @@ fieldset:disabled .btn { --breadcrumb-border-radius: ; --breadcrumb-divider-color: hsl(210, 7%, 46%); --breadcrumb-item-padding-x: 0.5rem; - --breadcrumb-item-active-color: val(var(--link-color)); + --breadcrumb-item-active-color: var(--link-color); display: -webkit-box; display: -ms-flexbox; display: flex; @@ -5541,7 +5471,7 @@ fieldset:disabled .btn { --pagination-padding-y: 0.375rem; --pagination-font-size: 1rem; --pagination-color: var(--link-color); - --pagination-bg: hsl(0, 0%, 100%); + --pagination-bg: var(--body-color); --pagination-border-width: 1px; --pagination-border-color: hsl(210, 14%, 89%); --pagination-border-radius: 0.25rem; @@ -5551,11 +5481,11 @@ fieldset:disabled .btn { --pagination-focus-color: var(--link-active-color); --pagination-focus-bg: hsl(210, 16%, 93%); --pagination-focus-box-shadow: 0 0 0 0.25rem rgba(1, 1, 86, 0.25); - --pagination-active-color: hsl(0, 0%, 100%); + --pagination-active-color: var(--body-color); --pagination-active-bg: hsl(240, 98%, 17%); --pagination-active-border-color: hsl(240, 98%, 17%); --pagination-disabled-color: hsl(210, 7%, 46%); - --pagination-disabled-bg: hsl(0, 0%, 100%); + --pagination-disabled-bg: var(--body-color); --pagination-disabled-border-color: hsl(210, 14%, 89%); display: -webkit-box; display: -ms-flexbox; @@ -5653,7 +5583,7 @@ fieldset:disabled .btn { --badge-padding-y: 0.35em; --badge-font-size: 0.75em; --badge-font-weight: 700; - --badge-color: hsl(0, 0%, 100%); + --badge-color: var(--body-color); --badge-border-radius: 0.25rem; display: inline-block; padding: var(--badge-padding-y) var(--badge-padding-x); @@ -5812,7 +5742,7 @@ fieldset:disabled .btn { --progress-bg: hsl(210, 16%, 93%); --progress-border-radius: 0.25rem; --progress-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075); - --progress-bar-color: hsl(0, 0%, 100%); + --progress-bar-color: var(--body-color); --progress-bar-bg: hsl(240, 98%, 17%); --progress-bar-transition: width 0.6s ease; display: -webkit-box; @@ -5874,7 +5804,7 @@ fieldset:disabled .btn { .list-group { --list-group-color: hsl(210, 11%, 15%); - --list-group-bg: hsl(0, 0%, 100%); + --list-group-bg: var(--body-color); --list-group-border-color: rgba(0, 0, 0, 0.125); --list-group-border-width: 1px; --list-group-border-radius: 0.25rem; @@ -5886,8 +5816,8 @@ fieldset:disabled .btn { --list-group-action-active-color: hsl(210, 11%, 15%); --list-group-action-active-bg: hsl(210, 16%, 93%); --list-group-disabled-color: hsl(210, 7%, 46%); - --list-group-disabled-bg: hsl(0, 0%, 100%); - --list-group-active-color: hsl(0, 0%, 100%); + --list-group-disabled-bg: var(--body-color); + --list-group-active-color: var(--body-color); --list-group-active-bg: hsl(240, 98%, 17%); --list-group-active-border-color: hsl(240, 98%, 17%); display: -webkit-box; @@ -6194,7 +6124,7 @@ fieldset:disabled .btn { } .list-group-item-primary.list-group-item-action.active { - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: #010134; border-color: #010134; } @@ -6211,7 +6141,7 @@ fieldset:disabled .btn { } .list-group-item-secondary.list-group-item-action.active { - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: #41464c; border-color: #41464c; } @@ -6228,7 +6158,7 @@ fieldset:disabled .btn { } .list-group-item-success.list-group-item-action.active { - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: #294f29; border-color: #294f29; } @@ -6245,7 +6175,7 @@ fieldset:disabled .btn { } .list-group-item-info.list-group-item-action.active { - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: #1d3b55; border-color: #1d3b55; } @@ -6262,7 +6192,7 @@ fieldset:disabled .btn { } .list-group-item-warning.list-group-item-action.active { - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: #683b00; border-color: #683b00; } @@ -6279,7 +6209,7 @@ fieldset:disabled .btn { } .list-group-item-danger.list-group-item-action.active { - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: #63130e; border-color: #63130e; } @@ -6296,7 +6226,7 @@ fieldset:disabled .btn { } .list-group-item-light.list-group-item-action.active { - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: #646464; border-color: #646464; } @@ -6313,7 +6243,7 @@ fieldset:disabled .btn { } .list-group-item-dark.list-group-item-action.active { - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: #202327; border-color: #202327; } @@ -6443,7 +6373,7 @@ fieldset:disabled .btn { --modal-padding: 1rem; --modal-margin: 0.5rem; --modal-color: ; - --modal-bg: hsl(0, 0%, 100%); + --modal-bg: var(--body-color); --modal-border-color: var(--border-color-translucent); --modal-border-width: 1px; --modal-border-radius: 0.3rem; @@ -6810,7 +6740,7 @@ fieldset:disabled .btn { --tooltip-padding-y: 0.25rem; --tooltip-margin: ; --tooltip-font-size: 0.875rem; - --tooltip-color: hsl(0, 0%, 100%); + --tooltip-color: var(--body-color); --tooltip-bg: hsl(0, 0%, 0%); --tooltip-border-radius: 0.25rem; --tooltip-opacity: 0.9; @@ -6820,7 +6750,7 @@ fieldset:disabled .btn { display: block; padding: var(--tooltip-arrow-height); margin: var(--tooltip-margin); - font-family: var(--font-family-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); + font-family: v-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-style: normal; font-weight: 400; line-height: 1.5; @@ -6925,7 +6855,7 @@ fieldset:disabled .btn { --popover-zindex: 1060; --popover-max-width: 276px; --popover-font-size: 0.875rem; - --popover-bg: hsl(0, 0%, 100%); + --popover-bg: var(--body-color); --popover-border-width: 1px; --popover-border-color: var(--border-color-translucent); --popover-border-radius: 0.3rem; @@ -7233,7 +7163,7 @@ fieldset:disabled .btn { justify-content: center; width: 15%; padding: 0; - color: hsl(0, 0%, 100%); + color: var(--body-color); text-align: center; background: none; border: 0; @@ -7257,7 +7187,7 @@ fieldset:disabled .btn { .carousel-control-prev:focus, .carousel-control-next:active, .carousel-control-next:focus { - color: hsl(0, 0%, 100%); + color: var(--body-color); text-decoration: none; outline: 0; opacity: 0.9; @@ -7329,7 +7259,7 @@ fieldset:disabled .btn { margin-left: 3px; text-indent: -999px; cursor: pointer; - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); background-clip: padding-box; border: 0; border-top: 10px solid transparent; @@ -7359,7 +7289,7 @@ fieldset:disabled .btn { left: 15%; padding-top: 1.25rem; padding-bottom: 1.25rem; - color: hsl(0, 0%, 100%); + color: var(--body-color); text-align: center; } @@ -7488,7 +7418,7 @@ fieldset:disabled .btn { --offcanvas-padding-x: 1rem; --offcanvas-padding-y: 1rem; --offcanvas-color: ; - --offcanvas-bg: hsl(0, 0%, 100%); + --offcanvas-bg: var(--body-color); --offcanvas-border-width: 1px; --offcanvas-border-color: var(--border-color-translucent); --offcanvas-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); @@ -7597,7 +7527,7 @@ fieldset:disabled .btn { .offcanvas-sm { --offcanvas-height: auto; --offcanvas-border-width: 0; - background-color: transparent !important; + background-color: transparent ; } .offcanvas-sm .offcanvas-header { @@ -7613,7 +7543,7 @@ fieldset:disabled .btn { flex-grow: 0; padding: 0; overflow-y: visible; - background-color: transparent !important; + background-color: transparent ; } } @@ -7720,7 +7650,7 @@ fieldset:disabled .btn { .offcanvas-md { --offcanvas-height: auto; --offcanvas-border-width: 0; - background-color: transparent !important; + background-color: transparent ; } .offcanvas-md .offcanvas-header { @@ -7736,7 +7666,7 @@ fieldset:disabled .btn { flex-grow: 0; padding: 0; overflow-y: visible; - background-color: transparent !important; + background-color: transparent ; } } @@ -7843,7 +7773,7 @@ fieldset:disabled .btn { .offcanvas-lg { --offcanvas-height: auto; --offcanvas-border-width: 0; - background-color: transparent !important; + background-color: transparent ; } .offcanvas-lg .offcanvas-header { @@ -7859,7 +7789,7 @@ fieldset:disabled .btn { flex-grow: 0; padding: 0; overflow-y: visible; - background-color: transparent !important; + background-color: transparent ; } } @@ -7966,7 +7896,7 @@ fieldset:disabled .btn { .offcanvas-xl { --offcanvas-height: auto; --offcanvas-border-width: 0; - background-color: transparent !important; + background-color: transparent ; } .offcanvas-xl .offcanvas-header { @@ -7982,7 +7912,7 @@ fieldset:disabled .btn { flex-grow: 0; padding: 0; overflow-y: visible; - background-color: transparent !important; + background-color: transparent ; } } @@ -8089,7 +8019,7 @@ fieldset:disabled .btn { .offcanvas-xxl { --offcanvas-height: auto; --offcanvas-border-width: 0; - background-color: transparent !important; + background-color: transparent ; } .offcanvas-xxl .offcanvas-header { @@ -8105,7 +8035,7 @@ fieldset:disabled .btn { flex-grow: 0; padding: 0; overflow-y: visible; - background-color: transparent !important; + background-color: transparent ; } } @@ -8316,115 +8246,116 @@ fieldset:disabled .btn { } .text-bg-primary { - color: hsl(0, 0%, 100%) !important; - background-color: RGBA(1, 1, 86, var(--bg-opacity, 1)) !important; + color: var(--body-color); + background-color: var(--primary); } + .text-bg-secondary { - color: hsl(0, 0%, 100%) !important; - background-color: RGBA(109, 117, 126, var(--bg-opacity, 1)) !important; + color: var(--body-color) ; + background-color: RGBA(109, 117, 126, var(--bg-opacity, 1)) ; } .text-bg-success { - color: hsl(0, 0%, 100%) !important; - background-color: RGBA(68, 131, 68, var(--bg-opacity, 1)) !important; + color: var(--body-color) ; + background-color: RGBA(68, 131, 68, var(--bg-opacity, 1)) ; } .text-bg-info { - color: hsl(0, 0%, 100%) !important; - background-color: RGBA(48, 99, 141, var(--bg-opacity, 1)) !important; + color: var(--body-color) ; + background-color: RGBA(48, 99, 141, var(--bg-opacity, 1)) ; } .text-bg-warning { - color: hsl(0, 0%, 100%) !important; - background-color: RGBA(173, 98, 0, var(--bg-opacity, 1)) !important; + color: var(--body-color) ; + background-color: RGBA(173, 98, 0, var(--bg-opacity, 1)) ; } .text-bg-danger { - color: hsl(0, 0%, 100%) !important; - background-color: RGBA(165, 31, 24, var(--bg-opacity, 1)) !important; + color: var(--body-color) ; + background-color: RGBA(165, 31, 24, var(--bg-opacity, 1)) ; } .text-bg-light { - color: hsl(0, 0%, 0%) !important; - background-color: RGBA(249, 250, 251, var(--bg-opacity, 1)) !important; + color: hsl(0, 0%, 0%) ; + background-color: RGBA(249, 250, 251, var(--bg-opacity, 1)) ; } .text-bg-dark { - color: hsl(0, 0%, 100%) !important; - background-color: RGBA(53, 59, 65, var(--bg-opacity, 1)) !important; + color: var(--body-color) ; + background-color: RGBA(53, 59, 65, var(--bg-opacity, 1)) ; } .link-primary { - color: hsl(240, 98%, 17%) !important; + color: hsl(240, 98%, 17%) ; } .link-primary:active, .link-primary:focus { - color: #010145 !important; + color: #010145 ; } .link-secondary { - color: hsl(210, 7%, 46%) !important; + color: hsl(210, 7%, 46%) ; } .link-secondary:active, .link-secondary:focus { - color: #575e65 !important; + color: #575e65 ; } .link-success { - color: hsl(120, 32%, 39%) !important; + color: hsl(120, 32%, 39%) ; } .link-success:active, .link-success:focus { - color: #366936 !important; + color: #366936 ; } .link-info { - color: hsl(207, 49%, 37%) !important; + color: hsl(207, 49%, 37%) ; } .link-info:active, .link-info:focus { - color: #264f71 !important; + color: #264f71 ; } .link-warning { - color: hsl(34, 100%, 34%) !important; + color: hsl(34, 100%, 34%) ; } .link-warning:active, .link-warning:focus { - color: #8a4e00 !important; + color: #8a4e00 ; } .link-danger { - color: hsl(3, 75%, 37%) !important; + color: hsl(3, 75%, 37%) ; } .link-danger:active, .link-danger:focus { - color: #841913 !important; + color: #841913 ; } .link-light { - color: hsl(210, 17%, 98%) !important; + color: hsl(210, 17%, 98%) ; } .link-light:active, .link-light:focus { - color: #fafbfc !important; + color: #fafbfc ; } .link-dark { - color: hsl(210, 10%, 23%) !important; + color: hsl(210, 10%, 23%) ; } .link-dark:active, .link-dark:focus { - color: #2a2f34 !important; + color: #2a2f34 ; } .ratio { @@ -8479,7 +8410,7 @@ fieldset:disabled .btn { } .sticky-top { - position: sticky !important; + position: sticky ; top: 0; z-index: 1020; } @@ -8593,15 +8524,15 @@ fieldset:disabled .btn { .visually-hidden, .sr-only, .visually-hidden-focusable:not(:focus):not(:focus-within) { - position: absolute !important; - width: 1px !important; - height: 1px !important; - padding: 0 !important; - margin: -1px !important; - overflow: hidden !important; - clip: rect(0, 0, 0, 0) !important; - white-space: nowrap !important; - border: 0 !important; + position: absolute ; + width: 1px ; + height: 1px ; + padding: 0 ; + margin: -1px ; + overflow: hidden ; + clip: rect(0, 0, 0, 0) ; + white-space: nowrap ; + border: 0 ; } .stretched-link::after { @@ -8632,307 +8563,307 @@ fieldset:disabled .btn { } .align-baseline { - vertical-align: baseline !important; + vertical-align: baseline ; } .align-top { - vertical-align: top !important; + vertical-align: top ; } .align-middle { - vertical-align: middle !important; + vertical-align: middle ; } .align-bottom { - vertical-align: bottom !important; + vertical-align: bottom ; } .align-text-bottom { - vertical-align: text-bottom !important; + vertical-align: text-bottom ; } .align-text-top { - vertical-align: text-top !important; + vertical-align: text-top ; } .float-start { - float: left !important; + float: left ; } .float-end { - float: right !important; + float: right ; } .float-none { - float: none !important; + float: none ; } .opacity-0 { - opacity: 0 !important; + opacity: 0 ; } .opacity-25 { - opacity: 0.25 !important; + opacity: 0.25 ; } .opacity-50 { - opacity: 0.5 !important; + opacity: 0.5 ; } .opacity-75 { - opacity: 0.75 !important; + opacity: 0.75 ; } .opacity-100 { - opacity: 1 !important; + opacity: 1 ; } .overflow-auto { - overflow: auto !important; + overflow: auto ; } .overflow-hidden { - overflow: hidden !important; + overflow: hidden ; } .overflow-visible { - overflow: visible !important; + overflow: visible ; } .overflow-scroll { - overflow: scroll !important; + overflow: scroll ; } .d-inline { - display: inline !important; + display: inline ; } .d-inline-block { - display: inline-block !important; + display: inline-block ; } .d-block { - display: block !important; + display: block ; } .d-grid { - display: grid !important; + display: grid ; } .d-table { - display: table !important; + display: table ; } .d-table-row { - display: table-row !important; + display: table-row ; } .d-table-cell { - display: table-cell !important; + display: table-cell ; } .d-flex { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; } .d-inline-flex { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; - display: inline-flex !important; + display: -webkit-inline-box ; + display: -ms-inline-flexbox ; + display: inline-flex ; } .d-none { - display: none !important; + display: none ; } .shadow { - -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important; - box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important; + -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) ; + box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) ; } .shadow-sm { - -webkit-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important; - box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important; + -webkit-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) ; + box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) ; } .shadow-lg { - -webkit-box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important; - box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important; + -webkit-box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) ; + box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) ; } .shadow-none { - -webkit-box-shadow: none !important; - box-shadow: none !important; + -webkit-box-shadow: none ; + box-shadow: none ; } .position-static { - position: static !important; + position: static ; } .position-relative { - position: relative !important; + position: relative ; } .position-absolute { - position: absolute !important; + position: absolute ; } .position-fixed { - position: fixed !important; + position: fixed ; } .position-sticky { - position: sticky !important; + position: sticky ; } .top-0 { - top: 0 !important; + top: 0 ; } .top-50 { - top: 50% !important; + top: 50% ; } .top-100 { - top: 100% !important; + top: 100% ; } .bottom-0 { - bottom: 0 !important; + bottom: 0 ; } .bottom-50 { - bottom: 50% !important; + bottom: 50% ; } .bottom-100 { - bottom: 100% !important; + bottom: 100% ; } .start-0 { - left: 0 !important; + left: 0 ; } .start-50 { - left: 50% !important; + left: 50% ; } .start-100 { - left: 100% !important; + left: 100% ; } .end-0 { - right: 0 !important; + right: 0 ; } .end-50 { - right: 50% !important; + right: 50% ; } .end-100 { - right: 100% !important; + right: 100% ; } .translate-middle { - -webkit-transform: translate(-50%, -50%) !important; - transform: translate(-50%, -50%) !important; + -webkit-transform: translate(-50%, -50%) ; + transform: translate(-50%, -50%) ; } .translate-middle-x { - -webkit-transform: translateX(-50%) !important; - transform: translateX(-50%) !important; + -webkit-transform: translateX(-50%) ; + transform: translateX(-50%) ; } .translate-middle-y { - -webkit-transform: translateY(-50%) !important; - transform: translateY(-50%) !important; + -webkit-transform: translateY(-50%) ; + transform: translateY(-50%) ; } .border { - border: var(--border-width) var(--border-style) var(--border-color) !important; + border: var(--border-width) var(--border-style) var(--border-color) ; } .border-0 { - border: 0 !important; + border: 0 ; } .border-top { - border-top: var(--border-width) var(--border-style) var(--border-color) !important; + border-top: var(--border-width) var(--border-style) var(--border-color) ; } .border-top-0 { - border-top: 0 !important; + border-top: 0 ; } .border-end { - border-right: var(--border-width) var(--border-style) var(--border-color) !important; + border-right: var(--border-width) var(--border-style) var(--border-color) ; } .border-end-0 { - border-right: 0 !important; + border-right: 0 ; } .border-bottom { - border-bottom: var(--border-width) var(--border-style) var(--border-color) !important; + border-bottom: var(--border-width) var(--border-style) var(--border-color) ; } .border-bottom-0 { - border-bottom: 0 !important; + border-bottom: 0 ; } .border-start { - border-left: var(--border-width) var(--border-style) var(--border-color) !important; + border-left: var(--border-width) var(--border-style) var(--border-color) ; } .border-start-0 { - border-left: 0 !important; + border-left: 0 ; } .border-primary { --border-opacity: 1; - border-color: rgba(var(--primary-rgb), var(--border-opacity)) !important; + border-color: rgba(var(--primary-rgb), var(--border-opacity)) ; } .border-secondary { --border-opacity: 1; - border-color: rgba(var(--secondary-rgb), var(--border-opacity)) !important; + border-color: rgba(var(--secondary-rgb), var(--border-opacity)) ; } .border-success { --border-opacity: 1; - border-color: rgba(var(--success-rgb), var(--border-opacity)) !important; + border-color: rgba(var(--success-rgb), var(--border-opacity)) ; } .border-info { --border-opacity: 1; - border-color: rgba(var(--info-rgb), var(--border-opacity)) !important; + border-color: rgba(var(--info-rgb), var(--border-opacity)) ; } .border-warning { --border-opacity: 1; - border-color: rgba(var(--warning-rgb), var(--border-opacity)) !important; + border-color: rgba(var(--warning-rgb), var(--border-opacity)) ; } .border-danger { --border-opacity: 1; - border-color: rgba(var(--danger-rgb), var(--border-opacity)) !important; + border-color: rgba(var(--danger-rgb), var(--border-opacity)) ; } .border-light { --border-opacity: 1; - border-color: rgba(var(--light-rgb), var(--border-opacity)) !important; + border-color: rgba(var(--light-rgb), var(--border-opacity)) ; } .border-dark { --border-opacity: 1; - border-color: rgba(var(--dark-rgb), var(--border-opacity)) !important; + border-color: rgba(var(--dark-rgb), var(--border-opacity)) ; } .border-white { --border-opacity: 1; - border-color: rgba(var(--white-rgb), var(--border-opacity)) !important; + border-color: rgba(var(--white-rgb), var(--border-opacity)) ; } .border-1 { @@ -8976,928 +8907,928 @@ fieldset:disabled .btn { } .w-25 { - width: 25% !important; + width: 25% ; } .w-50 { - width: 50% !important; + width: 50% ; } .w-75 { - width: 75% !important; + width: 75% ; } .w-100 { - width: 100% !important; + width: 100% ; } .w-auto { - width: auto !important; + width: auto ; } .mw-100 { - max-width: 100% !important; + max-width: 100% ; } .vw-100 { - width: 100vw !important; + width: 100vw ; } .min-vw-100 { - min-width: 100vw !important; + min-width: 100vw ; } .h-25 { - height: 25% !important; + height: 25% ; } .h-50 { - height: 50% !important; + height: 50% ; } .h-75 { - height: 75% !important; + height: 75% ; } .h-100 { - height: 100% !important; + height: 100% ; } .h-auto { - height: auto !important; + height: auto ; } .mh-100 { - max-height: 100% !important; + max-height: 100% ; } .vh-100 { - height: 100vh !important; + height: 100vh ; } .min-vh-100 { - min-height: 100vh !important; + min-height: 100vh ; } .flex-fill { - -webkit-box-flex: 1 !important; - -ms-flex: 1 1 auto !important; - flex: 1 1 auto !important; + -webkit-box-flex: 1 ; + -ms-flex: 1 1 auto ; + flex: 1 1 auto ; } .flex-row { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: row !important; - flex-direction: row !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: normal ; + -ms-flex-direction: row ; + flex-direction: row ; } .flex-column { - -webkit-box-orient: vertical !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: column !important; - flex-direction: column !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: normal ; + -ms-flex-direction: column ; + flex-direction: column ; } .flex-row-reverse { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: row-reverse !important; - flex-direction: row-reverse !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: reverse ; + -ms-flex-direction: row-reverse ; + flex-direction: row-reverse ; } .flex-column-reverse { - -webkit-box-orient: vertical !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: column-reverse !important; - flex-direction: column-reverse !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: reverse ; + -ms-flex-direction: column-reverse ; + flex-direction: column-reverse ; } .flex-grow-0 { - -webkit-box-flex: 0 !important; - -ms-flex-positive: 0 !important; - flex-grow: 0 !important; + -webkit-box-flex: 0 ; + -ms-flex-positive: 0 ; + flex-grow: 0 ; } .flex-grow-1 { - -webkit-box-flex: 1 !important; - -ms-flex-positive: 1 !important; - flex-grow: 1 !important; + -webkit-box-flex: 1 ; + -ms-flex-positive: 1 ; + flex-grow: 1 ; } .flex-shrink-0 { - -ms-flex-negative: 0 !important; - flex-shrink: 0 !important; + -ms-flex-negative: 0 ; + flex-shrink: 0 ; } .flex-shrink-1 { - -ms-flex-negative: 1 !important; - flex-shrink: 1 !important; + -ms-flex-negative: 1 ; + flex-shrink: 1 ; } .flex-wrap { - -ms-flex-wrap: wrap !important; - flex-wrap: wrap !important; + -ms-flex-wrap: wrap ; + flex-wrap: wrap ; } .flex-nowrap { - -ms-flex-wrap: nowrap !important; - flex-wrap: nowrap !important; + -ms-flex-wrap: nowrap ; + flex-wrap: nowrap ; } .flex-wrap-reverse { - -ms-flex-wrap: wrap-reverse !important; - flex-wrap: wrap-reverse !important; + -ms-flex-wrap: wrap-reverse ; + flex-wrap: wrap-reverse ; } .justify-content-start { - -webkit-box-pack: start !important; - -ms-flex-pack: start !important; - justify-content: flex-start !important; + -webkit-box-pack: start ; + -ms-flex-pack: start ; + justify-content: flex-start ; } .justify-content-end { - -webkit-box-pack: end !important; - -ms-flex-pack: end !important; - justify-content: flex-end !important; + -webkit-box-pack: end ; + -ms-flex-pack: end ; + justify-content: flex-end ; } .justify-content-center { - -webkit-box-pack: center !important; - -ms-flex-pack: center !important; - justify-content: center !important; + -webkit-box-pack: center ; + -ms-flex-pack: center ; + justify-content: center ; } .justify-content-between { - -webkit-box-pack: justify !important; - -ms-flex-pack: justify !important; - justify-content: space-between !important; + -webkit-box-pack: justify ; + -ms-flex-pack: justify ; + justify-content: space-between ; } .justify-content-around { - -ms-flex-pack: distribute !important; - justify-content: space-around !important; + -ms-flex-pack: distribute ; + justify-content: space-around ; } .justify-content-evenly { - -webkit-box-pack: space-evenly !important; - -ms-flex-pack: space-evenly !important; - justify-content: space-evenly !important; + -webkit-box-pack: space-evenly ; + -ms-flex-pack: space-evenly ; + justify-content: space-evenly ; } .align-items-start { - -webkit-box-align: start !important; - -ms-flex-align: start !important; - align-items: flex-start !important; + -webkit-box-align: start ; + -ms-flex-align: start ; + align-items: flex-start ; } .align-items-end { - -webkit-box-align: end !important; - -ms-flex-align: end !important; - align-items: flex-end !important; + -webkit-box-align: end ; + -ms-flex-align: end ; + align-items: flex-end ; } .align-items-center { - -webkit-box-align: center !important; - -ms-flex-align: center !important; - align-items: center !important; + -webkit-box-align: center ; + -ms-flex-align: center ; + align-items: center ; } .align-items-baseline { - -webkit-box-align: baseline !important; - -ms-flex-align: baseline !important; - align-items: baseline !important; + -webkit-box-align: baseline ; + -ms-flex-align: baseline ; + align-items: baseline ; } .align-items-stretch { - -webkit-box-align: stretch !important; - -ms-flex-align: stretch !important; - align-items: stretch !important; + -webkit-box-align: stretch ; + -ms-flex-align: stretch ; + align-items: stretch ; } .align-content-start { - -ms-flex-line-pack: start !important; - align-content: flex-start !important; + -ms-flex-line-pack: start ; + align-content: flex-start ; } .align-content-end { - -ms-flex-line-pack: end !important; - align-content: flex-end !important; + -ms-flex-line-pack: end ; + align-content: flex-end ; } .align-content-center { - -ms-flex-line-pack: center !important; - align-content: center !important; + -ms-flex-line-pack: center ; + align-content: center ; } .align-content-between { - -ms-flex-line-pack: justify !important; - align-content: space-between !important; + -ms-flex-line-pack: justify ; + align-content: space-between ; } .align-content-around { - -ms-flex-line-pack: distribute !important; - align-content: space-around !important; + -ms-flex-line-pack: distribute ; + align-content: space-around ; } .align-content-stretch { - -ms-flex-line-pack: stretch !important; - align-content: stretch !important; + -ms-flex-line-pack: stretch ; + align-content: stretch ; } .align-self-auto { - -ms-flex-item-align: auto !important; - align-self: auto !important; + -ms-flex-item-align: auto ; + align-self: auto ; } .align-self-start { - -ms-flex-item-align: start !important; - align-self: flex-start !important; + -ms-flex-item-align: start ; + align-self: flex-start ; } .align-self-end { - -ms-flex-item-align: end !important; - align-self: flex-end !important; + -ms-flex-item-align: end ; + align-self: flex-end ; } .align-self-center { - -ms-flex-item-align: center !important; - align-self: center !important; + -ms-flex-item-align: center ; + align-self: center ; } .align-self-baseline { - -ms-flex-item-align: baseline !important; - align-self: baseline !important; + -ms-flex-item-align: baseline ; + align-self: baseline ; } .align-self-stretch { - -ms-flex-item-align: stretch !important; - align-self: stretch !important; + -ms-flex-item-align: stretch ; + align-self: stretch ; } .order-first { - -webkit-box-ordinal-group: 0 !important; - -ms-flex-order: -1 !important; - order: -1 !important; + -webkit-box-ordinal-group: 0 ; + -ms-flex-order: -1 ; + order: -1 ; } .order-0 { - -webkit-box-ordinal-group: 1 !important; - -ms-flex-order: 0 !important; - order: 0 !important; + -webkit-box-ordinal-group: 1 ; + -ms-flex-order: 0 ; + order: 0 ; } .order-1 { - -webkit-box-ordinal-group: 2 !important; - -ms-flex-order: 1 !important; - order: 1 !important; + -webkit-box-ordinal-group: 2 ; + -ms-flex-order: 1 ; + order: 1 ; } .order-2 { - -webkit-box-ordinal-group: 3 !important; - -ms-flex-order: 2 !important; - order: 2 !important; + -webkit-box-ordinal-group: 3 ; + -ms-flex-order: 2 ; + order: 2 ; } .order-3 { - -webkit-box-ordinal-group: 4 !important; - -ms-flex-order: 3 !important; - order: 3 !important; + -webkit-box-ordinal-group: 4 ; + -ms-flex-order: 3 ; + order: 3 ; } .order-4 { - -webkit-box-ordinal-group: 5 !important; - -ms-flex-order: 4 !important; - order: 4 !important; + -webkit-box-ordinal-group: 5 ; + -ms-flex-order: 4 ; + order: 4 ; } .order-5 { - -webkit-box-ordinal-group: 6 !important; - -ms-flex-order: 5 !important; - order: 5 !important; + -webkit-box-ordinal-group: 6 ; + -ms-flex-order: 5 ; + order: 5 ; } .order-last { - -webkit-box-ordinal-group: 7 !important; - -ms-flex-order: 6 !important; - order: 6 !important; + -webkit-box-ordinal-group: 7 ; + -ms-flex-order: 6 ; + order: 6 ; } .m-0 { - margin: 0 !important; + margin: 0 ; } .m-1 { - margin: 0.25rem !important; + margin: 0.25rem ; } .m-2 { - margin: 0.5rem !important; + margin: 0.5rem ; } .m-3 { - margin: 1rem !important; + margin: 1rem ; } .m-4 { - margin: 1.5rem !important; + margin: 1.5rem ; } .m-5 { - margin: 3rem !important; + margin: 3rem ; } .m-auto { - margin: auto !important; + margin: auto ; } .mx-0 { - margin-right: 0 !important; - margin-left: 0 !important; + margin-right: 0 ; + margin-left: 0 ; } .mx-1 { - margin-right: 0.25rem !important; - margin-left: 0.25rem !important; + margin-right: 0.25rem ; + margin-left: 0.25rem ; } .mx-2 { - margin-right: 0.5rem !important; - margin-left: 0.5rem !important; + margin-right: 0.5rem ; + margin-left: 0.5rem ; } .mx-3 { - margin-right: 1rem !important; - margin-left: 1rem !important; + margin-right: 1rem ; + margin-left: 1rem ; } .mx-4 { - margin-right: 1.5rem !important; - margin-left: 1.5rem !important; + margin-right: 1.5rem ; + margin-left: 1.5rem ; } .mx-5 { - margin-right: 3rem !important; - margin-left: 3rem !important; + margin-right: 3rem ; + margin-left: 3rem ; } .mx-auto { - margin-right: auto !important; - margin-left: auto !important; + margin-right: auto ; + margin-left: auto ; } .my-0 { - margin-top: 0 !important; - margin-bottom: 0 !important; + margin-top: 0 ; + margin-bottom: 0 ; } .my-1 { - margin-top: 0.25rem !important; - margin-bottom: 0.25rem !important; + margin-top: 0.25rem ; + margin-bottom: 0.25rem ; } .my-2 { - margin-top: 0.5rem !important; - margin-bottom: 0.5rem !important; + margin-top: 0.5rem ; + margin-bottom: 0.5rem ; } .my-3 { - margin-top: 1rem !important; - margin-bottom: 1rem !important; + margin-top: 1rem ; + margin-bottom: 1rem ; } .my-4 { - margin-top: 1.5rem !important; - margin-bottom: 1.5rem !important; + margin-top: 1.5rem ; + margin-bottom: 1.5rem ; } .my-5 { - margin-top: 3rem !important; - margin-bottom: 3rem !important; + margin-top: 3rem ; + margin-bottom: 3rem ; } .my-auto { - margin-top: auto !important; - margin-bottom: auto !important; + margin-top: auto ; + margin-bottom: auto ; } .mt-0 { - margin-top: 0 !important; + margin-top: 0 ; } .mt-1 { - margin-top: 0.25rem !important; + margin-top: 0.25rem ; } .mt-2 { - margin-top: 0.5rem !important; + margin-top: 0.5rem ; } .mt-3 { - margin-top: 1rem !important; + margin-top: 1rem ; } .mt-4 { - margin-top: 1.5rem !important; + margin-top: 1.5rem ; } .mt-5 { - margin-top: 3rem !important; + margin-top: 3rem ; } .mt-auto { - margin-top: auto !important; + margin-top: auto ; } .me-0 { - margin-right: 0 !important; + margin-right: 0 ; } .me-1 { - margin-right: 0.25rem !important; + margin-right: 0.25rem ; } .me-2 { - margin-right: 0.5rem !important; + margin-right: 0.5rem ; } .me-3 { - margin-right: 1rem !important; + margin-right: 1rem ; } .me-4 { - margin-right: 1.5rem !important; + margin-right: 1.5rem ; } .me-5 { - margin-right: 3rem !important; + margin-right: 3rem ; } .me-auto { - margin-right: auto !important; + margin-right: auto ; } .mb-0 { - margin-bottom: 0 !important; + margin-bottom: 0 ; } .mb-1 { - margin-bottom: 0.25rem !important; + margin-bottom: 0.25rem ; } .mb-2 { - margin-bottom: 0.5rem !important; + margin-bottom: 0.5rem ; } .mb-3, .form-group { - margin-bottom: 1rem !important; + margin-bottom: 1rem ; } .mb-4 { - margin-bottom: 1.5rem !important; + margin-bottom: 1.5rem ; } .mb-5 { - margin-bottom: 3rem !important; + margin-bottom: 3rem ; } .mb-auto { - margin-bottom: auto !important; + margin-bottom: auto ; } .ms-0 { - margin-left: 0 !important; + margin-left: 0 ; } .ms-1 { - margin-left: 0.25rem !important; + margin-left: 0.25rem ; } .ms-2 { - margin-left: 0.5rem !important; + margin-left: 0.5rem ; } .ms-3 { - margin-left: 1rem !important; + margin-left: 1rem ; } .ms-4 { - margin-left: 1.5rem !important; + margin-left: 1.5rem ; } .ms-5 { - margin-left: 3rem !important; + margin-left: 3rem ; } .ms-auto { - margin-left: auto !important; + margin-left: auto ; } .p-0 { - padding: 0 !important; + padding: 0 ; } .p-1 { - padding: 0.25rem !important; + padding: 0.25rem ; } .p-2 { - padding: 0.5rem !important; + padding: 0.5rem ; } .p-3 { - padding: 1rem !important; + padding: 1rem ; } .p-4 { - padding: 1.5rem !important; + padding: 1.5rem ; } .p-5 { - padding: 3rem !important; + padding: 3rem ; } .px-0 { - padding-right: 0 !important; - padding-left: 0 !important; + padding-right: 0 ; + padding-left: 0 ; } .px-1 { - padding-right: 0.25rem !important; - padding-left: 0.25rem !important; + padding-right: 0.25rem ; + padding-left: 0.25rem ; } .px-2 { - padding-right: 0.5rem !important; - padding-left: 0.5rem !important; + padding-right: 0.5rem ; + padding-left: 0.5rem ; } .px-3 { - padding-right: 1rem !important; - padding-left: 1rem !important; + padding-right: 1rem ; + padding-left: 1rem ; } .px-4 { - padding-right: 1.5rem !important; - padding-left: 1.5rem !important; + padding-right: 1.5rem ; + padding-left: 1.5rem ; } .px-5 { - padding-right: 3rem !important; - padding-left: 3rem !important; + padding-right: 3rem ; + padding-left: 3rem ; } .py-0 { - padding-top: 0 !important; - padding-bottom: 0 !important; + padding-top: 0 ; + padding-bottom: 0 ; } .py-1 { - padding-top: 0.25rem !important; - padding-bottom: 0.25rem !important; + padding-top: 0.25rem ; + padding-bottom: 0.25rem ; } .py-2 { - padding-top: 0.5rem !important; - padding-bottom: 0.5rem !important; + padding-top: 0.5rem ; + padding-bottom: 0.5rem ; } .py-3 { - padding-top: 1rem !important; - padding-bottom: 1rem !important; + padding-top: 1rem ; + padding-bottom: 1rem ; } .py-4 { - padding-top: 1.5rem !important; - padding-bottom: 1.5rem !important; + padding-top: 1.5rem ; + padding-bottom: 1.5rem ; } .py-5 { - padding-top: 3rem !important; - padding-bottom: 3rem !important; + padding-top: 3rem ; + padding-bottom: 3rem ; } .pt-0 { - padding-top: 0 !important; + padding-top: 0 ; } .pt-1 { - padding-top: 0.25rem !important; + padding-top: 0.25rem ; } .pt-2 { - padding-top: 0.5rem !important; + padding-top: 0.5rem ; } .pt-3 { - padding-top: 1rem !important; + padding-top: 1rem ; } .pt-4 { - padding-top: 1.5rem !important; + padding-top: 1.5rem ; } .pt-5 { - padding-top: 3rem !important; + padding-top: 3rem ; } .pe-0 { - padding-right: 0 !important; + padding-right: 0 ; } .pe-1 { - padding-right: 0.25rem !important; + padding-right: 0.25rem ; } .pe-2 { - padding-right: 0.5rem !important; + padding-right: 0.5rem ; } .pe-3 { - padding-right: 1rem !important; + padding-right: 1rem ; } .pe-4 { - padding-right: 1.5rem !important; + padding-right: 1.5rem ; } .pe-5 { - padding-right: 3rem !important; + padding-right: 3rem ; } .pb-0 { - padding-bottom: 0 !important; + padding-bottom: 0 ; } .pb-1 { - padding-bottom: 0.25rem !important; + padding-bottom: 0.25rem ; } .pb-2 { - padding-bottom: 0.5rem !important; + padding-bottom: 0.5rem ; } .pb-3 { - padding-bottom: 1rem !important; + padding-bottom: 1rem ; } .pb-4 { - padding-bottom: 1.5rem !important; + padding-bottom: 1.5rem ; } .pb-5 { - padding-bottom: 3rem !important; + padding-bottom: 3rem ; } .ps-0 { - padding-left: 0 !important; + padding-left: 0 ; } .ps-1 { - padding-left: 0.25rem !important; + padding-left: 0.25rem ; } .ps-2 { - padding-left: 0.5rem !important; + padding-left: 0.5rem ; } .ps-3 { - padding-left: 1rem !important; + padding-left: 1rem ; } .ps-4 { - padding-left: 1.5rem !important; + padding-left: 1.5rem ; } .ps-5 { - padding-left: 3rem !important; + padding-left: 3rem ; } .gap-0 { - gap: 0 !important; + gap: 0 ; } .gap-1 { - gap: 0.25rem !important; + gap: 0.25rem ; } .gap-2 { - gap: 0.5rem !important; + gap: 0.5rem ; } .gap-3 { - gap: 1rem !important; + gap: 1rem ; } .gap-4 { - gap: 1.5rem !important; + gap: 1.5rem ; } .gap-5 { - gap: 3rem !important; + gap: 3rem ; } .font-monospace { - font-family: var(--font-monospace) !important; + font-family: var(--font-monospace) ; } .fs-1 { - font-size: calc(1.375rem + 1.5vw) !important; + font-size: calc(1.375rem + 1.5vw) ; } .fs-2 { - font-size: calc(1.325rem + 0.9vw) !important; + font-size: calc(1.325rem + 0.9vw) ; } .fs-3 { - font-size: calc(1.3rem + 0.6vw) !important; + font-size: calc(1.3rem + 0.6vw) ; } .fs-4 { - font-size: calc(1.275rem + 0.3vw) !important; + font-size: calc(1.275rem + 0.3vw) ; } .fs-5 { - font-size: 1.25rem !important; + font-size: 1.25rem ; } .fs-6 { - font-size: 1rem !important; + font-size: 1rem ; } .fst-italic { - font-style: italic !important; + font-style: italic ; } .fst-normal { - font-style: normal !important; + font-style: normal ; } .fw-light { - font-weight: 300 !important; + font-weight: 300 ; } .fw-lighter { - font-weight: lighter !important; + font-weight: lighter ; } .fw-normal { - font-weight: 400 !important; + font-weight: 400 ; } .fw-bold { - font-weight: 700 !important; + font-weight: 700 ; } .fw-semibold { - font-weight: 600 !important; + font-weight: 600 ; } .fw-bolder { - font-weight: bolder !important; + font-weight: bolder ; } .lh-1 { - line-height: 1 !important; + line-height: 1 ; } .lh-sm { - line-height: 1.25 !important; + line-height: 1.25 ; } .lh-base { - line-height: 1.5 !important; + line-height: 1.5 ; } .lh-lg { - line-height: 2 !important; + line-height: 2 ; } .text-start { - text-align: left !important; + text-align: left; } .text-end { - text-align: right !important; + text-align: right; } .text-center { - text-align: center !important; + text-align: center ; } .text-decoration-none { - text-decoration: none !important; + text-decoration: none ; } .text-decoration-underline { - text-decoration: underline !important; + text-decoration: underline ; } .text-decoration-line-through { - text-decoration: line-through !important; + text-decoration: line-through ; } .text-lowercase { - text-transform: lowercase !important; + text-transform: lowercase ; } .text-uppercase { - text-transform: uppercase !important; + text-transform: uppercase ; } .text-capitalize { - text-transform: capitalize !important; + text-transform: capitalize ; } .text-wrap { - white-space: normal !important; + white-space: normal ; } .text-nowrap { - white-space: nowrap !important; + white-space: nowrap ; } /* rtl:begin:remove */ .text-break { - word-wrap: break-word !important; - word-break: break-word !important; + word-wrap: break-word ; + word-break: break-word ; } /* rtl:end:remove */ .text-primary { --text-opacity: 1; - color: rgba(var(--primary-rgb), var(--text-opacity)) !important; + color: rgba(var(--primary-rgb), var(--text-opacity)) ; } .text-secondary { --text-opacity: 1; - color: rgba(var(--secondary-rgb), var(--text-opacity)) !important; + color: rgba(var(--secondary-rgb), var(--text-opacity)) ; } .text-success { --text-opacity: 1; - color: rgba(var(--success-rgb), var(--text-opacity)) !important; + color: rgba(var(--success-rgb), var(--text-opacity)) ; } .text-info { --text-opacity: 1; - color: rgba(var(--info-rgb), var(--text-opacity)) !important; + color: rgba(var(--info-rgb), var(--text-opacity)) ; } .text-warning { --text-opacity: 1; - color: rgba(var(--warning-rgb), var(--text-opacity)) !important; + color: rgba(var(--warning-rgb), var(--text-opacity)) ; } .text-danger { --text-opacity: 1; - color: rgba(var(--danger-rgb), var(--text-opacity)) !important; + color: rgba(var(--danger-rgb), var(--text-opacity)) ; } .text-light { --text-opacity: 1; - color: rgba(var(--light-rgb), var(--text-opacity)) !important; + color: rgba(var(--light-rgb), var(--text-opacity)) ; } .text-dark { --text-opacity: 1; - color: rgba(var(--dark-rgb), var(--text-opacity)) !important; + color: rgba(var(--dark-rgb), var(--text-opacity)) ; } .text-black { --text-opacity: 1; - color: rgba(var(--black-rgb), var(--text-opacity)) !important; + color: rgba(var(--black-rgb), var(--text-opacity)) ; } .text-white { --text-opacity: 1; - color: rgba(var(--white-rgb), var(--text-opacity)) !important; + color: rgba(var(--white-rgb), var(--text-opacity)) ; } .text-body { --text-opacity: 1; - color: rgba(var(--body-color-rgb), var(--text-opacity)) !important; + color: rgba(var(--body-color-rgb), var(--text-opacity)) ; } .text-muted { --text-opacity: 1; - color: hsl(210, 7%, 46%) !important; + color: hsl(210, 7%, 46%) ; } .text-black-50 { --text-opacity: 1; - color: rgba(0, 0, 0, 0.5) !important; + color: rgba(0, 0, 0, 0.5) ; } .text-white-50 { --text-opacity: 1; - color: rgba(255, 255, 255, 0.5) !important; + color: rgba(255, 255, 255, 0.5) ; } .text-reset { --text-opacity: 1; - color: inherit !important; + color: inherit ; } .text-opacity-25 { @@ -9918,62 +9849,62 @@ fieldset:disabled .btn { .bg-primary { --bg-opacity: 1; - background-color: rgba(var(--primary-rgb), var(--bg-opacity)) !important; + background-color: rgba(var(--primary-rgb), var(--bg-opacity)) ; } .bg-secondary { --bg-opacity: 1; - background-color: rgba(var(--secondary-rgb), var(--bg-opacity)) !important; + background-color: rgba(var(--secondary-rgb), var(--bg-opacity)) ; } .bg-success { --bg-opacity: 1; - background-color: rgba(var(--success-rgb), var(--bg-opacity)) !important; + background-color: rgba(var(--success-rgb), var(--bg-opacity)) ; } .bg-info { --bg-opacity: 1; - background-color: rgba(var(--info-rgb), var(--bg-opacity)) !important; + background-color: rgba(var(--info-rgb), var(--bg-opacity)) ; } .bg-warning { --bg-opacity: 1; - background-color: rgba(var(--warning-rgb), var(--bg-opacity)) !important; + background-color: rgba(var(--warning-rgb), var(--bg-opacity)) ; } .bg-danger { --bg-opacity: 1; - background-color: rgba(var(--danger-rgb), var(--bg-opacity)) !important; + background-color: rgba(var(--danger-rgb), var(--bg-opacity)) ; } .bg-light { --bg-opacity: 1; - background-color: rgba(var(--light-rgb), var(--bg-opacity)) !important; + background-color: rgba(var(--light-rgb), var(--bg-opacity)) ; } .bg-dark { --bg-opacity: 1; - background-color: rgba(var(--dark-rgb), var(--bg-opacity)) !important; + background-color: rgba(var(--dark-rgb), var(--bg-opacity)) ; } .bg-black { --bg-opacity: 1; - background-color: rgba(var(--black-rgb), var(--bg-opacity)) !important; + background-color: rgba(var(--black-rgb), var(--bg-opacity)) ; } .bg-white { --bg-opacity: 1; - background-color: rgba(var(--white-rgb), var(--bg-opacity)) !important; + background-color: rgba(var(--white-rgb), var(--bg-opacity)) ; } .bg-body { --bg-opacity: 1; - background-color: rgba(var(--body-bg-rgb), var(--bg-opacity)) !important; + background-color: rgba(var(--body-bg-rgb), var(--bg-opacity)) ; } .bg-transparent { --bg-opacity: 1; - background-color: transparent !important; + background-color: transparent ; } .bg-opacity-10 { @@ -9997,3802 +9928,3802 @@ fieldset:disabled .btn { } .bg-gradient { - background-image: var(--gradient) !important; + background-image: var(--gradient) ; } .user-select-all { - -webkit-user-select: all !important; - -moz-user-select: all !important; - user-select: all !important; + -webkit-user-select: all ; + -moz-user-select: all ; + user-select: all ; } .user-select-auto { - -webkit-user-select: auto !important; - -moz-user-select: auto !important; - -ms-user-select: auto !important; - user-select: auto !important; + -webkit-user-select: auto ; + -moz-user-select: auto ; + -ms-user-select: auto ; + user-select: auto ; } .user-select-none { - -webkit-user-select: none !important; - -moz-user-select: none !important; - -ms-user-select: none !important; - user-select: none !important; + -webkit-user-select: none ; + -moz-user-select: none ; + -ms-user-select: none ; + user-select: none ; } .pe-none { - pointer-events: none !important; + pointer-events: none ; } .pe-auto { - pointer-events: auto !important; + pointer-events: auto ; } .rounded { - border-radius: var(--border-radius) !important; + border-radius: var(--border-radius) ; } .rounded-0 { - border-radius: 0 !important; + border-radius: 0 ; } .rounded-1 { - border-radius: var(--border-radius-sm) !important; + border-radius: var(--border-radius-sm) ; } .rounded-2 { - border-radius: var(--border-radius) !important; + border-radius: var(--border-radius) ; } .rounded-3 { - border-radius: var(--border-radius-lg) !important; + border-radius: var(--border-radius-lg) ; } .rounded-4 { - border-radius: var(--border-radius-xl) !important; + border-radius: var(--border-radius-xl) ; } .rounded-5 { - border-radius: var(--border-radius-2xl) !important; + border-radius: var(--border-radius-2xl) ; } .rounded-circle { - border-radius: 50% !important; + border-radius: 50% ; } .rounded-pill { - border-radius: var(--border-radius-pill) !important; + border-radius: var(--border-radius-pill) ; } .rounded-top { - border-top-left-radius: var(--border-radius) !important; - border-top-right-radius: var(--border-radius) !important; + border-top-left-radius: var(--border-radius) ; + border-top-right-radius: var(--border-radius) ; } .rounded-end { - border-top-right-radius: var(--border-radius) !important; - border-bottom-right-radius: var(--border-radius) !important; + border-top-right-radius: var(--border-radius) ; + border-bottom-right-radius: var(--border-radius) ; } .rounded-bottom { - border-bottom-right-radius: var(--border-radius) !important; - border-bottom-left-radius: var(--border-radius) !important; + border-bottom-right-radius: var(--border-radius) ; + border-bottom-left-radius: var(--border-radius) ; } .rounded-start { - border-bottom-left-radius: var(--border-radius) !important; - border-top-left-radius: var(--border-radius) !important; + border-bottom-left-radius: var(--border-radius) ; + border-top-left-radius: var(--border-radius) ; } .visible { - visibility: visible !important; + visibility: visible ; } .invisible { - visibility: hidden !important; + visibility: hidden ; } @media (min-width: 576px) { .float-sm-start { - float: left !important; + float: left ; } .float-sm-end { - float: right !important; + float: right ; } .float-sm-none { - float: none !important; + float: none ; } .d-sm-inline { - display: inline !important; + display: inline ; } .d-sm-inline-block { - display: inline-block !important; + display: inline-block ; } .d-sm-block { - display: block !important; + display: block ; } .d-sm-grid { - display: grid !important; + display: grid ; } .d-sm-table { - display: table !important; + display: table ; } .d-sm-table-row { - display: table-row !important; + display: table-row ; } .d-sm-table-cell { - display: table-cell !important; + display: table-cell ; } .d-sm-flex { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; } .d-sm-inline-flex { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; - display: inline-flex !important; + display: -webkit-inline-box ; + display: -ms-inline-flexbox ; + display: inline-flex ; } .d-sm-none { - display: none !important; + display: none ; } .flex-sm-fill { - -webkit-box-flex: 1 !important; - -ms-flex: 1 1 auto !important; - flex: 1 1 auto !important; + -webkit-box-flex: 1 ; + -ms-flex: 1 1 auto ; + flex: 1 1 auto ; } .flex-sm-row { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: row !important; - flex-direction: row !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: normal ; + -ms-flex-direction: row ; + flex-direction: row ; } .flex-sm-column { - -webkit-box-orient: vertical !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: column !important; - flex-direction: column !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: normal ; + -ms-flex-direction: column ; + flex-direction: column ; } .flex-sm-row-reverse { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: row-reverse !important; - flex-direction: row-reverse !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: reverse ; + -ms-flex-direction: row-reverse ; + flex-direction: row-reverse ; } .flex-sm-column-reverse { - -webkit-box-orient: vertical !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: column-reverse !important; - flex-direction: column-reverse !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: reverse ; + -ms-flex-direction: column-reverse ; + flex-direction: column-reverse ; } .flex-sm-grow-0 { - -webkit-box-flex: 0 !important; - -ms-flex-positive: 0 !important; - flex-grow: 0 !important; + -webkit-box-flex: 0 ; + -ms-flex-positive: 0 ; + flex-grow: 0 ; } .flex-sm-grow-1 { - -webkit-box-flex: 1 !important; - -ms-flex-positive: 1 !important; - flex-grow: 1 !important; + -webkit-box-flex: 1 ; + -ms-flex-positive: 1 ; + flex-grow: 1 ; } .flex-sm-shrink-0 { - -ms-flex-negative: 0 !important; - flex-shrink: 0 !important; + -ms-flex-negative: 0 ; + flex-shrink: 0 ; } .flex-sm-shrink-1 { - -ms-flex-negative: 1 !important; - flex-shrink: 1 !important; + -ms-flex-negative: 1 ; + flex-shrink: 1 ; } .flex-sm-wrap { - -ms-flex-wrap: wrap !important; - flex-wrap: wrap !important; + -ms-flex-wrap: wrap ; + flex-wrap: wrap ; } .flex-sm-nowrap { - -ms-flex-wrap: nowrap !important; - flex-wrap: nowrap !important; + -ms-flex-wrap: nowrap ; + flex-wrap: nowrap ; } .flex-sm-wrap-reverse { - -ms-flex-wrap: wrap-reverse !important; - flex-wrap: wrap-reverse !important; + -ms-flex-wrap: wrap-reverse ; + flex-wrap: wrap-reverse ; } .justify-content-sm-start { - -webkit-box-pack: start !important; - -ms-flex-pack: start !important; - justify-content: flex-start !important; + -webkit-box-pack: start ; + -ms-flex-pack: start ; + justify-content: flex-start ; } .justify-content-sm-end { - -webkit-box-pack: end !important; - -ms-flex-pack: end !important; - justify-content: flex-end !important; + -webkit-box-pack: end ; + -ms-flex-pack: end ; + justify-content: flex-end ; } .justify-content-sm-center { - -webkit-box-pack: center !important; - -ms-flex-pack: center !important; - justify-content: center !important; + -webkit-box-pack: center ; + -ms-flex-pack: center ; + justify-content: center ; } .justify-content-sm-between { - -webkit-box-pack: justify !important; - -ms-flex-pack: justify !important; - justify-content: space-between !important; + -webkit-box-pack: justify ; + -ms-flex-pack: justify ; + justify-content: space-between ; } .justify-content-sm-around { - -ms-flex-pack: distribute !important; - justify-content: space-around !important; + -ms-flex-pack: distribute ; + justify-content: space-around ; } .justify-content-sm-evenly { - -webkit-box-pack: space-evenly !important; - -ms-flex-pack: space-evenly !important; - justify-content: space-evenly !important; + -webkit-box-pack: space-evenly ; + -ms-flex-pack: space-evenly ; + justify-content: space-evenly ; } .align-items-sm-start { - -webkit-box-align: start !important; - -ms-flex-align: start !important; - align-items: flex-start !important; + -webkit-box-align: start ; + -ms-flex-align: start ; + align-items: flex-start ; } .align-items-sm-end { - -webkit-box-align: end !important; - -ms-flex-align: end !important; - align-items: flex-end !important; + -webkit-box-align: end ; + -ms-flex-align: end ; + align-items: flex-end ; } .align-items-sm-center { - -webkit-box-align: center !important; - -ms-flex-align: center !important; - align-items: center !important; + -webkit-box-align: center ; + -ms-flex-align: center ; + align-items: center ; } .align-items-sm-baseline { - -webkit-box-align: baseline !important; - -ms-flex-align: baseline !important; - align-items: baseline !important; + -webkit-box-align: baseline ; + -ms-flex-align: baseline ; + align-items: baseline ; } .align-items-sm-stretch { - -webkit-box-align: stretch !important; - -ms-flex-align: stretch !important; - align-items: stretch !important; + -webkit-box-align: stretch ; + -ms-flex-align: stretch ; + align-items: stretch ; } .align-content-sm-start { - -ms-flex-line-pack: start !important; - align-content: flex-start !important; + -ms-flex-line-pack: start ; + align-content: flex-start ; } .align-content-sm-end { - -ms-flex-line-pack: end !important; - align-content: flex-end !important; + -ms-flex-line-pack: end ; + align-content: flex-end ; } .align-content-sm-center { - -ms-flex-line-pack: center !important; - align-content: center !important; + -ms-flex-line-pack: center ; + align-content: center ; } .align-content-sm-between { - -ms-flex-line-pack: justify !important; - align-content: space-between !important; + -ms-flex-line-pack: justify ; + align-content: space-between ; } .align-content-sm-around { - -ms-flex-line-pack: distribute !important; - align-content: space-around !important; + -ms-flex-line-pack: distribute ; + align-content: space-around ; } .align-content-sm-stretch { - -ms-flex-line-pack: stretch !important; - align-content: stretch !important; + -ms-flex-line-pack: stretch ; + align-content: stretch ; } .align-self-sm-auto { - -ms-flex-item-align: auto !important; - align-self: auto !important; + -ms-flex-item-align: auto ; + align-self: auto ; } .align-self-sm-start { - -ms-flex-item-align: start !important; - align-self: flex-start !important; + -ms-flex-item-align: start ; + align-self: flex-start ; } .align-self-sm-end { - -ms-flex-item-align: end !important; - align-self: flex-end !important; + -ms-flex-item-align: end ; + align-self: flex-end ; } .align-self-sm-center { - -ms-flex-item-align: center !important; - align-self: center !important; + -ms-flex-item-align: center ; + align-self: center ; } .align-self-sm-baseline { - -ms-flex-item-align: baseline !important; - align-self: baseline !important; + -ms-flex-item-align: baseline ; + align-self: baseline ; } .align-self-sm-stretch { - -ms-flex-item-align: stretch !important; - align-self: stretch !important; + -ms-flex-item-align: stretch ; + align-self: stretch ; } .order-sm-first { - -webkit-box-ordinal-group: 0 !important; - -ms-flex-order: -1 !important; - order: -1 !important; + -webkit-box-ordinal-group: 0 ; + -ms-flex-order: -1 ; + order: -1 ; } .order-sm-0 { - -webkit-box-ordinal-group: 1 !important; - -ms-flex-order: 0 !important; - order: 0 !important; + -webkit-box-ordinal-group: 1 ; + -ms-flex-order: 0 ; + order: 0 ; } .order-sm-1 { - -webkit-box-ordinal-group: 2 !important; - -ms-flex-order: 1 !important; - order: 1 !important; + -webkit-box-ordinal-group: 2 ; + -ms-flex-order: 1 ; + order: 1 ; } .order-sm-2 { - -webkit-box-ordinal-group: 3 !important; - -ms-flex-order: 2 !important; - order: 2 !important; + -webkit-box-ordinal-group: 3 ; + -ms-flex-order: 2 ; + order: 2 ; } .order-sm-3 { - -webkit-box-ordinal-group: 4 !important; - -ms-flex-order: 3 !important; - order: 3 !important; + -webkit-box-ordinal-group: 4 ; + -ms-flex-order: 3 ; + order: 3 ; } .order-sm-4 { - -webkit-box-ordinal-group: 5 !important; - -ms-flex-order: 4 !important; - order: 4 !important; + -webkit-box-ordinal-group: 5 ; + -ms-flex-order: 4 ; + order: 4 ; } .order-sm-5 { - -webkit-box-ordinal-group: 6 !important; - -ms-flex-order: 5 !important; - order: 5 !important; + -webkit-box-ordinal-group: 6 ; + -ms-flex-order: 5 ; + order: 5 ; } .order-sm-last { - -webkit-box-ordinal-group: 7 !important; - -ms-flex-order: 6 !important; - order: 6 !important; + -webkit-box-ordinal-group: 7 ; + -ms-flex-order: 6 ; + order: 6 ; } .m-sm-0 { - margin: 0 !important; + margin: 0 ; } .m-sm-1 { - margin: 0.25rem !important; + margin: 0.25rem ; } .m-sm-2 { - margin: 0.5rem !important; + margin: 0.5rem ; } .m-sm-3 { - margin: 1rem !important; + margin: 1rem ; } .m-sm-4 { - margin: 1.5rem !important; + margin: 1.5rem ; } .m-sm-5 { - margin: 3rem !important; + margin: 3rem ; } .m-sm-auto { - margin: auto !important; + margin: auto ; } .mx-sm-0 { - margin-right: 0 !important; - margin-left: 0 !important; + margin-right: 0 ; + margin-left: 0 ; } .mx-sm-1 { - margin-right: 0.25rem !important; - margin-left: 0.25rem !important; + margin-right: 0.25rem ; + margin-left: 0.25rem ; } .mx-sm-2 { - margin-right: 0.5rem !important; - margin-left: 0.5rem !important; + margin-right: 0.5rem ; + margin-left: 0.5rem ; } .mx-sm-3 { - margin-right: 1rem !important; - margin-left: 1rem !important; + margin-right: 1rem ; + margin-left: 1rem ; } .mx-sm-4 { - margin-right: 1.5rem !important; - margin-left: 1.5rem !important; + margin-right: 1.5rem ; + margin-left: 1.5rem ; } .mx-sm-5 { - margin-right: 3rem !important; - margin-left: 3rem !important; + margin-right: 3rem ; + margin-left: 3rem ; } .mx-sm-auto { - margin-right: auto !important; - margin-left: auto !important; + margin-right: auto ; + margin-left: auto ; } .my-sm-0 { - margin-top: 0 !important; - margin-bottom: 0 !important; + margin-top: 0 ; + margin-bottom: 0 ; } .my-sm-1 { - margin-top: 0.25rem !important; - margin-bottom: 0.25rem !important; + margin-top: 0.25rem ; + margin-bottom: 0.25rem ; } .my-sm-2 { - margin-top: 0.5rem !important; - margin-bottom: 0.5rem !important; + margin-top: 0.5rem ; + margin-bottom: 0.5rem ; } .my-sm-3 { - margin-top: 1rem !important; - margin-bottom: 1rem !important; + margin-top: 1rem ; + margin-bottom: 1rem ; } .my-sm-4 { - margin-top: 1.5rem !important; - margin-bottom: 1.5rem !important; + margin-top: 1.5rem ; + margin-bottom: 1.5rem ; } .my-sm-5 { - margin-top: 3rem !important; - margin-bottom: 3rem !important; + margin-top: 3rem ; + margin-bottom: 3rem ; } .my-sm-auto { - margin-top: auto !important; - margin-bottom: auto !important; + margin-top: auto ; + margin-bottom: auto ; } .mt-sm-0 { - margin-top: 0 !important; + margin-top: 0 ; } .mt-sm-1 { - margin-top: 0.25rem !important; + margin-top: 0.25rem ; } .mt-sm-2 { - margin-top: 0.5rem !important; + margin-top: 0.5rem ; } .mt-sm-3 { - margin-top: 1rem !important; + margin-top: 1rem ; } .mt-sm-4 { - margin-top: 1.5rem !important; + margin-top: 1.5rem ; } .mt-sm-5 { - margin-top: 3rem !important; + margin-top: 3rem ; } .mt-sm-auto { - margin-top: auto !important; + margin-top: auto ; } .me-sm-0 { - margin-right: 0 !important; + margin-right: 0 ; } .me-sm-1 { - margin-right: 0.25rem !important; + margin-right: 0.25rem ; } .me-sm-2 { - margin-right: 0.5rem !important; + margin-right: 0.5rem ; } .me-sm-3 { - margin-right: 1rem !important; + margin-right: 1rem ; } .me-sm-4 { - margin-right: 1.5rem !important; + margin-right: 1.5rem ; } .me-sm-5 { - margin-right: 3rem !important; + margin-right: 3rem ; } .me-sm-auto { - margin-right: auto !important; + margin-right: auto ; } .mb-sm-0 { - margin-bottom: 0 !important; + margin-bottom: 0 ; } .mb-sm-1 { - margin-bottom: 0.25rem !important; + margin-bottom: 0.25rem ; } .mb-sm-2 { - margin-bottom: 0.5rem !important; + margin-bottom: 0.5rem ; } .mb-sm-3 { - margin-bottom: 1rem !important; + margin-bottom: 1rem ; } .mb-sm-4 { - margin-bottom: 1.5rem !important; + margin-bottom: 1.5rem ; } .mb-sm-5 { - margin-bottom: 3rem !important; + margin-bottom: 3rem ; } .mb-sm-auto { - margin-bottom: auto !important; + margin-bottom: auto ; } .ms-sm-0 { - margin-left: 0 !important; + margin-left: 0 ; } .ms-sm-1 { - margin-left: 0.25rem !important; + margin-left: 0.25rem ; } .ms-sm-2 { - margin-left: 0.5rem !important; + margin-left: 0.5rem ; } .ms-sm-3 { - margin-left: 1rem !important; + margin-left: 1rem ; } .ms-sm-4 { - margin-left: 1.5rem !important; + margin-left: 1.5rem ; } .ms-sm-5 { - margin-left: 3rem !important; + margin-left: 3rem ; } .ms-sm-auto { - margin-left: auto !important; + margin-left: auto ; } .p-sm-0 { - padding: 0 !important; + padding: 0 ; } .p-sm-1 { - padding: 0.25rem !important; + padding: 0.25rem ; } .p-sm-2 { - padding: 0.5rem !important; + padding: 0.5rem ; } .p-sm-3 { - padding: 1rem !important; + padding: 1rem ; } .p-sm-4 { - padding: 1.5rem !important; + padding: 1.5rem ; } .p-sm-5 { - padding: 3rem !important; + padding: 3rem ; } .px-sm-0 { - padding-right: 0 !important; - padding-left: 0 !important; + padding-right: 0 ; + padding-left: 0 ; } .px-sm-1 { - padding-right: 0.25rem !important; - padding-left: 0.25rem !important; + padding-right: 0.25rem ; + padding-left: 0.25rem ; } .px-sm-2 { - padding-right: 0.5rem !important; - padding-left: 0.5rem !important; + padding-right: 0.5rem ; + padding-left: 0.5rem ; } .px-sm-3 { - padding-right: 1rem !important; - padding-left: 1rem !important; + padding-right: 1rem ; + padding-left: 1rem ; } .px-sm-4 { - padding-right: 1.5rem !important; - padding-left: 1.5rem !important; + padding-right: 1.5rem ; + padding-left: 1.5rem ; } .px-sm-5 { - padding-right: 3rem !important; - padding-left: 3rem !important; + padding-right: 3rem ; + padding-left: 3rem ; } .py-sm-0 { - padding-top: 0 !important; - padding-bottom: 0 !important; + padding-top: 0 ; + padding-bottom: 0 ; } .py-sm-1 { - padding-top: 0.25rem !important; - padding-bottom: 0.25rem !important; + padding-top: 0.25rem ; + padding-bottom: 0.25rem ; } .py-sm-2 { - padding-top: 0.5rem !important; - padding-bottom: 0.5rem !important; + padding-top: 0.5rem ; + padding-bottom: 0.5rem ; } .py-sm-3 { - padding-top: 1rem !important; - padding-bottom: 1rem !important; + padding-top: 1rem ; + padding-bottom: 1rem ; } .py-sm-4 { - padding-top: 1.5rem !important; - padding-bottom: 1.5rem !important; + padding-top: 1.5rem ; + padding-bottom: 1.5rem ; } .py-sm-5 { - padding-top: 3rem !important; - padding-bottom: 3rem !important; + padding-top: 3rem ; + padding-bottom: 3rem ; } .pt-sm-0 { - padding-top: 0 !important; + padding-top: 0 ; } .pt-sm-1 { - padding-top: 0.25rem !important; + padding-top: 0.25rem ; } .pt-sm-2 { - padding-top: 0.5rem !important; + padding-top: 0.5rem ; } .pt-sm-3 { - padding-top: 1rem !important; + padding-top: 1rem ; } .pt-sm-4 { - padding-top: 1.5rem !important; + padding-top: 1.5rem ; } .pt-sm-5 { - padding-top: 3rem !important; + padding-top: 3rem ; } .pe-sm-0 { - padding-right: 0 !important; + padding-right: 0 ; } .pe-sm-1 { - padding-right: 0.25rem !important; + padding-right: 0.25rem ; } .pe-sm-2 { - padding-right: 0.5rem !important; + padding-right: 0.5rem ; } .pe-sm-3 { - padding-right: 1rem !important; + padding-right: 1rem ; } .pe-sm-4 { - padding-right: 1.5rem !important; + padding-right: 1.5rem ; } .pe-sm-5 { - padding-right: 3rem !important; + padding-right: 3rem ; } .pb-sm-0 { - padding-bottom: 0 !important; + padding-bottom: 0 ; } .pb-sm-1 { - padding-bottom: 0.25rem !important; + padding-bottom: 0.25rem ; } .pb-sm-2 { - padding-bottom: 0.5rem !important; + padding-bottom: 0.5rem ; } .pb-sm-3 { - padding-bottom: 1rem !important; + padding-bottom: 1rem ; } .pb-sm-4 { - padding-bottom: 1.5rem !important; + padding-bottom: 1.5rem ; } .pb-sm-5 { - padding-bottom: 3rem !important; + padding-bottom: 3rem ; } .ps-sm-0 { - padding-left: 0 !important; + padding-left: 0 ; } .ps-sm-1 { - padding-left: 0.25rem !important; + padding-left: 0.25rem ; } .ps-sm-2 { - padding-left: 0.5rem !important; + padding-left: 0.5rem ; } .ps-sm-3 { - padding-left: 1rem !important; + padding-left: 1rem ; } .ps-sm-4 { - padding-left: 1.5rem !important; + padding-left: 1.5rem ; } .ps-sm-5 { - padding-left: 3rem !important; + padding-left: 3rem ; } .gap-sm-0 { - gap: 0 !important; + gap: 0 ; } .gap-sm-1 { - gap: 0.25rem !important; + gap: 0.25rem ; } .gap-sm-2 { - gap: 0.5rem !important; + gap: 0.5rem ; } .gap-sm-3 { - gap: 1rem !important; + gap: 1rem ; } .gap-sm-4 { - gap: 1.5rem !important; + gap: 1.5rem ; } .gap-sm-5 { - gap: 3rem !important; + gap: 3rem ; } .text-sm-start { - text-align: left !important; + text-align: left ; } .text-sm-end { - text-align: right !important; + text-align: right ; } .text-sm-center { - text-align: center !important; + text-align: center ; } } @media (min-width: 768px) { .float-md-start { - float: left !important; + float: left ; } .float-md-end { - float: right !important; + float: right ; } .float-md-none { - float: none !important; + float: none ; } .d-md-inline { - display: inline !important; + display: inline ; } .d-md-inline-block { - display: inline-block !important; + display: inline-block ; } .d-md-block { - display: block !important; + display: block ; } .d-md-grid { - display: grid !important; + display: grid ; } .d-md-table { - display: table !important; + display: table ; } .d-md-table-row { - display: table-row !important; + display: table-row ; } .d-md-table-cell { - display: table-cell !important; + display: table-cell ; } .d-md-flex { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; } .d-md-inline-flex { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; - display: inline-flex !important; + display: -webkit-inline-box ; + display: -ms-inline-flexbox ; + display: inline-flex ; } .d-md-none { - display: none !important; + display: none ; } .flex-md-fill { - -webkit-box-flex: 1 !important; - -ms-flex: 1 1 auto !important; - flex: 1 1 auto !important; + -webkit-box-flex: 1 ; + -ms-flex: 1 1 auto ; + flex: 1 1 auto ; } .flex-md-row { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: row !important; - flex-direction: row !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: normal ; + -ms-flex-direction: row ; + flex-direction: row ; } .flex-md-column { - -webkit-box-orient: vertical !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: column !important; - flex-direction: column !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: normal ; + -ms-flex-direction: column ; + flex-direction: column ; } .flex-md-row-reverse { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: row-reverse !important; - flex-direction: row-reverse !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: reverse ; + -ms-flex-direction: row-reverse ; + flex-direction: row-reverse ; } .flex-md-column-reverse { - -webkit-box-orient: vertical !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: column-reverse !important; - flex-direction: column-reverse !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: reverse ; + -ms-flex-direction: column-reverse ; + flex-direction: column-reverse ; } .flex-md-grow-0 { - -webkit-box-flex: 0 !important; - -ms-flex-positive: 0 !important; - flex-grow: 0 !important; + -webkit-box-flex: 0 ; + -ms-flex-positive: 0 ; + flex-grow: 0 ; } .flex-md-grow-1 { - -webkit-box-flex: 1 !important; - -ms-flex-positive: 1 !important; - flex-grow: 1 !important; + -webkit-box-flex: 1 ; + -ms-flex-positive: 1 ; + flex-grow: 1 ; } .flex-md-shrink-0 { - -ms-flex-negative: 0 !important; - flex-shrink: 0 !important; + -ms-flex-negative: 0 ; + flex-shrink: 0 ; } .flex-md-shrink-1 { - -ms-flex-negative: 1 !important; - flex-shrink: 1 !important; + -ms-flex-negative: 1 ; + flex-shrink: 1 ; } .flex-md-wrap { - -ms-flex-wrap: wrap !important; - flex-wrap: wrap !important; + -ms-flex-wrap: wrap ; + flex-wrap: wrap ; } .flex-md-nowrap { - -ms-flex-wrap: nowrap !important; - flex-wrap: nowrap !important; + -ms-flex-wrap: nowrap ; + flex-wrap: nowrap ; } .flex-md-wrap-reverse { - -ms-flex-wrap: wrap-reverse !important; - flex-wrap: wrap-reverse !important; + -ms-flex-wrap: wrap-reverse ; + flex-wrap: wrap-reverse ; } .justify-content-md-start { - -webkit-box-pack: start !important; - -ms-flex-pack: start !important; - justify-content: flex-start !important; + -webkit-box-pack: start ; + -ms-flex-pack: start ; + justify-content: flex-start ; } .justify-content-md-end { - -webkit-box-pack: end !important; - -ms-flex-pack: end !important; - justify-content: flex-end !important; + -webkit-box-pack: end ; + -ms-flex-pack: end ; + justify-content: flex-end ; } .justify-content-md-center { - -webkit-box-pack: center !important; - -ms-flex-pack: center !important; - justify-content: center !important; + -webkit-box-pack: center ; + -ms-flex-pack: center ; + justify-content: center ; } .justify-content-md-between { - -webkit-box-pack: justify !important; - -ms-flex-pack: justify !important; - justify-content: space-between !important; + -webkit-box-pack: justify ; + -ms-flex-pack: justify ; + justify-content: space-between ; } .justify-content-md-around { - -ms-flex-pack: distribute !important; - justify-content: space-around !important; + -ms-flex-pack: distribute ; + justify-content: space-around ; } .justify-content-md-evenly { - -webkit-box-pack: space-evenly !important; - -ms-flex-pack: space-evenly !important; - justify-content: space-evenly !important; + -webkit-box-pack: space-evenly ; + -ms-flex-pack: space-evenly ; + justify-content: space-evenly ; } .align-items-md-start { - -webkit-box-align: start !important; - -ms-flex-align: start !important; - align-items: flex-start !important; + -webkit-box-align: start ; + -ms-flex-align: start ; + align-items: flex-start ; } .align-items-md-end { - -webkit-box-align: end !important; - -ms-flex-align: end !important; - align-items: flex-end !important; + -webkit-box-align: end ; + -ms-flex-align: end ; + align-items: flex-end ; } .align-items-md-center { - -webkit-box-align: center !important; - -ms-flex-align: center !important; - align-items: center !important; + -webkit-box-align: center ; + -ms-flex-align: center ; + align-items: center ; } .align-items-md-baseline { - -webkit-box-align: baseline !important; - -ms-flex-align: baseline !important; - align-items: baseline !important; + -webkit-box-align: baseline ; + -ms-flex-align: baseline ; + align-items: baseline ; } .align-items-md-stretch { - -webkit-box-align: stretch !important; - -ms-flex-align: stretch !important; - align-items: stretch !important; + -webkit-box-align: stretch ; + -ms-flex-align: stretch ; + align-items: stretch ; } .align-content-md-start { - -ms-flex-line-pack: start !important; - align-content: flex-start !important; + -ms-flex-line-pack: start ; + align-content: flex-start ; } .align-content-md-end { - -ms-flex-line-pack: end !important; - align-content: flex-end !important; + -ms-flex-line-pack: end ; + align-content: flex-end ; } .align-content-md-center { - -ms-flex-line-pack: center !important; - align-content: center !important; + -ms-flex-line-pack: center ; + align-content: center ; } .align-content-md-between { - -ms-flex-line-pack: justify !important; - align-content: space-between !important; + -ms-flex-line-pack: justify ; + align-content: space-between ; } .align-content-md-around { - -ms-flex-line-pack: distribute !important; - align-content: space-around !important; + -ms-flex-line-pack: distribute ; + align-content: space-around ; } .align-content-md-stretch { - -ms-flex-line-pack: stretch !important; - align-content: stretch !important; + -ms-flex-line-pack: stretch ; + align-content: stretch ; } .align-self-md-auto { - -ms-flex-item-align: auto !important; - align-self: auto !important; + -ms-flex-item-align: auto ; + align-self: auto ; } .align-self-md-start { - -ms-flex-item-align: start !important; - align-self: flex-start !important; + -ms-flex-item-align: start ; + align-self: flex-start ; } .align-self-md-end { - -ms-flex-item-align: end !important; - align-self: flex-end !important; + -ms-flex-item-align: end ; + align-self: flex-end ; } .align-self-md-center { - -ms-flex-item-align: center !important; - align-self: center !important; + -ms-flex-item-align: center ; + align-self: center ; } .align-self-md-baseline { - -ms-flex-item-align: baseline !important; - align-self: baseline !important; + -ms-flex-item-align: baseline ; + align-self: baseline ; } .align-self-md-stretch { - -ms-flex-item-align: stretch !important; - align-self: stretch !important; + -ms-flex-item-align: stretch ; + align-self: stretch ; } .order-md-first { - -webkit-box-ordinal-group: 0 !important; - -ms-flex-order: -1 !important; - order: -1 !important; + -webkit-box-ordinal-group: 0 ; + -ms-flex-order: -1 ; + order: -1 ; } .order-md-0 { - -webkit-box-ordinal-group: 1 !important; - -ms-flex-order: 0 !important; - order: 0 !important; + -webkit-box-ordinal-group: 1 ; + -ms-flex-order: 0 ; + order: 0 ; } .order-md-1 { - -webkit-box-ordinal-group: 2 !important; - -ms-flex-order: 1 !important; - order: 1 !important; + -webkit-box-ordinal-group: 2 ; + -ms-flex-order: 1 ; + order: 1 ; } .order-md-2 { - -webkit-box-ordinal-group: 3 !important; - -ms-flex-order: 2 !important; - order: 2 !important; + -webkit-box-ordinal-group: 3 ; + -ms-flex-order: 2 ; + order: 2 ; } .order-md-3 { - -webkit-box-ordinal-group: 4 !important; - -ms-flex-order: 3 !important; - order: 3 !important; + -webkit-box-ordinal-group: 4 ; + -ms-flex-order: 3 ; + order: 3 ; } .order-md-4 { - -webkit-box-ordinal-group: 5 !important; - -ms-flex-order: 4 !important; - order: 4 !important; + -webkit-box-ordinal-group: 5 ; + -ms-flex-order: 4 ; + order: 4 ; } .order-md-5 { - -webkit-box-ordinal-group: 6 !important; - -ms-flex-order: 5 !important; - order: 5 !important; + -webkit-box-ordinal-group: 6 ; + -ms-flex-order: 5 ; + order: 5 ; } .order-md-last { - -webkit-box-ordinal-group: 7 !important; - -ms-flex-order: 6 !important; - order: 6 !important; + -webkit-box-ordinal-group: 7 ; + -ms-flex-order: 6 ; + order: 6 ; } .m-md-0 { - margin: 0 !important; + margin: 0 ; } .m-md-1 { - margin: 0.25rem !important; + margin: 0.25rem ; } .m-md-2 { - margin: 0.5rem !important; + margin: 0.5rem ; } .m-md-3 { - margin: 1rem !important; + margin: 1rem ; } .m-md-4 { - margin: 1.5rem !important; + margin: 1.5rem ; } .m-md-5 { - margin: 3rem !important; + margin: 3rem ; } .m-md-auto { - margin: auto !important; + margin: auto ; } .mx-md-0 { - margin-right: 0 !important; - margin-left: 0 !important; + margin-right: 0 ; + margin-left: 0 ; } .mx-md-1 { - margin-right: 0.25rem !important; - margin-left: 0.25rem !important; + margin-right: 0.25rem ; + margin-left: 0.25rem ; } .mx-md-2 { - margin-right: 0.5rem !important; - margin-left: 0.5rem !important; + margin-right: 0.5rem ; + margin-left: 0.5rem ; } .mx-md-3 { - margin-right: 1rem !important; - margin-left: 1rem !important; + margin-right: 1rem ; + margin-left: 1rem ; } .mx-md-4 { - margin-right: 1.5rem !important; - margin-left: 1.5rem !important; + margin-right: 1.5rem ; + margin-left: 1.5rem ; } .mx-md-5 { - margin-right: 3rem !important; - margin-left: 3rem !important; + margin-right: 3rem ; + margin-left: 3rem ; } .mx-md-auto { - margin-right: auto !important; - margin-left: auto !important; + margin-right: auto ; + margin-left: auto ; } .my-md-0 { - margin-top: 0 !important; - margin-bottom: 0 !important; + margin-top: 0 ; + margin-bottom: 0 ; } .my-md-1 { - margin-top: 0.25rem !important; - margin-bottom: 0.25rem !important; + margin-top: 0.25rem ; + margin-bottom: 0.25rem ; } .my-md-2 { - margin-top: 0.5rem !important; - margin-bottom: 0.5rem !important; + margin-top: 0.5rem ; + margin-bottom: 0.5rem ; } .my-md-3 { - margin-top: 1rem !important; - margin-bottom: 1rem !important; + margin-top: 1rem ; + margin-bottom: 1rem ; } .my-md-4 { - margin-top: 1.5rem !important; - margin-bottom: 1.5rem !important; + margin-top: 1.5rem ; + margin-bottom: 1.5rem ; } .my-md-5 { - margin-top: 3rem !important; - margin-bottom: 3rem !important; + margin-top: 3rem ; + margin-bottom: 3rem ; } .my-md-auto { - margin-top: auto !important; - margin-bottom: auto !important; + margin-top: auto ; + margin-bottom: auto ; } .mt-md-0 { - margin-top: 0 !important; + margin-top: 0 ; } .mt-md-1 { - margin-top: 0.25rem !important; + margin-top: 0.25rem ; } .mt-md-2 { - margin-top: 0.5rem !important; + margin-top: 0.5rem ; } .mt-md-3 { - margin-top: 1rem !important; + margin-top: 1rem ; } .mt-md-4 { - margin-top: 1.5rem !important; + margin-top: 1.5rem ; } .mt-md-5 { - margin-top: 3rem !important; + margin-top: 3rem ; } .mt-md-auto { - margin-top: auto !important; + margin-top: auto ; } .me-md-0 { - margin-right: 0 !important; + margin-right: 0 ; } .me-md-1 { - margin-right: 0.25rem !important; + margin-right: 0.25rem ; } .me-md-2 { - margin-right: 0.5rem !important; + margin-right: 0.5rem ; } .me-md-3 { - margin-right: 1rem !important; + margin-right: 1rem ; } .me-md-4 { - margin-right: 1.5rem !important; + margin-right: 1.5rem ; } .me-md-5 { - margin-right: 3rem !important; + margin-right: 3rem ; } .me-md-auto { - margin-right: auto !important; + margin-right: auto ; } .mb-md-0 { - margin-bottom: 0 !important; + margin-bottom: 0 ; } .mb-md-1 { - margin-bottom: 0.25rem !important; + margin-bottom: 0.25rem ; } .mb-md-2 { - margin-bottom: 0.5rem !important; + margin-bottom: 0.5rem ; } .mb-md-3 { - margin-bottom: 1rem !important; + margin-bottom: 1rem ; } .mb-md-4 { - margin-bottom: 1.5rem !important; + margin-bottom: 1.5rem ; } .mb-md-5 { - margin-bottom: 3rem !important; + margin-bottom: 3rem ; } .mb-md-auto { - margin-bottom: auto !important; + margin-bottom: auto ; } .ms-md-0 { - margin-left: 0 !important; + margin-left: 0 ; } .ms-md-1 { - margin-left: 0.25rem !important; + margin-left: 0.25rem ; } .ms-md-2 { - margin-left: 0.5rem !important; + margin-left: 0.5rem ; } .ms-md-3 { - margin-left: 1rem !important; + margin-left: 1rem ; } .ms-md-4 { - margin-left: 1.5rem !important; + margin-left: 1.5rem ; } .ms-md-5 { - margin-left: 3rem !important; + margin-left: 3rem ; } .ms-md-auto { - margin-left: auto !important; + margin-left: auto ; } .p-md-0 { - padding: 0 !important; + padding: 0 ; } .p-md-1 { - padding: 0.25rem !important; + padding: 0.25rem ; } .p-md-2 { - padding: 0.5rem !important; + padding: 0.5rem ; } .p-md-3 { - padding: 1rem !important; + padding: 1rem ; } .p-md-4 { - padding: 1.5rem !important; + padding: 1.5rem ; } .p-md-5 { - padding: 3rem !important; + padding: 3rem ; } .px-md-0 { - padding-right: 0 !important; - padding-left: 0 !important; + padding-right: 0 ; + padding-left: 0 ; } .px-md-1 { - padding-right: 0.25rem !important; - padding-left: 0.25rem !important; + padding-right: 0.25rem ; + padding-left: 0.25rem ; } .px-md-2 { - padding-right: 0.5rem !important; - padding-left: 0.5rem !important; + padding-right: 0.5rem ; + padding-left: 0.5rem ; } .px-md-3 { - padding-right: 1rem !important; - padding-left: 1rem !important; + padding-right: 1rem ; + padding-left: 1rem ; } .px-md-4 { - padding-right: 1.5rem !important; - padding-left: 1.5rem !important; + padding-right: 1.5rem ; + padding-left: 1.5rem ; } .px-md-5 { - padding-right: 3rem !important; - padding-left: 3rem !important; + padding-right: 3rem ; + padding-left: 3rem ; } .py-md-0 { - padding-top: 0 !important; - padding-bottom: 0 !important; + padding-top: 0 ; + padding-bottom: 0 ; } .py-md-1 { - padding-top: 0.25rem !important; - padding-bottom: 0.25rem !important; + padding-top: 0.25rem ; + padding-bottom: 0.25rem ; } .py-md-2 { - padding-top: 0.5rem !important; - padding-bottom: 0.5rem !important; + padding-top: 0.5rem ; + padding-bottom: 0.5rem ; } .py-md-3 { - padding-top: 1rem !important; - padding-bottom: 1rem !important; + padding-top: 1rem ; + padding-bottom: 1rem ; } .py-md-4 { - padding-top: 1.5rem !important; - padding-bottom: 1.5rem !important; + padding-top: 1.5rem ; + padding-bottom: 1.5rem ; } .py-md-5 { - padding-top: 3rem !important; - padding-bottom: 3rem !important; + padding-top: 3rem ; + padding-bottom: 3rem ; } .pt-md-0 { - padding-top: 0 !important; + padding-top: 0 ; } .pt-md-1 { - padding-top: 0.25rem !important; + padding-top: 0.25rem ; } .pt-md-2 { - padding-top: 0.5rem !important; + padding-top: 0.5rem ; } .pt-md-3 { - padding-top: 1rem !important; + padding-top: 1rem ; } .pt-md-4 { - padding-top: 1.5rem !important; + padding-top: 1.5rem ; } .pt-md-5 { - padding-top: 3rem !important; + padding-top: 3rem ; } .pe-md-0 { - padding-right: 0 !important; + padding-right: 0 ; } .pe-md-1 { - padding-right: 0.25rem !important; + padding-right: 0.25rem ; } .pe-md-2 { - padding-right: 0.5rem !important; + padding-right: 0.5rem ; } .pe-md-3 { - padding-right: 1rem !important; + padding-right: 1rem ; } .pe-md-4 { - padding-right: 1.5rem !important; + padding-right: 1.5rem ; } .pe-md-5 { - padding-right: 3rem !important; + padding-right: 3rem ; } .pb-md-0 { - padding-bottom: 0 !important; + padding-bottom: 0 ; } .pb-md-1 { - padding-bottom: 0.25rem !important; + padding-bottom: 0.25rem ; } .pb-md-2 { - padding-bottom: 0.5rem !important; + padding-bottom: 0.5rem ; } .pb-md-3 { - padding-bottom: 1rem !important; + padding-bottom: 1rem ; } .pb-md-4 { - padding-bottom: 1.5rem !important; + padding-bottom: 1.5rem ; } .pb-md-5 { - padding-bottom: 3rem !important; + padding-bottom: 3rem ; } .ps-md-0 { - padding-left: 0 !important; + padding-left: 0 ; } .ps-md-1 { - padding-left: 0.25rem !important; + padding-left: 0.25rem ; } .ps-md-2 { - padding-left: 0.5rem !important; + padding-left: 0.5rem ; } .ps-md-3 { - padding-left: 1rem !important; + padding-left: 1rem ; } .ps-md-4 { - padding-left: 1.5rem !important; + padding-left: 1.5rem ; } .ps-md-5 { - padding-left: 3rem !important; + padding-left: 3rem ; } .gap-md-0 { - gap: 0 !important; + gap: 0 ; } .gap-md-1 { - gap: 0.25rem !important; + gap: 0.25rem ; } .gap-md-2 { - gap: 0.5rem !important; + gap: 0.5rem ; } .gap-md-3 { - gap: 1rem !important; + gap: 1rem ; } .gap-md-4 { - gap: 1.5rem !important; + gap: 1.5rem ; } .gap-md-5 { - gap: 3rem !important; + gap: 3rem ; } .text-md-start { - text-align: left !important; + text-align: left ; } .text-md-end { - text-align: right !important; + text-align: right ; } .text-md-center { - text-align: center !important; + text-align: center ; } } @media (min-width: 992px) { .float-lg-start { - float: left !important; + float: left ; } .float-lg-end { - float: right !important; + float: right ; } .float-lg-none { - float: none !important; + float: none ; } .d-lg-inline { - display: inline !important; + display: inline ; } .d-lg-inline-block { - display: inline-block !important; + display: inline-block ; } .d-lg-block { - display: block !important; + display: block ; } .d-lg-grid { - display: grid !important; + display: grid ; } .d-lg-table { - display: table !important; + display: table ; } .d-lg-table-row { - display: table-row !important; + display: table-row ; } .d-lg-table-cell { - display: table-cell !important; + display: table-cell ; } .d-lg-flex { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; } .d-lg-inline-flex { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; - display: inline-flex !important; + display: -webkit-inline-box ; + display: -ms-inline-flexbox ; + display: inline-flex ; } .d-lg-none { - display: none !important; + display: none ; } .flex-lg-fill { - -webkit-box-flex: 1 !important; - -ms-flex: 1 1 auto !important; - flex: 1 1 auto !important; + -webkit-box-flex: 1 ; + -ms-flex: 1 1 auto ; + flex: 1 1 auto ; } .flex-lg-row { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: row !important; - flex-direction: row !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: normal ; + -ms-flex-direction: row ; + flex-direction: row ; } .flex-lg-column { - -webkit-box-orient: vertical !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: column !important; - flex-direction: column !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: normal ; + -ms-flex-direction: column ; + flex-direction: column ; } .flex-lg-row-reverse { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: row-reverse !important; - flex-direction: row-reverse !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: reverse ; + -ms-flex-direction: row-reverse ; + flex-direction: row-reverse ; } .flex-lg-column-reverse { - -webkit-box-orient: vertical !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: column-reverse !important; - flex-direction: column-reverse !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: reverse ; + -ms-flex-direction: column-reverse ; + flex-direction: column-reverse ; } .flex-lg-grow-0 { - -webkit-box-flex: 0 !important; - -ms-flex-positive: 0 !important; - flex-grow: 0 !important; + -webkit-box-flex: 0 ; + -ms-flex-positive: 0 ; + flex-grow: 0 ; } .flex-lg-grow-1 { - -webkit-box-flex: 1 !important; - -ms-flex-positive: 1 !important; - flex-grow: 1 !important; + -webkit-box-flex: 1 ; + -ms-flex-positive: 1 ; + flex-grow: 1 ; } .flex-lg-shrink-0 { - -ms-flex-negative: 0 !important; - flex-shrink: 0 !important; + -ms-flex-negative: 0 ; + flex-shrink: 0 ; } .flex-lg-shrink-1 { - -ms-flex-negative: 1 !important; - flex-shrink: 1 !important; + -ms-flex-negative: 1 ; + flex-shrink: 1 ; } .flex-lg-wrap { - -ms-flex-wrap: wrap !important; - flex-wrap: wrap !important; + -ms-flex-wrap: wrap ; + flex-wrap: wrap ; } .flex-lg-nowrap { - -ms-flex-wrap: nowrap !important; - flex-wrap: nowrap !important; + -ms-flex-wrap: nowrap ; + flex-wrap: nowrap ; } .flex-lg-wrap-reverse { - -ms-flex-wrap: wrap-reverse !important; - flex-wrap: wrap-reverse !important; + -ms-flex-wrap: wrap-reverse ; + flex-wrap: wrap-reverse ; } .justify-content-lg-start { - -webkit-box-pack: start !important; - -ms-flex-pack: start !important; - justify-content: flex-start !important; + -webkit-box-pack: start ; + -ms-flex-pack: start ; + justify-content: flex-start ; } .justify-content-lg-end { - -webkit-box-pack: end !important; - -ms-flex-pack: end !important; - justify-content: flex-end !important; + -webkit-box-pack: end ; + -ms-flex-pack: end ; + justify-content: flex-end ; } .justify-content-lg-center { - -webkit-box-pack: center !important; - -ms-flex-pack: center !important; - justify-content: center !important; + -webkit-box-pack: center ; + -ms-flex-pack: center ; + justify-content: center ; } .justify-content-lg-between { - -webkit-box-pack: justify !important; - -ms-flex-pack: justify !important; - justify-content: space-between !important; + -webkit-box-pack: justify ; + -ms-flex-pack: justify ; + justify-content: space-between ; } .justify-content-lg-around { - -ms-flex-pack: distribute !important; - justify-content: space-around !important; + -ms-flex-pack: distribute ; + justify-content: space-around ; } .justify-content-lg-evenly { - -webkit-box-pack: space-evenly !important; - -ms-flex-pack: space-evenly !important; - justify-content: space-evenly !important; + -webkit-box-pack: space-evenly ; + -ms-flex-pack: space-evenly ; + justify-content: space-evenly ; } .align-items-lg-start { - -webkit-box-align: start !important; - -ms-flex-align: start !important; - align-items: flex-start !important; + -webkit-box-align: start ; + -ms-flex-align: start ; + align-items: flex-start ; } .align-items-lg-end { - -webkit-box-align: end !important; - -ms-flex-align: end !important; - align-items: flex-end !important; + -webkit-box-align: end ; + -ms-flex-align: end ; + align-items: flex-end ; } .align-items-lg-center { - -webkit-box-align: center !important; - -ms-flex-align: center !important; - align-items: center !important; + -webkit-box-align: center ; + -ms-flex-align: center ; + align-items: center ; } .align-items-lg-baseline { - -webkit-box-align: baseline !important; - -ms-flex-align: baseline !important; - align-items: baseline !important; + -webkit-box-align: baseline ; + -ms-flex-align: baseline ; + align-items: baseline ; } .align-items-lg-stretch { - -webkit-box-align: stretch !important; - -ms-flex-align: stretch !important; - align-items: stretch !important; + -webkit-box-align: stretch ; + -ms-flex-align: stretch ; + align-items: stretch ; } .align-content-lg-start { - -ms-flex-line-pack: start !important; - align-content: flex-start !important; + -ms-flex-line-pack: start ; + align-content: flex-start ; } .align-content-lg-end { - -ms-flex-line-pack: end !important; - align-content: flex-end !important; + -ms-flex-line-pack: end ; + align-content: flex-end ; } .align-content-lg-center { - -ms-flex-line-pack: center !important; - align-content: center !important; + -ms-flex-line-pack: center ; + align-content: center ; } .align-content-lg-between { - -ms-flex-line-pack: justify !important; - align-content: space-between !important; + -ms-flex-line-pack: justify ; + align-content: space-between ; } .align-content-lg-around { - -ms-flex-line-pack: distribute !important; - align-content: space-around !important; + -ms-flex-line-pack: distribute ; + align-content: space-around ; } .align-content-lg-stretch { - -ms-flex-line-pack: stretch !important; - align-content: stretch !important; + -ms-flex-line-pack: stretch ; + align-content: stretch ; } .align-self-lg-auto { - -ms-flex-item-align: auto !important; - align-self: auto !important; + -ms-flex-item-align: auto ; + align-self: auto ; } .align-self-lg-start { - -ms-flex-item-align: start !important; - align-self: flex-start !important; + -ms-flex-item-align: start ; + align-self: flex-start ; } .align-self-lg-end { - -ms-flex-item-align: end !important; - align-self: flex-end !important; + -ms-flex-item-align: end ; + align-self: flex-end ; } .align-self-lg-center { - -ms-flex-item-align: center !important; - align-self: center !important; + -ms-flex-item-align: center ; + align-self: center ; } .align-self-lg-baseline { - -ms-flex-item-align: baseline !important; - align-self: baseline !important; + -ms-flex-item-align: baseline ; + align-self: baseline ; } .align-self-lg-stretch { - -ms-flex-item-align: stretch !important; - align-self: stretch !important; + -ms-flex-item-align: stretch ; + align-self: stretch ; } .order-lg-first { - -webkit-box-ordinal-group: 0 !important; - -ms-flex-order: -1 !important; - order: -1 !important; + -webkit-box-ordinal-group: 0 ; + -ms-flex-order: -1 ; + order: -1 ; } .order-lg-0 { - -webkit-box-ordinal-group: 1 !important; - -ms-flex-order: 0 !important; - order: 0 !important; + -webkit-box-ordinal-group: 1 ; + -ms-flex-order: 0 ; + order: 0 ; } .order-lg-1 { - -webkit-box-ordinal-group: 2 !important; - -ms-flex-order: 1 !important; - order: 1 !important; + -webkit-box-ordinal-group: 2 ; + -ms-flex-order: 1 ; + order: 1 ; } .order-lg-2 { - -webkit-box-ordinal-group: 3 !important; - -ms-flex-order: 2 !important; - order: 2 !important; + -webkit-box-ordinal-group: 3 ; + -ms-flex-order: 2 ; + order: 2 ; } .order-lg-3 { - -webkit-box-ordinal-group: 4 !important; - -ms-flex-order: 3 !important; - order: 3 !important; + -webkit-box-ordinal-group: 4 ; + -ms-flex-order: 3 ; + order: 3 ; } .order-lg-4 { - -webkit-box-ordinal-group: 5 !important; - -ms-flex-order: 4 !important; - order: 4 !important; + -webkit-box-ordinal-group: 5 ; + -ms-flex-order: 4 ; + order: 4 ; } .order-lg-5 { - -webkit-box-ordinal-group: 6 !important; - -ms-flex-order: 5 !important; - order: 5 !important; + -webkit-box-ordinal-group: 6 ; + -ms-flex-order: 5 ; + order: 5 ; } .order-lg-last { - -webkit-box-ordinal-group: 7 !important; - -ms-flex-order: 6 !important; - order: 6 !important; + -webkit-box-ordinal-group: 7 ; + -ms-flex-order: 6 ; + order: 6 ; } .m-lg-0 { - margin: 0 !important; + margin: 0 ; } .m-lg-1 { - margin: 0.25rem !important; + margin: 0.25rem ; } .m-lg-2 { - margin: 0.5rem !important; + margin: 0.5rem ; } .m-lg-3 { - margin: 1rem !important; + margin: 1rem ; } .m-lg-4 { - margin: 1.5rem !important; + margin: 1.5rem ; } .m-lg-5 { - margin: 3rem !important; + margin: 3rem ; } .m-lg-auto { - margin: auto !important; + margin: auto ; } .mx-lg-0 { - margin-right: 0 !important; - margin-left: 0 !important; + margin-right: 0 ; + margin-left: 0 ; } .mx-lg-1 { - margin-right: 0.25rem !important; - margin-left: 0.25rem !important; + margin-right: 0.25rem ; + margin-left: 0.25rem ; } .mx-lg-2 { - margin-right: 0.5rem !important; - margin-left: 0.5rem !important; + margin-right: 0.5rem ; + margin-left: 0.5rem ; } .mx-lg-3 { - margin-right: 1rem !important; - margin-left: 1rem !important; + margin-right: 1rem ; + margin-left: 1rem ; } .mx-lg-4 { - margin-right: 1.5rem !important; - margin-left: 1.5rem !important; + margin-right: 1.5rem ; + margin-left: 1.5rem ; } .mx-lg-5 { - margin-right: 3rem !important; - margin-left: 3rem !important; + margin-right: 3rem ; + margin-left: 3rem ; } .mx-lg-auto { - margin-right: auto !important; - margin-left: auto !important; + margin-right: auto ; + margin-left: auto ; } .my-lg-0 { - margin-top: 0 !important; - margin-bottom: 0 !important; + margin-top: 0 ; + margin-bottom: 0 ; } .my-lg-1 { - margin-top: 0.25rem !important; - margin-bottom: 0.25rem !important; + margin-top: 0.25rem ; + margin-bottom: 0.25rem ; } .my-lg-2 { - margin-top: 0.5rem !important; - margin-bottom: 0.5rem !important; + margin-top: 0.5rem ; + margin-bottom: 0.5rem ; } .my-lg-3 { - margin-top: 1rem !important; - margin-bottom: 1rem !important; + margin-top: 1rem ; + margin-bottom: 1rem ; } .my-lg-4 { - margin-top: 1.5rem !important; - margin-bottom: 1.5rem !important; + margin-top: 1.5rem ; + margin-bottom: 1.5rem ; } .my-lg-5 { - margin-top: 3rem !important; - margin-bottom: 3rem !important; + margin-top: 3rem ; + margin-bottom: 3rem ; } .my-lg-auto { - margin-top: auto !important; - margin-bottom: auto !important; + margin-top: auto ; + margin-bottom: auto ; } .mt-lg-0 { - margin-top: 0 !important; + margin-top: 0 ; } .mt-lg-1 { - margin-top: 0.25rem !important; + margin-top: 0.25rem ; } .mt-lg-2 { - margin-top: 0.5rem !important; + margin-top: 0.5rem ; } .mt-lg-3 { - margin-top: 1rem !important; + margin-top: 1rem ; } .mt-lg-4 { - margin-top: 1.5rem !important; + margin-top: 1.5rem ; } .mt-lg-5 { - margin-top: 3rem !important; + margin-top: 3rem ; } .mt-lg-auto { - margin-top: auto !important; + margin-top: auto ; } .me-lg-0 { - margin-right: 0 !important; + margin-right: 0 ; } .me-lg-1 { - margin-right: 0.25rem !important; + margin-right: 0.25rem ; } .me-lg-2 { - margin-right: 0.5rem !important; + margin-right: 0.5rem ; } .me-lg-3 { - margin-right: 1rem !important; + margin-right: 1rem ; } .me-lg-4 { - margin-right: 1.5rem !important; + margin-right: 1.5rem ; } .me-lg-5 { - margin-right: 3rem !important; + margin-right: 3rem ; } .me-lg-auto { - margin-right: auto !important; + margin-right: auto ; } .mb-lg-0 { - margin-bottom: 0 !important; + margin-bottom: 0 ; } .mb-lg-1 { - margin-bottom: 0.25rem !important; + margin-bottom: 0.25rem ; } .mb-lg-2 { - margin-bottom: 0.5rem !important; + margin-bottom: 0.5rem ; } .mb-lg-3 { - margin-bottom: 1rem !important; + margin-bottom: 1rem ; } .mb-lg-4 { - margin-bottom: 1.5rem !important; + margin-bottom: 1.5rem ; } .mb-lg-5 { - margin-bottom: 3rem !important; + margin-bottom: 3rem ; } .mb-lg-auto { - margin-bottom: auto !important; + margin-bottom: auto ; } .ms-lg-0 { - margin-left: 0 !important; + margin-left: 0 ; } .ms-lg-1 { - margin-left: 0.25rem !important; + margin-left: 0.25rem ; } .ms-lg-2 { - margin-left: 0.5rem !important; + margin-left: 0.5rem ; } .ms-lg-3 { - margin-left: 1rem !important; + margin-left: 1rem ; } .ms-lg-4 { - margin-left: 1.5rem !important; + margin-left: 1.5rem ; } .ms-lg-5 { - margin-left: 3rem !important; + margin-left: 3rem ; } .ms-lg-auto { - margin-left: auto !important; + margin-left: auto ; } .p-lg-0 { - padding: 0 !important; + padding: 0 ; } .p-lg-1 { - padding: 0.25rem !important; + padding: 0.25rem ; } .p-lg-2 { - padding: 0.5rem !important; + padding: 0.5rem ; } .p-lg-3 { - padding: 1rem !important; + padding: 1rem ; } .p-lg-4 { - padding: 1.5rem !important; + padding: 1.5rem ; } .p-lg-5 { - padding: 3rem !important; + padding: 3rem ; } .px-lg-0 { - padding-right: 0 !important; - padding-left: 0 !important; + padding-right: 0 ; + padding-left: 0 ; } .px-lg-1 { - padding-right: 0.25rem !important; - padding-left: 0.25rem !important; + padding-right: 0.25rem ; + padding-left: 0.25rem ; } .px-lg-2 { - padding-right: 0.5rem !important; - padding-left: 0.5rem !important; + padding-right: 0.5rem ; + padding-left: 0.5rem ; } .px-lg-3 { - padding-right: 1rem !important; - padding-left: 1rem !important; + padding-right: 1rem ; + padding-left: 1rem ; } .px-lg-4 { - padding-right: 1.5rem !important; - padding-left: 1.5rem !important; + padding-right: 1.5rem ; + padding-left: 1.5rem ; } .px-lg-5 { - padding-right: 3rem !important; - padding-left: 3rem !important; + padding-right: 3rem ; + padding-left: 3rem ; } .py-lg-0 { - padding-top: 0 !important; - padding-bottom: 0 !important; + padding-top: 0 ; + padding-bottom: 0 ; } .py-lg-1 { - padding-top: 0.25rem !important; - padding-bottom: 0.25rem !important; + padding-top: 0.25rem ; + padding-bottom: 0.25rem ; } .py-lg-2 { - padding-top: 0.5rem !important; - padding-bottom: 0.5rem !important; + padding-top: 0.5rem ; + padding-bottom: 0.5rem ; } .py-lg-3 { - padding-top: 1rem !important; - padding-bottom: 1rem !important; + padding-top: 1rem ; + padding-bottom: 1rem ; } .py-lg-4 { - padding-top: 1.5rem !important; - padding-bottom: 1.5rem !important; + padding-top: 1.5rem ; + padding-bottom: 1.5rem ; } .py-lg-5 { - padding-top: 3rem !important; - padding-bottom: 3rem !important; + padding-top: 3rem ; + padding-bottom: 3rem ; } .pt-lg-0 { - padding-top: 0 !important; + padding-top: 0 ; } .pt-lg-1 { - padding-top: 0.25rem !important; + padding-top: 0.25rem ; } .pt-lg-2 { - padding-top: 0.5rem !important; + padding-top: 0.5rem ; } .pt-lg-3 { - padding-top: 1rem !important; + padding-top: 1rem ; } .pt-lg-4 { - padding-top: 1.5rem !important; + padding-top: 1.5rem ; } .pt-lg-5 { - padding-top: 3rem !important; + padding-top: 3rem ; } .pe-lg-0 { - padding-right: 0 !important; + padding-right: 0 ; } .pe-lg-1 { - padding-right: 0.25rem !important; + padding-right: 0.25rem ; } .pe-lg-2 { - padding-right: 0.5rem !important; + padding-right: 0.5rem ; } .pe-lg-3 { - padding-right: 1rem !important; + padding-right: 1rem ; } .pe-lg-4 { - padding-right: 1.5rem !important; + padding-right: 1.5rem ; } .pe-lg-5 { - padding-right: 3rem !important; + padding-right: 3rem ; } .pb-lg-0 { - padding-bottom: 0 !important; + padding-bottom: 0 ; } .pb-lg-1 { - padding-bottom: 0.25rem !important; + padding-bottom: 0.25rem ; } .pb-lg-2 { - padding-bottom: 0.5rem !important; + padding-bottom: 0.5rem ; } .pb-lg-3 { - padding-bottom: 1rem !important; + padding-bottom: 1rem ; } .pb-lg-4 { - padding-bottom: 1.5rem !important; + padding-bottom: 1.5rem ; } .pb-lg-5 { - padding-bottom: 3rem !important; + padding-bottom: 3rem ; } .ps-lg-0 { - padding-left: 0 !important; + padding-left: 0 ; } .ps-lg-1 { - padding-left: 0.25rem !important; + padding-left: 0.25rem ; } .ps-lg-2 { - padding-left: 0.5rem !important; + padding-left: 0.5rem ; } .ps-lg-3 { - padding-left: 1rem !important; + padding-left: 1rem ; } .ps-lg-4 { - padding-left: 1.5rem !important; + padding-left: 1.5rem ; } .ps-lg-5 { - padding-left: 3rem !important; + padding-left: 3rem ; } .gap-lg-0 { - gap: 0 !important; + gap: 0 ; } .gap-lg-1 { - gap: 0.25rem !important; + gap: 0.25rem ; } .gap-lg-2 { - gap: 0.5rem !important; + gap: 0.5rem ; } .gap-lg-3 { - gap: 1rem !important; + gap: 1rem ; } .gap-lg-4 { - gap: 1.5rem !important; + gap: 1.5rem ; } .gap-lg-5 { - gap: 3rem !important; + gap: 3rem ; } .text-lg-start { - text-align: left !important; + text-align: left ; } .text-lg-end { - text-align: right !important; + text-align: right ; } .text-lg-center { - text-align: center !important; + text-align: center ; } } @media (min-width: 1200px) { .float-xl-start { - float: left !important; + float: left ; } .float-xl-end { - float: right !important; + float: right ; } .float-xl-none { - float: none !important; + float: none ; } .d-xl-inline { - display: inline !important; + display: inline ; } .d-xl-inline-block { - display: inline-block !important; + display: inline-block ; } .d-xl-block { - display: block !important; + display: block ; } .d-xl-grid { - display: grid !important; + display: grid ; } .d-xl-table { - display: table !important; + display: table ; } .d-xl-table-row { - display: table-row !important; + display: table-row ; } .d-xl-table-cell { - display: table-cell !important; + display: table-cell ; } .d-xl-flex { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; } .d-xl-inline-flex { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; - display: inline-flex !important; + display: -webkit-inline-box ; + display: -ms-inline-flexbox ; + display: inline-flex ; } .d-xl-none { - display: none !important; + display: none ; } .flex-xl-fill { - -webkit-box-flex: 1 !important; - -ms-flex: 1 1 auto !important; - flex: 1 1 auto !important; + -webkit-box-flex: 1 ; + -ms-flex: 1 1 auto ; + flex: 1 1 auto ; } .flex-xl-row { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: row !important; - flex-direction: row !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: normal ; + -ms-flex-direction: row ; + flex-direction: row ; } .flex-xl-column { - -webkit-box-orient: vertical !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: column !important; - flex-direction: column !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: normal ; + -ms-flex-direction: column ; + flex-direction: column ; } .flex-xl-row-reverse { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: row-reverse !important; - flex-direction: row-reverse !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: reverse ; + -ms-flex-direction: row-reverse ; + flex-direction: row-reverse ; } .flex-xl-column-reverse { - -webkit-box-orient: vertical !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: column-reverse !important; - flex-direction: column-reverse !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: reverse ; + -ms-flex-direction: column-reverse ; + flex-direction: column-reverse ; } .flex-xl-grow-0 { - -webkit-box-flex: 0 !important; - -ms-flex-positive: 0 !important; - flex-grow: 0 !important; + -webkit-box-flex: 0 ; + -ms-flex-positive: 0 ; + flex-grow: 0 ; } .flex-xl-grow-1 { - -webkit-box-flex: 1 !important; - -ms-flex-positive: 1 !important; - flex-grow: 1 !important; + -webkit-box-flex: 1 ; + -ms-flex-positive: 1 ; + flex-grow: 1 ; } .flex-xl-shrink-0 { - -ms-flex-negative: 0 !important; - flex-shrink: 0 !important; + -ms-flex-negative: 0 ; + flex-shrink: 0 ; } .flex-xl-shrink-1 { - -ms-flex-negative: 1 !important; - flex-shrink: 1 !important; + -ms-flex-negative: 1 ; + flex-shrink: 1 ; } .flex-xl-wrap { - -ms-flex-wrap: wrap !important; - flex-wrap: wrap !important; + -ms-flex-wrap: wrap ; + flex-wrap: wrap ; } .flex-xl-nowrap { - -ms-flex-wrap: nowrap !important; - flex-wrap: nowrap !important; + -ms-flex-wrap: nowrap ; + flex-wrap: nowrap ; } .flex-xl-wrap-reverse { - -ms-flex-wrap: wrap-reverse !important; - flex-wrap: wrap-reverse !important; + -ms-flex-wrap: wrap-reverse ; + flex-wrap: wrap-reverse ; } .justify-content-xl-start { - -webkit-box-pack: start !important; - -ms-flex-pack: start !important; - justify-content: flex-start !important; + -webkit-box-pack: start ; + -ms-flex-pack: start ; + justify-content: flex-start ; } .justify-content-xl-end { - -webkit-box-pack: end !important; - -ms-flex-pack: end !important; - justify-content: flex-end !important; + -webkit-box-pack: end ; + -ms-flex-pack: end ; + justify-content: flex-end ; } .justify-content-xl-center { - -webkit-box-pack: center !important; - -ms-flex-pack: center !important; - justify-content: center !important; + -webkit-box-pack: center ; + -ms-flex-pack: center ; + justify-content: center ; } .justify-content-xl-between { - -webkit-box-pack: justify !important; - -ms-flex-pack: justify !important; - justify-content: space-between !important; + -webkit-box-pack: justify ; + -ms-flex-pack: justify ; + justify-content: space-between ; } .justify-content-xl-around { - -ms-flex-pack: distribute !important; - justify-content: space-around !important; + -ms-flex-pack: distribute ; + justify-content: space-around ; } .justify-content-xl-evenly { - -webkit-box-pack: space-evenly !important; - -ms-flex-pack: space-evenly !important; - justify-content: space-evenly !important; + -webkit-box-pack: space-evenly ; + -ms-flex-pack: space-evenly ; + justify-content: space-evenly ; } .align-items-xl-start { - -webkit-box-align: start !important; - -ms-flex-align: start !important; - align-items: flex-start !important; + -webkit-box-align: start ; + -ms-flex-align: start ; + align-items: flex-start ; } .align-items-xl-end { - -webkit-box-align: end !important; - -ms-flex-align: end !important; - align-items: flex-end !important; + -webkit-box-align: end ; + -ms-flex-align: end ; + align-items: flex-end ; } .align-items-xl-center { - -webkit-box-align: center !important; - -ms-flex-align: center !important; - align-items: center !important; + -webkit-box-align: center ; + -ms-flex-align: center ; + align-items: center ; } .align-items-xl-baseline { - -webkit-box-align: baseline !important; - -ms-flex-align: baseline !important; - align-items: baseline !important; + -webkit-box-align: baseline ; + -ms-flex-align: baseline ; + align-items: baseline ; } .align-items-xl-stretch { - -webkit-box-align: stretch !important; - -ms-flex-align: stretch !important; - align-items: stretch !important; + -webkit-box-align: stretch ; + -ms-flex-align: stretch ; + align-items: stretch ; } .align-content-xl-start { - -ms-flex-line-pack: start !important; - align-content: flex-start !important; + -ms-flex-line-pack: start ; + align-content: flex-start ; } .align-content-xl-end { - -ms-flex-line-pack: end !important; - align-content: flex-end !important; + -ms-flex-line-pack: end ; + align-content: flex-end ; } .align-content-xl-center { - -ms-flex-line-pack: center !important; - align-content: center !important; + -ms-flex-line-pack: center ; + align-content: center ; } .align-content-xl-between { - -ms-flex-line-pack: justify !important; - align-content: space-between !important; + -ms-flex-line-pack: justify ; + align-content: space-between ; } .align-content-xl-around { - -ms-flex-line-pack: distribute !important; - align-content: space-around !important; + -ms-flex-line-pack: distribute ; + align-content: space-around ; } .align-content-xl-stretch { - -ms-flex-line-pack: stretch !important; - align-content: stretch !important; + -ms-flex-line-pack: stretch ; + align-content: stretch ; } .align-self-xl-auto { - -ms-flex-item-align: auto !important; - align-self: auto !important; + -ms-flex-item-align: auto ; + align-self: auto ; } .align-self-xl-start { - -ms-flex-item-align: start !important; - align-self: flex-start !important; + -ms-flex-item-align: start ; + align-self: flex-start ; } .align-self-xl-end { - -ms-flex-item-align: end !important; - align-self: flex-end !important; + -ms-flex-item-align: end ; + align-self: flex-end ; } .align-self-xl-center { - -ms-flex-item-align: center !important; - align-self: center !important; + -ms-flex-item-align: center ; + align-self: center ; } .align-self-xl-baseline { - -ms-flex-item-align: baseline !important; - align-self: baseline !important; + -ms-flex-item-align: baseline ; + align-self: baseline ; } .align-self-xl-stretch { - -ms-flex-item-align: stretch !important; - align-self: stretch !important; + -ms-flex-item-align: stretch ; + align-self: stretch ; } .order-xl-first { - -webkit-box-ordinal-group: 0 !important; - -ms-flex-order: -1 !important; - order: -1 !important; + -webkit-box-ordinal-group: 0 ; + -ms-flex-order: -1 ; + order: -1 ; } .order-xl-0 { - -webkit-box-ordinal-group: 1 !important; - -ms-flex-order: 0 !important; - order: 0 !important; + -webkit-box-ordinal-group: 1 ; + -ms-flex-order: 0 ; + order: 0 ; } .order-xl-1 { - -webkit-box-ordinal-group: 2 !important; - -ms-flex-order: 1 !important; - order: 1 !important; + -webkit-box-ordinal-group: 2 ; + -ms-flex-order: 1 ; + order: 1 ; } .order-xl-2 { - -webkit-box-ordinal-group: 3 !important; - -ms-flex-order: 2 !important; - order: 2 !important; + -webkit-box-ordinal-group: 3 ; + -ms-flex-order: 2 ; + order: 2 ; } .order-xl-3 { - -webkit-box-ordinal-group: 4 !important; - -ms-flex-order: 3 !important; - order: 3 !important; + -webkit-box-ordinal-group: 4 ; + -ms-flex-order: 3 ; + order: 3 ; } .order-xl-4 { - -webkit-box-ordinal-group: 5 !important; - -ms-flex-order: 4 !important; - order: 4 !important; + -webkit-box-ordinal-group: 5 ; + -ms-flex-order: 4 ; + order: 4 ; } .order-xl-5 { - -webkit-box-ordinal-group: 6 !important; - -ms-flex-order: 5 !important; - order: 5 !important; + -webkit-box-ordinal-group: 6 ; + -ms-flex-order: 5 ; + order: 5 ; } .order-xl-last { - -webkit-box-ordinal-group: 7 !important; - -ms-flex-order: 6 !important; - order: 6 !important; + -webkit-box-ordinal-group: 7 ; + -ms-flex-order: 6 ; + order: 6 ; } .m-xl-0 { - margin: 0 !important; + margin: 0 ; } .m-xl-1 { - margin: 0.25rem !important; + margin: 0.25rem ; } .m-xl-2 { - margin: 0.5rem !important; + margin: 0.5rem ; } .m-xl-3 { - margin: 1rem !important; + margin: 1rem ; } .m-xl-4 { - margin: 1.5rem !important; + margin: 1.5rem ; } .m-xl-5 { - margin: 3rem !important; + margin: 3rem ; } .m-xl-auto { - margin: auto !important; + margin: auto ; } .mx-xl-0 { - margin-right: 0 !important; - margin-left: 0 !important; + margin-right: 0 ; + margin-left: 0 ; } .mx-xl-1 { - margin-right: 0.25rem !important; - margin-left: 0.25rem !important; + margin-right: 0.25rem ; + margin-left: 0.25rem ; } .mx-xl-2 { - margin-right: 0.5rem !important; - margin-left: 0.5rem !important; + margin-right: 0.5rem ; + margin-left: 0.5rem ; } .mx-xl-3 { - margin-right: 1rem !important; - margin-left: 1rem !important; + margin-right: 1rem ; + margin-left: 1rem ; } .mx-xl-4 { - margin-right: 1.5rem !important; - margin-left: 1.5rem !important; + margin-right: 1.5rem ; + margin-left: 1.5rem ; } .mx-xl-5 { - margin-right: 3rem !important; - margin-left: 3rem !important; + margin-right: 3rem ; + margin-left: 3rem ; } .mx-xl-auto { - margin-right: auto !important; - margin-left: auto !important; + margin-right: auto ; + margin-left: auto ; } .my-xl-0 { - margin-top: 0 !important; - margin-bottom: 0 !important; + margin-top: 0 ; + margin-bottom: 0 ; } .my-xl-1 { - margin-top: 0.25rem !important; - margin-bottom: 0.25rem !important; + margin-top: 0.25rem ; + margin-bottom: 0.25rem ; } .my-xl-2 { - margin-top: 0.5rem !important; - margin-bottom: 0.5rem !important; + margin-top: 0.5rem ; + margin-bottom: 0.5rem ; } .my-xl-3 { - margin-top: 1rem !important; - margin-bottom: 1rem !important; + margin-top: 1rem ; + margin-bottom: 1rem ; } .my-xl-4 { - margin-top: 1.5rem !important; - margin-bottom: 1.5rem !important; + margin-top: 1.5rem ; + margin-bottom: 1.5rem ; } .my-xl-5 { - margin-top: 3rem !important; - margin-bottom: 3rem !important; + margin-top: 3rem ; + margin-bottom: 3rem ; } .my-xl-auto { - margin-top: auto !important; - margin-bottom: auto !important; + margin-top: auto ; + margin-bottom: auto ; } .mt-xl-0 { - margin-top: 0 !important; + margin-top: 0 ; } .mt-xl-1 { - margin-top: 0.25rem !important; + margin-top: 0.25rem ; } .mt-xl-2 { - margin-top: 0.5rem !important; + margin-top: 0.5rem ; } .mt-xl-3 { - margin-top: 1rem !important; + margin-top: 1rem ; } .mt-xl-4 { - margin-top: 1.5rem !important; + margin-top: 1.5rem ; } .mt-xl-5 { - margin-top: 3rem !important; + margin-top: 3rem ; } .mt-xl-auto { - margin-top: auto !important; + margin-top: auto ; } .me-xl-0 { - margin-right: 0 !important; + margin-right: 0 ; } .me-xl-1 { - margin-right: 0.25rem !important; + margin-right: 0.25rem ; } .me-xl-2 { - margin-right: 0.5rem !important; + margin-right: 0.5rem ; } .me-xl-3 { - margin-right: 1rem !important; + margin-right: 1rem ; } .me-xl-4 { - margin-right: 1.5rem !important; + margin-right: 1.5rem ; } .me-xl-5 { - margin-right: 3rem !important; + margin-right: 3rem ; } .me-xl-auto { - margin-right: auto !important; + margin-right: auto ; } .mb-xl-0 { - margin-bottom: 0 !important; + margin-bottom: 0 ; } .mb-xl-1 { - margin-bottom: 0.25rem !important; + margin-bottom: 0.25rem ; } .mb-xl-2 { - margin-bottom: 0.5rem !important; + margin-bottom: 0.5rem ; } .mb-xl-3 { - margin-bottom: 1rem !important; + margin-bottom: 1rem ; } .mb-xl-4 { - margin-bottom: 1.5rem !important; + margin-bottom: 1.5rem ; } .mb-xl-5 { - margin-bottom: 3rem !important; + margin-bottom: 3rem ; } .mb-xl-auto { - margin-bottom: auto !important; + margin-bottom: auto ; } .ms-xl-0 { - margin-left: 0 !important; + margin-left: 0 ; } .ms-xl-1 { - margin-left: 0.25rem !important; + margin-left: 0.25rem ; } .ms-xl-2 { - margin-left: 0.5rem !important; + margin-left: 0.5rem ; } .ms-xl-3 { - margin-left: 1rem !important; + margin-left: 1rem ; } .ms-xl-4 { - margin-left: 1.5rem !important; + margin-left: 1.5rem ; } .ms-xl-5 { - margin-left: 3rem !important; + margin-left: 3rem ; } .ms-xl-auto { - margin-left: auto !important; + margin-left: auto ; } .p-xl-0 { - padding: 0 !important; + padding: 0 ; } .p-xl-1 { - padding: 0.25rem !important; + padding: 0.25rem ; } .p-xl-2 { - padding: 0.5rem !important; + padding: 0.5rem ; } .p-xl-3 { - padding: 1rem !important; + padding: 1rem ; } .p-xl-4 { - padding: 1.5rem !important; + padding: 1.5rem ; } .p-xl-5 { - padding: 3rem !important; + padding: 3rem ; } .px-xl-0 { - padding-right: 0 !important; - padding-left: 0 !important; + padding-right: 0 ; + padding-left: 0 ; } .px-xl-1 { - padding-right: 0.25rem !important; - padding-left: 0.25rem !important; + padding-right: 0.25rem ; + padding-left: 0.25rem ; } .px-xl-2 { - padding-right: 0.5rem !important; - padding-left: 0.5rem !important; + padding-right: 0.5rem ; + padding-left: 0.5rem ; } .px-xl-3 { - padding-right: 1rem !important; - padding-left: 1rem !important; + padding-right: 1rem ; + padding-left: 1rem ; } .px-xl-4 { - padding-right: 1.5rem !important; - padding-left: 1.5rem !important; + padding-right: 1.5rem ; + padding-left: 1.5rem ; } .px-xl-5 { - padding-right: 3rem !important; - padding-left: 3rem !important; + padding-right: 3rem ; + padding-left: 3rem ; } .py-xl-0 { - padding-top: 0 !important; - padding-bottom: 0 !important; + padding-top: 0 ; + padding-bottom: 0 ; } .py-xl-1 { - padding-top: 0.25rem !important; - padding-bottom: 0.25rem !important; + padding-top: 0.25rem ; + padding-bottom: 0.25rem ; } .py-xl-2 { - padding-top: 0.5rem !important; - padding-bottom: 0.5rem !important; + padding-top: 0.5rem ; + padding-bottom: 0.5rem ; } .py-xl-3 { - padding-top: 1rem !important; - padding-bottom: 1rem !important; + padding-top: 1rem ; + padding-bottom: 1rem ; } .py-xl-4 { - padding-top: 1.5rem !important; - padding-bottom: 1.5rem !important; + padding-top: 1.5rem ; + padding-bottom: 1.5rem ; } .py-xl-5 { - padding-top: 3rem !important; - padding-bottom: 3rem !important; + padding-top: 3rem ; + padding-bottom: 3rem ; } .pt-xl-0 { - padding-top: 0 !important; + padding-top: 0 ; } .pt-xl-1 { - padding-top: 0.25rem !important; + padding-top: 0.25rem ; } .pt-xl-2 { - padding-top: 0.5rem !important; + padding-top: 0.5rem ; } .pt-xl-3 { - padding-top: 1rem !important; + padding-top: 1rem ; } .pt-xl-4 { - padding-top: 1.5rem !important; + padding-top: 1.5rem ; } .pt-xl-5 { - padding-top: 3rem !important; + padding-top: 3rem ; } .pe-xl-0 { - padding-right: 0 !important; + padding-right: 0 ; } .pe-xl-1 { - padding-right: 0.25rem !important; + padding-right: 0.25rem ; } .pe-xl-2 { - padding-right: 0.5rem !important; + padding-right: 0.5rem ; } .pe-xl-3 { - padding-right: 1rem !important; + padding-right: 1rem ; } .pe-xl-4 { - padding-right: 1.5rem !important; + padding-right: 1.5rem ; } .pe-xl-5 { - padding-right: 3rem !important; + padding-right: 3rem ; } .pb-xl-0 { - padding-bottom: 0 !important; + padding-bottom: 0 ; } .pb-xl-1 { - padding-bottom: 0.25rem !important; + padding-bottom: 0.25rem ; } .pb-xl-2 { - padding-bottom: 0.5rem !important; + padding-bottom: 0.5rem ; } .pb-xl-3 { - padding-bottom: 1rem !important; + padding-bottom: 1rem ; } .pb-xl-4 { - padding-bottom: 1.5rem !important; + padding-bottom: 1.5rem ; } .pb-xl-5 { - padding-bottom: 3rem !important; + padding-bottom: 3rem ; } .ps-xl-0 { - padding-left: 0 !important; + padding-left: 0 ; } .ps-xl-1 { - padding-left: 0.25rem !important; + padding-left: 0.25rem ; } .ps-xl-2 { - padding-left: 0.5rem !important; + padding-left: 0.5rem ; } .ps-xl-3 { - padding-left: 1rem !important; + padding-left: 1rem ; } .ps-xl-4 { - padding-left: 1.5rem !important; + padding-left: 1.5rem ; } .ps-xl-5 { - padding-left: 3rem !important; + padding-left: 3rem ; } .gap-xl-0 { - gap: 0 !important; + gap: 0 ; } .gap-xl-1 { - gap: 0.25rem !important; + gap: 0.25rem ; } .gap-xl-2 { - gap: 0.5rem !important; + gap: 0.5rem ; } .gap-xl-3 { - gap: 1rem !important; + gap: 1rem ; } .gap-xl-4 { - gap: 1.5rem !important; + gap: 1.5rem ; } .gap-xl-5 { - gap: 3rem !important; + gap: 3rem ; } .text-xl-start { - text-align: left !important; + text-align: left ; } .text-xl-end { - text-align: right !important; + text-align: right ; } .text-xl-center { - text-align: center !important; + text-align: center ; } } @media (min-width: 1400px) { .float-xxl-start { - float: left !important; + float: left ; } .float-xxl-end { - float: right !important; + float: right ; } .float-xxl-none { - float: none !important; + float: none ; } .d-xxl-inline { - display: inline !important; + display: inline ; } .d-xxl-inline-block { - display: inline-block !important; + display: inline-block ; } .d-xxl-block { - display: block !important; + display: block ; } .d-xxl-grid { - display: grid !important; + display: grid ; } .d-xxl-table { - display: table !important; + display: table ; } .d-xxl-table-row { - display: table-row !important; + display: table-row ; } .d-xxl-table-cell { - display: table-cell !important; + display: table-cell ; } .d-xxl-flex { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; } .d-xxl-inline-flex { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; - display: inline-flex !important; + display: -webkit-inline-box ; + display: -ms-inline-flexbox ; + display: inline-flex ; } .d-xxl-none { - display: none !important; + display: none ; } .flex-xxl-fill { - -webkit-box-flex: 1 !important; - -ms-flex: 1 1 auto !important; - flex: 1 1 auto !important; + -webkit-box-flex: 1 ; + -ms-flex: 1 1 auto ; + flex: 1 1 auto ; } .flex-xxl-row { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: row !important; - flex-direction: row !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: normal ; + -ms-flex-direction: row ; + flex-direction: row ; } .flex-xxl-column { - -webkit-box-orient: vertical !important; - -webkit-box-direction: normal !important; - -ms-flex-direction: column !important; - flex-direction: column !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: normal ; + -ms-flex-direction: column ; + flex-direction: column ; } .flex-xxl-row-reverse { - -webkit-box-orient: horizontal !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: row-reverse !important; - flex-direction: row-reverse !important; + -webkit-box-orient: horizontal ; + -webkit-box-direction: reverse ; + -ms-flex-direction: row-reverse ; + flex-direction: row-reverse ; } .flex-xxl-column-reverse { - -webkit-box-orient: vertical !important; - -webkit-box-direction: reverse !important; - -ms-flex-direction: column-reverse !important; - flex-direction: column-reverse !important; + -webkit-box-orient: vertical ; + -webkit-box-direction: reverse ; + -ms-flex-direction: column-reverse ; + flex-direction: column-reverse ; } .flex-xxl-grow-0 { - -webkit-box-flex: 0 !important; - -ms-flex-positive: 0 !important; - flex-grow: 0 !important; + -webkit-box-flex: 0 ; + -ms-flex-positive: 0 ; + flex-grow: 0 ; } .flex-xxl-grow-1 { - -webkit-box-flex: 1 !important; - -ms-flex-positive: 1 !important; - flex-grow: 1 !important; + -webkit-box-flex: 1 ; + -ms-flex-positive: 1 ; + flex-grow: 1 ; } .flex-xxl-shrink-0 { - -ms-flex-negative: 0 !important; - flex-shrink: 0 !important; + -ms-flex-negative: 0 ; + flex-shrink: 0 ; } .flex-xxl-shrink-1 { - -ms-flex-negative: 1 !important; - flex-shrink: 1 !important; + -ms-flex-negative: 1 ; + flex-shrink: 1 ; } .flex-xxl-wrap { - -ms-flex-wrap: wrap !important; - flex-wrap: wrap !important; + -ms-flex-wrap: wrap ; + flex-wrap: wrap ; } .flex-xxl-nowrap { - -ms-flex-wrap: nowrap !important; - flex-wrap: nowrap !important; + -ms-flex-wrap: nowrap ; + flex-wrap: nowrap ; } .flex-xxl-wrap-reverse { - -ms-flex-wrap: wrap-reverse !important; - flex-wrap: wrap-reverse !important; + -ms-flex-wrap: wrap-reverse ; + flex-wrap: wrap-reverse ; } .justify-content-xxl-start { - -webkit-box-pack: start !important; - -ms-flex-pack: start !important; - justify-content: flex-start !important; + -webkit-box-pack: start ; + -ms-flex-pack: start ; + justify-content: flex-start ; } .justify-content-xxl-end { - -webkit-box-pack: end !important; - -ms-flex-pack: end !important; - justify-content: flex-end !important; + -webkit-box-pack: end ; + -ms-flex-pack: end ; + justify-content: flex-end ; } .justify-content-xxl-center { - -webkit-box-pack: center !important; - -ms-flex-pack: center !important; - justify-content: center !important; + -webkit-box-pack: center ; + -ms-flex-pack: center ; + justify-content: center ; } .justify-content-xxl-between { - -webkit-box-pack: justify !important; - -ms-flex-pack: justify !important; - justify-content: space-between !important; + -webkit-box-pack: justify ; + -ms-flex-pack: justify ; + justify-content: space-between ; } .justify-content-xxl-around { - -ms-flex-pack: distribute !important; - justify-content: space-around !important; + -ms-flex-pack: distribute ; + justify-content: space-around ; } .justify-content-xxl-evenly { - -webkit-box-pack: space-evenly !important; - -ms-flex-pack: space-evenly !important; - justify-content: space-evenly !important; + -webkit-box-pack: space-evenly ; + -ms-flex-pack: space-evenly ; + justify-content: space-evenly ; } .align-items-xxl-start { - -webkit-box-align: start !important; - -ms-flex-align: start !important; - align-items: flex-start !important; + -webkit-box-align: start ; + -ms-flex-align: start ; + align-items: flex-start ; } .align-items-xxl-end { - -webkit-box-align: end !important; - -ms-flex-align: end !important; - align-items: flex-end !important; + -webkit-box-align: end ; + -ms-flex-align: end ; + align-items: flex-end ; } .align-items-xxl-center { - -webkit-box-align: center !important; - -ms-flex-align: center !important; - align-items: center !important; + -webkit-box-align: center ; + -ms-flex-align: center ; + align-items: center ; } .align-items-xxl-baseline { - -webkit-box-align: baseline !important; - -ms-flex-align: baseline !important; - align-items: baseline !important; + -webkit-box-align: baseline ; + -ms-flex-align: baseline ; + align-items: baseline ; } .align-items-xxl-stretch { - -webkit-box-align: stretch !important; - -ms-flex-align: stretch !important; - align-items: stretch !important; + -webkit-box-align: stretch ; + -ms-flex-align: stretch ; + align-items: stretch ; } .align-content-xxl-start { - -ms-flex-line-pack: start !important; - align-content: flex-start !important; + -ms-flex-line-pack: start ; + align-content: flex-start ; } .align-content-xxl-end { - -ms-flex-line-pack: end !important; - align-content: flex-end !important; + -ms-flex-line-pack: end ; + align-content: flex-end ; } .align-content-xxl-center { - -ms-flex-line-pack: center !important; - align-content: center !important; + -ms-flex-line-pack: center ; + align-content: center ; } .align-content-xxl-between { - -ms-flex-line-pack: justify !important; - align-content: space-between !important; + -ms-flex-line-pack: justify ; + align-content: space-between ; } .align-content-xxl-around { - -ms-flex-line-pack: distribute !important; - align-content: space-around !important; + -ms-flex-line-pack: distribute ; + align-content: space-around ; } .align-content-xxl-stretch { - -ms-flex-line-pack: stretch !important; - align-content: stretch !important; + -ms-flex-line-pack: stretch ; + align-content: stretch ; } .align-self-xxl-auto { - -ms-flex-item-align: auto !important; - align-self: auto !important; + -ms-flex-item-align: auto ; + align-self: auto ; } .align-self-xxl-start { - -ms-flex-item-align: start !important; - align-self: flex-start !important; + -ms-flex-item-align: start ; + align-self: flex-start ; } .align-self-xxl-end { - -ms-flex-item-align: end !important; - align-self: flex-end !important; + -ms-flex-item-align: end ; + align-self: flex-end ; } .align-self-xxl-center { - -ms-flex-item-align: center !important; - align-self: center !important; + -ms-flex-item-align: center ; + align-self: center ; } .align-self-xxl-baseline { - -ms-flex-item-align: baseline !important; - align-self: baseline !important; + -ms-flex-item-align: baseline ; + align-self: baseline ; } .align-self-xxl-stretch { - -ms-flex-item-align: stretch !important; - align-self: stretch !important; + -ms-flex-item-align: stretch ; + align-self: stretch ; } .order-xxl-first { - -webkit-box-ordinal-group: 0 !important; - -ms-flex-order: -1 !important; - order: -1 !important; + -webkit-box-ordinal-group: 0 ; + -ms-flex-order: -1 ; + order: -1 ; } .order-xxl-0 { - -webkit-box-ordinal-group: 1 !important; - -ms-flex-order: 0 !important; - order: 0 !important; + -webkit-box-ordinal-group: 1 ; + -ms-flex-order: 0 ; + order: 0 ; } .order-xxl-1 { - -webkit-box-ordinal-group: 2 !important; - -ms-flex-order: 1 !important; - order: 1 !important; + -webkit-box-ordinal-group: 2 ; + -ms-flex-order: 1 ; + order: 1 ; } .order-xxl-2 { - -webkit-box-ordinal-group: 3 !important; - -ms-flex-order: 2 !important; - order: 2 !important; + -webkit-box-ordinal-group: 3 ; + -ms-flex-order: 2 ; + order: 2 ; } .order-xxl-3 { - -webkit-box-ordinal-group: 4 !important; - -ms-flex-order: 3 !important; - order: 3 !important; + -webkit-box-ordinal-group: 4 ; + -ms-flex-order: 3 ; + order: 3 ; } .order-xxl-4 { - -webkit-box-ordinal-group: 5 !important; - -ms-flex-order: 4 !important; - order: 4 !important; + -webkit-box-ordinal-group: 5 ; + -ms-flex-order: 4 ; + order: 4 ; } .order-xxl-5 { - -webkit-box-ordinal-group: 6 !important; - -ms-flex-order: 5 !important; - order: 5 !important; + -webkit-box-ordinal-group: 6 ; + -ms-flex-order: 5 ; + order: 5 ; } .order-xxl-last { - -webkit-box-ordinal-group: 7 !important; - -ms-flex-order: 6 !important; - order: 6 !important; + -webkit-box-ordinal-group: 7 ; + -ms-flex-order: 6 ; + order: 6 ; } .m-xxl-0 { - margin: 0 !important; + margin: 0 ; } .m-xxl-1 { - margin: 0.25rem !important; + margin: 0.25rem ; } .m-xxl-2 { - margin: 0.5rem !important; + margin: 0.5rem ; } .m-xxl-3 { - margin: 1rem !important; + margin: 1rem ; } .m-xxl-4 { - margin: 1.5rem !important; + margin: 1.5rem ; } .m-xxl-5 { - margin: 3rem !important; + margin: 3rem ; } .m-xxl-auto { - margin: auto !important; + margin: auto ; } .mx-xxl-0 { - margin-right: 0 !important; - margin-left: 0 !important; + margin-right: 0 ; + margin-left: 0 ; } .mx-xxl-1 { - margin-right: 0.25rem !important; - margin-left: 0.25rem !important; + margin-right: 0.25rem ; + margin-left: 0.25rem ; } .mx-xxl-2 { - margin-right: 0.5rem !important; - margin-left: 0.5rem !important; + margin-right: 0.5rem ; + margin-left: 0.5rem ; } .mx-xxl-3 { - margin-right: 1rem !important; - margin-left: 1rem !important; + margin-right: 1rem ; + margin-left: 1rem ; } .mx-xxl-4 { - margin-right: 1.5rem !important; - margin-left: 1.5rem !important; + margin-right: 1.5rem ; + margin-left: 1.5rem ; } .mx-xxl-5 { - margin-right: 3rem !important; - margin-left: 3rem !important; + margin-right: 3rem ; + margin-left: 3rem ; } .mx-xxl-auto { - margin-right: auto !important; - margin-left: auto !important; + margin-right: auto ; + margin-left: auto ; } .my-xxl-0 { - margin-top: 0 !important; - margin-bottom: 0 !important; + margin-top: 0 ; + margin-bottom: 0 ; } .my-xxl-1 { - margin-top: 0.25rem !important; - margin-bottom: 0.25rem !important; + margin-top: 0.25rem ; + margin-bottom: 0.25rem ; } .my-xxl-2 { - margin-top: 0.5rem !important; - margin-bottom: 0.5rem !important; + margin-top: 0.5rem ; + margin-bottom: 0.5rem ; } .my-xxl-3 { - margin-top: 1rem !important; - margin-bottom: 1rem !important; + margin-top: 1rem ; + margin-bottom: 1rem ; } .my-xxl-4 { - margin-top: 1.5rem !important; - margin-bottom: 1.5rem !important; + margin-top: 1.5rem ; + margin-bottom: 1.5rem ; } .my-xxl-5 { - margin-top: 3rem !important; - margin-bottom: 3rem !important; + margin-top: 3rem ; + margin-bottom: 3rem ; } .my-xxl-auto { - margin-top: auto !important; - margin-bottom: auto !important; + margin-top: auto ; + margin-bottom: auto ; } .mt-xxl-0 { - margin-top: 0 !important; + margin-top: 0 ; } .mt-xxl-1 { - margin-top: 0.25rem !important; + margin-top: 0.25rem ; } .mt-xxl-2 { - margin-top: 0.5rem !important; + margin-top: 0.5rem ; } .mt-xxl-3 { - margin-top: 1rem !important; + margin-top: 1rem ; } .mt-xxl-4 { - margin-top: 1.5rem !important; + margin-top: 1.5rem ; } .mt-xxl-5 { - margin-top: 3rem !important; + margin-top: 3rem ; } .mt-xxl-auto { - margin-top: auto !important; + margin-top: auto ; } .me-xxl-0 { - margin-right: 0 !important; + margin-right: 0 ; } .me-xxl-1 { - margin-right: 0.25rem !important; + margin-right: 0.25rem ; } .me-xxl-2 { - margin-right: 0.5rem !important; + margin-right: 0.5rem ; } .me-xxl-3 { - margin-right: 1rem !important; + margin-right: 1rem ; } .me-xxl-4 { - margin-right: 1.5rem !important; + margin-right: 1.5rem ; } .me-xxl-5 { - margin-right: 3rem !important; + margin-right: 3rem ; } .me-xxl-auto { - margin-right: auto !important; + margin-right: auto ; } .mb-xxl-0 { - margin-bottom: 0 !important; + margin-bottom: 0 ; } .mb-xxl-1 { - margin-bottom: 0.25rem !important; + margin-bottom: 0.25rem ; } .mb-xxl-2 { - margin-bottom: 0.5rem !important; + margin-bottom: 0.5rem ; } .mb-xxl-3 { - margin-bottom: 1rem !important; + margin-bottom: 1rem ; } .mb-xxl-4 { - margin-bottom: 1.5rem !important; + margin-bottom: 1.5rem ; } .mb-xxl-5 { - margin-bottom: 3rem !important; + margin-bottom: 3rem ; } .mb-xxl-auto { - margin-bottom: auto !important; + margin-bottom: auto ; } .ms-xxl-0 { - margin-left: 0 !important; + margin-left: 0 ; } .ms-xxl-1 { - margin-left: 0.25rem !important; + margin-left: 0.25rem ; } .ms-xxl-2 { - margin-left: 0.5rem !important; + margin-left: 0.5rem ; } .ms-xxl-3 { - margin-left: 1rem !important; + margin-left: 1rem ; } .ms-xxl-4 { - margin-left: 1.5rem !important; + margin-left: 1.5rem ; } .ms-xxl-5 { - margin-left: 3rem !important; + margin-left: 3rem ; } .ms-xxl-auto { - margin-left: auto !important; + margin-left: auto ; } .p-xxl-0 { - padding: 0 !important; + padding: 0 ; } .p-xxl-1 { - padding: 0.25rem !important; + padding: 0.25rem ; } .p-xxl-2 { - padding: 0.5rem !important; + padding: 0.5rem ; } .p-xxl-3 { - padding: 1rem !important; + padding: 1rem ; } .p-xxl-4 { - padding: 1.5rem !important; + padding: 1.5rem ; } .p-xxl-5 { - padding: 3rem !important; + padding: 3rem ; } .px-xxl-0 { - padding-right: 0 !important; - padding-left: 0 !important; + padding-right: 0 ; + padding-left: 0 ; } .px-xxl-1 { - padding-right: 0.25rem !important; - padding-left: 0.25rem !important; + padding-right: 0.25rem ; + padding-left: 0.25rem ; } .px-xxl-2 { - padding-right: 0.5rem !important; - padding-left: 0.5rem !important; + padding-right: 0.5rem ; + padding-left: 0.5rem ; } .px-xxl-3 { - padding-right: 1rem !important; - padding-left: 1rem !important; + padding-right: 1rem ; + padding-left: 1rem ; } .px-xxl-4 { - padding-right: 1.5rem !important; - padding-left: 1.5rem !important; + padding-right: 1.5rem ; + padding-left: 1.5rem ; } .px-xxl-5 { - padding-right: 3rem !important; - padding-left: 3rem !important; + padding-right: 3rem ; + padding-left: 3rem ; } .py-xxl-0 { - padding-top: 0 !important; - padding-bottom: 0 !important; + padding-top: 0 ; + padding-bottom: 0 ; } .py-xxl-1 { - padding-top: 0.25rem !important; - padding-bottom: 0.25rem !important; + padding-top: 0.25rem ; + padding-bottom: 0.25rem ; } .py-xxl-2 { - padding-top: 0.5rem !important; - padding-bottom: 0.5rem !important; + padding-top: 0.5rem ; + padding-bottom: 0.5rem ; } .py-xxl-3 { - padding-top: 1rem !important; - padding-bottom: 1rem !important; + padding-top: 1rem ; + padding-bottom: 1rem ; } .py-xxl-4 { - padding-top: 1.5rem !important; - padding-bottom: 1.5rem !important; + padding-top: 1.5rem ; + padding-bottom: 1.5rem ; } .py-xxl-5 { - padding-top: 3rem !important; - padding-bottom: 3rem !important; + padding-top: 3rem ; + padding-bottom: 3rem ; } .pt-xxl-0 { - padding-top: 0 !important; + padding-top: 0 ; } .pt-xxl-1 { - padding-top: 0.25rem !important; + padding-top: 0.25rem ; } .pt-xxl-2 { - padding-top: 0.5rem !important; + padding-top: 0.5rem ; } .pt-xxl-3 { - padding-top: 1rem !important; + padding-top: 1rem ; } .pt-xxl-4 { - padding-top: 1.5rem !important; + padding-top: 1.5rem ; } .pt-xxl-5 { - padding-top: 3rem !important; + padding-top: 3rem ; } .pe-xxl-0 { - padding-right: 0 !important; + padding-right: 0 ; } .pe-xxl-1 { - padding-right: 0.25rem !important; + padding-right: 0.25rem ; } .pe-xxl-2 { - padding-right: 0.5rem !important; + padding-right: 0.5rem ; } .pe-xxl-3 { - padding-right: 1rem !important; + padding-right: 1rem ; } .pe-xxl-4 { - padding-right: 1.5rem !important; + padding-right: 1.5rem ; } .pe-xxl-5 { - padding-right: 3rem !important; + padding-right: 3rem ; } .pb-xxl-0 { - padding-bottom: 0 !important; + padding-bottom: 0 ; } .pb-xxl-1 { - padding-bottom: 0.25rem !important; + padding-bottom: 0.25rem ; } .pb-xxl-2 { - padding-bottom: 0.5rem !important; + padding-bottom: 0.5rem ; } .pb-xxl-3 { - padding-bottom: 1rem !important; + padding-bottom: 1rem ; } .pb-xxl-4 { - padding-bottom: 1.5rem !important; + padding-bottom: 1.5rem ; } .pb-xxl-5 { - padding-bottom: 3rem !important; + padding-bottom: 3rem ; } .ps-xxl-0 { - padding-left: 0 !important; + padding-left: 0 ; } .ps-xxl-1 { - padding-left: 0.25rem !important; + padding-left: 0.25rem ; } .ps-xxl-2 { - padding-left: 0.5rem !important; + padding-left: 0.5rem ; } .ps-xxl-3 { - padding-left: 1rem !important; + padding-left: 1rem ; } .ps-xxl-4 { - padding-left: 1.5rem !important; + padding-left: 1.5rem ; } .ps-xxl-5 { - padding-left: 3rem !important; + padding-left: 3rem ; } .gap-xxl-0 { - gap: 0 !important; + gap: 0 ; } .gap-xxl-1 { - gap: 0.25rem !important; + gap: 0.25rem ; } .gap-xxl-2 { - gap: 0.5rem !important; + gap: 0.5rem ; } .gap-xxl-3 { - gap: 1rem !important; + gap: 1rem ; } .gap-xxl-4 { - gap: 1.5rem !important; + gap: 1.5rem ; } .gap-xxl-5 { - gap: 3rem !important; + gap: 3rem ; } .text-xxl-start { - text-align: left !important; + text-align: left ; } .text-xxl-end { - text-align: right !important; + text-align: right ; } .text-xxl-center { - text-align: center !important; + text-align: center ; } } @media (min-width: 1200px) { .fs-1 { - font-size: 2.5rem !important; + font-size: 2.5rem ; } .fs-2 { - font-size: 2rem !important; + font-size: 2rem ; } .fs-3 { - font-size: 1.75rem !important; + font-size: 1.75rem ; } .fs-4 { - font-size: 1.5rem !important; + font-size: 1.5rem ; } } @media print { .d-print-inline { - display: inline !important; + display: inline ; } .d-print-inline-block { - display: inline-block !important; + display: inline-block ; } .d-print-block { - display: block !important; + display: block ; } .d-print-grid { - display: grid !important; + display: grid ; } .d-print-table { - display: table !important; + display: table ; } .d-print-table-row { - display: table-row !important; + display: table-row ; } .d-print-table-cell { - display: table-cell !important; + display: table-cell ; } .d-print-flex { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; + display: -webkit-box ; + display: -ms-flexbox ; + display: flex ; } .d-print-inline-flex { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; - display: inline-flex !important; + display: -webkit-inline-box ; + display: -ms-inline-flexbox ; + display: inline-flex ; } .d-print-none { - display: none !important; + display: none ; } } @@ -13824,7 +13755,7 @@ span.minicolors-swatch-color { } html { - background-color: hsl(0, 0%, 100%); + background-color: var(--body-bg); } body { @@ -14129,7 +14060,7 @@ meter { padding: 0.5em; color: var(--color-primary, hsl(220, 67%, 20%)); pointer-events: all; - background-color: var(--white, hsl(0, 0%, 100%)); + background-color: var(--white, var(--body-color)); border: 1px solid var(--color-primary, hsl(220, 67%, 20%)); border-radius: 0.25rem; opacity: 0; @@ -14144,9 +14075,9 @@ meter { .back-to-top-link:active, .back-to-top-link:focus { - color: var(--white, hsl(0, 0%, 100%)); + color: var(--white, var(--body-color)); background-color: var(--color-active); - border-color: var(--white, hsl(0, 0%, 100%)); + border-color: var(--white, var(--body-color)); } .container-banner img { @@ -14156,7 +14087,7 @@ meter { .container-banner .banner-overlay { height: 70vh; - color: hsl(0, 0%, 100%); + color: var(--body-color); background-repeat: no-repeat; background-attachment: fixed; background-position: top, center; @@ -14193,7 +14124,7 @@ meter { height: 4px; margin: 1rem auto 2rem; content: ""; - background: hsl(0, 0%, 100%); + background: var(--body-color); } .container-banner .banner-overlay .overlay .text-thin .lead { @@ -14208,14 +14139,8 @@ meter { .footer { margin-top: 1em; - color: hsl(0, 0%, 100%); - background-color: var(--color-primary); - background-image: -o-linear-gradient(315deg, var(--color-primary) 0%, var(--color-active) 100%) - /* rtl: linear-gradient(135deg, var(--color-active) 0%, var(--color-primary) 100%) */ - ; - background-image: linear-gradient(135deg, var(--color-primary) 0%, var(--color-active) 100%) - /* rtl: linear-gradient(135deg, var(--color-active) 0%, var(--color-primary) 100%) */ - ; + color: var(--body-color); + background: var(--color-primary); } .footer .grid-child { @@ -14255,7 +14180,7 @@ meter { .form-control { max-width: 100%; - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); } .form-control.input-xlarge { @@ -14333,7 +14258,7 @@ td .form-control { margin: 0.5em; color: hsl(0, 0%, 0%); text-align: start; - background: hsl(0, 0%, 100%); + background: var(--body-color); border: 1px solid hsl(210, 7%, 46%); border-radius: 0.25rem; -webkit-box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.8); @@ -14425,7 +14350,7 @@ fieldset>* { .container-header { position: relative; - z-index: 10; + z-index: 100; background: var(--header-background-image); background-size: var(--header-background-size); -webkit-box-shadow: 0 5px 5px hsla(0, 0%, 0%, 0.03) inset; @@ -14435,22 +14360,22 @@ fieldset>* { @media (max-width: 991.98px) { .container-header { - position: relative !important; + position: relative ; } } .container-header .grid-child { - padding: var(--border); + padding: var(--padding-x) var(--padding-y); } .container-header nav { padding: 0; - margin-top: 0.5em; + margin-top: 0.25em; } .container-header .site-description { font-size: 1rem; - color: hsl(0, 0%, 100%); + color: var(--body-color); white-space: normal; } @@ -14486,7 +14411,7 @@ fieldset>* { justify-content: space-between; padding-bottom: 0.3em; background-color: var(--nav-bg-color); - border-width: var(--border) 0; + border-width: var(--border-width); border-top: solid var(--accent-color-primary); border-bottom: solid var(--accent-color-secondary); border-left: none; @@ -14494,10 +14419,8 @@ fieldset>* { } @media (max-width: 767.98px) { - - .container-header .container-nav .container-search, .container-header .container-nav nav { - margin-top: 1em; + margin-top: 0.4rem; } } @@ -14657,13 +14580,8 @@ li.current a { } .container-header .navbar-toggler { - color: hsl(0, 0%, 100%); + color: var(--body-color); cursor: pointer; - border: 1px solid hsl(0, 0%, 100%); -} - -.container-header .navbar-toggler .fas { - font-size: 1.5rem; } .container-header .container-search { @@ -14671,11 +14589,11 @@ li.current a { } .container-header .mod-finder { - color: hsl(0, 0%, 100%); + color: var(--body-color); } .container-header .mod-finder a { - color: hsl(0, 0%, 100%); + color: var(--body-color); } .container-header .mod-finder a:active, @@ -14688,13 +14606,13 @@ li.current a { } .container-header .mod-finder .awesomplete>ul { - background: -webkit-gradient(linear, left top, right bottom, from(hsl(0, 0%, 100%)), to(hsla(0, 0%, 100%, 0.9))); - background: -o-linear-gradient(top left, hsl(0, 0%, 100%), hsla(0, 0%, 100%, 0.9)); - background: linear-gradient(to bottom right, hsl(0, 0%, 100%), hsla(0, 0%, 100%, 0.9)); + background: -webkit-gradient(linear, left top, right bottom, from(var(--body-color)), to(hsla(0, 0%, 100%, 0.9))); + background: -o-linear-gradient(top left, var(--body-color), hsla(0, 0%, 100%, 0.9)); + background: linear-gradient(to bottom right, var(--body-color), hsla(0, 0%, 100%, 0.9)); } .icon-white { - color: hsl(0, 0%, 100%); + color: var(--body-color); } .input-group-text::before { @@ -14717,8 +14635,7 @@ li.current a { font-size: 1.1rem; line-height: 22px; color: hsl(210, 14%, 83%); - border: 2px solid var(--border); - border-radius: 50%; + border: 0; } .tbody-icon .icon-publish, @@ -14787,13 +14704,78 @@ iframe { position: relative; } +/* HERO CONTAINER */ +.hero-overlay { + position: relative; + overflow: hidden; + isolation: isolate; +} + +/* BACKGROUND IMAGE LAYER (inherits from parent hero section) */ +.hero-overlay::before { + content: ""; + position: absolute; + inset: 0; + z-index: -2; + + background-position: center; + background-size: cover; + background-repeat: no-repeat; + + transform: scale(1.02); +} + +/* CENTER SOFTENING LAYER */ +.hero-overlay::after { + content: ""; + position: absolute; + inset: 0; + z-index: -1; + + -webkit-backdrop-filter: blur(8px) saturate(0.9) brightness(1.12); + backdrop-filter: blur(8px) saturate(0.9) brightness(1.12); + + -webkit-mask-image: radial-gradient( + circle at 50% 45%, + rgba(0,0,0,1) 0%, + rgba(0,0,0,1) 38%, + rgba(0,0,0,0) 72% + ); + mask-image: radial-gradient( + circle at 50% 45%, + rgba(0,0,0,1) 0%, + rgba(0,0,0,1) 38%, + rgba(0,0,0,0) 72% + ); + + pointer-events: none; +} + +/* TEXT OVERLAY PANEL */ +.hero-overlay .overlay { + position: relative; + z-index: 0; + + border-top: var(--border-width) var(--border-style) var(--accent-color-primary); + border-bottom: var(--border-width) var(--border-style) var(--accent-color-secondary); + + background-color: rgba(111, 117, 123, 0.55); + background-image: linear-gradient( + 180deg, + rgba(255,255,255,0.12), + rgba(0,0,0,0.18) + ); +} + + + .container-topbar { - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: var(--color-primary); } .container-topbar a { - color: hsl(0, 0%, 100%) !important; + color: var(--body-color) ; } @@ -14931,7 +14913,7 @@ iframe { padding: 1vw 2vw; margin-bottom: 1rem; color: #495057; - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); border: 1px solid #b2bfcd; } @@ -14941,7 +14923,7 @@ iframe { padding: 0 0.5rem; font-weight: 700; color: #495057; - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); } .modal .btn { @@ -14950,12 +14932,12 @@ iframe { .modal .btn-primary:not([href]), .modal .btn-success:not([href]) { - color: hsl(0, 0%, 100%); + color: var(--body-color); } .modal .btn-primary:not([href]):active, .modal .btn-success:not([href]):active { - color: hsl(0, 0%, 100%); + color: var(--body-color); } .modal-header { @@ -15200,7 +15182,7 @@ ul.tags { .items-leading .item-image { max-width: 100%; - width: 100% !important; + width: 100% ; } @supports (display: grid) { @@ -15394,7 +15376,7 @@ joomla-alert { min-height: 43px; padding: 0.25rem; color: #495057; - background: hsl(0, 0%, 100%); + background: var(--body-color); -webkit-box-shadow: -3px -2px 22px #ddd; box-shadow: -3px -2px 22px #ddd; } @@ -15436,7 +15418,7 @@ joomla-alert { font-size: 1rem; line-height: 2.45rem; color: #495057; - background: hsl(0, 0%, 100%); + background: var(--body-color); border-color: hsl(210, 11%, 71%); } @@ -15537,7 +15519,7 @@ joomla-alert { joomla-tab[view=accordion] .col-md-9, joomla-tab[view=accordion] .col-md-3 { - padding: 0.5rem 1rem !important; + padding: 0.5rem 1rem ; } #myTab { @@ -15619,16 +15601,10 @@ body { body.wrapper-fluid .site-grid { grid-template-columns: [full-start] minmax(0, 1fr) [main-start] repeat(4, minmax(0, 25%)) [main-end] minmax(0, 1fr) [full-end]; grid-gap: 0 2em; - background-image: url(../images/teaser_bg_sm.png); - background-repeat: repeat-x; -} - -[data-bs-theme="dark"] body .site-grid { - background-image: none; } body.wrapper-fluid .grid-child { - //max-width: none; + max-width: none; } body.wrapper-fluid header>.grid-child, @@ -15637,12 +15613,9 @@ body.wrapper-fluid footer>.grid-child { padding-left: 2em; padding-top: 0; padding-bottom: 0; - //margin-left: 6em; - //margin-right: 6em; } body.wrapper-fluid header>.grid-child { - //padding:0; margin: 0; } @@ -15670,7 +15643,15 @@ body:not(.has-sidebar-right) .site-grid .container-component { @supports (display: grid) { .site-grid { display: grid; - grid-template-areas: ". banner banner banner banner ."". top-a top-a top-a top-a ."". top-b top-b top-b top-b ."". comp comp comp comp ."". side-r side-r side-r side-r ."". side-l side-l side-l side-l ."". bot-a bot-a bot-a bot-a ."". bot-b bot-b bot-b bot-b ."; + grid-template-areas: + ". banner banner banner banner ." + ". top-a top-a top-a top-a ." + ". top-b top-b top-b top-b ." + ". comp comp comp comp ." + ". side-l side-l side-l side-l ." + ". side-r side-r side-r side-r ." + ". bot-a bot-a bot-a bot-a ." + ". bot-b bot-b bot-b bot-b ."; grid-template-columns: [full-start] minmax(0, 1fr) [main-start] repeat(4, minmax(0, 19.875rem)) [main-end] minmax(0, 1fr) [full-end]; grid-gap: 0 1em; } @@ -15774,7 +15755,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { } .awesomplete>ul { - z-index: 1000 !important; + z-index: 1000 ; } .btn:focus, @@ -15820,7 +15801,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { .article-info .association .btn-secondary, .cat-list-association .btn-secondary { font-weight: 700; - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: hsl(210, 7%, 46%); border-color: hsl(210, 14%, 83%); } @@ -15829,7 +15810,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { .article-info .association .btn-secondary:focus, .cat-list-association .btn-secondary:active, .cat-list-association .btn-secondary:focus { - color: hsl(0, 0%, 100%); + color: var(--body-color); background-color: hsl(210, 10%, 23%); } @@ -15873,19 +15854,19 @@ body:not(.has-sidebar-right) .site-grid .container-component { .form-select[multiple], [multiple].custom-select { padding: 0; - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); } .form-select[multiple] option, [multiple].custom-select option { padding: 0.3rem 1rem; - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); } .form-select[multiple] option:checked, [multiple].custom-select option:checked { - color: hsl(0, 0%, 100%); - background-color: var(--color-primary) !important; + color: var(--body-color); + background-color: var(--color-primary) ; } .form-select.form-select-success, @@ -15901,7 +15882,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { .form-select.custom-select-success option, .custom-select-success.custom-select option { color: hsl(210, 11%, 15%); - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); } .form-select.form-select-danger, @@ -15917,7 +15898,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { .form-select.custom-select-danger option, .custom-select-danger.custom-select option { color: hsl(210, 11%, 15%); - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); } .form-select optgroup, @@ -15925,7 +15906,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { .form-select option, .custom-select option { color: var(--dark); - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); } .accordion .card-header { @@ -15942,7 +15923,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { .dropdown-menu { padding: 0.2rem 0; margin-top: 0.5rem; - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); border-color: hsl(210, 14%, 89%); } @@ -15969,7 +15950,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { } .list-group-item { - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); } .list-unstyled .list-unstyled { @@ -16077,8 +16058,8 @@ body:not(.has-sidebar-right) .site-grid .container-component { border: 1px solid hsl(210, 14%, 89%); border-bottom: 0; border-radius: 0.25rem 0.25rem 0 0; - -webkit-box-shadow: 0 1px hsl(0, 0%, 100%) inset, 0 2px 3px -3px hsla(0, 0%, 0%, 0.15), 0 -4px 0 hsla(0, 0%, 0%, 0.05) inset, 1px 1px 4px hsla(0, 0%, 0%, 0.1); - box-shadow: 0 1px hsl(0, 0%, 100%) inset, 0 2px 3px -3px hsla(0, 0%, 0%, 0.15), 0 -4px 0 hsla(0, 0%, 0%, 0.05) inset, 1px 1px 4px hsla(0, 0%, 0%, 0.1); + -webkit-box-shadow: 0 1px var(--body-color) inset, 0 2px 3px -3px hsla(0, 0%, 0%, 0.15), 0 -4px 0 hsla(0, 0%, 0%, 0.05) inset, 1px 1px 4px hsla(0, 0%, 0%, 0.1); + box-shadow: 0 1px var(--body-color) inset, 0 2px 3px -3px hsla(0, 0%, 0%, 0.15), 0 -4px 0 hsla(0, 0%, 0%, 0.05) inset, 1px 1px 4px hsla(0, 0%, 0%, 0.1); } .nav.nav-tabs .nav-item { @@ -16139,7 +16120,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { .nav-tabs+.tab-content { padding: 15px; - background: hsl(0, 0%, 100%); + background: var(--body-color); border: 1px solid; border-color: hsl(210, 14%, 89%); border-radius: 0 0 0.25rem 0.25rem; @@ -16182,8 +16163,8 @@ body:not(.has-sidebar-right) .site-grid .container-component { line-height: 1.5; color: hsl(210, 11%, 15%); vertical-align: middle; - background: hsl(210, 16%, 93%) url("../images/select-bg.svg") no-repeat right 1rem center; - background-image: none \9; + background: hsl(210, 16%, 93%) url("../images/select-bg.svg") no-repeat right .1rem center; + background-image: none; background-size: 116rem; border: 1px solid hsl(210, 14%, 83%); -webkit-box-shadow: none; @@ -16192,6 +16173,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { -moz-appearance: none; appearance: none; border-radius: 0.25rem; + width:100%; } .chosen-container.chosen-container-single .chosen-single abbr { @@ -16209,11 +16191,11 @@ body:not(.has-sidebar-right) .site-grid .container-component { } .chosen-container.chosen-container-single .chosen-single div b { - background: none !important; + background: none ; } .chosen-container.chosen-container-single .chosen-drop { - background: hsl(0, 0%, 100%); + background: var(--body-color); border: 1px solid hsl(210, 14%, 83%); } @@ -16231,12 +16213,12 @@ body:not(.has-sidebar-right) .site-grid .container-component { min-height: calc(1.5em + 1.2rem + 2px); font-size: 1rem; line-height: 1.5; - background-image: hsl(0, 0%, 100%); + background-image: var(--body-color); } .chosen-container.chosen-container-multi .chosen-choices li.search-choice { padding: 5px 33px 5px 10px; - color: hsl(0, 0%, 100%); + color: var(--body-color); background: var(--primary); border: 0; -webkit-box-shadow: 1px 1px 4px hsla(0, 0%, 0%, 0.1); @@ -16250,7 +16232,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { width: 20px; height: 100%; background: hsla(0, 0%, 0%, 0.2); - background-image: none !important; + background-image: none ; } .chosen-container.chosen-container-multi .chosen-choices li.search-choice .search-choice-close::before { @@ -16258,7 +16240,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { top: 6px; right: 5px; font-size: 1rem; - color: hsl(0, 0%, 100%); + color: var(--body-color); content: "×"; } @@ -16268,21 +16250,21 @@ body:not(.has-sidebar-right) .site-grid .container-component { } .chosen-container-single { - width: auto !important; + width: auto ; } .card .chosen-container.chosen-container-single { - width: 100% !important; + width: 100% ; } .card .chosen-container.chosen-container-single .chosen-single { - width: 100% !important; + width: 100% ; } .gu-mirror { - position: fixed !important; - z-index: 9999 !important; - margin: 0 !important; + position: fixed ; + z-index: 9999 ; + margin: 0 ; background-color: hsl(120, 73%, 75%); opacity: 0.8; } @@ -16425,7 +16407,7 @@ body:not(.has-sidebar-right) .site-grid .container-component { .metismenu.mod-menu .mm-collapse { position: absolute; - background-color: hsl(0, 0%, 100%); + background-color: var(--body-color); -webkit-box-shadow: 1px 1px 4px hsla(0, 0%, 0%, 0.1); box-shadow: 1px 1px 4px hsla(0, 0%, 0%, 0.1); } @@ -16576,15 +16558,15 @@ body:not(.has-sidebar-right) .site-grid .container-component { } .tox { - white-space: nowrap !important; + white-space: nowrap ; } :root { --template-sidebar-bg: var(--template-bg-dark-80); - --template-sidebar-font-color: hsl(0, 0%, 100%); - --template-sidebar-link-color: hsl(0, 0%, 100%); + --template-sidebar-font-color: var(--body-color); + --template-sidebar-link-color: var(--body-color); --template-bg-light: #f0f4fb; - --template-text-light: hsl(0, 0%, 100%); + --template-text-light: var(--body-color); --template-special-color: #132f53; --template-link-color: #2a69b8; --template-link-active-color: #173a65; @@ -16608,127 +16590,127 @@ body:not(.has-sidebar-right) .site-grid .container-component { } .border-primary { - border-color: var(--primary) !important; + border-color: var(--primary) ; } .border-secondary { - border-color: var(--secondary) !important; + border-color: var(--secondary) ; } .border-success { - border-color: var(--success) !important; + border-color: var(--success) ; } .border-info { - border-color: var(--info) !important; + border-color: var(--info) ; } .border-warning { - border-color: var(--warning) !important; + border-color: var(--warning) ; } .border-danger { - border-color: var(--danger) !important; + border-color: var(--danger) ; } .border-light { - border-color: var(--light) !important; + border-color: var(--light) ; } .border-dark { - border-color: var(--dark) !important; + border-color: var(--dark) ; } .border-white { - border-color: var(--white) !important; + border-color: var(--white) ; } .text-primary { - color: var(--primary) !important; + color: var(--primary) ; } .text-secondary { - color: var(--secondary) !important; + color: var(--secondary) ; } .text-success { - color: var(--success) !important; + color: var(--success) ; } .text-info { - color: var(--info) !important; + color: var(--info) ; } .text-warning { - color: var(--warning) !important; + color: var(--warning) ; } .text-danger { - color: var(--danger) !important; + color: var(--danger) ; } .text-light { - color: var(--light) !important; + color: var(--light) ; } .text-dark { - color: var(--dark) !important; + color: var(--dark) ; } .text-black { - color: var(--black) !important; + color: var(--black) ; } .text-white { - color: var(--white) !important; + color: var(--white) ; } .text-body { - color: var(--body-color) !important; + color: var(--body-color) ; } .bg-primary { - background-color: var(--primary) !important; + background-color: var(--primary) ; } .bg-secondary { - background-color: var(--secondary) !important; + background-color: var(--secondary) ; } .bg-success { - background-color: var(--success) !important; + background-color: var(--success) ; } .bg-info { - background-color: var(--info) !important; + background-color: var(--info) ; } .bg-warning { - background-color: var(--warning) !important; + background-color: var(--warning) ; } .bg-danger { - background-color: var(--danger) !important; + background-color: var(--danger) ; } .bg-light { - background-color: var(--light) !important; + background-color: var(--light) ; } .bg-dark { - background-color: var(--dark) !important; + background-color: var(--dark) ; } .bg-black { - background-color: var(--black) !important; + background-color: var(--black) ; } .bg-white { - background-color: var(--white) !important; + background-color: var(--white) ; } .bg-body { - background-color: var(--body-bg) !important; + background-color: var(--body-bg) ; } /*! VM BASIC */ @@ -16791,10 +16773,6 @@ body:not(.has-sidebar-right) .site-grid .container-component { color: #A0A0A0; } -.text-secondary { - color: #A0A0A0 !important; -} - .form-control, .form-select { font-size: 14px @@ -16805,19 +16783,6 @@ form .form-select { border-color: #C7C7C7 } -/*! - * Bootstrap Table of Contents v1.0.1 (http://afeld.github.io/bootstrap-toc/) - * Copyright 2015 Aidan Feldman - * Licensed under MIT (https://github.com/afeld/bootstrap-toc/blob/gh-pages/LICENSE) - * - * Custom layout/styling modifications by Moko Consulting - * © 2025 Moko Consulting — All Rights Reserved - * Website: https://mokoconsulting.tech - * Email: hello@mokoconsulting.tech - * Phone: +1 (931) 279-6313 - */ - - /* --- TOC right-rail container (non-invasive) --- */ .container-toc-right { float: right; @@ -16915,7 +16880,7 @@ form .form-select { } .container-below-topbar { - padding: var(--border) !important; + padding: var(--padding-x) var(--padding-y); background-image: var(--container-below-topbar-bg-image); background-color: var(--container-below-topbar-bg-color); background-size: var(--container-below-topbar-bg-size); @@ -16930,8 +16895,8 @@ form .form-select { } .container-top-a { - padding-left: var(--border); - padding-right: var(--border); + padding-left: var(--padding-x); + padding-right: var(--padding-x); background-image: var(--container-top-a-bg-image); background-color: var(--container-top-a-bg-color); background-size: var(--container-top-a-bg-size); @@ -16945,8 +16910,8 @@ form .form-select { } .container-top-b { - padding-left: var(--border); - padding-right: var(--border); + padding-left: var(--padding-x); + padding-right: var(--padding-x); background-image: var(--container-top-b-bg-image); background-color: var(--container-top-b-bg-color); background-size: var(--container-top-b-bg-size); @@ -16961,8 +16926,8 @@ form .form-select { .container-sidebar-left, .container-sidebar-right { - padding-left: var(--border); - padding-right: var(--border); + padding-left: var(--padding-x); + padding-right: var(--padding-x); background-image: var(--container-sidebar-bg-image); background-color: var(--container-sidebar-bg-color); background-size: var(--container-sidebar-bg-size); @@ -16976,8 +16941,8 @@ form .form-select { } .container-bottom-a { - padding-left: var(--border); - padding-right: var(--border); + padding-left: var(--padding-x); + padding-right: var(--padding-x); background-image: var(--container-bottom-a-bg-image); background-color: var(--container-bottom-a-bg-color); background-size: var(--container-bottom-a-bg-size); @@ -16991,8 +16956,8 @@ form .form-select { } .container-bottom-b { - padding-left: var(--border); - padding-right: var(--border); + padding-left: var(--padding-x); + padding-right: var(--padding-x); background-image: var(--container-bottom-b-bg-image); background-color: var(--container-bottom-b-bg-color); background-size: var(--container-bottom-b-bg-size); @@ -17012,7 +16977,7 @@ form .form-select { display: flex; align-items: center; gap: .5rem; - padding: .5rem .75rem; + padding: calc(var(--padding-x, 0.25rem) * 2) calc(var(--padding-y, 0.25rem) * 3) calc(var(--padding-x, 0.25rem) * 2) calc(var(--padding-y, 0.25rem) * 8); border-radius: 999px; border: none; background: var(--muted-color); @@ -17082,9 +17047,8 @@ button#mokoThemeSwitch { font-size: .875rem; } -#mokoThemeFab.debug-outline { - outline: 2px dashed var(--pink); - outline-offset: 2px; +#mokoThemeFab button { + color: var(--white); } body.site.error-page { @@ -17107,107 +17071,107 @@ body.site.error-page { border-radius: 14px; padding: 2rem; background: var(--template-bg-light, #fff); +} +.error-brand { + display: flex; + align-items: center; + gap: 1rem; + margin-bottom: 1rem; +} - .error-brand { - display: flex; - align-items: center; - gap: 1rem; - margin-bottom: 1rem; - } +.error-brand .brand-logo { + background-color: invert(var(--body-bg)); + padding: var(--border-radius-sxl); + border-radius: var(--border-radius-2xl); +} - .error-brand .brand-logo { - background-color: invert(var(--body-bg)); - padding: var(--border-radius-sxl); - border-radius: var(--border-radius-2xl); - } +.error-brand .logo { + max-height: 48px; + width: auto; + display: block; +} - .error-brand .logo { - max-height: 48px; - width: auto; - display: block; - } +.error-title { + margin: 0.5rem 0 0; + font-size: clamp(1.5rem, 2vw + 1rem, 2.25rem); + font-weight: 700; +} - .error-title { - margin: 0.5rem 0 0; - font-size: clamp(1.5rem, 2vw + 1rem, 2.25rem); - font-weight: 700; - } +.error-code { + opacity: .75; + font-weight: 600; +} - .error-code { - opacity: .75; - font-weight: 600; - } +.error-actions { + display: flex; + flex-wrap: wrap; + gap: .75rem; + margin-top: 1.25rem; +} - .error-actions { - display: flex; - flex-wrap: wrap; - gap: .75rem; - margin-top: 1.25rem; - } +.moko-offline-wrap { + min-height: 100vh; + display: grid; + grid-template-rows: auto 1fr auto; +} - .moko-offline-wrap { - min-height: 100vh; - display: grid; - grid-template-rows: auto 1fr auto; - } +.moko-offline-main { + display: grid; + place-items: center; + padding: 2rem 1rem; +} - .moko-offline-main { - display: grid; - place-items: center; - padding: 2rem 1rem; - } +.moko-card { + max-width: 720px; + width: 100%; +} - .moko-card { - max-width: 720px; - width: 100%; - } +.moko-brand { + display: flex; + align-items: center; + gap: .75rem; + text-decoration: none; +} - .moko-brand { - display: flex; - align-items: center; - gap: .75rem; - text-decoration: none; - } +.moko-brand .brand-tagline { + display: block; + opacity: .75; + font-size: .875rem; + line-height: 1.2; +} - .moko-brand .brand-tagline { - display: block; - opacity: .75; - font-size: .875rem; - line-height: 1.2; - } +.theme-switcher .dropdown-item.active { + font-weight: 600; +} - .theme-switcher .dropdown-item.active { - font-weight: 600; - } +.skip-link { + position: absolute; + left: -9999px; + top: auto; + width: 1px; + height: 1px; + overflow: hidden; +} - .skip-link { - position: absolute; - left: -9999px; - top: auto; - width: 1px; - height: 1px; - overflow: hidden; - } +.skip-l ink:focus { + position: static; + width: auto; + height: auto; + padding: .5rem 1rem; +} - .skip-l ink:focus { - position: static; - width: auto; - height: auto; - padding: .5rem 1rem; - } +.btn { + display: inline-flex; + align-items: center; + gap: .5rem; + border: 1px solid color-mix(in srgb, currentColor 20%, transparent); + border-radius: 8px; + padding: .5rem .9rem; + text-decoration: none; +} - .btn { - display: inline-flex; - align-items: center; - gap: .5rem; - border: 1px solid color-mix(in srgb, currentColor 20%, transparent); - border-radius: 8px; - padding: .5rem .9rem; - text-decoration: none; - } - - #mokoThemeFab .knob { +#mokoThemeFab .knob { position: absolute; top: 2px; left: 2px; @@ -17241,3 +17205,1122 @@ button#mokoThemeSwitch { outline: 2px dashed var(--pink); outline-offset: 2px; } + +html.component body{ + padding-top: 50px; +} + +code { + background-color: var(--gab-gray1); +} + +#view_gabble { + background-color: var(--gab-blue); + padding: 6px; + border-radius: 6px; +} + +#mod_gabble { + background-color: var(--gab-blue); + padding: 3px; + border-radius: 6px; +} + +#lists_gabble { + position: relative; + height: 100%; + border: 4px solid var(--gab-red); + background-color: var(--gab-green); + padding: 4px; + border-radius: 6px; +} + +#select_list { + margin-left: 0px; + width: 100%; + padding: 4px; + border-radius: 6px 6px 0px 0px; +} + +#options_list { + width: 100%; + padding: 4px; +} + +#frame_list { + width: 100%; + height: 484px; + padding: 4px; + border-radius: 0px 0px 6px 6px; +} + +#windows_list { + margin-left: 0px; + width: 100%; + border: 4px solid var(--gab-red); + background-color: var(--gab-green); + padding: 4px; + border-radius: 6px; +} + +#frame_window { + width: 100%; +} + +#openai_btn { + position: absolute; + right: 10px; + bottom: 10px; + visibility: hidden; + width: 34px; + height: 34px; + cursor: pointer; + border: 3px solid var(--gab-gray3); + background-color: #FFF; + border-radius: 17px; +} + +#openai_btn:hover { + width: 36px; + height: 36px; + border: 3px solid var(--gab-gray3); + border-radius: 18px; +} + +#openai_logo_anim { + position: absolute; + top: 15px; + right: 15px; + width: 35px; + height: 35px; + padding: 2px; + z-index: 1; + border-radius: 10px; +} + +.openai_logo_sm { + width: 22px; + height: 22px; + background-color: #FFF; + border: 3px solid #FFF; + border-radius: 11px; +} + +.openai_logo_md { + width: 34px; + height: 34px; + background-color: #FFF; + border: 4px solid #FFF; + border-radius: 17px; +} + +.btn_on_com { + position: absolute; + bottom: -2px; + left: -2px; + width: 12px; + height: 12px; + background-color: #448344; + border-radius: 6px; +} + +.btn_on_mod { + position: absolute; + top: 0px; + left: 0px; + width: 12px; + height: 12px; + background-color: #448344; + border-radius: 6px; +} + +.button_list { + border: none; + width:100%; + outline: none; + background-color: var(--gab-gray1); + padding: 6px; + border-radius: 6px; +} + +.button_list:hover { + background-color: var(--gab-gray2); +} + +.button_list_s { + border: none; + width: 100%; + outline: none; + cursor: pointer; + color: #FFF; + background-color: var(--gab-red); + padding: 6px; + border-radius: 6px; +} + +.window_list { + position: relative; + margin: 4px; + width: 100%; + border: none; + outline: none; + cursor: pointer; + text-align: left; + background-color: var(--gab-gray1); + padding: 6px; + border-radius: 6px; +} + +.window_list:hover { + background-color: var(--gab-gray2); +} + +.window_list_s { + position: relative; + margin: 4px; + width: 100%; + border: none; + outline: none; + cursor: pointer; + text-align: left; + color: #FFF; + background-color: var(--gab-red); + padding: 6px; + border-radius: 6px; +} + +.btn_close { + position: absolute; + right: 4px; + top: 10px; + padding-left: 1px; + width: 16px; + height: 16px; + color: #000; + font-size: 10px; + text-align: center; + background-color: var(--gab-gray2); + border-radius: 8px; +} + +.btn_close:hover { + background-color: var(--gab-gray3); +} + +.iframe_list { + width: 100%; + height: 100%; + background-color: #FFF; + border: 4px solid var(--gab-red); + border-radius: 6px; +} + +.iframe_messages { + width: 100%; + height: 100%; + background-color: #FFF; + border: 4px solid var(--gab-red); + border-radius: 6px; +} + +.input_box { + position: relative; +} + +.input_emoji { + position: absolute; + right: 48px; + top: 11px; + cursor: pointer; + color: var(--gab-gray2); +} + +.input_emoji:hover { + color: var(--gab-gray3); +} + +.emoji { + display: inline-block; + float: left; + cursor: pointer; + padding: 2px; + background-color: #FFF; +} + +.emoji:hover { + background-color: var(--gab-orange); +} + +.emojis_div { + position: absolute; + top: -92px; + right: 0px; + width: 200px; + height: 92px; + border: 4px solid var(--gab-red); + background-color: var(--gab-gray1); + border-radius: 6px; +} + +.msg-button-on { + margin-left: 5px; + width: 30px; + height: 30px; + font-size: 20px; + text-align: center; + color: #FFF; + background-color: var(--gab-orange); + border-radius: 15px; +} + +.msg-button-off { + margin-left: 5px; + width: 30px; + height: 30px; + font-size: 20px; + text-align: center; + color: #FFF; + background-color: var(--gab-gray2); + border-radius: 15px; +} + +.taba-content { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; +} + +.msg-input { + padding-left: 10px; + padding-right: 26px; + width: calc(100% - 35px); + height: 30px; + border-radius: 15px; +} + +.main-windows { + position: fixed; + margin-bottom: 10px; + bottom: 0px; + right: 90px; + z-index: 901; +} + +.list-windows { + position: fixed; + bottom: 0px; + right: 0px; + width: 50px; + margin-bottom: 20px; + margin-right: 20px; + z-index: 901; +} + +.item-list { + display: inline-block; + color: #F5F5F5; + margin-top: 5px; + width: 50px; + height: 50px; + font-size: 30px; + text-align: center; + border: 3px solid var(--gab-red); + background-color: var(--gab-blue); + border-radius: 25px; +} + +.button { + opacity: 1; +} + +.button:hover { + cursor: pointer; + opacity: .6; +} + +.notifications { + position: relative; +} + +.n-notifications { + position: absolute; + bottom: -6px; + right: -2px; + width: 18px; + height: 18px; + color: #FFF; + font-size: 11px; + font-weight: bold; + text-align: center; + background-color: #a51f18; + border-radius: 9px; +} + +.m-notifications { + position: absolute; + top: -6px; + right: -2px; + width: 18px; + height: 18px; + color: #FFF; + font-size: 11px; + font-weight: bold; + text-align: center; + background-color: #a51f18; + border-radius: 9px; +} + +.window { + display: inline-block; + margin-left: 8px; + width: 280px; + height: 420px; +} + +.window-com { + margin-top: 6px; + width: 100%; + height: 480px; +} + +.window-title { + margin-left: 5px; + display: inline-block; + color: #FFF; +} + +.window-title-com { + margin-left: 5px; + display: inline-block; + color: #000; +} + +.window-icon { + display: inline-block; + color: #FFF; +} + +.window-header { + padding: 6px; + width: 100%; + height: 40px; + background-color: var(--gab-blue); + border-radius: 8px 8px 0px 0px; +} + +.window-header-com { + padding: 4px; + width: 100%; + height: 35px; + background-color: var(--gab-red); + border-radius: 8px 8px 0px 0px; +} + +.window-content { + position: relative; + display: block; + width: 100%; + height: calc(100% - 80px); + background-color: #DDD; +} + +.content-footer { + position: relative; + padding: 5px; + width: 100%; + height: 40px; + background-color: #DDD; + border-radius: 0px 0px 8px 8px; +} + +.taba-btn { + text-align: center; + display: inline-block; + margin-left: 5px; + float: right; + width: 24px; + height: 24px; + background-color: #DDD; + border-radius: 12px; +} + +.taba-hover { + cursor: pointer; + opacity: 1; +} + +.taba-hover:hover { + opacity: 0.6; +} + +.taba-self { + border: 1px solid #FFF; + background-color: #7ac143; + padding: 6px; + padding-top: 9px; + border-radius: 10px; +} + +.taba-others { + border: 1px solid #FFF; + background-color: #5091cd; + padding: 6px; + padding-top: 9px; + border-radius: 10px; +} + + + +.taba-bot { + border: 1px solid #FFF; + background-color: var(--gab-gray3); + padding: 6px; + padding-top: 9px; + border-radius: 10px; +} + +.taba-dice { + border: 1px solid #FFF; + background-color: #f44321; + padding: 6px; + border-radius: 10px; +} + +.taba-emoji { + border: 1px solid #FFF; + background-color: #5091cd; + padding: 6px; + border-radius: 10px; +} + +.taba-user { + border: 1px solid #FFF; + background-color: #FFF; + padding: 6px; + border-radius: 6px; + word-wrap: break-word; +} + +.taba-user-on { + border: 1px solid #FFF; + background-color: var(--gab-green); + padding: 6px; + border-radius: 8px; +} + +.taba-feed { + border: 1px solid #FFF; + background-color: var(--gab-blue); + padding: 6px; + border-radius: 8px; +} + +.openai_error { + border: 1px solid #FFF; + background-color: var(--gab-red); + padding: 6px; + border-radius: 8px; +} + +.taba-msgsystem { + border: 1px solid #FFF; + background-color: #AAA; + padding: 6px; + border-radius: 10px; +} + +.taba-msghead { + background-color: #f5f5f5; + padding: 4px; + padding-left: 10px; + padding-right: 6px; + border-radius: 6px 6px 0px 0px; +} + +.taba-msg { + background-color: #f5f5f5; + padding: 8px; + border-radius: 0px 8px 8px 8px; + word-wrap: break-word; +} + +nav[data-toggle=toc] .nav>li>a{ + display:block; + padding:4px 20px; + font-size:13px; + font-weight:500; + color:#767676; +} +nav[data-toggle=toc] .nav>li>a:focus,nav[data-toggle=toc] .nav>li>a:hover{ + padding-left:19px; + color:#563d7c; + text-decoration:none; + background-color:transparent; + border-left:1px solid #563d7c; +} +nav[data-toggle=toc] .nav-link.active,nav[data-toggle=toc] .nav-link.active:focus,nav[data-toggle=toc] .nav-link.active:hover{ + padding-left:18px; + font-weight:700; + color:#563d7c; + background-color:transparent; + border-left:2px solid #563d7c; +} +nav[data-toggle=toc] .nav-link+ul{ + display:none; + padding-bottom:10px; +} +nav[data-toggle=toc] .nav .nav>li>a{ + padding-top:1px; + padding-bottom:1px; + padding-left:30px; + font-size:12px; + font-weight:400; +} +nav[data-toggle=toc] .nav .nav>li>a:focus,nav[data-toggle=toc] .nav .nav>li>a:hover{ + padding-left:29px; +} +nav[data-toggle=toc] .nav .nav>li>.active,nav[data-toggle=toc] .nav .nav>li>.active:focus,nav[data-toggle=toc] .nav .nav>li>.active:hover{ + padding-left:28px; + font-weight:500; +} +nav[data-toggle=toc] .nav-link.active+ul{ + display:block; +} + + +/* =============================== += Choices = +=============================== */ +.choices { + position: relative; + overflow: hidden; + margin-bottom: 24px; + font-size: 16px; +} +.choices:focus { + outline: none; +} +.choices:last-child { + margin-bottom: 0; +} +.choices.is-open { + overflow: initial; +} +.choices.is-disabled .choices__inner, +.choices.is-disabled .choices__input { + background-color: #eaeaea; + cursor: not-allowed; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} +.choices.is-disabled .choices__item { + cursor: not-allowed; +} +.choices [hidden] { + display: none !important; +} + +.choices[data-type*=select-one] { + cursor: pointer; +} +.choices[data-type*=select-one] .choices__inner { + padding-bottom: 7.5px; +} +.choices[data-type*=select-one] .choices__input { + display: block; + width: 100%; + padding: 10px; + border-bottom: 1px solid #ddd; + background-color: #fff; + margin: 0; +} +.choices[data-type*=select-one] .choices__button { + background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg=="); + padding: 0; + background-size: 8px; + position: absolute; + top: 50%; + right: 0; + margin-top: -10px; + margin-right: 25px; + height: 20px; + width: 20px; + border-radius: 10em; + opacity: 0.25; +} +.choices[data-type*=select-one] .choices__button:hover, .choices[data-type*=select-one] .choices__button:focus { + opacity: 1; +} +.choices[data-type*=select-one] .choices__button:focus { + -webkit-box-shadow: 0 0 0 2px #00bcd4; + box-shadow: 0 0 0 2px #00bcd4; +} +.choices[data-type*=select-one] .choices__item[data-value=""] .choices__button { + display: none; +} +.choices[data-type*=select-one]::after { + content: ""; + height: 0; + width: 0; + border-style: solid; + border-color: #333 transparent transparent transparent; + border-width: 5px; + position: absolute; + right: 11.5px; + top: 50%; + margin-top: -2.5px; + pointer-events: none; +} +.choices[data-type*=select-one].is-open::after { + border-color: transparent transparent #333 transparent; + margin-top: -7.5px; +} +.choices[data-type*=select-one][dir=rtl]::after { + left: 11.5px; + right: auto; +} +.choices[data-type*=select-one][dir=rtl] .choices__button { + right: auto; + left: 0; + margin-left: 25px; + margin-right: 0; +} + +.choices[data-type*=select-multiple] .choices__inner, +.choices[data-type*=text] .choices__inner { + cursor: text; +} +.choices[data-type*=select-multiple] .choices__button, +.choices[data-type*=text] .choices__button { + position: relative; + display: inline-block; + margin-top: 0; + margin-right: -4px; + margin-bottom: 0; + margin-left: 8px; + padding-left: 16px; + border-left: 1px solid #008fa1; + background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg=="); + background-size: 8px; + width: 8px; + line-height: 1; + opacity: 0.75; + border-radius: 0; +} +.choices[data-type*=select-multiple] .choices__button:hover, .choices[data-type*=select-multiple] .choices__button:focus, +.choices[data-type*=text] .choices__button:hover, +.choices[data-type*=text] .choices__button:focus { + opacity: 1; +} + +.choices__inner { + display: inline-block; + vertical-align: top; + width: 100%; + background-color: #f9f9f9; + padding: 7.5px 7.5px 3.75px; + border: 1px solid #ddd; + border-radius: 2.5px; + font-size: 14px; + min-height: 44px; + overflow: hidden; +} +.is-focused .choices__inner, .is-open .choices__inner { + border-color: #b7b7b7; +} +.is-open .choices__inner { + border-radius: 2.5px 2.5px 0 0; +} +.is-flipped.is-open .choices__inner { + border-radius: 0 0 2.5px 2.5px; +} + +.choices__list { + margin: 0; + padding-left: 0; + list-style: none; +} + +.choices__list--single { + display: inline-block; + padding: 4px 16px 4px 4px; + width: 100%; +} +[dir=rtl] .choices__list--single { + padding-right: 4px; + padding-left: 16px; +} +.choices__list--single .choices__item { + width: 100%; +} + +.choices__list--multiple { + display: inline; +} +.choices__list--multiple .choices__item { + display: inline-block; + vertical-align: middle; + border-radius: 20px; + padding: 4px 10px; + font-size: 12px; + font-weight: 500; + margin-right: 3.75px; + margin-bottom: 3.75px; + background-color: #00bcd4; + border: 1px solid #00a5bb; + color: #fff; + word-break: break-all; + -webkit-box-sizing: border-box; + box-sizing: border-box; +} +.choices__list--multiple .choices__item[data-deletable] { + padding-right: 5px; +} +[dir=rtl] .choices__list--multiple .choices__item { + margin-right: 0; + margin-left: 3.75px; +} +.choices__list--multiple .choices__item.is-highlighted { + background-color: #00a5bb; + border: 1px solid #008fa1; +} +.is-disabled .choices__list--multiple .choices__item { + background-color: #aaaaaa; + border: 1px solid #919191; +} + +.choices__list--dropdown { + visibility: hidden; + z-index: 1; + position: absolute; + width: 100%; + background-color: #fff; + border: 1px solid #ddd; + top: 100%; + margin-top: -1px; + border-bottom-left-radius: 2.5px; + border-bottom-right-radius: 2.5px; + overflow: hidden; + word-break: break-all; + will-change: visibility; +} +.choices__list--dropdown.is-active { + visibility: visible; +} +.is-open .choices__list--dropdown { + border-color: #b7b7b7; +} +.is-flipped .choices__list--dropdown { + top: auto; + bottom: 100%; + margin-top: 0; + margin-bottom: -1px; + border-radius: 0.25rem 0.25rem 0 0; +} +.choices__list--dropdown .choices__list { + position: relative; + max-height: 300px; + overflow: auto; + -webkit-overflow-scrolling: touch; + will-change: scroll-position; +} +.choices__list--dropdown .choices__item { + position: relative; + padding: 10px; + font-size: 14px; +} +[dir=rtl] .choices__list--dropdown .choices__item { + text-align: right; +} +@media (min-width: 640px) { + .choices__list--dropdown .choices__item--selectable { + padding-right: 100px; + } + .choices__list--dropdown .choices__item--selectable::after { + content: attr(data-select-text); + font-size: 12px; + opacity: 0; + position: absolute; + right: 10px; + top: 50%; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + } + [dir=rtl] .choices__list--dropdown .choices__item--selectable { + text-align: right; + padding-left: 100px; + padding-right: 10px; + } + [dir=rtl] .choices__list--dropdown .choices__item--selectable::after { + right: auto; + left: 10px; + } +} +.choices__list--dropdown .choices__item--selectable.is-highlighted { + background-color: #f2f2f2; +} +.choices__list--dropdown .choices__item--selectable.is-highlighted::after { + opacity: 0.5; +} + +.choices__item { + cursor: default; +} + +.choices__item--selectable { + cursor: pointer; +} + +.choices__item--disabled { + cursor: not-allowed; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + opacity: 0.5; +} + +.choices__heading { + font-weight: 600; + font-size: 12px; + padding: 10px; + border-bottom: 1px solid #f7f7f7; + color: gray; +} + +.choices__button { + text-indent: -9999px; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + border: 0; + background-color: transparent; + background-repeat: no-repeat; + background-position: center; + cursor: pointer; +} +.choices__button:focus { + outline: none; +} + +.choices__input { + display: inline-block; + vertical-align: baseline; + background-color: #f9f9f9; + font-size: 14px; + margin-bottom: 5px; + border: 0; + border-radius: 0; + max-width: 100%; + padding: 4px 0 4px 2px; +} +.choices__input:focus { + outline: 0; +} +[dir=rtl] .choices__input { + padding-right: 2px; + padding-left: 0; +} + +.choices__placeholder { + opacity: 0.5; +} + +/* ===== End of Choices ====== */ +.choices { + border: 1px solid hsl(210, 14%, 83%); + border-radius: 0.25rem; +} +.choices.is-focused { + border-color: #8894aa; + -webkit-box-shadow: 0 0 0 0.25rem rgba(1, 1, 86, 0.25); + box-shadow: 0 0 0 0.25rem rgba(1, 1, 86, 0.25); +} + +.choices__inner { + padding: 0.4rem 1rem; + margin-bottom: 0; + font-size: 1rem; + border: none; + border-radius: 0; +} + +.choices__input { + padding: 0; + margin-bottom: 0; + font-size: 1rem; + background-color: transparent; +} +.choices__input::-webkit-input-placeholder { + color: hsl(210, 9%, 31%); + opacity: 1; +} +.choices__input::-moz-placeholder { + color: hsl(210, 9%, 31%); + opacity: 1; +} +.choices__input:-ms-input-placeholder { + color: hsl(210, 9%, 31%); + opacity: 1; +} +.choices__input::-ms-input-placeholder { + color: hsl(210, 9%, 31%); + opacity: 1; +} +.choices__input::placeholder { + color: hsl(210, 9%, 31%); + opacity: 1; +} + +.choices__list--dropdown { + z-index: 1060; +} + +.choices__list--multiple .choices__item { + position: relative; + margin: 2px; + background-color: var(--color-primary); + -webkit-margin-end: 2px; + margin-inline-end: 2px; + border: 0; + border-radius: 0.25rem; +} +.choices__list--multiple .choices__item.is-highlighted { + background-color: var(--color-primary); + opacity: 0.9; +} + +.choices .choices__list--dropdown .choices__item { + -webkit-padding-end: 10px; + padding-inline-end: 10px; +} +.choices .choices__list--dropdown .choices__item--selectable::after { + display: none; +} + +.choices__button_joomla { + position: relative; + padding: 0 10px; + color: inherit; + text-indent: -9999px; + cursor: pointer; + background: none; + border: 0; + opacity: 0.5; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; +} +.choices__button_joomla::before { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + display: block; + text-align: center; + text-indent: 0; + content: "×"; +} +.choices__button_joomla:hover, .choices__button_joomla:focus { + opacity: 1; +} +.choices__button_joomla:focus { + outline: none; +} + +.choices[data-type*=select-one] .choices__inner, +.choices[data-type*=select-multiple] .choices__inner { + -webkit-padding-end: 3rem; + padding-inline-end: 3rem; + cursor: pointer; + background: url("../../../images/select-bg.svg") no-repeat 100%/116rem; + background-color: hsl(210, 16%, 93%); +} +[dir=rtl] .choices[data-type*=select-one] .choices__inner, +[dir=rtl] .choices[data-type*=select-multiple] .choices__inner { + background: url("../../../images/select-bg-rtl.svg") no-repeat 0/116rem; + background-color: hsl(210, 16%, 93%); +} + +.choices[data-type*=select-one] .choices__item { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + justify-content: space-between; +} +.choices[data-type*=select-one] .choices__button_joomla { + position: absolute; + top: 50%; + inset-inline-end: 0; + width: 20px; + height: 20px; + padding: 0; + -webkit-margin-before: -10px; + margin-block-start: -10px; + -webkit-margin-end: 50px; + margin-inline-end: 50px; + border-radius: 10em; + opacity: 0.5; +} +.choices[data-type*=select-one] .choices__button_joomla:hover, .choices[data-type*=select-one] .choices__button_joomla:focus { + opacity: 1; +} +.choices[data-type*=select-one] .choices__button_joomla:focus { + -webkit-box-shadow: 0 0 0 2px #00bcd4; + box-shadow: 0 0 0 2px #00bcd4; +} +.choices[data-type*=select-one]::after { + display: none; +} + +.choices[data-type*=select-multiple] .choices__input, +.choices[data-type*=text] .choices__input { + padding: 0.2rem 0; +} + +.choices__heading { + font-size: 1.2rem; +} + + +/* Base renderer for Joomla icon-* using Font Awesome Free */ +[class^="icon-"]::before, +[class*=" icon-"]::before { + --_fa-family: var(--fa-family, var(--fa-style-family, "Font Awesome 7 Free")); + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + display: var(--fa-display, inline-block); + font-family: var(--_fa-family); + font-feature-settings: normal; + font-style: normal; + font-synthesis: none; + font-variant: normal; + font-weight: var(--fa-style, 900); + line-height: 1; + text-align: center; + text-rendering: auto; + width: var(--fa-width, 1.25em); +} + +/* Ensure the icon container can render */ +[class^="icon-"], +[class*=" icon-"] { + display: inline-flex; + align-items: center; + justify-content: center; +} + +/* Icon mappings */ +.icon-menu::before { content: "\f0c9"; } /* bars */ +.icon-search::before { content: "\f002"; } +.icon-user::before { content: "\f007"; } +.icon-edit::before { content: "\f044"; } +.icon-save::before { content: "\f0c7"; } +.icon-trash::before { content: "\f1f8"; } +.icon-cancel::before { content: "\f00d"; } +.icon-check::before { content: "\f00c"; } +.icon-plus::before { content: "\f067"; } +.icon-minus::before { content: "\f068"; } diff --git a/src/media/js/template.js b/src/media/js/template.js index 950e662..0d0639f 100644 --- a/src/media/js/template.js +++ b/src/media/js/template.js @@ -11,7 +11,7 @@ VERSION: 03.05.00 BRIEF: Core JavaScript utilities and behaviors for Moko-Cassiopeia template */ - +!function(a){"use strict";window.Toc={helpers:{findOrFilter:function(e,t){var n=e.find(t);return e.filter(t).add(n).filter(":not([data-toc-skip])")},generateUniqueIdBase:function(e){return a(e).text().trim().replace(/\'/gi,"").replace(/[& +$,:;=?@"#{}|^~[`%!'<>\]\.\/\(\)\*\\\n\t\b\v]/g,"-").replace(/-{2,}/g,"-").substring(0,64).replace(/^-+|-+$/gm,"").toLowerCase()||e.tagName.toLowerCase()},generateUniqueId:function(e){for(var t=this.generateUniqueIdBase(e),n=0;;n++){var r=t;if(0')},createChildNavList:function(e){var t=this.createNavList();return e.append(t),t},generateNavEl:function(e,t){var n=a('');n.attr("href","#"+e),n.text(t);var r=a("
  • ");return r.append(n),r},generateNavItem:function(e){var t=this.generateAnchor(e),n=a(e),r=n.data("toc-text")||n.text();return this.generateNavEl(t,r)},getTopLevel:function(e){for(var t=1;t<=6;t++){if(1 + + This file is part of a Moko Consulting project. + + SPDX-License-Identifier: GPL-3.0-or-later + + This program is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation; either version 3 of the License, or + (at your option) any later version. + + This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. + + You should have received a copy of the GNU General Public License along with this program. If not, see https://www.gnu.org/licenses/ . + + # FILE INFORMATION + DEFGROUP: Joomla.Template.Site + INGROUP: Moko-Cassiopeia + REPO: https://github.com/mokoconsulting-tech/moko-cassiopeia + PATH: ./media/templates/site/moko-cassiopeia/js/user.js + VERSION: 03.00.00 + BRIEF: JavaScript for handling user-specific interactions in Moko-Cassiopeia template + */ diff --git a/src/templates/component.php b/src/templates/component.php index b990d6d..a4b0c2d 100644 --- a/src/templates/component.php +++ b/src/templates/component.php @@ -11,76 +11,212 @@ REPO: https://github.com/mokoconsulting-tech/moko-cassiopeia PATH: ./templates/moko-cassiopeia/component.php VERSION: 03.05.00 - BRIEF: Minimal component-only template file for Moko-Cassiopeia + BRIEF: Main template index file for Moko-Cassiopeia rendering site layout */ + defined('_JEXEC') or die; use Joomla\CMS\Factory; use Joomla\CMS\HTML\HTMLHelper; +use Joomla\CMS\Language\Text; +use Joomla\CMS\Uri\Uri; +use Joomla\CMS\Component\ComponentHelper; /** @var Joomla\CMS\Document\HtmlDocument $this */ -$app = Factory::getApplication(); -$wa = $this->getWebAssetManager(); +$app = Factory::getApplication(); +$input = $app->getInput(); +$document = $app->getDocument(); +$wa = $document->getWebAssetManager(); -// Color Theme -$paramsColorName = $this->params->get('colorName', 'colors_standard'); -$assetColorName = 'theme.' . $paramsColorName; -$wa->registerAndUseStyle($assetColorName, 'media/templates/site/moko-cassiopeia/css/global/' . $paramsColorName . '.css'); +// Template params +$params_LightColorName = (string) $this->params->get('colorLightName', 'colors_standard'); // colors_standard|colors_alternative|colors_custom -// Use a font scheme if set in the template style options -$paramsFontScheme = $this->params->get('useFontScheme', false); -$fontStyles = ''; +$params_DarkColorName = (string) $this->params->get('colorDarkName', 'colors_standard'); // colors_standard|colors_alternative|colors_custom -if ($paramsFontScheme) { - if (stripos($paramsFontScheme, 'https://') === 0) { +$params_googletagmanager = $this->params->get('googletagmanager', false); +$params_googletagmanagerid = $this->params->get('googletagmanagerid', null); +$params_googleanalytics = $this->params->get('googleanalytics', false); +$params_googleanalyticsid = $this->params->get('googleanalyticsid', null); +$params_custom_head_start = $this->params->get('custom_head_start', null); +$params_custom_head_end = $this->params->get('custom_head_end', null); +$params_developmentmode = $this->params->get('developmentmode', false); + +// Bootstrap behaviors (assets handled via WAM) +HTMLHelper::_('bootstrap.framework'); +HTMLHelper::_('bootstrap.alert'); +HTMLHelper::_('bootstrap.button'); +HTMLHelper::_('bootstrap.carousel'); +HTMLHelper::_('bootstrap.collapse'); +HTMLHelper::_('bootstrap.dropdown'); +HTMLHelper::_('bootstrap.modal'); +HTMLHelper::_('bootstrap.offcanvas'); +HTMLHelper::_('bootstrap.popover'); +HTMLHelper::_('bootstrap.scrollspy'); +HTMLHelper::_('bootstrap.tab'); +HTMLHelper::_('bootstrap.tooltip'); +HTMLHelper::_('bootstrap.toast'); + +// Detecting Active Variables +$option = $input->getCmd('option', ''); +$view = $input->getCmd('view', ''); +$layout = $input->getCmd('layout', ''); +$task = $input->getCmd('task', ''); +$itemid = $input->getCmd('Itemid', ''); +$sitenameR = $app->get('sitename'); // raw for title composition +$sitename = htmlspecialchars($sitenameR, ENT_QUOTES, 'UTF-8'); +$menu = $app->getMenu()->getActive(); +$pageclass = $menu !== null ? $menu->getParams()->get('pageclass_sfx', '') : ''; + +// Respect “Site Name in Page Titles” (0:none, 1:before, 2:after) +$mode = (int) $app->get('sitename_pagetitles', 0); +$pageTitle = trim($this->getTitle()); +$final = $pageTitle !== '' + ? ($mode === 1 ? $sitenameR . ' - ' . $pageTitle + : ($mode === 2 ? $pageTitle . ' - ' . $sitenameR : $pageTitle)) + : $sitenameR; +$this->setTitle($final); + +// Template/Media path +$templatePath = 'media/templates/site/moko-cassiopeia'; + +// Core template CSS +$wa->useStyle('template.base'); // css/template.css +$wa->useStyle('template.vendor.social-media-demo'); // css/user.css + +// Optional vendor CSS +$wa->useStyle('vendor.bootstrap-toc'); + +// Optional demo/showcase CSS (available for use, not loaded by default) +// To use: Add 'template.global.social-media-demo' to your article/module +// $wa->useStyle('template.global.social-media-demo'); + +// Color theme (light + optional dark) +$colorLightKey = strtolower(preg_replace('/[^a-z0-9_.-]/i', '', $params_LightColorName)); +$colorDarkKey = strtolower(preg_replace('/[^a-z0-9_.-]/i', '', $params_DarkColorName)); +$lightKey = 'template.light.' . $colorLightKey; +$darkKey = 'template.dark.' . $colorDarkKey; +try { + $wa->useStyle('template.light.colors_standard'); +} catch (\Throwable $e) { + $wa->registerAndUseStyle('template.light.colors_standard', $templatePath . '/css/global/light/colors_standard.css'); +} +try { + $wa->useStyle('template.dark.colors_standard'); +} catch (\Throwable $e) { + $wa->registerAndUseStyle('template.dark.colors_standard', $templatePath . '/css/global/dark/colors_standard.css'); +} +try { + $wa->useStyle($lightKey); +} catch (\Throwable $e) { + $wa->registerAndUseStyle('template.light.dynamic', $templatePath . '/css/global/light/' . $colorLightKey . '.css'); +} +try { + $wa->useStyle($darkKey); +} catch (\Throwable $e) { + $wa->registerAndUseStyle('template.dark.dynamic', $templatePath . '/css/global/dark/' . $colorDarkKey . '.css'); +} + +// Scripts +$wa->useScript('template.js'); +$wa->useScript('theme-init.js'); +$wa->useScript('vendor.bootstrap-toc.js'); + +/** + * VirtueMart detection: + * - Component must exist and be enabled + */ +$isVirtueMartActive = ComponentHelper::isEnabled('com_virtuemart', true); + +if ($isVirtueMartActive) { + /** + * Load a VirtueMart-specific stylesheet defined in your template manifest. + * This assumes you defined an asset named "template.virtuemart". + */ + $wa->useStyle('vendor.vm'); +} + +// Font scheme (external or local) + CSS custom properties +$params_FontScheme = $this->params->get('useFontScheme', false); +$fontStyles = ''; + +if ($params_FontScheme) { + if (stripos($params_FontScheme, 'https://') === 0) { $this->getPreloadManager()->preconnect('https://fonts.googleapis.com/', ['crossorigin' => 'anonymous']); $this->getPreloadManager()->preconnect('https://fonts.gstatic.com/', ['crossorigin' => 'anonymous']); - $this->getPreloadManager()->preload($paramsFontScheme, ['as' => 'style', 'crossorigin' => 'anonymous']); - $wa->registerAndUseStyle('fontscheme.current', $paramsFontScheme, [], ['media' => 'print', 'rel' => 'lazy-stylesheet', 'onload' => 'this.media=\'all\'', 'crossorigin' => 'anonymous']); + $this->getPreloadManager()->preload($params_FontScheme, ['as' => 'style', 'crossorigin' => 'anonymous']); + $wa->registerAndUseStyle('fontscheme.current', $params_FontScheme, [], [ + 'media' => 'print', + 'rel' => 'lazy-stylesheet', + 'onload' => 'this.media=\'all\'', + 'crossorigin' => 'anonymous' + ]); - if (preg_match_all('/family=([^?:]*):/i', $paramsFontScheme, $matches) > 0) { - $fontStyles = '--font-family-body: "' . str_replace('+', ' ', $matches[1][0]) . '", sans-serif; - --font-family-headings: "' . str_replace('+', ' ', isset($matches[1][1]) ? $matches[1][1] : $matches[1][0]) . '", sans-serif; - --font-weight-normal: 400; - --font-weight-headings: 700;'; + if (preg_match_all('/family=([^?:]*):/i', $params_FontScheme, $matches) > 0) { + $fontStyles = '--font-family-body: "' . str_replace('+', ' ', $matches[1][0]) . '", sans-serif;' . "\n"; + $fontStyles .= '--font-family-headings: "' . str_replace('+', ' ', isset($matches[1][1]) ? $matches[1][1] : $matches[1][0]) . '", sans-serif;' . "\n"; + $fontStyles .= '--font-weight-normal: 400;' . "\n"; + $fontStyles .= '--font-weight-headings: 700;'; } } else { - $wa->registerAndUseStyle('fontscheme.current', $paramsFontScheme, ['version' => 'auto'], ['media' => 'print', 'rel' => 'lazy-stylesheet', 'onload' => 'this.media=\'all\'']); - $this->getPreloadManager()->preload($wa->getAsset('style', 'fontscheme.current')->getUri() . '?' . $this->getMediaVersion(), ['as' => 'style']); + $wa->registerAndUseStyle('fontscheme.current', $params_FontScheme, ['version' => 'auto'], [ + 'media' => 'print', + 'rel' => 'lazy-stylesheet', + 'onload' => 'this.media=\'all\'' + ]); + $this->getPreloadManager()->preload( + $wa->getAsset('style', 'fontscheme.current')->getUri() . '?' . $this->getMediaVersion(), + ['as' => 'style'] + ); } } -// Enable assets -$wa->usePreset('template.moko-cassiopeia.' . ($this->direction === 'rtl' ? 'rtl' : 'ltr')) - ->useStyle('template.active.language') - ->useStyle('template.user') - ->useScript('template.user') - ->addInlineStyle(":root { - --hue: 214; - --template-bg-light: #f0f4fb; - --template-text-dark: #495057; - --template-text-light: #ffffff; - --template-link-color: #2a69b8; - --template-special-color: #001B4C; - $fontStyles - }"); +// Meta +$this->setMetaData('viewport', 'width=device-width, initial-scale=1'); +if ($this->params->get('faKitCode')) { + $faKit = "https://kit.fontawesome.com/" . $this->params->get('faKitCode') . ".js"; + HTMLHelper::_('script', $faKit, ['crossorigin' => 'anonymous']); +} else { + try { + if($params_developmentmode){ + $wa->useStyle('vendor.fa7free.all'); + $wa->useStyle('vendor.fa7free.brands'); + $wa->useStyle('vendor.fa7free.fontawesome'); + $wa->useStyle('vendor.fa7free.regular'); + $wa->useStyle('vendor.fa7free.solid'); + } else { + $wa->useStyle('vendor.fa7free.all.min'); + $wa->useStyle('vendor.fa7free.brands.min'); + $wa->useStyle('vendor.fa7free.fontawesome.min'); + $wa->useStyle('vendor.fa7free.regular.min'); + $wa->useStyle('vendor.fa7free.solid.min'); + } + } catch (\Throwable $e) { + if($params_developmentmode){ + $wa->registerAndUseStyle('vendor.fa7free.all.dynamic', $templatePath . '/vendor/fa7free/css/all.css'); + $wa->registerAndUseStyle('vendor.fa7free.brands.dynamic', $templatePath . '/vendor/fa7free/css/brands.css'); + $wa->registerAndUseStyle('vendor.fa7free.fontawesome.dynamic', $templatePath . '/vendor/fa7free/css/fontawesome.css'); + $wa->registerAndUseStyle('vendor.fa7free.regular.dynamic', $templatePath . '/vendor/fa7free/css/regular.css'); + $wa->registerAndUseStyle('vendor.fa7free.solid.dynamic', $templatePath . '/vendor/fa7free/css/solid.css'); + } else { + $wa->registerAndUseStyle('vendor.fa7free.all.min.dynamic', $templatePath . '/vendor/fa7free/css/all.min.css'); + $wa->registerAndUseStyle('vendor.fa7free.brands.min.dynamic', $templatePath . '/vendor/fa7free/css/brands.min.css'); + $wa->registerAndUseStyle('vendor.fa7free.fontawesome.min.dynamic', $templatePath . '/vendor/fa7free/css/fontawesome.min.css'); + $wa->registerAndUseStyle('vendor.fa7free.regular.min.dynamic', $templatePath . '/vendor/fa7free/css/regular.min.css'); + $wa->registerAndUseStyle('vendor.fa7free.solid.min.dynamic', $templatePath . '/vendor/fa7free/css/solid.min.css'); + } -// Override 'template.active' asset to set correct ltr/rtl dependency -$wa->registerStyle('template.active', '', [], [], ['template.moko-cassiopeia.' . ($this->direction === 'rtl' ? 'rtl' : 'ltr')]); + } +} +$params_leftIcon = htmlspecialchars($this->params->get('drawerLeftIcon', 'fa-solid fa-chevron-left'), ENT_COMPAT, 'UTF-8'); +$params_rightIcon = htmlspecialchars($this->params->get('drawerRightIcon', 'fa-solid fa-chevron-right'), ENT_COMPAT, 'UTF-8'); -// Browsers support SVG favicons -$this->addHeadLink(HTMLHelper::_('image', 'joomla-favicon.svg', '', [], true, 1), 'icon', 'rel', ['type' => 'image/svg+xml']); -$this->addHeadLink(HTMLHelper::_('image', 'favicon.ico', '', [], true, 1), 'alternate icon', 'rel', ['type' => 'image/vnd.microsoft.icon']); -$this->addHeadLink(HTMLHelper::_('image', 'joomla-favicon-pinned.svg', '', [], true, 1), 'mask-icon', 'rel', ['color' => '#000']); - -// Defer font awesome -$wa->getAsset('style', 'fontawesome')->setAttribute('rel', 'lazy-stylesheet'); +$wa->useStyle('template.user'); // css/user.css ?> - + diff --git a/src/templates/index.php b/src/templates/index.php index 4fcca69..057ee32 100644 --- a/src/templates/index.php +++ b/src/templates/index.php @@ -21,12 +21,14 @@ use Joomla\CMS\Factory; use Joomla\CMS\HTML\HTMLHelper; use Joomla\CMS\Language\Text; use Joomla\CMS\Uri\Uri; +use Joomla\CMS\Component\ComponentHelper; /** @var Joomla\CMS\Document\HtmlDocument $this */ $app = Factory::getApplication(); $input = $app->getInput(); -$wa = $this->getWebAssetManager(); +$document = $app->getDocument(); +$wa = $document->getWebAssetManager(); // Template params $params_LightColorName = (string) $this->params->get('colorLightName', 'colors_standard'); // colors_standard|colors_alternative|colors_custom @@ -40,10 +42,9 @@ $params_googleanalyticsid = $this->params->get('googleanalyticsid', null); $params_custom_head_start = $this->params->get('custom_head_start', null); $params_custom_head_end = $this->params->get('custom_head_end', null); $params_developmentmode = $this->params->get('developmentmode', false); - +/* // Bootstrap behaviors (assets handled via WAM) HTMLHelper::_('bootstrap.framework'); -HTMLHelper::_('bootstrap.loadCss', true); HTMLHelper::_('bootstrap.alert'); HTMLHelper::_('bootstrap.button'); HTMLHelper::_('bootstrap.carousel'); @@ -56,7 +57,7 @@ HTMLHelper::_('bootstrap.scrollspy'); HTMLHelper::_('bootstrap.tab'); HTMLHelper::_('bootstrap.tooltip'); HTMLHelper::_('bootstrap.toast'); - +*/ // Detecting Active Variables $option = $input->getCmd('option', ''); $view = $input->getCmd('view', ''); @@ -80,41 +81,33 @@ $this->setTitle($final); // Template/Media path $templatePath = 'media/templates/site/moko-cassiopeia'; -// =========================== -// Web Asset Manager (WAM) — matches your joomla.asset.json -// =========================== - // Core template CSS -$wa->useStyle('template.global.base'); // css/template.css -$wa->useStyle('template.global.social-media-demo'); // css/user.css - -// Optional vendor CSS -$wa->useStyle('vendor.bootstrap-toc'); - -// Optional demo/showcase CSS (available for use, not loaded by default) -// To use: Add 'template.global.social-media-demo' to your article/module -// $wa->useStyle('template.global.social-media-demo'); +$wa->useStyle('template.base'); // css/template.css // Color theme (light + optional dark) $colorLightKey = strtolower(preg_replace('/[^a-z0-9_.-]/i', '', $params_LightColorName)); $colorDarkKey = strtolower(preg_replace('/[^a-z0-9_.-]/i', '', $params_DarkColorName)); $lightKey = 'template.light.' . $colorLightKey; $darkKey = 'template.dark.' . $colorDarkKey; + try { $wa->useStyle('template.light.colors_standard'); } catch (\Throwable $e) { $wa->registerAndUseStyle('template.light.colors_standard', $templatePath . '/css/global/light/colors_standard.css'); } + try { $wa->useStyle('template.dark.colors_standard'); } catch (\Throwable $e) { $wa->registerAndUseStyle('template.dark.colors_standard', $templatePath . '/css/global/dark/colors_standard.css'); } + try { $wa->useStyle($lightKey); } catch (\Throwable $e) { $wa->registerAndUseStyle('template.light.dynamic', $templatePath . '/css/global/light/' . $colorLightKey . '.css'); } + try { $wa->useStyle($darkKey); } catch (\Throwable $e) { @@ -123,9 +116,20 @@ try { // Scripts $wa->useScript('template.js'); -$wa->useScript('theme-init.js'); -$wa->useScript('darkmode-toggle.js'); -$wa->useScript('vendor.bootstrap-toc.js'); + +/** + * VirtueMart detection: + * - Component must exist and be enabled + */ +$isVirtueMartActive = ComponentHelper::isEnabled('com_virtuemart', true); + +if ($isVirtueMartActive) { + /** + * Load a VirtueMart-specific stylesheet defined in your template manifest. + * This assumes you defined an asset named "template.virtuemart". + */ + $wa->useStyle('vendor.vm'); +} // Font scheme (external or local) + CSS custom properties $params_FontScheme = $this->params->get('useFontScheme', false); diff --git a/src/templates/joomla.asset.json b/src/templates/joomla.asset.json index ae3339d..f047c5d 100644 --- a/src/templates/joomla.asset.json +++ b/src/templates/joomla.asset.json @@ -1,276 +1,246 @@ { - "$schema": "https://developer.joomla.org/schemas/json-schema/web_assets.json", - "name": "moko-cassiopeia", - "description": "Moko-Cassiopeia template assets", - "license": "GPL-3.0-or-later", - "x-header": { - "copyright_year": 2025, - "author": "Jonathan Miller", - "owner": "Moko Consulting", - "contact": "hello@mokoconsulting.tech", - "project": "Moko-Cassiopeia Template", - "spdx_license": "GPL-3.0-or-later", - "notice": "This file is part of a Moko Consulting project.", - "disclaimer": "This program is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License; either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. You should have received a copy of the GNU General Public License along with this program. If not, see https://www.gnu.org/licenses/.", - "repo": "https://github.com/mokoconsulting-tech/moko-cassiopeia", - "file_information": { - "defgroup": "Joomla.Template.Site", - "ingroup": "Moko-Cassiopeia.Template.Assets", - "path": "./media/templates/site/moko-cassiopeia/joomla.asset.json", - "version": "03.00.00", - "brief": "Joomla asset registry for Moko-Cassiopeia" - } - }, - "assets": [ - { - "name": "template.global.base", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/template.css", - "attributes": {"media": "all"} - }, - { - "name": "template.global.base.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/template.min.css", - "attributes": {"media": "all"} - }, - { - "name": "template.user", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/user.css", - "attributes": {"media": "all"} - }, - { - "name": "template.user.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/user.min.css", - "attributes": {"media": "all"} - }, - { - "name": "template.editor", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/editor.css", - "attributes": {"media": "all"} - }, - { - "name": "template.editor.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/editor.min.css", - "attributes": {"media": "all"} - }, - { - "name": "vendor.bootstrap-toc", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/afeld/bootstrap-toc.min.css", - "attributes": {"media": "all"} - }, - { - "name": "vendor.bootstrap-toc.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/afeld/bootstrap-toc.min.css", - "attributes": {"media": "all"} - }, - { - "name": "template.light.colors_standard", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_standard.css", - "attributes": {"media": "all"} - }, - { - "name": "template.light.colors_standard.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_standard.min.css", - "attributes": {"media": "all"} - }, - { - "name": "template.light.colors_alternative", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_alternative.css", - "attributes": {"media": "all"} - }, - { - "name": "template.light.colors_alternative.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_alternative.min.css", - "attributes": {"media": "all"} - }, - { - "name": "template.light.colors_custom", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_custom.css", - "attributes": {"media": "all"} - }, - { - "name": "template.light.colors_custom.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_custom.min.css", - "attributes": {"media": "all"} - }, - { - "name": "template.dark.colors_standard", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_standard.css", - "attributes": {"media": "all"} - }, - { - "name": "template.dark.colors_standard.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_standard.min.css", - "attributes": {"media": "all"} - }, - { - "name": "template.dark.colors_alternative", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_alternative.css", - "attributes": {"media": "all"} - }, - { - "name": "template.dark.colors_alternative.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_alternative.min.css" - }, - { - "name": "template.dark.colors_custom", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_custom.css", - "attributes": {"media": "all"} - }, - { - "name": "template.dark.colors_custom.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_custom.min.css", - "attributes": {"media": "all"} - }, - { - "name": "template.js", - "type": "script", - "uri": "media/templates/site/moko-cassiopeia/js/template.js", - "attributes": {"defer": true} - }, - { - "name": "template.js.min", - "type": "script", - "uri": "media/templates/site/moko-cassiopeia/js/template.min.js", - "attributes": {"defer": true} - }, - { - "name": "theme-init.js", - "type": "script", - "uri": "media/templates/site/moko-cassiopeia/js/theme-init.js", - "attributes": {"defer": true} - }, - { - "name": "theme-init.min.js", - "type": "script", - "uri": "media/templates/site/moko-cassiopeia/js/theme-init.min.js", - "attributes": {"defer": true} - }, - { - "name": "darkmode-toggle.js", - "type": "script", - "uri": "media/templates/site/moko-cassiopeia/js/darkmode-toggle.js", - "attributes": {"defer": true} - }, - { - "name": "darkmode-toggle.min.js", - "type": "script", - "uri": "media/templates/site/moko-cassiopeia/js/darkmode-toggle.min.js", - "attributes": {"defer": true} - }, - { - "name": "gtm.js", - "type": "script", - "uri": "media/templates/site/moko-cassiopeia/js/gtm.js", - "attributes": {"defer": true} - }, - { - "name": "gtm.min.js", - "type": "script", - "uri": "media/templates/site/moko-cassiopeia/js/gtm.min.js", - "attributes": {"defer": true} - }, - { - "name": "vendor.bootstrap-toc.js", - "type": "script", - "uri": "media/templates/site/moko-cassiopeia/vendor/afeld/bootstrap-toc.min.js", - "attributes": {"defer": true} - }, - { - "name": "vendor.bootstrap-toc.js.min", - "type": "script", - "uri": "media/templates/site/moko-cassiopeia/vendor/afeld/bootstrap-toc.min.js", - "attributes": {"defer": true} - }, - { - "name": "vendor.fa7free.all", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/all.css" - }, - { - "name": "vendor.fa7free.all.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/all.min.css", - "attributes": {"media": "all"} - }, - { - "name": "vendor.fa7free.brands", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/brands.css", - "attributes": {"media": "all"} - }, - { - "name": "vendor.fa7free.brands.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/brands.min.css", - "attributes": {"media": "all"} - }, - { - "name": "vendor.fa7free.fontawesome", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/fontawesome.css", - "attributes": {"media": "all"} - }, - { - "name": "vendor.fa7free.fontawesome.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/fontawesome.min.css", - "attributes": {"media": "all"} - }, - { - "name": "vendor.fa7free.regular", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/regular.css", - "attributes": {"media": "all"} - }, - { - "name": "vendor.fa7free.regular.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/regular.min.css", - "attributes": {"media": "all"} - }, - { - "name": "vendor.fa7free.solid", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/solid.css", - "attributes": {"media": "all"} - }, - { - "name": "vendor.fa7free.solid.min", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/solid.min.css", - "attributes": {"media": "all"} - }, - { - "name": "template.global.social-media-demo", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/css/global/social-media-demo.css", - "attributes": {"media": "all"} - }, - { - "name": "vendor.vm", - "type": "style", - "uri": "media/templates/site/moko-cassiopeia/vendor/vm.css", - "attributes": {"media": "all"} - } - ] + "$schema": "https://developer.joomla.org/schemas/json-schema/web_assets.json", + "name": "moko-cassiopeia", + "description": "Moko-Cassiopeia template assets", + "license": "GPL-3.0-or-later", + "x-header": { + "copyright_year": 2025, + "author": "Jonathan Miller", + "owner": "Moko Consulting", + "contact": "hello@mokoconsulting.tech", + "project": "Moko-Cassiopeia Template", + "spdx_license": "GPL-3.0-or-later", + "notice": "This file is part of a Moko Consulting project.", + "disclaimer": "This program is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License; either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. You should have received a copy of the GNU General Public License along with this program. If not, see https://www.gnu.org/licenses/.", + "repo": "https://github.com/mokoconsulting-tech/moko-cassiopeia", + "file_information": { + "defgroup": "Joomla.Template.Site", + "ingroup": "Moko-Cassiopeia.Template.Assets", + "path": "./media/templates/site/moko-cassiopeia/joomla.asset.json", + "version": "03.00.00", + "brief": "Joomla asset registry for Moko-Cassiopeia" + } + }, + "assets": [ + { + "name": "template.base", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/template.css", + "attributes": {"media": "all"} + }, + { + "name": "template.base.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/template.min.css", + "attributes": {"media": "all"} + }, + { + "name": "template.user", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/user.css", + "attributes": {"media": "all"} + }, + { + "name": "template.user.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/user.min.css", + "attributes": {"media": "all"} + }, + { + "name": "template.editor", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/editor.css", + "attributes": {"media": "all"} + }, + { + "name": "template.editor.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/editor.min.css", + "attributes": {"media": "all"} + }, + { + "name": "template.light.colors_standard", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_standard.css", + "attributes": {"media": "all"} + }, + { + "name": "template.light.colors_standard.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_standard.min.css", + "attributes": {"media": "all"} + }, + { + "name": "template.light.colors_alternative", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_alternative.css", + "attributes": {"media": "all"} + }, + { + "name": "template.light.colors_alternative.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_alternative.min.css", + "attributes": {"media": "all"} + }, + { + "name": "template.light.colors_custom", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_custom.css", + "attributes": {"media": "all"} + }, + { + "name": "template.light.colors_custom.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/light/colors_custom.min.css", + "attributes": {"media": "all"} + }, + { + "name": "template.dark.colors_standard", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_standard.css", + "attributes": {"media": "all"} + }, + { + "name": "template.dark.colors_standard.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_standard.min.css", + "attributes": {"media": "all"} + }, + { + "name": "template.dark.colors_alternative", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_alternative.css", + "attributes": {"media": "all"} + }, + { + "name": "template.dark.colors_alternative.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_alternative.min.css" + }, + { + "name": "template.dark.colors_custom", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_custom.css", + "attributes": {"media": "all"} + }, + { + "name": "template.dark.colors_custom.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/colors/dark/colors_custom.min.css", + "attributes": {"media": "all"} + }, + { + "name": "template.js", + "type": "script", + "uri": "media/templates/site/moko-cassiopeia/js/template.js", + "attributes": {"defer": true} + }, + { + "name": "template.js.min", + "type": "script", + "uri": "media/templates/site/moko-cassiopeia/js/template.min.js", + "attributes": {"defer": true} + }, + { + "name": "theme-init.js", + "type": "script", + "uri": "media/templates/site/moko-cassiopeia/js/theme-init.js", + "attributes": {"defer": true} + }, + { + "name": "theme-init.min.js", + "type": "script", + "uri": "media/templates/site/moko-cassiopeia/js/theme-init.min.js", + "attributes": {"defer": true} + }, + { + "name": "darkmode-toggle.js", + "type": "script", + "uri": "media/templates/site/moko-cassiopeia/js/darkmode-toggle.js", + "attributes": {"defer": true} + }, + { + "name": "darkmode-toggle.min.js", + "type": "script", + "uri": "media/templates/site/moko-cassiopeia/js/darkmode-toggle.min.js", + "attributes": {"defer": true} + }, + { + "name": "gtm.js", + "type": "script", + "uri": "media/templates/site/moko-cassiopeia/js/gtm.js", + "attributes": {"defer": true} + }, + { + "name": "gtm.min.js", + "type": "script", + "uri": "media/templates/site/moko-cassiopeia/js/gtm.min.js", + "attributes": {"defer": true} + }, + { + "name": "vendor.fa7free.all", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/all.css" + }, + { + "name": "vendor.fa7free.all.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/all.min.css", + "attributes": {"media": "all"} + }, + { + "name": "vendor.fa7free.brands", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/brands.css", + "attributes": {"media": "all"} + }, + { + "name": "vendor.fa7free.brands.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/brands.min.css", + "attributes": {"media": "all"} + }, + { + "name": "vendor.fa7free.fontawesome", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/fontawesome.css", + "attributes": {"media": "all"} + }, + { + "name": "vendor.fa7free.fontawesome.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/fontawesome.min.css", + "attributes": {"media": "all"} + }, + { + "name": "vendor.fa7free.regular", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/regular.css", + "attributes": {"media": "all"} + }, + { + "name": "vendor.fa7free.regular.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/regular.min.css", + "attributes": {"media": "all"} + }, + { + "name": "vendor.fa7free.solid", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/solid.css", + "attributes": {"media": "all"} + }, + { + "name": "vendor.fa7free.solid.min", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/vendor/fa7free/css/solid.min.css", + "attributes": {"media": "all"} + }, + { + "name": "vendor.vm", + "type": "style", + "uri": "media/templates/site/moko-cassiopeia/css/vendor/vm.css", + "attributes": {"media": "all"} + } + ] }