/* Easy Web Service - Custom Styles & Enhancements */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Kanit:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300&display=swap');

:root {
    --primary: #3b82f6;
    --primary-dark: #1d4ed8;
    --secondary: #6366f1;
    --accent: #06b6d4;
    --dark-bg: #0b0f19;
    --card-bg: #111827;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Kanit', 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    background-color: #0b0f19;
    color: #f3f4f6;
    overflow-x: hidden;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: #0b0f19;
}
::-webkit-scrollbar-thumb {
    background: #1f2937;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #374151;
}

/* Hide scrollbar for clean horizontal navs */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Gradient Backgrounds & Glows */
.hero-glow {
    background: radial-gradient(circle 650px at 50% 10%, rgba(59, 130, 246, 0.16), transparent 75%);
}

.gradient-text {
    background: linear-gradient(135deg, #60a5fa 0%, #a855f7 50%, #ec4899 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.gradient-text-blue {
    background: linear-gradient(135deg, #38bdf8 0%, #3b82f6 50%, #6366f1 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.gradient-text-gold {
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.gradient-border {
    position: relative;
    border-radius: 1rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02));
    border: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(12px);
    transition: all 0.3s ease;
}

.gradient-border:hover {
    border-color: rgba(59, 130, 246, 0.4);
    box-shadow: 0 12px 35px -10px rgba(59, 130, 246, 0.25);
    transform: translateY(-2px);
}

/* Feature Badge */
.badge-tag {
    background: rgba(59, 130, 246, 0.1);
    border: 1px solid rgba(59, 130, 246, 0.3);
    color: #93c5fd;
}

/* Pulse Glow Animation */
@keyframes softPulse {
    0%, 100% { opacity: 0.4; transform: scale(1); }
    50% { opacity: 0.8; transform: scale(1.04); }
}
.pulse-glow {
    animation: softPulse 6s infinite ease-in-out;
}

/* Hover Zoom for Images */
.img-hover-zoom {
    overflow: hidden;
}
.img-hover-zoom img {
    transition: transform 0.5s ease;
}
.img-hover-zoom:hover img {
    transform: scale(1.05);
}

/* Interactive Card Effects */
.card-hover {
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.card-hover:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 30px -10px rgba(0, 0, 0, 0.5);
}

/* ==========================================================================
   PRINT FRIENDLY OPTIMIZATION (FOR TOR & QUOTATIONS)
   ========================================================================== */
@media print {
    *, *::before, *::after {
        background: transparent !important;
        color: #111827 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }
    html, body {
        background-color: #ffffff !important;
        color: #111827 !important;
        font-size: 11pt !important;
    }
    .no-print, header, footer, #main-navbar, .sticky, button {
        display: none !important;
    }
    .print-only {
        display: block !important;
    }
    .bg-slate-900, .bg-slate-950, .bg-slate-900\/90, .bg-slate-950\/60 {
        background-color: #ffffff !important;
        border: 1px solid #e5e7eb !important;
        box-shadow: none !important;
    }
    table {
        border-collapse: collapse !important;
        width: 100% !important;
        border: 1px solid #d1d5db !important;
        margin-bottom: 1rem !important;
    }
    th, td {
        border: 1px solid #d1d5db !important;
        padding: 8px 10px !important;
        color: #1f2937 !important;
    }
    thead th {
        background-color: #f3f4f6 !important;
        font-weight: bold !important;
    }
    h1, h2, h3, h4 {
        color: #111827 !important;
        page-break-after: avoid !important;
    }
    .gradient-text, .gradient-text-blue, .gradient-text-gold {
        background: none !important;
        -webkit-text-fill-color: #111827 !important;
        color: #111827 !important;
    }
    .divide-y > * {
        border-color: #e5e7eb !important;
    }
    .border-slate-800, .border-emerald-500\/30, .border-blue-500\/30, .border-cyan-500\/30, .border-indigo-500\/30, .border-amber-500\/30 {
        border-color: #d1d5db !important;
    }
    .page-break {
        page-break-before: always;
    }
}
