import { onMounted, ref, defineComponent, mergeProps, unref, createVNode, resolveDynamicComponent, useSSRContext, withCtx } from "vue";
import { ssrRenderAttrs, ssrRenderList, ssrRenderClass, ssrRenderVNode, ssrInterpolate, ssrRenderComponent } from "vue/server-renderer";
import { Head } from "@inertiajs/vue3";
import { Sun, Moon, Monitor } from "lucide-vue-next";
import { _ as _sfc_main$3, a as _sfc_main$4 } from "./Layout-UfShJMxQ.js";
import { _ as _sfc_main$2 } from "./AppLayout-DXKl-uoF.js";
import "./AppLogoIcon-DhmQfNIw.js";
import "class-variance-authority";
import "clsx";
import "tailwind-merge";
import "reka-ui";
import "@vueuse/core";
import "./Input-CFG4Vy8n.js";
function updateTheme(value) {
  if (typeof window === "undefined") {
    return;
  }
  if (value === "system") {
    const mediaQueryList = window.matchMedia("(prefers-color-scheme: dark)");
    const systemTheme = mediaQueryList.matches ? "dark" : "light";
    document.documentElement.classList.toggle("dark", systemTheme === "dark");
  } else {
    document.documentElement.classList.toggle("dark", value === "dark");
  }
}
const setCookie = (name, value, days = 365) => {
  if (typeof document === "undefined") {
    return;
  }
  const maxAge = days * 24 * 60 * 60;
  document.cookie = `${name}=${value};path=/;max-age=${maxAge};SameSite=Lax`;
};
const appearance = ref("system");
function useAppearance() {
  onMounted(() => {
    const savedAppearance = localStorage.getItem("appearance");
    if (savedAppearance) {
      appearance.value = savedAppearance;
    }
  });
  function updateAppearance(value) {
    appearance.value = value;
    localStorage.setItem("appearance", value);
    setCookie("appearance", value);
    updateTheme(value);
  }
  return {
    appearance,
    updateAppearance
  };
}
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
  __name: "AppearanceTabs",
  __ssrInlineRender: true,
  setup(__props) {
    const { appearance: appearance2 } = useAppearance();
    const tabs = [
      { value: "light", Icon: Sun, label: "Light" },
      { value: "dark", Icon: Moon, label: "Dark" },
      { value: "system", Icon: Monitor, label: "System" }
    ];
    return (_ctx, _push, _parent, _attrs) => {
      _push(`<div${ssrRenderAttrs(mergeProps({ class: "inline-flex gap-1 rounded-lg bg-neutral-100 p-1 dark:bg-neutral-800" }, _attrs))}><!--[-->`);
      ssrRenderList(tabs, ({ value, Icon, label }) => {
        _push(`<button class="${ssrRenderClass([
          "flex items-center rounded-md px-3.5 py-1.5 transition-colors",
          unref(appearance2) === value ? "bg-white shadow-xs dark:bg-neutral-700 dark:text-neutral-100" : "text-neutral-500 hover:bg-neutral-200/60 hover:text-black dark:text-neutral-400 dark:hover:bg-neutral-700/60"
        ])}">`);
        ssrRenderVNode(_push, createVNode(resolveDynamicComponent(Icon), { class: "-ml-1 h-4 w-4" }, null), _parent);
        _push(`<span class="ml-1.5 text-sm">${ssrInterpolate(label)}</span></button>`);
      });
      _push(`<!--]--></div>`);
    };
  }
});
const _sfc_setup$1 = _sfc_main$1.setup;
_sfc_main$1.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("resources/js/components/AppearanceTabs.vue");
  return _sfc_setup$1 ? _sfc_setup$1(props, ctx) : void 0;
};
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "Appearance",
  __ssrInlineRender: true,
  setup(__props) {
    const breadcrumbItems = [
      {
        title: "Настройки внешнего вида",
        href: "/settings/appearance"
      }
    ];
    return (_ctx, _push, _parent, _attrs) => {
      _push(ssrRenderComponent(_sfc_main$2, mergeProps({ breadcrumbs: breadcrumbItems }, _attrs), {
        default: withCtx((_, _push2, _parent2, _scopeId) => {
          if (_push2) {
            _push2(ssrRenderComponent(unref(Head), { title: "Настройки внешнего вида" }, null, _parent2, _scopeId));
            _push2(ssrRenderComponent(_sfc_main$3, null, {
              default: withCtx((_2, _push3, _parent3, _scopeId2) => {
                if (_push3) {
                  _push3(`<div class="space-y-6"${_scopeId2}>`);
                  _push3(ssrRenderComponent(_sfc_main$4, {
                    title: "Настройки внешнего вида",
                    description: "Обновите настройки внешнего вида вашей учетной записи"
                  }, null, _parent3, _scopeId2));
                  _push3(ssrRenderComponent(_sfc_main$1, null, null, _parent3, _scopeId2));
                  _push3(`</div>`);
                } else {
                  return [
                    createVNode("div", { class: "space-y-6" }, [
                      createVNode(_sfc_main$4, {
                        title: "Настройки внешнего вида",
                        description: "Обновите настройки внешнего вида вашей учетной записи"
                      }),
                      createVNode(_sfc_main$1)
                    ])
                  ];
                }
              }),
              _: 1
            }, _parent2, _scopeId));
          } else {
            return [
              createVNode(unref(Head), { title: "Настройки внешнего вида" }),
              createVNode(_sfc_main$3, null, {
                default: withCtx(() => [
                  createVNode("div", { class: "space-y-6" }, [
                    createVNode(_sfc_main$4, {
                      title: "Настройки внешнего вида",
                      description: "Обновите настройки внешнего вида вашей учетной записи"
                    }),
                    createVNode(_sfc_main$1)
                  ])
                ]),
                _: 1
              })
            ];
          }
        }),
        _: 1
      }, _parent));
    };
  }
});
const _sfc_setup = _sfc_main.setup;
_sfc_main.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("resources/js/pages/settings/Appearance.vue");
  return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};
export {
  _sfc_main as default
};
