/*
Theme Name: THE SYSTEM BY AFLAH ZAMAN
Theme URI: https://aflahzaman.com
Author: AFLAHZAMAN.COM
Author URI: https://aflahzaman.com
Description: AFLAH ZAMAN is a digital strategist and business systems consultant specializing in building scalable digital infrastructures, high performance websites, and long term growth systems for founders, creators, and businesses. Since 2019, he has been creating search optimized platforms, designing digital ecosystems, and developing automated workflows that help brands grow faster with clarity and confidence. His work blends strategy, technical depth, and system thinking to make online expansion simpler for everyone.
Requires at least: 6.4
Tested up to: 6.9
Requires PHP: 5.3
Version: 2.0.1
License: GPLv3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: the-system-by-aflah-zaman
Tags: Site Editor, Custom Colors, Custom Logo, custom-menu, Editor Style, Featured Images, rtl-language-support, Sticky Post, threaded-comments, translation-ready, Wide Blocks, Block Editor Patterns, Block Editor Styles, Style Variations, Blog, Portfolio, News, One Column, Two Columns, Three Columns, Four Columns, Left Sidebar, Right Sidebar, Grid Layout, flexible-header, Footer Widgets, Full Width Template

/* ==========================================================================
   CSS Custom Properties (Shadcn Design System)
   ========================================================================== */

/* ==========================================================================
   CSS Custom Properties (Shadcn Design System)
   ========================================================================== */

:root {
  --radius: 0.625rem;
  --spacing: 0.25rem;
  --wp--preset--color--border: #e5e5e5;
  --wp--preset--color--input: #e5e5e5;
  --wp--preset--color--ring: #a1a1a1;
  --wp--preset--color--sidebar: #fafafa;
  --wp--preset--color--sidebar-foreground: #0a0a0a;
  --wp--preset--color--sidebar-primary: #171717;
  --wp--preset--color--sidebar-primary-foreground: #fafafa;
  --wp--preset--color--sidebar-accent: #f5f5f5;
  --wp--preset--color--sidebar-accent-foreground: #171717;
  --wp--preset--color--sidebar-border: #e5e5e5;
  --wp--preset--color--sidebar-ring: #a1a1a1;

  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  --default-transition-duration: 0.15s;

  --text-xs--line-height: calc(1 / 0.75);
  --text-sm--line-height: calc(1.25 / 0.875);
  --text-base--line-height: calc(1.5 / 1);
  --text-lg--line-height: calc(1.75 / 1.125);
  --text-xl--line-height: calc(1.75 / 1.25);
  --text-2xl--line-height: calc(2 / 1.5);
  --text-3xl--line-height: calc(2.25 / 1.875);
  --text-4xl--line-height: calc(2.5 / 2.25);
  --text-5xl--line-height: 1;
  --text-7xl--line-height: 1;

  --border: var(--wp--preset--color--border);
  --input: var(--wp--preset--color--input);
  --ring: var(--wp--preset--color--ring);
  --sidebar: var(--wp--preset--color--sidebar);
  --sidebar-foreground: var(--wp--preset--color--sidebar-foreground);
  --sidebar-primary: var(--wp--preset--color--sidebar-primary);
  --sidebar-primary-foreground: var(
    --wp--preset--color--sidebar-primary-foreground
  );
  --sidebar-accent: var(--wp--preset--color--sidebar-accent);
  --sidebar-accent-foreground: var(
    --wp--preset--color--sidebar-accent-foreground
  );
  --sidebar-border: var(--wp--preset--color--sidebar-border);
  --sidebar-ring: var(--wp--preset--color--sidebar-ring);
  --code: var(--wp--preset--color--code);
  --code-foreground: var(--wp--preset--color--code-foreground);
  --background: var(--wp--preset--color--background);
  --foreground: var(--wp--preset--color--foreground);
  --card: var(--wp--preset--color--card);
  --card-foreground: var(--wp--preset--color--card-foreground);
  --popover: var(--wp--preset--color--popover);
  --popover-foreground: var(--wp--preset--color--popover-foreground);
  --primary: var(--wp--preset--color--primary);
  --primary-foreground: var(--wp--preset--color--primary-foreground);
  --secondary: var(--wp--preset--color--secondary);
  --secondary-foreground: var(--wp--preset--color--secondary-foreground);
  --muted: var(--wp--preset--color--muted);
  --muted-foreground: var(--wp--preset--color--muted-foreground);
  --accent: var(--wp--preset--color--accent);
  --accent-foreground: var(--wp--preset--color--accent-foreground);
  --destructive: var(--wp--preset--color--destructive);
  --destructive-foreground: var(--wp--preset--color--destructive-foreground);
}

.dark {
  --wp--preset--color--background: #0a0a0a;
  --wp--preset--color--foreground: #fafafa;
  --wp--preset--color--card: #171717;
  --wp--preset--color--card-foreground: #fafafa;
  --wp--preset--color--popover: #262626;
  --wp--preset--color--popover-foreground: #fafafa;
  --wp--preset--color--primary: #e5e5e5;
  --wp--preset--color--primary-foreground: #171717;
  --wp--preset--color--secondary: #262626;
  --wp--preset--color--secondary-foreground: #fafafa;
  --wp--preset--color--muted: #262626;
  --wp--preset--color--muted-foreground: #a1a1a1;
  --wp--preset--color--accent: #404040;
  --wp--preset--color--accent-foreground: #fafafa;
  --wp--preset--color--destructive: #ff6467;
  --wp--preset--color--border: rgba(255, 255, 255, 0.1);
  --wp--preset--color--input: rgba(255, 255, 255, 0.15);
  --wp--preset--color--ring: rgb(115, 115, 115);
  --wp--preset--color--sidebar: #171717;
  --wp--preset--color--sidebar-foreground: #fafafa;
  --wp--preset--color--sidebar-primary: #1447e6;
  --wp--preset--color--sidebar-primary-foreground: #fafafa;
  --wp--preset--color--sidebar-accent: #262626;
  --wp--preset--color--sidebar-accent-foreground: #fafafa;
  --wp--preset--color--sidebar-border: rgba(255, 255, 255, 0.1);
  --wp--preset--color--sidebar-ring: #525252;
  --wp--preset--color--code: #161616;
  --wp--preset--color--code-foreground: #a1a1a2;
}

/* ==========================================================================
   Base Styles
   ========================================================================== */

* {
  border-color: var(--border);
}

body {
  font-feature-settings: "rlig" 1, "calt" 1;
}

button[disabled] {
  opacity: 0.5;
}

fieldset {
  border: 1px solid var(--border);
}

/* ==========================================================================
   Button Styles (Shadcn inspired)
   ========================================================================== */

.wp-block-button__link {
  transition-property: all;
  transition-timing-function: var(--default-transition-timing-function);
  transition-duration: var(--default-transition-duration);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

/* Button variants */
.wp-block-button.is-style-outline .wp-block-button__link {
  background-color: transparent;
  color: var(--primary);
  border: 1px solid var(--border);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background-color: var(--accent);
  color: var(--accent-foreground);
}

.wp-block-button.is-style-secondary .wp-block-button__link {
  background-color: var(--secondary);
  color: var(--secondary-foreground);
}

.wp-block-button.is-style-secondary .wp-block-button__link:hover {
  background-color: color-mix(in oklab, var(--secondary) 80%, transparent);
}

.wp-block-button.is-style-destructive .wp-block-button__link {
  background-color: var(--destructive);
  color: var(--destructive-foreground);
}

.wp-block-button.is-style-destructive .wp-block-button__link:hover {
  background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
}

.wp-block-button.is-style-ghost .wp-block-button__link {
  background-color: transparent;
  color: var(--primary);
}

.wp-block-button.is-style-ghost .wp-block-button__link:hover {
  background-color: var(--accent);
  color: var(--accent-foreground);
}

/* ==========================================================================
   Theme mode toggler
   ========================================================================== */

.dark-mode-toggle {
  background: none;
  border: none;
  color: var(--foreground);
  cursor: pointer;
  padding: 0.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: calc(var(--radius) - 2px);
  transition-property: background-color;
  transition-timing-function: var(--default-transition-timing-function);
  transition-duration: var(--default-transition-duration);
}

.dark-mode-toggle:hover {
  background-color: var(--accent);
}

.dark-mode-toggle svg {
  width: 1.25rem;
  height: 1.25rem;
}

/* ==========================================================================
   Accessibility
   ========================================================================== */

.has-xs-font-size {
  line-height: var(--text-xs--line-height);
}
.has-sm-font-size {
  line-height: var(--text-sm--line-height);
}
.has-base-font-size {
  line-height: var(--text-base--line-height);
}
.has-lg-font-size {
  line-height: var(--text-lg--line-height);
}
.has-xl-font-size {
  line-height: var(--text-xl--line-height);
}
.has-2-xl-font-size {
  line-height: var(--text-2xl--line-height);
}
.has-3-xl-font-size {
  line-height: var(--text-3xl--line-height);
}
.has-4-xl-font-size {
  line-height: var(--text-4xl--line-height);
}
.has-5-xl-font-size {
  line-height: var(--text-5xl--line-height);
}
.has-7-xl-font-size {
  line-height: var(--text-7xl--line-height);
}
/* .required {
  color: var(--destructive);
} */

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ==========================================================================
   Print Styles
   ========================================================================== */

@media print {
  .dark-mode-toggle {
    display: none;
  }

  * {
    background: white !important;
    color: black !important;
  }
}

/* ==========================================================================
   Pill Navigation Styles
   ========================================================================== */

@media screen and (min-width: 600px) {
  .wp-block-navigation.is-style-pill .wp-block-navigation-item__content {
    text-decoration: none;
  }

  .wp-block-navigation.is-style-pill .wp-block-navigation-item.has-child,
  .wp-block-navigation.is-style-pill .wp-block-navigation-submenu__toggle {
    cursor: default;
  }

  .wp-block-navigation.is-style-pill .wp-block-navigation-item__content {
    padding: var(--wp--preset--spacing--2) var(--wp--preset--spacing--3);
  }

  .wp-block-navigation.is-style-pill
    ul:not(.wp-block-navigation__submenu-container)
    > .wp-block-navigation-item {
    background-color: var(--background);
    border-radius: calc(var(--radius) - 2px);
  }

  .wp-block-navigation.is-style-pill
    ul:not(.wp-block-navigation__submenu-container)
    > .wp-block-navigation-item
    > .wp-block-navigation-item__content {
    color: var(--foreground);
    border-radius: calc(var(--radius) - 2px);
  }

  .wp-block-navigation.is-style-pill
    ul:not(.wp-block-navigation__submenu-container)
    > .wp-block-navigation-item:hover {
    background-color: var(--accent);
  }
  .wp-block-navigation.is-style-pill
    ul:not(.wp-block-navigation__submenu-container)
    > .wp-block-navigation-item:hover
    > .wp-block-navigation-item__content {
    color: var(--accent-foreground);
  }

  .wp-block-navigation.is-style-pill
    ul:not(.wp-block-navigation__submenu-container)
    > .wp-block-navigation-item:has(.wp-block-navigation-submenu__toggle)
    > .wp-block-navigation-item__content {
    padding-right: 0;
  }

  .wp-block-navigation.is-style-pill .wp-block-navigation-submenu__toggle {
    width: unset;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--wp--preset--spacing--2) var(--wp--preset--spacing--4);
    margin: 0;
  }

  .wp-block-navigation.is-style-pill
    ul:not(.wp-block-navigation__submenu-container)
    > .wp-block-navigation-item
    > .wp-block-navigation-submenu__toggle
    svg {
    transition-property: transform;
    transition-timing-function: var(--default-transition-timing-function);
    transition-duration: var(--default-transition-duration);
  }

  .wp-block-navigation.is-style-pill
    ul:not(.wp-block-navigation__submenu-container)
    > .wp-block-navigation-item:hover
    > .wp-block-navigation-submenu__toggle
    svg {
    transform: rotate(180deg);
  }

  .wp-block-navigation.is-style-pill .wp-block-navigation__submenu-container {
    padding: var(--wp--preset--spacing--2);
    border-radius: calc(var(--radius) - 2px);
    border: 1px solid var(--border);
    margin-top: var(--wp--preset--spacing--2);
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  }

  .wp-block-navigation.is-style-pill
    .wp-block-navigation__submenu-container::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    top: calc(var(--wp--preset--spacing--3) * -1);
    z-index: -1;
  }

  .wp-block-navigation.is-style-pill
    .wp-block-navigation__submenu-container
    > .wp-block-navigation-item {
    border-radius: calc(var(--radius) - 4px);
  }

  .wp-block-navigation.is-style-pill
    .wp-block-navigation__submenu-container
    > .wp-block-navigation-item:hover {
    background-color: var(--accent);
    color: var(--accent-foreground);
  }

  .dark
    .wp-block-navigation.is-style-pill
    .wp-block-navigation__submenu-container {
    background-color: var(--popover) !important;
  }
}

@media screen and (max-width: 768px) {
  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content
    .wp-block-navigation__container,
  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content
    .wp-block-navigation__submenu-container {
    gap: var(--wp--preset--spacing--5);
  }
}

/* ==========================================================================
   Inputs
   ========================================================================== */
input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="tel"],
textarea,
.wp-block-search__input,
.wc-block-components-textarea,
.wc-block-components-form .wc-block-components-text-input input[type="text"],
.wc-block-components-form .wc-block-components-text-input input[type="email"],
.wc-block-components-form .wc-block-components-text-input input[type="number"],
.wc-block-components-form
  .wc-block-components-text-input
  input[type="password"],
.wc-block-components-form .wc-block-components-text-input input[type="search"],
.wc-block-components-form .wc-block-components-text-input input[type="url"],
.wc-block-components-form .wc-block-components-text-input input[type="tel"],
.wc-block-components-form .wc-block-components-text-input textarea,
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="number"],
.wc-block-components-text-input input[type="password"],
.wc-block-components-text-input input[type="search"],
.wc-block-components-text-input input[type="url"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-text-input textarea,
select,
.wc-blocks-components-select .wc-blocks-components-select__select,
.woocommerce-page form .form-row input.input-text,
.woocommerce-page form .form-row select,
.woocommerce-page form .form-row textarea.input-text {
  background-color: transparent;
  color: var(--foreground) !important;
  border-width: 1px !important;
  border-style: solid;
  border-color: var(--border);
  border-radius: calc(var(--radius) - 2px) !important;
  padding: 0.25rem 0.75rem !important;
  font-size: 0.875rem !important;
  line-height: 1.25/0.875 !important;
  height: calc(var(--spacing) * 9);
  box-shadow: 0 0.0625rem 0.125rem 0 rgb(0 0 0 / 0.05);
  transition-property: border-color;
  transition-timing-function: var(--default-transition-timing-function);
  transition-duration: var(--default-transition-duration);
}

textarea,
.wc-block-components-textarea,
.wc-block-components-form .wc-block-components-text-input textarea {
  height: auto;
}

.wp-block-search__input:focus-visible,
.wp-block-search__input:focus,
input[type="text"]:focus-visible,
input[type="text"]:focus,
input[type="email"]:focus-visible,
input[type="email"]:focus,
input[type="password"]:focus-visible,
input[type="password"]:focus,
input[type="search"]:focus-visible,
input[type="search"]:focus,
input[type="url"]:focus-visible,
input[type="url"]:focus,
input[type="tel"]:focus-visible,
input[type="tel"]:focus,
input[type="number"]:focus-visible,
input[type="number"]:focus,
textarea:focus-visible,
textarea:focus,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="text"]:focus-visible,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="text"]:focus,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="email"]:focus-visible,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="email"]:focus,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="password"]:focus-visible,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="password"]:focus,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="search"]:focus-visible,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="search"]:focus,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="url"]:focus-visible,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="url"]:focus,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="tel"]:focus-visible,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="tel"]:focus,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="number"]:focus-visible,
.wc-block-components-form
  .wc-block-components-text-input
  input[type="number"]:focus,
.wc-block-components-text-input input[type="text"]:focus-visible,
.wc-block-components-text-input input[type="text"]:focus,
.wc-block-components-text-input input[type="email"]:focus-visible,
.wc-block-components-text-input input[type="email"]:focus,
.wc-block-components-text-input input[type="number"]:focus-visible,
.wc-block-components-text-input input[type="number"]:focus,
.wc-block-components-text-input input[type="password"]:focus-visible,
.wc-block-components-text-input input[type="password"]:focus,
.wc-block-components-text-input input[type="search"]:focus-visible,
.wc-block-components-text-input input[type="search"]:focus,
.wc-block-components-text-input input[type="tel"]:focus-visible,
.wc-block-components-text-input input[type="tel"]:focus,
.wc-block-components-text-input input[type="url"]:focus-visible,
.wc-block-components-text-input input[type="url"]:focus,
.wc-block-components-textarea:focus-visible,
.wc-block-components-textarea:focus,
select:focus-visible,
select:focus,
.wc-blocks-components-select .wc-blocks-components-select__select:focus-visible,
.wc-blocks-components-select .wc-blocks-components-select__select:focus,
.woocommerce-page form .form-row input.input-text:focus-visible,
.woocommerce-page form .form-row input.input-text:focus,
.woocommerce-page form .form-row select:focus-visible,
.woocommerce-page form .form-row select:focus,
.woocommerce-page form .form-row textarea.input-text:focus-visible,
.woocommerce-page form .form-row textarea.input-text:focus {
  outline: none;
  border-color: var(--ring);
  box-shadow: 0 0 0 3px color-mix(in oklab, oklch(70.8% 0 0) 50%, transparent);
}

select,
.wc-blocks-components-select .wc-blocks-components-select__select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='oklch(80.6% 0 0)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  background-position: right 0.75rem center;
  background-repeat: no-repeat;
  background-size: 0.75rem auto;
  appearance: none;
}

/**
 * Select Options Styling (for browsers that support it)
 * Note: Limited styling support across browsers
 */
select option {
  background-color: var(--background);
  color: var(--foreground);
  padding: 0.5rem;
}

select option:checked {
  background: linear-gradient(var(--primary), var(--primary));
  background-color: var(--primary);
  color: var(--primary-foreground);
}

input[type="checkbox"],
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="checkbox"],
input[type="radio"],
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="radio"],
.wc-block-components-radio-control .wc-block-components-radio-control__input {
  display: inline-flex;
  appearance: none;
  -webkit-appearance: none;
  cursor: inherit;
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
  background-color: transparent;
  border-width: 1px;
  border-style: solid;
  border-color: var(--border);
  border-radius: 4px;
  color: var(--primary-foreground);
  box-shadow: none;
}

input[type="checkbox"],
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="checkbox"] {
  position: relative;
}

input[type="checkbox"]:checked,
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="checkbox"]:checked {
  background-color: var(--primary);
}

input[type="radio"],
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="radio"],
.wc-block-components-radio-control .wc-block-components-radio-control__input {
  border-radius: 100%;
}

input[type="checkbox"]:checked::after,
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1.5px;
  width: 3.5px;
  height: 8px;
  border: solid currentColor;
  border-width: 0 1px 1px 0;
  -webkit-transform: rotate(45deg) translate(-50%, -50%);
  -ms-transform: rotate(45deg) translate(-50%, -50%);
  transform: rotate(45deg);
}

input[type="radio"]:checked,
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="radio"]:checked,
.wc-block-components-radio-control
  .wc-block-components-radio-control__input:checked {
  border-color: var(--border);
}

input[type="radio"]:checked::before,
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="radio"]:checked::before,
.wc-block-components-radio-control
  .wc-block-components-radio-control__input:checked::before {
  width: calc(var(--spacing) * 2);
  height: calc(var(--spacing) * 2);
  min-width: calc(var(--spacing) * 2);
  min-height: calc(var(--spacing) * 2);
  border-radius: 100%;
  background-color: var(--primary);
}

input[type="checkbox"]:focus-visible,
input[type="checkbox"]:focus,
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="checkbox"]:focus-visible,
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="checkbox"]:focus,
input[type="radio"]:focus-visible,
input[type="radio"]:focus,
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="radio"]:focus-visible,
.wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="radio"]:focus,
.wc-block-components-radio-control
  .wc-block-components-radio-control__input:focus-visible,
.wc-block-components-radio-control
  .wc-block-components-radio-control__input:focus {
  outline: none;
}

/* ==========================================================================
   Dark Mode Inputs
   ========================================================================== */

.dark .wp-block-search__input,
.dark input[type="text"],
.dark input[type="email"],
.dark input[type="password"],
.dark input[type="number"],
.dark input[type="search"],
.dark input[type="url"],
.dark input[type="tel"],
.dark textarea,
.dark .wc-block-components-textarea,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="text"],
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="email"],
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="password"],
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="number"],
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="search"],
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="tel"],
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="url"],
.dark .wc-block-components-text-input input[type="text"],
.dark .wc-block-components-text-input input[type="email"],
.dark .wc-block-components-text-input input[type="number"],
.dark .wc-block-components-text-input input[type="password"],
.dark .wc-block-components-text-input input[type="search"],
.dark .wc-block-components-text-input input[type="tel"],
.dark .wc-block-components-text-input input[type="url"],
.dark .wc-block-components-textarea,
.dark select,
.dark .wc-blocks-components-select .wc-blocks-components-select__select,
.dark input[type="checkbox"],
.dark
  .wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="checkbox"],
input[type="radio"],
.dark
  .wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="radio"],
.dark
  .wc-block-components-radio-control
  .wc-block-components-radio-control__input {
  background-color: color-mix(in oklab, var(--input) 30%, transparent);
}

.dark .wp-block-search__input:focus-visible,
.dark .wp-block-search__input:focus,
.dark input[type="text"]:focus-visible,
.dark input[type="text"]:focus,
.dark input[type="email"]:focus-visible,
.dark input[type="email"]:focus,
.dark input[type="password"]:focus-visible,
.dark input[type="password"]:focus,
.dark input[type="search"]:focus-visible,
.dark input[type="search"]:focus,
.dark input[type="tel"]:focus-visible,
.dark input[type="tel"]:focus,
.dark input[type="url"]:focus-visible,
.dark input[type="url"]:focus,
.dark input[type="number"]:focus-visible,
.dark input[type="number"]:focus,
.dark textarea:focus-visible,
.dark textarea:focus,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="text"]:focus-visible,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="text"]:focus,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="email"]:focus-visible,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="email"]:focus-visible,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="number"]:focus-visible,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="number"]:focus,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="password"]:focus-visible,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="password"]:focus,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="search"]:focus-visible,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="search"]:focus,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="tel"]:focus-visible,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="tel"]:focus,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="url"]:focus-visible,
.dark
  .wc-block-components-form
  .wc-block-components-text-input
  input[type="url"]:focus,
.dark .wc-block-components-textarea:focus-visible,
.dark .wc-block-components-textarea:focus,
.dark .wc-block-components-text-input input[type="text"]:focus-visible,
.dark .wc-block-components-text-input input[type="text"]:focus,
.dark .wc-block-components-text-input input[type="email"]:focus-visible,
.dark .wc-block-components-text-input input[type="email"]:focus,
.dark .wc-block-components-text-input input[type="number"]:focus-visible,
.dark .wc-block-components-text-input input[type="number"]:focus,
.dark .wc-block-components-text-input input[type="password"]:focus-visible,
.dark .wc-block-components-text-input input[type="password"]:focus,
.dark .wc-block-components-text-input input[type="search"]:focus-visible,
.dark .wc-block-components-text-input input[type="search"]:focus,
.dark .wc-block-components-text-input input[type="tel"]:focus-visible,
.dark .wc-block-components-text-input input[type="tel"]:focus,
.dark .wc-block-components-text-input input[type="url"]:focus-visible,
.dark .wc-block-components-text-input input[type="url"]:focus,
.dark select:focus-visible,
.dark select:focus,
.dark
  .wc-blocks-components-select
  .wc-blocks-components-select__select:focus-visible,
.dark .wc-blocks-components-select .wc-blocks-components-select__select:focus {
  border-width: 1px !important;
  box-shadow: 0 0 0 3px color-mix(in oklab, oklch(55.6% 0 0) 50%, transparent);
}

.dark select,
.dark .wc-blocks-components-select .wc-blocks-components-select__select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='oklch(100% 0 0/.15)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
}

.dark input[type="checkbox"]:checked,
.dark
  .wc-block-components-checkbox
  .wc-block-components-checkbox__input[type="checkbox"]:checked {
  background-color: var(--primary);
}