/* --- Custom Properties & Overrides --- */
:root {
    --primary-color: #ff9800; /* Materialize Orange */
    --primary-color-dark: #f57c00; /* Orange Darken-2 */
    --main-bg-color: rgb(26, 28, 30);
    --card-bg-color: #343434; /* Materialize Grey Darken-3, for the subtle tint effect */
    --text-color: rgb(226, 226, 229);
}

body {
    font-family: 'Inter', sans-serif;
    background-color: var(--main-bg-color);
    color: var(--text-color);
}

h1, h2, h3, h4, h5, h6, .brand-logo {
    font-family: 'Source Sans 3', sans-serif;
    font-weight: 600;
    color: #fff;
}

/* --- General Components --- */
.primary-color { background-color: var(--primary-color) !important; color: #212121 !important; }
.primary-color:hover { background-color: var(--primary-color-dark) !important; }
.primary-text { color: var(--primary-color) !important; }
.chip { background-color: #616161; color: #fff; margin: 5px; }
.card { background-color: var(--card-bg-color); }
.card .card-content { color: var(--text-color); }
.card .card-title { color: #fff; }

/* --- Navigation --- */
nav { background-color: var(--main-bg-color); box-shadow: 0 2px 5px rgba(0,0,0,0.3); }
nav .brand-logo, nav ul a { color: #fff !important; }
.sidenav { background-color: var(--main-bg-color); }
.sidenav-link { color: #fff !important; }

/* --- Hero Section --- */
.hero-section { padding-top: 4rem; padding-bottom: 4rem; }
h1.header { font-size: 4.2rem; font-weight: 700; }
h2.sub-header { font-size: 1.5rem; color: #e0e0e0; font-weight: 400; margin-bottom: 2rem; }
.intro-sentence { margin-bottom: 2.5rem !important; color: #f5f5f5; }

/* --- About Section (Equal Height Cards) --- */
#about .row .col { display: flex; flex-direction: column; }
#about .row .col .card { flex: 1 1 auto; }
#about .card-title { font-size: 1.8rem; margin-bottom: 1rem; }

/* --- Skills Section --- */
.skills-card { min-height: 290px; }
#skills i.large { font-size: 5rem; }
#skills .card-title { font-size: 1.3rem; font-weight: 700; }
.skills-section-technical { margin-top: 4rem; } /* Added spacing */

/* --- Tabs Styles --- */
.tabs-container { display: flex; justify-content: center; }
.tabs { background-color: var(--card-bg-color); border-radius: 5px; width: 100%; max-width: 900px; }
.tabs .tab a { color: rgba(255, 255, 255, 0.7); transition: color 0.3s ease; }
.tabs .tab a:hover, .tabs .tab a.active { color: #fff; }
.tabs .tab a i { vertical-align: middle; margin-right: 8px; }
.tabs .indicator { background-color: var(--primary-color); }
.skills-content { padding: 25px; text-align: center; }

/* --- Timeline Styles --- */
#experience h2 { margin-bottom: 3rem; }
.timeline { position: relative; max-width: 750px; margin: 0 auto; }
.timeline::after { content: ''; position: absolute; width: 3px; background-color: var(--primary-color); top: 0; bottom: 0; left: 50%; margin-left: -1.5px; }
.timeline-item { padding: 0.5rem 2rem; position: relative; width: 50%; }
.timeline-item:nth-child(odd) { left: 0; padding-right: 40px; }
.timeline-item:nth-child(even) { left: 50%; padding-left: 40px; }
.timeline .card-title { font-size: 1.4rem; font-weight: 700; }
.timeline .card-content p { margin-bottom: 0; }
.timeline .card { text-align: left; }

/* --- Contact Section Styles --- */
.contact-intro { margin-bottom: 2rem; }
.contact-intro h5 { font-size: 2rem; margin-bottom: 0; }
.contact-intro p { font-size: 1.2rem; color: #bdbdbd; }
.contact-buttons { margin-top: 2rem; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 1rem; }
.linkedin-icon { fill: currentColor; width: 20px; height: 20px; margin-right: 8px; vertical-align: middle; position: relative; top: -1px; }

/* --- Footer Styles --- */
.page-footer-condensed { background-color: #111; padding: 15px 0; }
.page-footer-condensed .container { text-align: center; }
.page-footer-condensed span { color: #bdbdbd; }

/* --- Responsive Adjustments --- */
@media (max-width: 992px) {
    .tabs-container { overflow-x: auto; justify-content: flex-start; }
}
@media (max-width: 768px) {
    h1.header { font-size: 3.2rem; }
    #about .row .col { display: block; } /* Stack about cards on mobile */
    .timeline::after { left: 20px; }
    .timeline-item { width: 100%; padding-left: 50px; padding-right: 15px; }
    .timeline-item:nth-child(odd), .timeline-item:nth-child(even) { left: 0; }
    .tabs .tab a { font-size: 12px; }
    .tabs .tab a i { display: none; }
}