/*
Theme Name: Alihsan AI Theme
Theme URI: https://alihsan.online
Author: Alihsan
Author URI: https://alihsan.online
Description: Custom AI-generated WordPress theme for alihsan.online.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.4
Requires PHP: 7.4
Text Domain: alihsan-ai-theme
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: custom-theme, ai-generated, responsive, modern
*/

/* Custom styles to supplement Tailwind */
@layer utilities {
  .hide-scrollbar::-webkit-scrollbar {
    display: none;
  }
  .hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
}

/* Base styles */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Force readable text in dark mode for pasted HTML */
.dark .prose,
.dark .prose p,
.dark .prose span,
.dark .prose div,
.dark .prose li,
.dark .prose td,
.dark .prose th {
  color: #e5e7eb !important; /* gray-200 */
  background-color: transparent !important;
}

.dark .prose a,
.dark .prose a * {
  color: #60a5fa !important; /* blue-400 */
  background-color: transparent !important;
  text-decoration: underline;
}

.dark .prose a:hover,
.dark .prose a:hover * {
  color: #93c5fd !important; /* blue-300 */
}

.dark .prose strong, 
.dark .prose b, 
.dark .prose h1, 
.dark .prose h2, 
.dark .prose h3, 
.dark .prose h4, 
.dark .prose h5, 
.dark .prose h6,
.dark .prose h1 *,
.dark .prose h2 *,
.dark .prose h3 *,
.dark .prose h4 *,
.dark .prose h5 *,
.dark .prose h6 * {
  color: #f9fafb !important; /* gray-50 */
  background-color: transparent !important;
}

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

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

/* 3D Book styles */
.perspective-\[1000px\] {
  perspective: 1000px;
}
.preserve-3d {
  transform-style: preserve-3d;
}
.backface-hidden {
  backface-visibility: hidden;
}
.rotate-y-\[-15deg\] {
  transform: rotateY(-15deg);
}
.rotate-y-\[-5deg\] {
  transform: rotateY(-5deg);
}
.hover\:rotate-y-\[-5deg\]:hover {
  transform: rotateY(-5deg);
}
.rotate-x-\[5deg\] {
  transform: rotateX(5deg);
}