@import "tailwindcss";
@import "yet-another-react-lightbox/styles.css";
@import "yet-another-react-lightbox/plugins/thumbnails.css";

:root {
  --background: #ffffff;
  --foreground: #171717;
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --font-sans: var(--font-geist-sans);
  --font-mono: var(--font-geist-mono);
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
  }
}

body {
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-geist-sans), Arial, Helvetica, sans-serif;
}

/* Custom scrollbar styles for the bold section */
.bold-scroll-container {
  scrollbar-width: thin;
  scrollbar-color: #B87333 #030f18;
  scroll-behavior: smooth;
}

.bold-scroll-container::-webkit-scrollbar {
  height: 8px;
}

.bold-scroll-container::-webkit-scrollbar-track {
  background: #030f18;
  border-radius: 4px;
}

.bold-scroll-container::-webkit-scrollbar-thumb {
  background: linear-gradient(90deg, #B87333, #A05A2C);
  border-radius: 4px;
  border: 1px solid #030f18;
}

.bold-scroll-container::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(90deg, #A05A2C, #8B4513);
}

/* Hide scrollbar on mobile devices */
@media (max-width: 768px) {
  .bold-scroll-container::-webkit-scrollbar {
    display: none;
  }
  .bold-scroll-container {
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
}

/* Custom scrollbar styles for admin navigation */
.admin-nav-scroll {
  scrollbar-width: thin;
  scrollbar-color: #ff914d #1a2633;
  scroll-behavior: smooth;
}

.admin-nav-scroll::-webkit-scrollbar {
  width: 6px;
}

.admin-nav-scroll::-webkit-scrollbar-track {
  background: #1a2633;
  border-radius: 3px;
}

.admin-nav-scroll::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #ff914d, #ff7a3d);
  border-radius: 3px;
  border: 1px solid #1a2633;
}

.admin-nav-scroll::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #ff7a3d, #ff6b2e);
}

/* Hide scrollbar on mobile devices for admin nav */
@media (max-width: 768px) {
  .admin-nav-scroll::-webkit-scrollbar {
    display: none;
  }
  .admin-nav-scroll {
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
}
.grecaptcha-badge {
  visibility: hidden !important;
}

/* ===== Shared Animation Keyframes ===== */

/* Floating animations for decorative elements */
@keyframes float {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-20px) scale(1.1); }
}

@keyframes float2 {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(15px) scale(1.05); }
}

@keyframes float-delayed {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-15px) scale(1.08); }
}

/* Fade-in animations */
@keyframes fade-in {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fade-in-up {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Pulse animations */
@keyframes pulse-slow {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.95; }
}

/* Shimmer effect for loading states */
@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

/* Animation utility classes */
.animate-float {
  animation: float 6s ease-in-out infinite;
}

.animate-float2 {
  animation: float2 7s ease-in-out infinite;
}

.animate-float-delayed {
  animation: float-delayed 8s ease-in-out infinite;
  animation-delay: 1s;
}

.animate-fade-in {
  animation: fade-in 1.2s cubic-bezier(0.4, 0, 0.2, 1) both;
}

.animate-fade-in-up {
  animation: fade-in-up 0.6s ease-out both;
}

.animate-pulse-slow {
  animation: pulse-slow 6s ease-in-out infinite;
}

.animate-shimmer {
  background: linear-gradient(90deg, transparent 25%, rgba(255,255,255,0.1) 50%, transparent 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}

/* Animation delay utilities */
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }
.delay-400 { animation-delay: 0.4s; }
.delay-500 { animation-delay: 0.5s; }

/* Smooth scroll behavior */
html {
  scroll-behavior: smooth;
}

/* Improved focus states for accessibility */
.focus-ring {
  @apply focus:outline-none focus:ring-2 focus:ring-[#B87333] focus:ring-offset-2 focus:ring-offset-[#020c13];
}

/* Admin Panel Specific Animations */
@keyframes slide-in-right {
  from {
    opacity: 0;
    transform: translateX(20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slide-in-left {
  from {
    opacity: 0;
    transform: translateX(-20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes scale-in {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.animate-slide-in-right {
  animation: slide-in-right 0.3s ease-out;
}

.animate-slide-in-left {
  animation: slide-in-left 0.3s ease-out;
}

.animate-scale-in {
  animation: scale-in 0.2s ease-out;
}

/* Smooth transitions for admin components */
.admin-transition {
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Line clamp utilities */
.line-clamp-1 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}