/* ---------------------------------- */
/* Resume Theme                       */
/* ---------------------------------- */

:root {
    --deep-purple: #3C2E5B;
    --black: #111214;

    --bs-body-bg: #F8F9FA;                      /* light page background */
    --bs-body-color: #212529;                   /* main text color */
    --bs-primary: var(--black);                   /* solid deep purple */

    --bs-button-bg: var(--deep-purple);           /* button bg */
    --bs-button-border: var(--black);             /* border color */
    --bs-button-text: #F8F9FA;                  /* text color */
    --bs-button-bg-hover: #F8F9FA;              /* button bg hover */
    --bs-button-border-hover: var(--deep-purple); /* button border hover */
    --bs-button-text-hover: var(--deep-purple);   /* button text color hover */

    --bs-secondary: #6C757D;                    /* neutral gray */
    --bs-light: #FFFFFF;                        /* cards & surfaces */

    /* Grayscale */
    --gray-100: #F8F9FA;
    --gray-200: #E3E5E8;
    --gray-300: #DEE2E6;
    --gray-400: #CED4DA;
    --gray-500: #ADB5BD;
    --gray-600: #6B6F76;
    --gray-700: #495057;
    --gray-800: #343A40;
    --gray-900: #212529;
}

/* ---------- Body ---------- */
body {
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ---------- Headings ---------- */
h1, h2, h3, h4, h5, h6, .fs-1, .fs-2, .fs-3, .fs-4 {
    color: var(--bs-primary);
    font-weight: 600;
}

/* ---------- Links ---------- */
a {
    color: var(--bs-button-text);
    background-color: var(--bs-button-bg);
    border-color: var(--bs-button-border);
    text-decoration: none;
}
a:hover, a:focus {
    color: var(--bs-button-text-hover);
    background-color: var(--bs-button-bg-hover);
    border-color: var(--bs-button-border-hover);
    text-decoration: none;
}

a.text-links {
    color: var(--bs-button-bg);
    background-color: var(--bs-button-text);
    border-color: var(--bs-button-text);
    text-decoration: none;
}
a.text-links:hover {
    color: var(--bs-button-border);
    background-color: var(--bs-button-text);
    border-color: var(--bs-button-text);
    text-decoration: underline;
}

/* ------- Custom Images ----- */
.resume-noah {
    max-height: 200px; 
    max-width: 200px; 
    margin: auto;
}

.resume-education {
    max-height: 200px; 
    max-width: 200px; 
    margin: auto;
}

.resume-experience {
    max-height: 200px; 
    max-width: 200px; 
    margin: auto;
    display: block; 
}

/* ---------- Cards ---------- */
.card {
    background-color: var(--bs-light);
    border: 1px solid var(--gray-300);
    border-radius: 8px;
}
.card-title {
    color: var(--bs-primary);
    font-weight: 600;
}
.card-text {
    color: var(--bs-body-color);
}
.card-a {
    color: var(--bs-primary);
}
.card-a:hover {
    color: var(--bs-button-text-hover);
}

/* ---------- Buttons ---------- */
.btn-primary {
    color: var(--bs-button-text);
    background-color: var(--bs-button-bg);
    border-color: var(--bs-button-border);
}
.btn-primary:hover {
    color: var(--bs-button-text-hover);
    background-color: var(--bs-button-bg-hover);
    border-color: var(--bs-button-border-hover);
}
.btn-secondary {
    background-color: var(--bs-button-border);
    border-color: var(--bs-button-border);
    color: var(--bs-body-bg);
}
.btn-secondary:hover {
    background-color: var(--bs-button-bg-hover);
    border-color: var(--bs-button-border);
    color: var(--bs-button-border);
}

/* ---------- Navbar ---------- */
.navbar, .navbar-light, .navbar-dark {
    background-color: var(--bs-light);
}
.navbar .nav-link {
    color: var(--deep-purple);
    text-decoration: none;
}
.navbar .nav-link:hover {
    color: var(--black);
    text-decoration: underline;
}

.navbar-brand {
    color: var(--bs-primary);
    background-color: var(--bs-body-bg);
    border-color: var(--bs-body-bg);
    text-decoration: none;
}

.navbar-brand:hover {
    color: var(--bs-primary);
    background-color: var(--bs-body-bg);
    border-color: var(--bs-body-bg);
    text-decoration: underline;
}

/* ---------- Section Dividers ---------- */
hr {
    border: 0;
    border-top: 1px solid var(--gray-200);
    margin: 3rem 0;
}

/* ---------- Utilities ---------- */
.text-muted {
    color: var(--bs-secondary) !important;
}
.bg-light {
    background-color: var(--bs-light) !important;
}