Server : Apache/2 System : Linux server-15-235-50-60 5.15.0-164-generic #174-Ubuntu SMP Fri Nov 14 20:25:16 UTC 2025 x86_64 User : gositeme ( 1004) PHP Version : 8.2.29 Disable Function : exec,system,passthru,shell_exec,proc_close,proc_open,dl,popen,show_source,posix_kill,posix_mkfifo,posix_getpwuid,posix_setpgid,posix_setsid,posix_setuid,posix_setgid,posix_seteuid,posix_setegid,posix_uname Directory :  /home/gositeme/domains/lavocat.ca/private_html/styles/

Upload File : current_dir [ Writeable ] document_root [ Writeable ]

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/Inter-Regular.woff2') format('woff2');
  font-display: swap;
}

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    --color-primary: #9f1fad;
    --color-primary-dark: #7a1785;
    --color-primary-light: #b44bc0;
    --color-secondary: #2d3748;
    --color-secondary-dark: #1a202c;
    --color-secondary-light: #4a5568;
    --color-background: #f7fafc;
    --color-background-dark: #edf2f7;
    --color-background-light: #ffffff;
    --color-text: #2d3748;
    --color-text-dark: #1a202c;
    --color-text-light: #4a5568;
    --color-accent: #4299e1;
    --color-accent-dark: #3182ce;
    --color-accent-light: #63b3ed;
    --color-border: #e2e8f0;
  }

  html {
    @apply antialiased;
  }
  
  body {
    @apply bg-background text-text;
  }

  /* Responsive typography */
  h1 {
    @apply text-2xl sm:text-3xl md:text-4xl font-bold;
  }

  h2 {
    @apply text-xl sm:text-2xl md:text-3xl font-semibold;
  }

  h3 {
    @apply text-lg sm:text-xl md:text-2xl font-semibold;
  }

  p {
    @apply text-base sm:text-lg leading-relaxed;
  }
}

@layer components {
  .btn {
    @apply inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-offset-2 transition-colors duration-200;
  }
  
  .btn-primary {
    @apply btn bg-primary text-white hover:bg-primary-dark focus:ring-primary;
  }
  
  .btn-secondary {
    @apply btn bg-secondary text-white hover:bg-secondary-dark focus:ring-secondary;
  }
  
  .btn-accent {
    @apply btn bg-accent text-white hover:bg-accent-dark focus:ring-accent;
  }
  
  .btn-outline {
    @apply btn border-gray-300 text-gray-700 bg-white hover:bg-gray-50 focus:ring-primary;
  }
  
  .input {
    @apply block w-full rounded-md border-gray-300 shadow-sm focus:border-primary focus:ring-primary sm:text-sm transition-colors duration-200;
  }
  
  .label {
    @apply block text-sm font-medium text-gray-700 mb-1;
  }
  
  .card {
    @apply bg-white rounded-lg shadow-md p-4 sm:p-6;
  }

  /* Status colors */
  .status-approved {
    @apply bg-green-100 text-green-800;
  }
  
  .status-pending {
    @apply bg-yellow-100 text-yellow-800;
  }
  
  .status-rejected {
    @apply bg-red-100 text-red-800;
  }

  /* Text colors */
  .text-muted {
    @apply text-text-light;
  }

  /* Border colors */
  .border-muted {
    @apply border-gray-200;
  }

  /* Mobile-first container */
  .container {
    @apply px-4 mx-auto;
    max-width: 100%;
  }

  /* Responsive spacing */
  .section {
    @apply py-8 sm:py-12 md:py-16;
  }

  .section-sm {
    @apply py-4 sm:py-6 md:py-8;
  }

  .section-lg {
    @apply py-12 sm:py-16 md:py-20;
  }

  /* Responsive grid */
  .grid-auto-fit {
    @apply grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3;
  }

  /* Responsive tables */
  .table-responsive {
    @apply block w-full overflow-x-auto;
  }

  /* Responsive images */
  .img-responsive {
    @apply w-full h-auto;
  }

  /* Responsive forms */
  .form-group {
    @apply mb-4 sm:mb-6;
  }

  .form-label {
    @apply block text-sm sm:text-base font-medium text-gray-700 mb-1 sm:mb-2;
  }

  .form-input {
    @apply block w-full rounded-md border-gray-300 shadow-sm focus:border-primary focus:ring-primary sm:text-sm;
  }

  .form-error {
    @apply mt-1 text-sm text-red-600;
  }

  /* Responsive buttons */
  .btn-mobile {
    @apply w-full sm:w-auto;
  }

  /* Responsive navigation */
  .nav-link {
    @apply block px-3 py-2 rounded-md text-base font-medium;
  }

  .nav-link-mobile {
    @apply block px-3 py-2 rounded-md text-base font-medium;
  }

  /* Responsive modals */
  .modal-content {
    @apply w-full max-w-lg mx-auto p-4 sm:p-6;
  }

  /* Responsive cards */
  .card-grid {
    @apply grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6;
  }

  /* Responsive lists */
  .list-responsive {
    @apply space-y-2 sm:space-y-3;
  }

  /* Responsive icons */
  .icon-sm {
    @apply w-4 h-4 sm:w-5 sm:h-5;
  }

  .icon-md {
    @apply w-5 h-5 sm:w-6 sm:h-6;
  }

  .icon-lg {
    @apply w-6 h-6 sm:w-8 sm:h-8;
  }

  .gositeme-glow {
    background: linear-gradient(90deg, var(--gositeme-glow-primary, #a855f7), var(--gositeme-glow-secondary, #ec4899));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: bold;
    text-shadow:
      0 0 8px var(--gositeme-glow-secondary, #ec4899),
      0 0 16px var(--gositeme-glow-primary, #a855f7);
    transition: text-shadow 0.3s, background 0.3s;
  }
  
  .gositeme-glow:hover {
    text-shadow:
      0 0 16px var(--gositeme-glow-secondary, #ec4899),
      0 0 32px var(--gositeme-glow-primary, #a855f7);
  }

  .animate-fade-in {
    animation: fadeIn 0.5s ease-out;
  }

  .spinner {
    @apply animate-spin rounded-full border-2 border-gray-300 border-t-blue-600;
  }

  .error-message {
    @apply text-red-600 text-sm mt-1;
  }

  .success-message {
    @apply text-green-600 text-sm mt-1;
  }

  .sr-only {
    @apply absolute w-px h-px p-0 -m-px overflow-hidden whitespace-nowrap border-0;
  }

  .focus-ring {
    @apply focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2;
  }
}

@layer utilities {
  /* Custom scrollbar styles */
  ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }
  
  ::-webkit-scrollbar-track {
    background: transparent;
  }
  
  ::-webkit-scrollbar-thumb {
    background-color: rgba(156, 163, 175, 0.5);
    border-radius: 10px;
    border: 2px solid transparent;
    background-clip: content-box;
  }
  
  ::-webkit-scrollbar-thumb:hover {
    background-color: rgba(156, 163, 175, 0.7);
  }

  /* Responsive container utilities */
  .container-sm {
    max-width: 640px;
  }

  .container-md {
    max-width: 768px;
  }

  .container-lg {
    max-width: 1024px;
  }

  .container-xl {
    max-width: 1280px;
  }
}

/* Custom animations */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@media print {
  .no-print {
    display: none !important;
  }
}