@import 'tailwindcss';

/*  Plugins */
@plugin 'daisyui' {
  themes: all;
}
@plugin 'daisyui/theme' {
  name: 'tikabase';
  default: false;
  prefersdark: false;
  color-scheme: 'light';
  --color-base-100: #ffffff;
  --color-base-200: #f8f9fa;
  --color-base-300: #e5e7eb;
  --color-base-content: #014a70;
  --color-primary: #0367fd;
  --color-primary-content: oklch(98% 0.003 247.858);
  --color-secondary: #64748b;
  --color-secondary-content: oklch(100% 0 0);
  --color-accent: #f59e0b;
  --color-accent-content: oklch(27% 0.072 132.109);
  --color-neutral: oklch(29% 0.066 243.157);
  --color-neutral-content: oklch(97% 0.013 236.62);
  --color-info: #f27f0d;
  --color-info-content: oklch(97% 0.014 254.604);
  --color-success: oklch(60% 0.118 184.704);
  --color-success-content: oklch(98% 0.014 180.72);
  --color-warning: oklch(64% 0.222 41.116);
  --color-warning-content: oklch(98% 0.016 73.684);
  --color-error: oklch(59% 0.249 0.584);
  --color-error-content: oklch(97% 0.014 343.198);
  --radius-selector: 0.5rem;
  --radius-field: 0.5rem;
  --radius-box: 0.5rem;
  --size-selector: 0.25rem;
  --size-field: 0.25rem;
  --border: 1px;
  --depth: 1;
  --noise: 0;
}
@plugin 'daisyui/theme' {
  name: 'showcase';
  default: false;
  prefersdark: false;
  color-scheme: 'light';
  --color-base-100: #ffffff;
  --color-base-200: #f6f5f3;
  --color-base-300: #e6e4e1;
  --color-base-content: #141213;
  --color-primary: #fdb521;
  --color-primary-content: #141213;
  --color-secondary: #6f6a66;
  --color-secondary-content: #fffffd;
  --color-accent: #fdb521;
  --color-accent-content: #141213;
  --color-neutral: #141213;
  --color-neutral-content: #fffffd;
  --color-info: #3b82f6;
  --color-info-content: #eff6ff;
  --color-success: #16a34a;
  --color-success-content: #f0fdf4;
  --color-warning: #fdb521;
  --color-warning-content: #141213;
  --color-error: #dc2626;
  --color-error-content: #fef2f2;
  --radius-selector: 0.5rem;
  --radius-field: 0.3rem;
  --radius-box: 1.25rem;
  --size-selector: 0.25rem;
  --size-field: 0.25rem;
  --border: 1px;
  --depth: 0;
  --noise: 0;
}

@keyframes home-progress {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}

@keyframes home-marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

.home-marquee {
  animation: home-marquee 46s linear infinite;
}

.home-progress {
  transform-origin: left center;
  animation: home-progress var(--home-duration, 7s) linear forwards;
}

@keyframes catalog-banner-media {
  from {
    opacity: 0;
    transform: scale(1.1);
  }
}

.catalog-banner-media {
  animation: catalog-banner-media 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0.2s both;
}

@keyframes catalog-banner-title {
  from {
    opacity: 0;
  }
}

.catalog-banner-title {
  animation: catalog-banner-title 0.3s ease-in 0.4s both;
}

@media (prefers-reduced-motion: reduce) {
  .catalog-banner-media,
  .catalog-banner-title {
    animation: none;
  }
}

.product-accordion summary {
  list-style: none;
}

.product-accordion summary::-webkit-details-marker {
  display: none;
}

.show-more-panel {
  overflow: hidden;
  transition: max-height 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.show-more-panel[data-collapsed='true'] {
  max-height: 250px;
  -webkit-mask-image: linear-gradient(to top, transparent 5px, #000 40px);
  mask-image: linear-gradient(to top, transparent 5px, #000 40px);
}

@media (prefers-reduced-motion: reduce) {
  .show-more-panel {
    transition: none;
  }
}

header[data-controller='masthead'] {
  position: absolute;
  transition: none;
}

@media (min-width: 1100px) and (max-width: 1300px) {
  header[data-controller='masthead'] .navbar-center .btn {
    font-size: 11px;
  }
}

header[data-controller='masthead'][data-parked='true'] {
  position: fixed;
  transform: translateY(-100%);
}

header[data-controller='masthead'][data-motion='in'],
header[data-controller='masthead'][data-motion='out'] {
  position: fixed;
  transition:
    transform 0.25s ease-out,
    background-color 0.25s ease-out,
    color 0.25s ease-out,
    box-shadow 0.25s ease-out;
}

header[data-controller='masthead'][data-motion='in'] {
  transform: translateY(0);
}

header[data-controller='masthead'][data-motion='out'] {
  transform: translateY(-100%);
}

@media (prefers-reduced-motion: reduce) {
  header[data-controller='masthead'][data-motion='in'],
  header[data-controller='masthead'][data-motion='out'] {
    transition: none;
  }
}

.catalog-card-media {
  transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.group:hover .catalog-card-media,
.group:focus-visible .catalog-card-media {
  transform: scale(1.1);
}

.catalog-card-scrim,
.catalog-card-scrim-hover,
.news-card-scrim {
  transition: opacity 0.25s ease-out;
}

.catalog-card-scrim {
  background-image: linear-gradient(
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.05) 44.79%,
    rgba(0, 0, 0, 0.5) 69.94%,
    rgba(0, 0, 0, 0.85) 100%
  );
}

.catalog-card-scrim-hover {
  background-image: linear-gradient(196deg, rgba(44, 53, 70, 0) 10.3%, rgb(44, 53, 70) 87.99%);
  opacity: 0;
}

.group:hover .catalog-card-scrim,
.group:focus-visible .catalog-card-scrim,
.group:hover .news-card-scrim,
.group:focus-visible .news-card-scrim {
  opacity: 0;
}

.group:hover .catalog-card-scrim-hover,
.group:focus-visible .catalog-card-scrim-hover {
  opacity: 1;
}

.catalog-card-arrow {
  opacity: 0;
  transform: translateX(-0.625rem);
  transition:
    opacity 0.1s cubic-bezier(0.215, 0.61, 0.355, 1),
    transform 0.1s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.group:hover .catalog-card-arrow,
.group:focus-visible .catalog-card-arrow {
  opacity: 1;
  transform: none;
  transition:
    opacity 0.6s cubic-bezier(0.215, 0.61, 0.355, 1),
    transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@keyframes about-slide-in {
  from {
    opacity: 0;
    transform: translateX(-2.5rem);
  }
}

@keyframes about-rise-in {
  from {
    opacity: 0;
    transform: translateY(1.5rem);
  }
}

.about-hero-copy {
  text-shadow: 0 0 8px rgb(0 0 0 / 35%);
}

.about-slide-in {
  animation: about-slide-in 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) both;
}

.about-slide-in-2 {
  animation-delay: 150ms;
}

.about-slide-in-3 {
  animation-delay: 280ms;
}

@media (max-width: 63.999rem) {
  .about-slide-in {
    animation-name: about-rise-in;
  }
}

[data-reveal-ready] [data-reveal-target~='item'][data-revealed='true'] {
  transition:
    opacity 0.7s ease,
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

[data-reveal-delay='1'] {
  transition-delay: 120ms;
}

[data-reveal-delay='2'] {
  transition-delay: 220ms;
}

[data-reveal-delay='3'] {
  transition-delay: 320ms;
}

@media (prefers-reduced-motion: no-preference) {
  [data-reveal-ready] [data-reveal-target~='item']:not([data-revealed='true']) {
    opacity: 0;
    transform: translateY(1.5rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .about-slide-in,
  [data-reveal-ready] [data-reveal-target~='item'][data-revealed='true'] {
    animation: none;
    transition: none;
  }
}

/* Keep the desktop sidebar width change short so the toggle does not feel late. */
@media (min-width: 40rem) {
  .drawer.sm\:drawer-open > .drawer-side,
  .drawer.sm\:drawer-open > .drawer-side > :not(.drawer-overlay) {
    transition-delay: 0s;
    transition-duration: 120ms;
  }
}
