@import "tailwindcss";
@import "tw-animate-css";

@custom-variant dark (&:is(.dark *));

@source "./resources/**/*.blade.php";
@source "./resources/**/*.js";
@source "./resources/**/*.jsx";
@source "./resources/**/*.vue"; /* if using Vue */
@source "./storage/framework/views/*.php"; /* for cached views */

.logo-text {
    /* Mimics the style in the image */
    font-family: Arial, sans-serif; 
    line-height: 1; /* Adjust for better alignment */
}
/* Custom class for the blue background color */
.bg-custom-blue {
    background-color: #1a2a9a; /* Using a darker blue approximation */
}
/* Custom class for the orange background color */
.bg-custom-orange {
    background-color: #ff5c00;
}
/* Styling for the image to cover the container */
.hero-image {
    object-fit: cover;
    width: 100%;
    height: 100%;
}
/* Custom pink border/ring color for form elements */
.border-custom-pink {
    border-color: #ffc0cb; /* Light pink approximation */
}
.ring-custom-pink-light:focus {
    --tw-ring-color: #ffc0cb;
}
/* Custom blue border for job cards */
.border-custom-job-blue {
    border-color: #1a2a9a;
}
/* Custom blue fill for job icons */
.fill-custom-blue {
    fill: #1a2a9a;
}
/* Custom orange fill for job icons */
.fill-custom-orange {
    fill: #ff5c00;
}

:root {
    --sidebar: hsl(0 0% 98%);
    --sidebar-foreground: hsl(240 5.3% 26.1%);
    --sidebar-primary: hsl(240 5.9% 10%);
    --sidebar-primary-foreground: hsl(0 0% 98%);
    --sidebar-accent: hsl(240 4.8% 95.9%);
    --sidebar-accent-foreground: hsl(240 5.9% 10%);
    --sidebar-border: hsl(220 13% 91%);
    --sidebar-ring: hsl(217.2 91.2% 59.8%);
}

.dark {
    --sidebar: hsl(240 5.9% 10%);
    --sidebar-foreground: hsl(240 4.8% 95.9%);
    --sidebar-primary: hsl(224.3 76.3% 48%);
    --sidebar-primary-foreground: hsl(0 0% 100%);
    --sidebar-accent: hsl(240 3.7% 15.9%);
    --sidebar-accent-foreground: hsl(240 4.8% 95.9%);
    --sidebar-border: hsl(240 3.7% 15.9%);
    --sidebar-ring: hsl(217.2 91.2% 59.8%);
}

@theme inline {
    --color-sidebar: var(--sidebar);
    --color-sidebar-foreground: var(--sidebar-foreground);
    --color-sidebar-primary: var(--sidebar-primary);
    --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
    --color-sidebar-accent: var(--sidebar-accent);
    --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
    --color-sidebar-border: var(--sidebar-border);
    --color-sidebar-ring: var(--sidebar-ring);
}

/* @layer base {
  * {
    @apply border-border outline-ring/50;
    }
  body {
    @apply bg-background text-foreground;
    }
} */