/*
================================================================================
|                                  DARK THEME                                  |
|         (Activated by adding the .dark-mode class to the body)             |
================================================================================
*/

/* ======= Base (Dark Mode) ======= */
body.dark-mode {
    color: #cccccc;
    background: #212529;
}

body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6 {
    color: #adb5bd;
}

/* Apply a dark tint/filter to images in dark mode */
body.dark-mode img {
    filter: brightness(80%) contrast(90%);
}

body.dark-mode a {
    color: #959d6b;
}

body.dark-mode a:hover {
    color: #aeb784;
}

body.dark-mode .text-highlight {
    color: #ffffff;
}

body.dark-mode a.dotted-link {
    border-bottom: 1px dotted #868e96;
    color: #868e96;
}

body.dark-mode a.dotted-link:hover {
    color: #adb5bd;
}

/* ======= Header (Dark Mode) ======= */
body.dark-mode .header {
    background: #282c34;
    border-top-color: #5f6b77;
}

body.dark-mode .header .profile-content .name {
    color: #f8f9fa;
}

body.dark-mode .header .profile-content .desc {
    color: #adb5bd;
}

body.dark-mode .desc.highlighted {
    background-color: #424242;
    color: #c6c6c6;
}

body.dark-mode .desc.notice {
    background: #4f3838; 
    border-radius: 16px; 
    padding: 8px 16px 2px 16px;
    margin-bottom: -16px;
}

body.dark-mode .header .profile-content .social a {
    background: #424242;
    color: #e0e0e0;
}

body.dark-mode .header .profile-content .social a:hover {
    background: #5f6b77;
}


/* ======= Sections (Dark Mode) ======= */
body.dark-mode .section .section-inner {
    background: #2c3036;
}

body.dark-mode .section .heading {
    color: #dee2e6;
}

/* Sections with similar link/text colors */
body.dark-mode .latest .item .title,
body.dark-mode .projects .item .title,
body.dark-mode .blog .item .title,
body.dark-mode .list ul li,
body.dark-mode .credits ul li {
    color: #adb5bd;
}

body.dark-mode .latest .item .title,
body.dark-mode .projects .item .title,
body.dark-mode .blog .item .title,
body.dark-mode .list ul li,
body.dark-mode .credits ul li {
    color: #e8e8e8;
}

body.dark-mode .latest .featured .summary {
    color: #adb5bd;
}


/* Experience & Education (Dark Mode) */
body.dark-mode .experience .item .title .place,
body.dark-mode .experience .item .title .place a,
body.dark-mode .experience .item .title .year,
body.dark-mode .education .item .university {
    color: #868e96;
}

body.dark-mode .experience .item .title .place a:hover {
    color: #adb5bd;
}

body.dark-mode .education .item .university .year {
    color: #777;
}


/* Info Section (Dark Mode) */
body.dark-mode .info .fa {
    color: #6c757d;
}


/* Skills Section (Dark Mode) */
body.dark-mode .skills .skillset .level-title .level-label {
    color: #868e96;
}

body.dark-mode .skills .skillset .level-bar {
    background: #3a3a3a;
}


/* Testimonials section (Dark Mode) */
body.dark-mode .testimonials .item .quote {
    color: #adb5bd;
    border-left-color: #49ac81;
}

body.dark-mode .testimonials .item .quote .fa {
    color: #49ac81;
}

body.dark-mode .testimonials .item .source .name {
    color: #adb5bd;
}

body.dark-mode .testimonials .item .source .title {
    color: #868e96;
}


/* Language Section (Dark Mode) */
body.dark-mode .languages .item .title {
    color: #adb5bd;
}

body.dark-mode .languages .item .level {
    color: #868e96;
}

body.dark-mode .languages .item .fa {
    color: #49ac81;
}

/* GitHub feed SVG needs to be inverted */
body.dark-mode .github-graph .js-calendar-graph-svg {
    filter: invert(1);
}

/* Custom CSS (Dark Mode) */
body.dark-mode .tag {
    background-color: #3e444c;
    border-color: #5f6b77;
    color: #ced4da;
}

/* ======= Style the Circular Font Awesome Toggle Button ======= */
#theme-toggle {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;

    /* Make it circular */
    width: 35px;
    height: 35px;
    border-radius: 50%;

    /* Styling */
    cursor: pointer;
    border: 0px solid #778492;
    background-color: #bfca42;
    color: #434343;

    /* Center the icon */
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
}

/* --- Icon Visibility Logic --- */

/* By default, show the moon and hide the sun */
#theme-toggle .fa-sun {
    display: none;
}

/* When body has .dark-mode, show the sun and hide the moon */
body.dark-mode #theme-toggle .fa-sun {
    display: block;
}

body.dark-mode #theme-toggle .fa-moon {
    display: none;
}


/* --- Dark Mode Button Style --- */
body.dark-mode #theme-toggle {
    background-color: #97670e;
    color: #e0e0e0;
    border-color: #5f6b77;
}

body.dark-mode a.btn-cta-primary, body.dark-mode .btn-cta-primary {
    background: #8d994e;
    border: 1px solid #8d994e;
    color: #dddddd;
    font-weight: 600;
    text-transform: uppercase;
}

body.dark-mode a.btn-cta-primary:hover, body.dark-mode .btn-cta-primary:hover {
    background: #aab862;
    border: 1px solid #aab862;
    color: #ffffff;
}

body.dark-mode a.btn-cta-secondary, body.dark-mode .btn-cta-secondary {
    background: #37666b;
    border: 1px solid #37666b;
    color: #ddd;
    font-weight: 600;
    text-transform: uppercase;
    margin-right: 12px; 
    border-radius: 16px;
}

body.dark-mode a.btn-cta-secondary:hover, body.dark-mode .btn-cta-secondary:hover {
    background: #467c82;
    border: 1px solid #467c82;
    color: #ddd;
}

body.dark-mode hr {
    border-color: #686868;
}

body.dark-mode .label-theme {
    background: #a19f64;
    font-size: 12px;
    color: #383838;
}

body.dark-mode .list-heading {
    color: navajowhite;
}