/*
 * Base Stylesheet
 *
 * Global styles, reset, and shared component styling.
 * Imports gestalt-variables.css for design tokens.
 */

@import url('gestalt-variables.css');

/* ==========================================
   RESET & GLOBAL
   ========================================== */
*, *::before, *::after {
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: var(--font-base);
    line-height: var(--leading-normal);
    color: var(--color-text);
    background-color: var(--color-bg-subtle);
    margin: 0;
    padding: 0;
}

a {
    color: var(--color-primary);
    text-decoration: none;
}

a:hover {
    color: var(--color-primary-dark);
    text-decoration: underline;
}
a.btn:hover {
    text-decoration: none;
}

/* Prevent underline on navbar, footer, and dropdown links (handled by component styles) */
nav-bar a:hover,
.site-footer a:hover,
.dropdown-item:hover,
.ts-dropdown .option:hover {
    text-decoration: none;
}

/* ==========================================
   PLACEHOLDER PULSE ANIMATION
   ========================================== */
@keyframes pulse {
    0% { opacity: 0.6; }
    50% { opacity: 1; }
    100% { opacity: 0.6; }
}

.placeholder-pulse {
    animation: pulse 1.5s ease-in-out infinite;
}

/* ==========================================
   COMMON BUTTON STYLES
   ========================================== */
.btn-primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
    transition: all var(--transition-base);
}

.btn-primary:hover {
    background-color: var(--color-primary-dark);
    border-color: var(--color-primary-dark);
}

/* ==========================================
   JOB DESCRIPTION NORMALIZATION
   ========================================== */
.job-description-content {
    font-size: var(--font-base) !important;
    line-height: var(--leading-normal) !important;
    color: var(--color-text) !important;
}

.job-description-content p,
.job-description-content li,
.job-description-content span,
.job-description-content div {
    font-size: inherit !important;
    line-height: inherit !important;
}

.job-description-content h1,
.job-description-content h2,
.job-description-content h3 {
    color: var(--color-text);
    margin-top: var(--space-lg);
    margin-bottom: var(--space-sm);
}

/* ==========================================
   COMPANY LOGO STYLES
   ========================================== */
.company-logo {
    width: 48px;
    height: 48px;
    border-radius: var(--radius-sm);
    object-fit: cover;
}

.company-logo-lg {
    width: 80px;
    height: 80px;
}

/* ==========================================
   RESPONSIVE UTILITIES
   ========================================== */
@media (max-width: 768px) {
    .hide-mobile {
        display: none !important;
    }
}

@media (min-width: 769px) {
    .hide-desktop {
        display: none !important;
    }
}