{% extends "/layouts/main.twig" %}

{% set active_menu = 'settings' %}

{% block title p__('title', 'Settings')|title %}

{% block template %}
<h1>{{ p__('heading', 'Settings') }}</h1>

<div>
  <h2>{{ p__('heading', 'Common') }}</h2>

  <div class="grid gap-2 mt-4 sm:gap-4 md:gap-5 sm:grid-cols-2">
    <a href="admin/settings/general"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="settings-2"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'General') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Website and SEO') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/public-details"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="circles-relation"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Public details') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Address, contacts etc.') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/policies"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="shield-check"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Policies') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Legal terms') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/pwa"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="bolt"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'PWA') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Progressive Web App settings') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/features"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="sparkles"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Features') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Configure features') }}
        </p>
      </div>
    </a>
  </div>
</div>

<div>
  <h2>{{ p__('heading', 'Branding') }}</h2>

  <div class="grid gap-2 mt-4 sm:gap-4 md:gap-5 sm:grid-cols-2">
    <a href="admin/settings/logo"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="brand-abstract"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Logo') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Logo and favicon') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/appearance"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="brush"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Appearance') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Color schemes etc.') }}
        </p>
      </div>
    </a>
  </div>
</div>

<div>
  <h2>{{ p__('heading', 'Finance') }}</h2>

  <div class="grid gap-2 mt-4 sm:gap-4 md:gap-5 sm:grid-cols-2">
    <a href="admin/settings/billing"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="file-invoice"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Billing') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Currency and subscriptions') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/payments"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="cash"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Payments') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Payment gateway integrations') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/credits"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="decimal"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Credit ratios') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Credit usage rates') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/rate-providers"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="exchange"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Exchange') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Currency exchange rate providers') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/affiliates"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        <i class="ti ti-affiliate"></i>
      </span>

      <div>
        <h3>{{ p__('heading', 'Affiliates') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Affiliate program settings') }}
        </p>
      </div>
    </a>
  </div>
</div>

<div>
  <h2>{{ p__('heading', 'Email') }}</h2>

  <div class="grid gap-2 mt-4 sm:gap-4 md:gap-5 sm:grid-cols-2">
    <a href="admin/settings/mail"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="at"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Mail') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Transport and sender details') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/smtp"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="server-cog"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'SMTP') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('SMTP transport details') }}
        </p>
      </div>
    </a>
  </div>
</div>

<div>
  <h2>{{ p__('heading', 'User accounts') }}</h2>

  <div class="grid gap-2 mt-4 sm:gap-4 md:gap-5 sm:grid-cols-2">
    <a href="admin/settings/accounts"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="user-cog"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Account settings') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Accounts and sign up form') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/identity-providers"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="fingerprint"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Identity providers') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('3rd party identiy providers') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/recaptcha"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="scan"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'CAPTCHA') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Google reCAPTCHA') }}
        </p>
      </div>
    </a>
  </div>
</div>

<div>
  <h2>{{ p__('heading', 'File storage') }}</h2>

  <div class="grid gap-2 mt-4 sm:gap-4 md:gap-5 sm:grid-cols-2">
    <a href="admin/settings/storage"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="file-stack"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Storage settings') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('File storage settings') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/cdn"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="cloud-upload"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Cloud storage') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Integrated cloud storage options') }}
        </p>
      </div>
    </a>
  </div>
</div>

<div>
  <h2>{{ p__('heading', 'Integrations') }}</h2>

  <div class="grid gap-2 mt-4 sm:gap-4 md:gap-5 sm:grid-cols-2">
    <a href="admin/settings/openai"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="brand-openai"></x-avatar>

      <div>
        <h3>OpenAI</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('API keys and service config') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/cohere"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        <svg xmlns="http://www.w3.org/2000/svg" width="218" height="224"
          viewBox="0 0 218 224">
          <path
            d="M70.7878 133.637C76.6687 133.637 88.367 133.305 104.537 126.48C123.38 118.525 160.869 104.085 187.913 89.2536C206.827 78.8799 215.117 65.1597 215.117 46.6833C215.118 21.0401 194.843 0.251953 169.833 0.251953H65.0456C29.1218 0.251953 0 30.111 0 66.9442C0 103.777 27.2666 133.637 70.7878 133.637Z"
            fill="currentColor" />
          <path
            d="M88.5088 179.584C88.5088 161.529 99.1098 145.25 115.374 138.329L148.374 124.287C181.753 110.083 218.493 135.234 218.493 172.29C218.493 200.998 195.791 224.269 167.791 224.261L132.061 224.251C108.006 224.245 88.5088 204.249 88.5088 179.584Z"
            fill="currentColor" />
          <path
            d="M37.4969 142.404H37.4962C16.7876 142.404 0 159.617 0 180.85V185.829C0 207.062 16.7876 224.275 37.4962 224.275H37.4969C58.2055 224.275 74.9932 207.062 74.9932 185.829V180.85C74.9932 159.617 58.2055 142.404 37.4969 142.404Z"
            fill="currentColor" />
        </svg>
      </span>

      <div>
        <h3>Cohere</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('API keys and service config') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/anthropic"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        <svg viewBox="0 0 256 176" version="1.1"
          xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid">
          <g fill="currentColor">
            <path
              d="M147.486878,0 C147.486878,0 217.568251,175.780074 217.568251,175.780074 C217.568251,175.780074 256,175.780074 256,175.780074 C256,175.780074 185.918621,0 185.918621,0 C185.918621,0 147.486878,0 147.486878,0 C147.486878,0 147.486878,0 147.486878,0 Z">
            </path>
            <path
              d="M66.1828124,106.221191 C66.1828124,106.221191 90.1624677,44.4471185 90.1624677,44.4471185 C90.1624677,44.4471185 114.142128,106.221191 114.142128,106.221191 C114.142128,106.221191 66.1828124,106.221191 66.1828124,106.221191 C66.1828124,106.221191 66.1828124,106.221191 66.1828124,106.221191 Z M70.0705318,0 C70.0705318,0 0,175.780074 0,175.780074 C0,175.780074 39.179211,175.780074 39.179211,175.780074 C39.179211,175.780074 53.5097704,138.86606 53.5097704,138.86606 C53.5097704,138.86606 126.817544,138.86606 126.817544,138.86606 C126.817544,138.86606 141.145724,175.780074 141.145724,175.780074 C141.145724,175.780074 180.324935,175.780074 180.324935,175.780074 C180.324935,175.780074 110.254409,0 110.254409,0 C110.254409,0 70.0705318,0 70.0705318,0 C70.0705318,0 70.0705318,0 70.0705318,0 Z">
            </path>
          </g>
        </svg>
      </span>

      <div>
        <h3>Anthropic / Claude AI</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('API keys and service config') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/xai"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor"
          viewBox="0 0 24 24" aria-hidden="true" class="w-6 h-6"
          focusable="false" style="fill:currentColor">
          <path
            d="m3.005 8.858 8.783 12.544h3.904L6.908 8.858zM6.905 15.825 3 21.402h3.907l1.951-2.788zM16.585 2l-6.75 9.64 1.953 2.79L20.492 2zM17.292 7.965v13.437h3.2V3.395z">
          </path>
        </svg>
      </span>

      <div>
        <h3>xAI / Grok</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('API keys and service config') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/elevenlabs"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        II
      </span>

      <div>
        <h3>ElevenLabs</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('API keys and service config') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/gcp"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="brand-google"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Google Cloud Platform') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Google credentials for TTS etc.') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/azure"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="brand-azure"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Azure') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Credentials for Azure TTS etc.') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/falai"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        <svg width="40" height="40" viewBox="0 0 40 40" fill="none"
          xmlns="http://www.w3.org/2000/svg">
          <path opacity="0.22" d="M14.6154 31.8462H12.4616V34H14.6154V31.8462Z"
            fill="currentColor" />
          <path opacity="0.85"
            d="M18.9224 23.2296H8.15329V25.3834H18.9224V23.2296Z"
            fill="currentColor" />
          <path d="M18.9235 21.0764H10.3083V23.2302H18.9235V21.0764Z"
            fill="currentColor" />
          <path opacity="0.4"
            d="M16.7692 29.6929H12.4616V31.8467H16.7692V29.6929Z"
            fill="currentColor" />
          <path opacity="0.7" d="M18.9229 25.3863H6V27.5401H18.9229V25.3863Z"
            fill="currentColor" />
          <path opacity="0.5" d="M18.923 27.5362H12.4616V29.69H18.923V27.5362Z"
            fill="currentColor" />
          <path opacity="0.22"
            d="M14.6154 16.7698H12.4616V18.9236H14.6154V16.7698Z"
            fill="currentColor" />
          <path opacity="0.85"
            d="M18.9224 8.15327H8.15329V10.3071H18.9224V8.15327Z"
            fill="currentColor" />
          <path d="M18.9235 6H10.3083V8.1538H18.9235V6Z" fill="currentColor" />
          <path opacity="0.4"
            d="M16.7692 14.6131H12.4616V16.7669H16.7692V14.6131Z"
            fill="currentColor" />
          <path opacity="0.7" d="M18.9229 10.3066H6V12.4604H18.9229V10.3066Z"
            fill="currentColor" />
          <path opacity="0.5"
            d="M18.923 12.4598H12.4616V14.6136H18.923V12.4598Z"
            fill="currentColor" />
          <path opacity="0.22" d="M29.6918 31.8462H27.538V34H29.6918V31.8462Z"
            fill="currentColor" />
          <path opacity="0.85"
            d="M33.9988 23.2296H23.2297V25.3834H33.9988V23.2296Z"
            fill="currentColor" />
          <path d="M34 21.0764H25.3847V23.2302H34V21.0764Z"
            fill="currentColor" />
          <path opacity="0.4"
            d="M31.8456 29.6929H27.538V31.8467H31.8456V29.6929Z"
            fill="currentColor" />
          <path opacity="0.7"
            d="M33.9993 25.3863H21.0765V27.5401H33.9993V25.3863Z"
            fill="currentColor" />
          <path opacity="0.5" d="M33.9995 27.5362H27.538V29.69H33.9995V27.5362Z"
            fill="currentColor" />
          <path opacity="0.22"
            d="M29.6918 16.7698H27.538V18.9236H29.6918V16.7698Z"
            fill="currentColor" />
          <path opacity="0.85"
            d="M33.9988 8.15327H23.2297V10.3071H33.9988V8.15327Z"
            fill="currentColor" />
          <path d="M34 6H25.3847V8.1538H34V6Z" fill="currentColor" />
          <path opacity="0.4"
            d="M31.8456 14.6131H27.538V16.7669H31.8456V14.6131Z"
            fill="currentColor" />
          <path opacity="0.7"
            d="M33.9993 10.3066H21.0765V12.4604H33.9993V10.3066Z"
            fill="currentColor" />
          <path opacity="0.5"
            d="M33.9995 12.4598H27.538V14.6136H33.9995V12.4598Z"
            fill="currentColor" />
        </svg>
      </span>

      <div>
        <h3>Fal AI</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('API keys and service config') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/stabilityai"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        S.
      </span>

      <div>
        <h3>Stability AI</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('API keys and service config') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/clipdrop"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        CD
      </span>

      <div>
        <h3>Clipdrop</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('API keys and service config') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/aimlapi"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        <svg xmlns="http://www.w3.org/2000/svg" width="23" height="21"
          viewBox="0 0 23 21" fill="none">
          <mask id="mask1_1_36" style="mask-type:alpha"
            maskUnits="userSpaceOnUse" x="0" y="0" width="23" height="21">
            <path
              d="M22.6669 9.06242C23.1034 9.81847 23.1034 10.75 22.6669 11.506L18.1401 19.3467C17.7036 20.1027 16.8969 20.5685 16.0239 20.5685H6.97038C6.09737 20.5685 5.29068 20.1027 4.85417 19.3467L0.327377 11.506C-0.109127 10.75 -0.109125 9.81847 0.327379 9.06242L4.85417 1.22179C5.29068 0.465744 6.09737 0 6.97038 0H16.0239C16.8969 0 17.7036 0.465745 18.1401 1.22179L22.6669 9.06242Z"
              fill="currentColor" />
          </mask>
          <g mask="url(#mask1_1_36)">
            <g>
              <path
                d="M16.9508 12.5632C26.2299 8.12153 9.56998 -24.081 12.268 -13.5355C14.0198 -6.68875 7.90618 -7.71248 8.52593 -3.93352C9.40423 1.42189 8.90688 4.18523 6.3567 5.74115C10.5063 7.89075 9.5275 16.1164 16.9508 12.5632Z"
                fill="currentColor" />
            </g>
            <g>
              <path
                d="M-13.1094 -2.29349C-7.82128 -1.60151 -9.64942 -7.49638 2.88647 -2.0493C10.8705 1.41992 11.7366 15.2689 6.88381 19.5307C2.21229 23.6333 -29.7826 16.8042 -25.7092 16.4775C-1.39544 14.5274 2.71477 9.89756 -13.1094 -2.29349Z"
                fill="currentColor" />
            </g>
            <g>
              <path
                d="M21.6704 31.5945C30.1671 27.5275 14.912 -1.9594 17.3826 7.69679C18.9866 13.9662 13.3885 13.0288 13.956 16.4891C14.7602 21.3929 14.3048 23.9232 11.9697 25.3479C15.7694 27.3162 14.8731 34.8482 21.6704 31.5945Z"
                fill="currentColor" />
            </g>
            <g>
              <path
                d="M24.1729 2.77419C20.4892 -2.17345 5.24743 10.3844 10.6154 7.86309C14.1006 6.22614 14.3789 9.84723 16.3499 9.14401C19.1432 8.14743 20.7144 8.18165 21.9091 9.51074C22.5116 6.91988 27.1199 6.73231 24.1729 2.77419Z"
                fill="currentColor" />
            </g>
            <g>
              <path
                d="M20.7044 15.0888C17.2431 9.22062 -11.7401 25.2217 -2.37651 21.9052C3.70283 19.752 2.52284 24.1556 5.86216 23.2093C10.5945 21.8681 12.9923 21.8391 14.2373 23.4063C16.3127 20.2194 23.4736 19.7833 20.7044 15.0888Z"
                fill="currentColor" />
            </g>
            <path d="M23.4894 -6.8722H-7.56133V24.8778H23.4894V-6.8722Z"
              fill="currentColor" />
          </g>
          <path fill-rule="evenodd" clip-rule="evenodd"
            d="M6.52895 13.737C6.35869 13.737 6.18737 13.6827 6.04266 13.572C5.69363 13.3028 5.62766 12.8016 5.89687 12.4526L9.08172 8.31323C9.21154 8.14404 9.40414 8.03444 9.61483 8.00784C9.82978 7.98017 10.0404 8.03976 10.2075 8.17277L13.2082 10.5298L15.8334 7.14272C16.1037 6.79264 16.6038 6.72773 16.9528 7.00014C17.3018 7.27042 17.3657 7.77161 17.0954 8.11957L13.9776 12.1419C13.8478 12.31 13.6562 12.4196 13.4455 12.4452C13.2327 12.4739 13.022 12.4122 12.8539 12.2813L9.85532 9.92536L7.16209 13.4252C7.0046 13.6295 6.76837 13.737 6.52895 13.737Z"
            fill="rgba(var(--color-main))" />
        </svg>
      </span>

      <div>
        <h3>AI/ML API</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('API for Suno AI etc.') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/onesignal"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        <svg width="32" height="32" viewBox="0 0 32 32" fill="none"
          xmlns="http://www.w3.org/2000/svg">
          <path fill="currentColor"
            d="M15.972.838C7.585.855.752 7.74.8 16.127a15.201 15.201 0 0 0 13.657 15.035.174.174 0 0 0 .192-.175V16.04h-1.181a.175.175 0 0 1-.175-.175v-2.358a.175.175 0 0 1 .175-.175h3.707a.175.175 0 0 1 .175.175v17.481a.175.175 0 0 0 .192.175A15.201 15.201 0 0 0 15.972.838Zm4.32 26.938a.175.175 0 0 1-.234-.166v-2.495a.262.262 0 0 1 .15-.236 9.79 9.79 0 0 0-4.36-18.63c-5.2.08-9.466 4.273-9.631 9.471a9.802 9.802 0 0 0 5.578 9.159.263.263 0 0 1 .15.236v2.495a.174.174 0 0 1-.15.174.175.175 0 0 1-.083-.008 12.515 12.515 0 0 1-8.204-11.852c.06-6.787 5.606-12.328 12.395-12.378 6.935-.056 12.591 5.57 12.591 12.493 0 5.383-3.42 9.982-8.202 11.737Z">
          </path>
        </svg>
      </span>

      <div>
        <h3>OneSignal</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Push notifications') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/serper"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        <svg viewBox="0 0 70 70" xmlns="http://www.w3.org/2000/svg">
          <path
            d="M35.6992 17.5264C37.571 17.5264 39.3369 17.8438 40.9971 18.4785C42.6735 19.1133 44.1383 19.9922 45.3916 21.1152C46.6449 22.2383 47.597 23.5404 48.248 25.0215C48.3945 25.347 48.4678 25.6807 48.4678 26.0225C48.4678 26.6898 48.2236 27.2676 47.7354 27.7559C47.2633 28.2279 46.6937 28.4639 46.0264 28.4639C45.5869 28.4639 45.1475 28.3255 44.708 28.0488C44.2686 27.7559 43.9593 27.4059 43.7803 26.999C43.1618 25.5993 42.1283 24.4844 40.6797 23.6543C39.2474 22.8242 37.5872 22.4092 35.6992 22.4092C34.7715 22.4092 33.7868 22.5231 32.7451 22.751C31.7197 22.9788 30.7513 23.3288 29.8398 23.8008C28.9284 24.2565 28.1878 24.8343 27.6182 25.5342C27.0485 26.234 26.7637 27.0479 26.7637 27.9756C26.7637 28.7243 27.0078 29.3753 27.4961 29.9287C27.9844 30.4658 28.5296 30.889 29.1318 31.1982C30.5479 31.8981 32.1104 32.3864 33.8193 32.6631C35.5446 32.9398 37.2861 33.2083 39.0439 33.4688C40.8018 33.7292 42.4375 34.1849 43.9512 34.8359C44.9115 35.2428 45.8311 35.8044 46.71 36.5205C47.5889 37.2367 48.305 38.1074 48.8584 39.1328C49.4118 40.1582 49.6885 41.3626 49.6885 42.7461C49.6885 44.5365 49.2572 46.1071 48.3945 47.458C47.5319 48.8089 46.4007 49.932 45.001 50.8271C43.6012 51.7223 42.0794 52.3978 40.4355 52.8535C38.8079 53.293 37.2129 53.5127 35.6504 53.5127C33.5345 53.5127 31.5488 53.179 29.6934 52.5117C27.8379 51.8281 26.2184 50.8678 24.835 49.6309C23.4515 48.3776 22.3936 46.9128 21.6611 45.2363C21.5146 44.9108 21.4414 44.5853 21.4414 44.2598C21.4414 43.5924 21.6774 43.0228 22.1494 42.5508C22.6377 42.0625 23.2155 41.8184 23.8828 41.8184C24.3385 41.8184 24.7861 41.9648 25.2256 42.2578C25.665 42.5345 25.9661 42.8844 26.1289 43.3076C26.8451 44.9515 28.0576 46.2536 29.7666 47.2139C31.4756 48.1579 33.4368 48.6299 35.6504 48.6299C37.0339 48.6299 38.4255 48.4264 39.8252 48.0195C41.2249 47.5964 42.3968 46.9535 43.3408 46.0908C44.3011 45.2119 44.7812 44.097 44.7812 42.7461C44.7812 41.8835 44.4883 41.1755 43.9023 40.6221C43.3327 40.0524 42.7061 39.6211 42.0225 39.3281C40.4762 38.6608 38.8242 38.2051 37.0664 37.9609C35.3086 37.7005 33.5589 37.432 31.8174 37.1553C30.0758 36.8623 28.4482 36.3333 26.9346 35.5684C25.6488 34.9173 24.4769 33.9733 23.4189 32.7363C22.3773 31.4831 21.8564 29.8962 21.8564 27.9756C21.8564 26.2829 22.2633 24.7936 23.0771 23.5078C23.9072 22.2057 24.9977 21.1152 26.3486 20.2363C27.7158 19.3411 29.2132 18.6657 30.8408 18.21C32.4684 17.7542 34.0879 17.5264 35.6992 17.5264Z"
            fill="currentColor"></path>
          <circle cx="35" cy="35" r="32" stroke="currentColor" stroke-width="6"
            fill="transparent"></circle>
        </svg>
      </span>

      <div>
        <h3>Serper</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Google search API') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/searchapi"
      class="flex gap-4 items-center box hover:border-line">
      <span class="avatar">
        <svg width="76" height="64" viewBox="0 0 76 64" fill="none"
          xmlns="http://www.w3.org/2000/svg">
          <path
            d="M57.7423 59.289C57.7423 59.6275 57.6757 59.9627 57.5461 60.2755C57.4166 60.5883 57.2267 60.8725 56.9873 61.1118C56.748 61.3512 56.4638 61.5411 56.151 61.6706C55.8383 61.8001 55.5031 61.8668 55.1645 61.8668C52.5675 61.8638 50.0777 60.8309 48.2413 58.9945C46.4049 57.1581 45.3719 54.6683 45.3689 52.0712V41.0482C45.3703 40.3654 45.6425 39.711 46.1258 39.2287C46.609 38.7463 47.2639 38.4755 47.9467 38.4755C48.6295 38.4755 49.2844 38.7463 49.7677 39.2287C50.251 39.711 50.5232 40.3654 50.5245 41.0482V52.0712C50.5259 53.3014 51.0152 54.4808 51.885 55.3507C52.7549 56.2206 53.9343 56.7099 55.1645 56.7112C55.503 56.7112 55.8383 56.7778 56.151 56.9074C56.4638 57.0369 56.748 57.2268 56.9873 57.4662C57.2267 57.7056 57.4166 57.9897 57.5461 58.3025C57.6757 58.6153 57.7423 58.9505 57.7423 59.289ZM72.6935 42.6875C72.3549 42.6875 72.0197 42.7541 71.7069 42.8837C71.3942 43.0132 71.11 43.2031 70.8706 43.4425C70.6313 43.6818 70.4414 43.966 70.3118 44.2788C70.1823 44.5916 70.1156 44.9268 70.1157 45.2653C70.1157 46.4959 69.6268 47.6761 68.7566 48.5463C67.8865 49.4164 66.7063 49.9053 65.4757 49.9053C64.2451 49.9053 63.0649 49.4164 62.1947 48.5463C61.3245 47.6761 60.8357 46.4959 60.8357 45.2653V23.2C60.8357 17.047 58.3914 11.146 54.0405 6.79514C49.6897 2.44428 43.7887 0 37.6356 0C31.4826 0 25.5816 2.44428 21.2307 6.79514C16.8799 11.146 14.4356 17.047 14.4356 23.2V45.2653C14.4356 46.4959 13.9467 47.6761 13.0766 48.5462C12.2064 49.4164 11.0262 49.9053 9.79558 49.9053C8.56497 49.9053 7.38477 49.4164 6.5146 48.5462C5.64443 47.6761 5.15558 46.4959 5.15558 45.2653C5.15624 44.9263 5.09006 44.5906 4.96081 44.2772C4.83157 43.9639 4.6418 43.6791 4.40236 43.4392C4.16292 43.1993 3.87853 43.009 3.56544 42.8791C3.25236 42.7492 2.91674 42.6824 2.57779 42.6824C2.23884 42.6824 1.90323 42.7492 1.59014 42.8791C1.27706 43.009 0.99266 43.1993 0.753225 43.4392C0.513789 43.6791 0.324015 43.9639 0.194768 44.2772C0.0655213 44.5906 -0.000662587 44.9263 5.00043e-06 45.2653C0.00262818 47.8615 1.03582 50.3505 2.87256 52.1854C4.7093 54.0203 7.19935 55.0509 9.79558 55.0509C12.3918 55.0509 14.8819 54.0203 16.7186 52.1854C18.5553 50.3505 19.5885 47.8615 19.5912 45.2653V23.2C19.5912 18.4143 21.4923 13.8247 24.8763 10.4407C28.2603 7.05665 32.85 5.15554 37.6357 5.15554C42.4214 5.15554 47.011 7.05665 50.395 10.4407C53.779 13.8247 55.6802 18.4143 55.6802 23.2V45.2653C55.6828 47.8615 56.716 50.3505 58.5527 52.1854C60.3895 54.0203 62.8795 55.0509 65.4757 55.0509C68.072 55.0509 70.562 54.0203 72.3988 52.1854C74.2355 50.3505 75.2687 47.8615 75.2713 45.2653C75.2713 44.9267 75.2047 44.5915 75.0751 44.2788C74.9456 43.966 74.7557 43.6818 74.5163 43.4424C74.2769 43.2031 73.9927 43.0132 73.68 42.8836C73.3672 42.7541 73.032 42.6875 72.6935 42.6875ZM37.6356 41.2445C37.2971 41.2445 36.9619 41.3111 36.6491 41.4407C36.3363 41.5702 36.0521 41.7601 35.8128 41.9995C35.5734 42.2388 35.3835 42.523 35.254 42.8358C35.1245 43.1485 35.0578 43.4838 35.0578 43.8223V61.3512C35.0592 62.034 35.3313 62.6884 35.8146 63.1707C36.2979 63.653 36.9528 63.9239 37.6356 63.9239C38.3184 63.9239 38.9733 63.653 39.4566 63.1707C39.9399 62.6884 40.212 62.034 40.2134 61.3512V43.8223C40.2134 43.4838 40.1468 43.1486 40.0172 42.8358C39.8877 42.523 39.6978 42.2388 39.4584 41.9995C39.2191 41.7601 38.9349 41.5702 38.6221 41.4407C38.3093 41.3111 37.9741 41.2445 37.6356 41.2445ZM27.3245 38.4704C26.9859 38.4704 26.6507 38.537 26.338 38.6666C26.0252 38.7961 25.741 38.986 25.5016 39.2253C25.2623 39.4647 25.0724 39.7489 24.9429 40.0617C24.8133 40.3744 24.7467 40.7096 24.7467 41.0482V52.0712C24.7453 53.3014 24.2561 54.4808 23.3862 55.3507C22.5163 56.2206 21.3369 56.7099 20.1067 56.7112C19.423 56.7112 18.7673 56.9828 18.2839 57.4662C17.8005 57.9497 17.5289 58.6053 17.5289 59.289C17.5289 59.9727 17.8005 60.6283 18.2839 61.1118C18.7673 61.5952 19.423 61.8668 20.1067 61.8668C22.7037 61.8638 25.1936 60.8309 27.0299 58.9945C28.8663 57.1581 29.8993 54.6682 29.9023 52.0712V41.0482C29.9023 40.7096 29.8356 40.3744 29.7061 40.0617C29.5765 39.7489 29.3867 39.4647 29.1473 39.2253C28.9079 38.986 28.6237 38.7961 28.311 38.6666C27.9982 38.537 27.663 38.4704 27.3245 38.4704ZM30.418 19.5909C29.7042 19.5909 29.0065 19.8025 28.413 20.1991C27.8195 20.5957 27.3569 21.1593 27.0838 21.8187C26.8106 22.4782 26.7392 23.2038 26.8784 23.9039C27.0177 24.6039 27.3614 25.247 27.8661 25.7517C28.3708 26.2564 29.0138 26.6001 29.7139 26.7394C30.414 26.8786 31.1396 26.8071 31.799 26.534C32.4585 26.2608 33.0221 25.7983 33.4187 25.2048C33.8152 24.6113 34.0269 23.9136 34.0269 23.1998C34.0269 22.2427 33.6466 21.3247 32.9698 20.6479C32.293 19.9711 31.3751 19.5909 30.418 19.5909ZM48.4624 23.1998C48.4624 22.486 48.2508 21.7883 47.8542 21.1948C47.4577 20.6013 46.8941 20.1387 46.2346 19.8656C45.5752 19.5924 44.8495 19.521 44.1495 19.6602C43.4494 19.7995 42.8064 20.1432 42.3017 20.6479C41.797 21.1526 41.4532 21.7957 41.314 22.4957C41.1747 23.1958 41.2462 23.9214 41.5194 24.5809C41.7925 25.2403 42.2551 25.8039 42.8486 26.2005C43.442 26.597 44.1398 26.8087 44.8536 26.8087C45.8107 26.8087 46.7286 26.4285 47.4054 25.7517C48.0822 25.0749 48.4624 24.1569 48.4624 23.1998Z"
            fill="currentColor" />
        </svg>

      </span>

      <div>
        <h3>Search API</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Google search & YouTube API') }}
        </p>
      </div>
    </a>

    <a href="admin/settings/script-tags"
      class="flex gap-4 items-center box hover:border-line">
      <x-avatar icon="code"></x-avatar>

      <div>
        <h3>{{ p__('heading', 'Script Tags') }}</h3>
        <p class="mt-1 text-sm text-content-dimmed">
          {{ __('Custom tags, Google Analytics etc.') }}
        </p>
      </div>
    </a>
  </div>
</div>

{% endblock %}