/* Light Theme Variables */
body[data-theme="light"] {
    --bg-color: #ffffff;
    --snd-bf-color: #f6f3fc;
    --text-color: #333333;
    --main-color: #8750f7;
    --tj-black-2: #f6f3fc;
}

/* Navbar Light Theme */
body[data-theme="light"] .header {
    background: transparent;
}

body[data-theme="light"] .header.sticky {
    background: var(--bg-color);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .navbar {
    background: var(--bg-color);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .header.sticky .navbar {
    background: transparent;
    border: none;
}

body[data-theme="light"] .header:not(.sticky) .navbar a {
    color: #666666;
}

body[data-theme="light"] .header:not(.sticky) .navbar a:hover,
body[data-theme="light"] .header:not(.sticky) .navbar a.active {
    color: var(--text-color);
}

body[data-theme="light"] .header.sticky .navbar a {
    color: #666666;
}

body[data-theme="light"] .header.sticky .navbar a:hover,
body[data-theme="light"] .header.sticky .navbar a.active {
    color: var(--main-color);
}

/* Home Section Light Theme */
body[data-theme="light"] .home {
    background: linear-gradient(135deg, #ffffff 0%, #f6f3fc 50%, #ede7fe 100%);
}

/* About Section Light Theme */
body[data-theme="light"] .about {
    background: var(--snd-bf-color);
}

body[data-theme="light"] .stat-card {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

/* Skills Section Light Theme */
body[data-theme="light"] .skills {
    background: #ffffff;
}

body[data-theme="light"] .skill-category {
    background: var(--snd-bf-color);
    border: 1px solid rgba(0, 0, 0, 0.1);
    transition: border-color 0.3s ease;
}

body[data-theme="light"] .skill-category:hover {
    border-color: var(--main-color);
}

body[data-theme="light"] .skill-inner {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .skill-card:hover .skill-inner {
    border-color: var(--main-color);
    transform: translateY(-5px);
}

/* Toggle Container Light Theme */
body[data-theme="light"] .toggle-container {
    background: rgba(0, 0, 0, 0.05);
}

body[data-theme="light"] .toggle-button {
    color: rgba(0, 0, 0, 0.5);
}

body[data-theme="light"] .toggle-button:hover {
    color: rgba(0, 0, 0, 0.8);
}

body[data-theme="light"] .toggle-button.active {
    color: #000000;
}

/* Education Section Light Theme */
body[data-theme="light"] .education {
    background: var(--snd-bf-color);
}

body[data-theme="light"] .timeline-body {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .institution-name {
    color: #333333;
    text-shadow: none;
}

body[data-theme="light"] .degree-title {
    color: var(--main-color);
}

body[data-theme="light"] .timeline-description {
    color: #444444;
}

body[data-theme="light"] .timeline-year {
    background: rgba(0, 0, 0, 0.05);
    color: #666666;
}

/* Add these styles to your existing light theme CSS */

/* Education Section Heading Light Theme Fix */
body[data-theme="light"] .education-heading h2 {
    background: none;
    -webkit-background-clip: unset;
    background-clip: unset;
    -webkit-text-fill-color: var(--text-color);
    color: var(--text-color);
}

body[data-theme="light"] .education-heading h2 span {
    color: var(--main-color);
    background: none;
    -webkit-text-fill-color: var(--main-color);
}

/* Timeline Section Light Theme */
body[data-theme="light"] .timeline-section {
    background: var(--snd-bf-color);
}

body[data-theme="light"] .timeline-section::after {
    background: linear-gradient(to bottom, var(--snd-bf-color), #ffffff);
}

/* Timeline Content Light Theme */
body[data-theme="light"] .timeline-content {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    border-left: 4px solid var(--main-color);
}

body[data-theme="light"] .timeline-content:hover {
    box-shadow: 0 15px 40px rgba(135, 80, 247, 0.2),
                0 5px 15px rgba(0, 0, 0, 0.1);
}

/* Timeline Title Light Theme Fix */
body[data-theme="light"] .timeline-title {
    color: var(--text-color);
}

/* No Experience Section Light Theme */
body[data-theme="light"] .no-experience {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-left: 4px solid var(--main-color);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .no-experience h3 {
    color: var(--text-color);
}

/* Column Title Light Theme */
body[data-theme="light"] .column-title {
    color: var(--text-color);
}

/* Timeline Date Light Theme */
body[data-theme="light"] .timeline-date {
    color: var(--main-color);
}

/* Timeline Company Light Theme */
body[data-theme="light"] .timeline-company {
    color: var(--main-color);
}

/* Timeline Description Light Theme */
body[data-theme="light"] .timeline-description {
    color: #444444;
}

body[data-theme="light"] .no-experience p {
    color: #444444;
}

/* Timeline Dot Light Theme */
body[data-theme="light"] .timeline-dot {
    background: #ffffff;
    border: 4px solid var(--main-color);
}

body[data-theme="light"] .timeline-dot:hover {
    border-color: var(--main-color);
    box-shadow: 0 0 20px rgba(135, 80, 247, 0.8);
}

/* Timeline Line Light Theme */
body[data-theme="light"] .timeline-column::before {
    background: linear-gradient(to bottom, var(--main-color), rgba(135, 80, 247, 0.5));
}

/* Projects Section Light Theme */
body[data-theme="light"] .projects {
    background: #ffffff;
}

body[data-theme="light"] .project-card {
    background: var(--snd-bf-color);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .card-background {
    opacity: 1;
}

body[data-theme="light"] .project-card:hover .card-background {
    opacity: 0.9;
}

body[data-theme="light"] .hover-overlay {
    background: linear-gradient(135deg, var(--main-color) 0%, #3f0071 100%);
}

/* Contact Section Light Theme */
body[data-theme="light"] .contact {
    background: var(--snd-bf-color);
}

body[data-theme="light"] .info-card {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .contact-form {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .form-group input,
body[data-theme="light"] .form-group textarea,
body[data-theme="light"] .form-group select {
    background: #ffffff;
    border: 2px solid rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .form-group label {
    background: #ffffff;
    color: #666666;
}

/* Footer Light Theme */
body[data-theme="light"] .footer {
    background: #ffffff;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .footer-bottom {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .footer-bottom-center p {
    color: #666666;
}

body[data-theme="light"] .footer-subtitle {
    color: #888888 !important;
}

/* Section Blending Light Theme */
body[data-theme="light"] .about::after {
    background: linear-gradient(to bottom, var(--snd-bf-color), #ffffff);
}

body[data-theme="light"] .skills::after {
    background: linear-gradient(to bottom, #ffffff, var(--snd-bf-color));
}

body[data-theme="light"] .education::after {
    background: linear-gradient(to bottom, var(--snd-bf-color), #ffffff);
}

body[data-theme="light"] .projects::after {
    background: linear-gradient(to bottom, #ffffff, var(--snd-bf-color));
}

/* Modal Light Theme */
body[data-theme="light"] .project-modal-content,
body[data-theme="light"] .certificate-modal .modal-container {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .modal-header {
    background: var(--snd-bf-color);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

/* Progress Bar Light Theme */
body[data-theme="light"] .progress-bar {
    background: rgba(0, 0, 0, 0.1);
}

body[data-theme="light"] .progress-fill {
    background: var(--main-color);
}