/* Responsive Styles */

/* Large Screens */
@media (min-width: 1400px) {
    .container {
        max-width: 1600px;
    }
    
    .cv-grid {
        grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
    }
}

/* Medium Screens */
@media (max-width: 1200px) {
    .cv-grid {
        grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
        gap: var(--spacing-lg);
    }
    
    .quick-stats {
        gap: var(--spacing-base);
    }
    
    .stat {
        min-width: 100px;
    }
}

/* Tablet Screens */
@media (max-width: 768px) {
    /* Header */
    .header-content {
        flex-direction: column;
        text-align: center;
        gap: var(--spacing-base);
    }
    
    .profile-section {
        flex-direction: column;
        text-align: center;
        gap: var(--spacing-base);
    }
    
    .profile-info h1 {
        font-size: var(--font-size-2xl);
    }
    
    .quick-stats {
        flex-wrap: wrap;
        justify-content: center;
        gap: var(--spacing-base);
    }
    
    /* Navigation */
    .nav-controls {
        flex-direction: column;
        gap: var(--spacing-base);
    }
    
    .view-toggles {
        width: 100%;
        justify-content: center;
    }
    
    .filters {
        width: 100%;
        flex-direction: column;
        gap: var(--spacing-sm);
    }
    
    #search-input,
    #category-filter {
        width: 100%;
        min-width: auto;
    }
    
    /* Main Content */
    .cv-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-base);
        margin-top: var(--spacing-base);
    }
    
    .main-content {
        padding: var(--spacing-base) 0;
    }
    
    /* Modules */
    .module-header {
        padding: var(--spacing-base);
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between;
        gap: var(--spacing-sm);
    }
    
    .module-content {
        padding: var(--spacing-base);
    }
    
    .module-header h2 {
        font-size: var(--font-size-lg);
    }
    
    /* Timeline */
    .timeline::before {
        left: 20px;
    }
    
    .timeline-marker {
        left: 20px;
    }
    
    .timeline-content {
        margin-left: 60px;
        margin-right: 0;
    }
    
    .timeline-item:nth-child(even) .timeline-content {
        margin-left: 60px;
        margin-right: 0;
    }
    
    .timeline-controls {
        flex-direction: column;
        align-items: center;
    }
    
    .timeline-filter {
        width: 100%;
        max-width: 200px;
        text-align: center;
    }
}

/* Mobile Screens */
@media (max-width: 480px) {
    /* Base */
    .container {
        padding: 0 var(--spacing-sm);
    }
    
    /* Header */
    .header {
        padding: var(--spacing-base) 0;
    }
    
    .profile-image {
        width: 60px;
        height: 60px;
        font-size: var(--font-size-xl);
    }
    
    .profile-info h1 {
        font-size: var(--font-size-xl);
    }
    
    .title {
        font-size: var(--font-size-base);
    }
    
    .stat {
        min-width: 80px;
        padding: var(--spacing-sm);
    }
    
    .stat-number {
        font-size: var(--font-size-xl);
    }
    
    /* Navigation */
    .navigation {
        top: 100px;
    }
    
    .view-btn {
        padding: var(--spacing-sm);
        font-size: var(--font-size-sm);
    }
    
    /* Modules */
    .module-header h2 {
        font-size: var(--font-size-base);
    }
    
    .appointment-header {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--spacing-xs);
    }
    
    .publication-item {
        flex-direction: column;
        gap: var(--spacing-sm);
    }
    
    .pub-year {
        min-width: auto;
    }
    
    .additional-roles {
        flex-direction: column;
    }
    
    .cert-item,
    .award-item,
    .membership-item,
    .service-item,
    .admin-service-item {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--spacing-xs);
    }
    
    /* Timeline */
    .timeline-header h2 {
        font-size: var(--font-size-xl);
    }
    
    .timeline-marker {
        width: 30px;
        height: 30px;
        font-size: var(--font-size-sm);
    }
    
    .timeline-content {
        margin-left: 50px;
        padding: var(--spacing-base);
    }
}

/* Very Small Screens */
@media (max-width: 320px) {
    .container {
        padding: 0 var(--spacing-xs);
    }
    
    .quick-stats {
        flex-direction: column;
        align-items: center;
    }
    
    .stat {
        width: 100%;
        max-width: 200px;
    }
    
    .view-toggles {
        flex-direction: column;
    }
    
    .view-btn {
        width: 100%;
        justify-content: center;
    }
}

/* Print Styles */
@media print {
    body {
        background: white !important;
        color: black !important;
    }
    
    .loading-screen,
    .navigation,
    .expand-btn,
    .show-all-btn,
    .view-toggles,
    .filters,
    .timeline-controls {
        display: none !important;
    }
    
    .cv-module {
        break-inside: avoid;
        margin-bottom: var(--spacing-lg);
        box-shadow: none;
        border: 1px solid #ccc;
    }
    
    .module-content {
        max-height: none !important;
        opacity: 1 !important;
        padding: var(--spacing-base) !important;
    }
    
    .header {
        position: static;
        box-shadow: none;
        border-bottom: 2px solid #000;
    }
    
    .timeline-item {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
    /* Auto dark mode styles - only apply when no manual theme is set */
    body:not([data-theme]) {
        --text-primary: #ffffff;
        --text-secondary: #b0b0b0;
        --text-muted: #808080;
        --background-primary: #1a1a1a;
        --background-secondary: #2d2d2d;
        --border-color: rgba(255, 255, 255, 0.2);
        background: linear-gradient(135deg, #2d3748 0%, #4a5568 100%);
    }
    
    body:not([data-theme]) .cv-module {
        background: rgba(26, 26, 26, 0.98);
        border-color: rgba(255, 255, 255, 0.1);
    }
    
    body:not([data-theme]) .header {
        background: rgba(26, 26, 26, 0.98);
    }
    
    body:not([data-theme]) .navigation {
        background: rgba(26, 26, 26, 0.95);
    }
}

/* Manual Light Theme - Higher specificity to override media queries */
body[data-theme="light"] {
    --text-primary: #1a1a1a !important;
    --text-secondary: #666 !important;
    --text-muted: #999 !important;
    --background-primary: #ffffff !important;
    --background-secondary: #f8f9fa !important;
    --border-color: rgba(102, 126, 234, 0.2) !important;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%) !important;
}

body[data-theme="light"] .cv-module {
    background: rgba(255, 255, 255, 0.98) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

body[data-theme="light"] .header {
    background: rgba(255, 255, 255, 0.98) !important;
}

body[data-theme="light"] .navigation {
    background: rgba(255, 255, 255, 0.95) !important;
    border-bottom-color: rgba(255, 255, 255, 0.2) !important;
}

body[data-theme="light"] #search-input,
body[data-theme="light"] #category-filter {
    background: var(--background-primary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

body[data-theme="light"] #search-input::placeholder {
    color: var(--text-secondary) !important;
}

body[data-theme="light"] .spanning-content {
    background: var(--background-primary) !important;
    color: var(--text-primary) !important;
}

/* Manual Dark Theme */
body[data-theme="dark"] {
    --text-primary: #ffffff !important;
    --text-secondary: #b0b0b0 !important;
    --text-muted: #808080 !important;
    --background-primary: #1a1a1a !important;
    --background-secondary: #2d2d2d !important;
    --border-color: rgba(255, 255, 255, 0.2) !important;
    background: linear-gradient(135deg, #2d3748 0%, #4a5568 100%) !important;
}

body[data-theme="dark"] .cv-module {
    background: rgba(26, 26, 26, 0.98) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

body[data-theme="dark"] .header {
    background: rgba(26, 26, 26, 0.98) !important;
}

body[data-theme="dark"] .navigation {
    background: rgba(26, 26, 26, 0.95) !important;
    border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

body[data-theme="dark"] #search-input,
body[data-theme="dark"] #category-filter {
    background: var(--background-secondary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

body[data-theme="dark"] #search-input::placeholder {
    color: var(--text-secondary) !important;
}

body[data-theme="dark"] .spanning-content {
    background: var(--background-primary) !important;
    color: var(--text-primary) !important;
}

/* Footer dark mode styles */
body[data-theme="dark"] .footer {
    background: rgba(26, 26, 26, 0.98) !important;
    border-top-color: rgba(255, 255, 255, 0.1) !important;
}

body[data-theme="dark"] .footer-info p:first-child {
    color: var(--text-primary) !important;
}

body[data-theme="dark"] .footer-info p {
    color: var(--text-secondary) !important;
}

body[data-theme="dark"] .footer-link {
    color: var(--primary-color) !important;
}

body[data-theme="dark"] .footer-link:hover {
    background: rgba(102, 126, 234, 0.2) !important;
    border-color: var(--primary-color) !important;
}

/* Footer light mode styles */
body[data-theme="light"] .footer {
    background: rgba(255, 255, 255, 0.98) !important;
    border-top-color: var(--border-color) !important;
}

body[data-theme="light"] .footer-info p:first-child {
    color: var(--text-primary) !important;
}

body[data-theme="light"] .footer-info p {
    color: var(--text-secondary) !important;
}

body[data-theme="light"] .footer-link {
    color: var(--primary-color) !important;
}

body[data-theme="light"] .footer-link:hover {
    background: rgba(102, 126, 234, 0.1) !important;
    border-color: var(--primary-color) !important;
}