/* ==========================================================================
   Infinity Office - Web Fonts Definition & Loader
   Curated, high-legibility Google Web Fonts for Docs, Sheets, and Slides
   Loaded with display=swap for instantaneous fallback & performance
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&family=Dancing+Script:wght@400..700&family=Fira+Code:wght@300..700&family=Inconsolata:wght@300..700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=JetBrains+Mono:wght@300..700&family=Lora:ital,wght@0,400..700;1,400..700&family=Merriweather:ital,wght@0,300..900;1,300..900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Oswald:wght@200..700&family=Pacifico&family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&family=Poppins:ital,wght@0,100..900;1,100..900&family=Roboto+Mono:wght@300..700&family=Roboto+Slab:wght@100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@400;600;700&family=Almarai:wght@400;700&family=Amiri:ital,wght@0,400;0,700;1,400&family=Bitter:ital,wght@0,400;0,700;1,400&family=Cairo:wght@400;600;700&family=Cinzel:wght@400;700&family=Comfortaa:wght@400;700&family=Cormorant+Garamond:ital,wght@0,400;0,700;1,400&family=DM+Sans:ital,wght@0,400;0,700;1,400&family=EB+Garamond:ital,wght@0,400;0,700;1,400&family=Great+Vibes&family=IBM+Plex+Mono:wght@400;600;700&family=Lato:ital,wght@0,400;0,700;1,400&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Lobster&family=Nunito:ital,wght@0,400;0,700;1,400&family=Outfit:wght@400;600;700&family=Permanent+Marker&family=Quicksand:wght@400;600;700&family=Raleway:ital,wght@0,400;0,700;1,400&family=Righteous&family=Rubik:ital,wght@0,400;0,600;0,700;1,400&family=Sacramento&family=Satisfy&family=Source+Code+Pro:ital,wght@0,400;0,700;1,400&family=Space+Mono:ital,wght@0,400;0,700;1,400&family=Tajawal:wght@400;700&family=Work+Sans:ital,wght@0,400;0,600;0,700;1,400&display=swap');

/* Web Font Utility Classes & Direct Family Classes */
.wf-inter { font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important; }
.wf-roboto { font-family: 'Roboto', sans-serif !important; }
.wf-open-sans { font-family: 'Open Sans', sans-serif !important; }
.wf-poppins { font-family: 'Poppins', sans-serif !important; }
.wf-montserrat { font-family: 'Montserrat', sans-serif !important; }
.wf-plus-jakarta { font-family: 'Plus Jakarta Sans', sans-serif !important; }
.wf-lato { font-family: 'Lato', sans-serif !important; }
.wf-nunito { font-family: 'Nunito', sans-serif !important; }
.wf-raleway { font-family: 'Raleway', sans-serif !important; }
.wf-rubik { font-family: 'Rubik', sans-serif !important; }
.wf-work-sans { font-family: 'Work Sans', sans-serif !important; }
.wf-dm-sans { font-family: 'DM Sans', sans-serif !important; }
.wf-outfit { font-family: 'Outfit', sans-serif !important; }
.wf-quicksand { font-family: 'Quicksand', sans-serif !important; }
.wf-oswald { font-family: 'Oswald', sans-serif !important; }

.wf-playfair { font-family: 'Playfair Display', Georgia, serif !important; }
.wf-merriweather { font-family: 'Merriweather', Georgia, serif !important; }
.wf-lora { font-family: 'Lora', Georgia, serif !important; }
.wf-eb-garamond { font-family: 'EB Garamond', Georgia, serif !important; }
.wf-cormorant { font-family: 'Cormorant Garamond', Georgia, serif !important; }
.wf-cinzel { font-family: 'Cinzel', Georgia, serif !important; }
.wf-bitter { font-family: 'Bitter', Georgia, serif !important; }
.wf-libre-baskerville { font-family: 'Libre Baskerville', Georgia, serif !important; }
.wf-roboto-slab { font-family: 'Roboto Slab', Georgia, serif !important; }

.wf-fira-code { font-family: 'Fira Code', 'Courier New', monospace !important; }
.wf-jetbrains-mono { font-family: 'JetBrains Mono', 'Courier New', monospace !important; }
.wf-roboto-mono { font-family: 'Roboto Mono', monospace !important; }
.wf-source-code-pro { font-family: 'Source Code Pro', monospace !important; }
.wf-space-mono { font-family: 'Space Mono', monospace !important; }
.wf-ibm-plex-mono { font-family: 'IBM Plex Mono', monospace !important; }
.wf-inconsolata { font-family: 'Inconsolata', monospace !important; }

.wf-dancing-script { font-family: 'Dancing Script', cursive !important; }
.wf-caveat { font-family: 'Caveat', cursive !important; }
.wf-pacifico { font-family: 'Pacifico', cursive !important; }
.wf-lobster { font-family: 'Lobster', cursive !important; }
.wf-great-vibes { font-family: 'Great Vibes', cursive !important; }
.wf-satisfy { font-family: 'Satisfy', cursive !important; }
.wf-permanent-marker { font-family: 'Permanent Marker', cursive !important; }
.wf-sacramento { font-family: 'Sacramento', cursive !important; }
.wf-comfortaa { font-family: 'Comfortaa', cursive !important; }
.wf-righteous { font-family: 'Righteous', cursive !important; }

.wf-cairo { font-family: 'Cairo', sans-serif !important; }
.wf-tajawal { font-family: 'Tajawal', sans-serif !important; }
.wf-almarai { font-family: 'Almarai', sans-serif !important; }
.wf-alexandria { font-family: 'Alexandria', sans-serif !important; }
.wf-amiri { font-family: 'Amiri', serif !important; }

/* Font Family Selection preview items */
.tool-select optgroup {
  font-weight: 700;
  font-size: 0.8rem;
  color: var(--text-muted, #64748b);
  background: var(--bg-surface, #ffffff);
}

.tool-select option {
  padding: 4px 8px;
  font-size: 0.9rem;
  color: var(--text-main, #0f172a);
  background: var(--bg-surface, #ffffff);
}

/* ==========================================================================
   Global Select2 Theme & High-Contrast Dark Mode for Fonts Dropdown
   ========================================================================== */
.select2-container--default .select2-selection--single {
  height: 28px !important;
  border-radius: 4px !important;
  border: 1px solid var(--border-color, #cbd5e1) !important;
  background-color: var(--bg-surface, #ffffff) !important;
  display: flex !important;
  align-items: center !important;
  outline: none !important;
}

.select2-container--default .select2-selection--single:focus,
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--primary-color, #2563eb) !important;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2) !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--text-main, #0f172a) !important;
  font-size: 0.8rem !important;
  line-height: 26px !important;
  padding-left: 8px !important;
  padding-right: 20px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 26px !important;
  right: 4px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--text-muted, #64748b) transparent transparent transparent !important;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--text-muted, #64748b) transparent !important;
}

/* Dropdown Container */
.select2-dropdown {
  background-color: var(--bg-surface, #ffffff) !important;
  border: 1px solid var(--border-color, #cbd5e1) !important;
  border-radius: 6px !important;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.25), 0 8px 10px -6px rgba(0, 0, 0, 0.2) !important;
  z-index: 99999 !important;
}

.select2-search--dropdown {
  padding: 6px !important;
}

.select2-search--dropdown .select2-search__field {
  border: 1px solid var(--border-color, #cbd5e1) !important;
  background-color: var(--bg-toolbar, #f8fafc) !important;
  color: var(--text-main, #0f172a) !important;
  border-radius: 4px !important;
  font-size: 0.8rem !important;
  padding: 5px 8px !important;
  outline: none !important;
}

.select2-search--dropdown .select2-search__field:focus {
  border-color: var(--primary-color, #2563eb) !important;
}

/* Category Optgroup Headers */
.select2-results__group {
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  color: var(--text-muted, #64748b) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  padding: 8px 10px 4px !important;
  background-color: var(--bg-surface, #ffffff) !important;
}

/* Option Items */
.select2-results__option {
  font-size: 0.88rem !important;
  padding: 6px 12px !important;
  color: var(--text-main, #0f172a) !important;
  background-color: var(--bg-surface, #ffffff) !important;
  cursor: pointer !important;
}

/* Highlighted (Hover / Arrow Key) */
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: var(--primary-color, #2563eb) !important;
  color: #ffffff !important;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable .select2-font-preview-name,
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable .select2-font-preview-sample {
  color: #ffffff !important;
  opacity: 1 !important;
}

/* Selected */
.select2-container--default .select2-results__option--selected {
  background-color: var(--primary-light, rgba(37, 99, 235, 0.15)) !important;
  color: var(--primary-color, #2563eb) !important;
  font-weight: 600 !important;
}

/* Font preview text item inside options */
.select2-font-preview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.select2-font-preview-name {
  flex: 1;
  color: inherit;
}

.select2-font-preview-sample {
  font-size: 0.76rem;
  opacity: 0.75;
  margin-left: 10px;
  color: inherit;
}

/* ==========================================================================
   Dark Mode Explicit Styles for Select2 (Docs, Sheets, Slides)
   ========================================================================== */
[data-theme="dark"] .select2-container--default .select2-selection--single {
  background-color: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

[data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #f8fafc !important;
}

[data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #94a3b8 transparent transparent transparent !important;
}

[data-theme="dark"] .select2-dropdown {
  background-color: #1e293b !important;
  border-color: #334155 !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6) !important;
}

[data-theme="dark"] .select2-search--dropdown {
  background-color: #1e293b !important;
}

[data-theme="dark"] .select2-search--dropdown .select2-search__field {
  background-color: #0f172a !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

[data-theme="dark"] .select2-results__group {
  background-color: #1e293b !important;
  color: #94a3b8 !important;
}

[data-theme="dark"] .select2-results__option {
  background-color: #1e293b !important;
  color: #f8fafc !important;
}

[data-theme="dark"] .select2-container--default .select2-results__option--selected {
  background-color: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: var(--primary-color, #ea580c) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .select2-font-preview-name {
  color: #f8fafc !important;
}

[data-theme="dark"] .select2-font-preview-sample {
  color: #cbd5e1 !important;
  opacity: 0.85;
}

[data-theme="dark"] .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable .select2-font-preview-name,
[data-theme="dark"] .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable .select2-font-preview-sample {
  color: #ffffff !important;
  opacity: 1 !important;
}

