/* ========================================
   RESPONSIVE.CSS - Media Queries
   ======================================== */

/* ========== TABLET & BELOW (max-width: 768px) ========== */
@media (max-width: 768px) {
    /* Hide quick nav on mobile */
    .quick-nav {
        display: none;
    }

    /* About grid - single column */
    .about-grid {
        grid-template-columns: 1fr;
        text-align: center;
        gap: var(--spacing-xl);
    }

    .profile-container {
        display: flex;
        justify-content: center;
    }

    .profile-frame {
        width: 180px;
    }

    /* Form row - single column */
    .form-row {
        grid-template-columns: 1fr;
    }

    /* Hero stats */
    .hero-stats {
        gap: var(--spacing-xl);
    }

    /* Command prompt smaller */
    .command-prompt {
        font-size: 0.8rem;
    }

    /* Terminal body padding */
    .terminal-body {
        padding: 1.5rem;
        padding-bottom: 5rem;
    }

    /* Output panel */
    .output-panel {
        margin-left: 0;
        padding: 1.5rem;
    }

    /* Services grid - single column */
    .services-grid {
        grid-template-columns: 1fr;
    }

    /* Portfolio grid - single column */
    .portfolio-grid {
        grid-template-columns: 1fr;
    }

    /* System info grid */
    .system-info-grid,
    .interests-content {
        grid-template-columns: 1fr;
    }


    /* Skills tree */
    .skills-tree {
        padding: 1rem;
        font-size: 0.8rem;
    }

    .tree-items {
        padding-left: 1rem;
    }

    .tree-item-name {
        min-width: auto;
    }

    .tree-item-level {
        display: none;
    }

    .tooltip-content {
        width: 220px;
        right: -50px;
    }

    .skills-summary {
        flex-direction: column;
        gap: 0.5rem;
    }

    /* Theme selector in header */
    .theme-selector {
        position: static;
    }

    .theme-dropdown {
        right: auto;
        left: 50%;
        transform: translateX(-50%) translateY(-10px);
    }

    .theme-selector:hover .theme-dropdown,
    .theme-selector:focus-within .theme-dropdown {
        transform: translateX(-50%) translateY(0);
    }

    /* Compact header activity on tablet - show only key items */
    .terminal-center {
        gap: 1rem;
    }

    .terminal-center .header-activity {
        gap: 0.75rem;
    }

    /* Hide some activity items on tablet, keep essentials */
    .terminal-center .activity-item:nth-child(3),
    .terminal-center .activity-item:nth-child(4) {
        display: none;
    }

    /* Hide ticker on tablet */
    .system-ticker {
        display: none;
    }
}

/* ========== SMALL MOBILE (max-width: 480px) ========== */
@media (max-width: 480px) {
    /* Terminal header - compact with mini activity */
    .terminal-header {
        padding: 0.4rem 0.75rem;
    }

    /* Brand logo - smaller on mobile */
    .brand-avatar {
        width: 24px;
        height: 24px;
    }

    .brand-text {
        font-size: 0.75rem;
    }

    /* Show only clock on mobile, hide other activity */
    .terminal-center {
        flex: 0;
        gap: 0;
    }

    .terminal-center .header-activity {
        display: none;
    }

    .terminal-center .header-clock {
        font-size: 0.55rem;
    }

    /* Terminal body */
    .terminal-body {
        padding: 1rem;
        padding-bottom: 4rem;
    }

    /* Output panel */
    .output-panel {
        padding: 1rem;
    }

    /* Hero section */
    .hero-output {
        padding: 1.5rem 1rem;
    }

    .ascii-logo {
        font-size: 0.4rem;
    }

    .hero-name {
        font-size: 2rem;
    }

    .hero-title {
        font-size: 0.85rem;
        letter-spacing: 0.15em;
    }

    .stat-value {
        font-size: 2rem;
    }

    /* Command input - slightly larger for touch */
    .command-input-container {
        padding: 0.5rem 0.75rem;
    }

    .command-input-container .prompt-user,
    .command-input-container .prompt-host,
    .command-input-container .prompt-at,
    .command-input-container .prompt-symbol {
        font-size: 0.65rem;
    }

    .command-input {
        font-size: 0.7rem;
    }

    .command-input::placeholder {
        font-size: 0.65rem;
    }

    /* Profile frame */
    .profile-frame {
        width: 150px;
    }

    /* Service cards */
    .service-card {
        padding: 1.25rem;
    }

    .service-icon {
        width: 38px;
        height: 38px;
        min-width: 38px;
        font-size: 1.1rem;
    }

    /* Portfolio cards */
    .portfolio-info {
        padding: 1rem;
    }

    /* Contact form */
    .contact-header h2 {
        font-size: 1.5rem;
    }

    .form-group input,
    .form-group textarea {
        padding: 0.75rem 1rem;
        font-size: 0.85rem;
    }

    .submit-btn {
        padding: 0.9rem 1.5rem;
        font-size: 0.85rem;
    }

    /* Social links */
    .social-link {
        width: 42px;
        height: 42px;
        font-size: 1.1rem;
    }

    /* Help modal */
    .help-content {
        padding: 1.5rem;
    }

    .cmd-name {
        min-width: 80px;
    }
}

/* ========== LARGE DESKTOP (min-width: 1200px) ========== */
@media (min-width: 1200px) {
    /* Services grid - 3 columns */
    .services-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Portfolio grid - 3 columns */
    .portfolio-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* ========== EXTRA LARGE DESKTOP (min-width: 1600px) ========== */
@media (min-width: 1600px) {
    /* Terminal body padding */
    .terminal-body {
        padding: 3rem 4rem;
        padding-bottom: 6rem;
    }

    /* Wider content on ultrawide */
    .terminal-body .command-section,
    .terminal-body .terminal-footer {
        max-width: 1400px;
    }

    /* Larger fonts */
    .hero-name {
        font-size: 5rem;
    }

    .stat-value {
        font-size: 3rem;
    }
}

/* ========== LANDSCAPE MOBILE ========== */
@media (max-height: 500px) and (orientation: landscape) {
    .terminal-body {
        padding-top: 1rem;
    }

    .hero-output {
        padding: 1rem;
    }

    .ascii-logo {
        display: none;
    }

    .scroll-hint {
        display: none;
    }
}

/* ========== HIGH CONTRAST MODE ========== */
@media (prefers-contrast: high) {
    :root {
        --border-color: rgba(255, 255, 255, 0.5);
    }

    .nav-dot,
    .terminal-btn {
        border-width: 2px;
    }

    .tool-tag,
    .portfolio-tag {
        border-width: 2px;
    }
}

/* ========== PRINT STYLES ========== */
@media print {
    .crt-overlay,
    .quick-nav,
    .command-input-container,
    .theme-selector,
    .loading-screen,
    .help-modal {
        display: none !important;
    }

    .terminal-frame {
        position: static;
    }

    .terminal-body {
        overflow: visible;
        padding: 0;
    }

    .command-section {
        opacity: 1;
        transform: none;
        page-break-inside: avoid;
    }

    body {
        background: white;
        color: black;
    }

    .output-panel {
        border: 1px solid #ccc;
        background: white;
    }
}