/* VSSJK Services — Custom CSS (supplement to Tailwind CDN) */
/* For production: compile Tailwind with purge and replace CDN with this file */

:root {
    --color-primary: #1B5E5A;
    --color-accent:  #2ECC71;
}

/* Prose styles for rich text content */
.prose h1, .prose h2, .prose h3, .prose h4 { font-weight: 800; color: #0A0A0A; margin-top: 1.5em; margin-bottom: .5em; }
.prose p  { margin-bottom: 1rem; line-height: 1.8; }
.prose ul { list-style: disc; padding-left: 1.5rem; margin-bottom: 1rem; }
.prose li { margin-bottom: .25rem; }
.prose a  { color: var(--color-primary); text-decoration: underline; }
.prose a:hover { color: var(--color-accent); }
.prose img { max-width: 100%; height: auto; }
.prose blockquote { border-left: 4px solid var(--color-accent); padding-left: 1rem; color: #666; font-style: italic; margin: 1.5rem 0; }

/* Image hover overlay */
.hover-img { transition: transform .5s ease; }
.hover-img:hover { transform: scale(1.03); }

/* Form focus rings */
input:focus, textarea:focus, select:focus { box-shadow: 0 0 0 3px rgba(46,204,113,.2); }

/* Admin toasts */
.toast {
    position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 10000;
    padding: .875rem 1.5rem; color: #fff; font-size: .875rem; font-weight: 600;
    border-radius: 0; min-width: 260px; opacity: 0;
    transition: opacity .3s ease, transform .3s ease;
    transform: translateY(10px);
}
.toast.show { opacity: 1; transform: none; }
.toast.success { background: var(--color-primary); }
.toast.error   { background: #e53e3e; }

/* Loading spinner */
.spinner { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,.3); border-top-color: #fff; border-radius: 50%; animation: spin .6s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Responsive tables */
@media (max-width: 640px) {
    .table-responsive { overflow-x: auto; }
}

/* Admin sidebar active link */
.admin-nav-link.active { background: rgba(27,94,90,.1); color: var(--color-primary); border-left: 3px solid var(--color-accent); }

/* Transitions */
*, *::before, *::after { transition-property: color, background-color, border-color, opacity, transform; transition-duration: 200ms; transition-timing-function: ease; }
a, button { transition-property: color, background-color, border-color, opacity, transform, box-shadow; }