@import "tailwindcss";

/* ─── Core Theme Variables ──────────────────────────────────────────────── */
:root {
  --background: #ffffff;
  --foreground: #171717;
  --main-color: #09735c;
  --second-color: #041126;
  --color-paleaqua: #f2e8db;
  --title-color: #1C231F;
  --black-color: #EDF2F1;
  --light-color: #F9F0E9;
  --white-color: #fff;
  --main-grey: #f9f9f9;
  --border-color: #f9f9f9;
  --boxShadow: 0px 10px 60px 0px rgb(211, 211, 211);
  --color-primary: #f2f7f7;
}

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

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --font-sans: var(--font-primary);
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

/* ─── Global Reset & Base ───────────────────────────────────────────────── */
html {
  scroll-padding-top: 90px;
}

body {
  background: var(--main-grey);
  color: var(--foreground);
  font-family: var(--font-primary, sans-serif);
}

/* Ensure all interactive elements show a pointer cursor */
button, 
a, 
[role="button"],
input[type="submit"],
input[type="button"],
.cursor-pointer {
  cursor: pointer !important;
}

/* ─── Shared Utility Animations ─────────────────────────────────────────── */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes scrollRight {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(0%); }
}

@keyframes scrollLeft {
  0%   { transform: translateX(0%); }
  100% { transform: translateX(-100%); }
}

.animate-fade-in      { animation: fadeIn    0.5s ease-out forwards; }
.animate-fade-in-up   { animation: fadeInUp  0.5s ease-out forwards; }
.animate-fadeIn       { animation: fadeIn    0.3s ease-out; }
.animate-scrollRight  { animation: scrollRight 20s linear infinite; }
.animate-scrollLeft   { animation: scrollLeft  20s linear infinite; }

.pause-animation {
  animation-play-state: paused !important;
}

/* ─── Global Float Utilities ─────────────────────────────────────────────── */
.clear-both  { clear: both; }
.float-left  { float: left; }
.float-right { float: right; }