/*******************************************************
 ***   EXPERIENCE THE GRACE
 ***   Developed by TJ Moore
 ***   Copyright (c) 2025 
 *******************************************************/
/* Global light/blue theme overrides */
:root {
    --etg-primary: #0d6efd;
    /* Bootstrap blue */
    --etg-primary-light: #5aa0ff;
    --etg-bg: #f7fbff;
    /* very light blue background */
    --etg-text: #0b2545;
    /* deep blue text */
}

body {
    background-color: var(--etg-bg);
    color: var(--etg-text);
    margin: 0;
    padding: 0;
}

.navbar {
    background-color: #ffffff !important;
    /* light blue */
}

.navbar .navbar-brand,
.navbar .nav-link {
    color: var(--etg-text) !important;
}

.btn-primary,
.bg-primary,
.text-primary,
.border-primary {
    --bs-btn-bg: var(--etg-primary);
    --bs-btn-border-color: var(--etg-primary);
    --bs-btn-hover-bg: #0b5ed7;
    --bs-btn-hover-border-color: #0b5ed7;
    --bs-btn-active-bg: #0a58ca;
    --bs-btn-active-border-color: #0a58ca;
    color: #fff !important;
    background-color: var(--etg-primary) !important;
    border-color: var(--etg-primary) !important;
}

.card {
    background-color: #ffffff;
    border-color: #dbe8ff;
}

.card-header.bg-primary {
    background-color: var(--etg-primary) !important;
}

.alert-info {
    background-color: #e9f2ff;
    border-color: #cfe0ff;
    color: var(--etg-text);
}

/* Login page styles */
.login-page {
    color: #000;
}

.login-page a {
    color: #000;
}

.login-page .text-muted {
    color: rgba(0, 0, 0, 0.6) !important;
}

.login-page h1,
.login-page h2,
.login-page h3,
.login-page h4,
.login-page h5,
.login-page h6 {
    color: #000;
}

.login-page .alert {
    color: inherit;
}

/* Inputs readable on dark backgrounds */
.login-page .form-control {
    color: #000;
    background-color: #fff;
    border-color: #ced4da;
}

.login-page .form-control::placeholder {
    color: rgba(0, 0, 0, 0.5);
}

.login-page .form-control:focus {
    color: #000;
    background-color: #fff;
    border-color: #86b7fe;
    box-shadow: 0 0 0 .2rem rgba(13, 110, 253, .25);
}

/* Links inside alerts/buttons remain legible */
.login-page .btn-close {
    filter: none;
}

.login-page .modal-content {
    color: #000;
}

/* keep video modal default readable */
.login-page .modal-content .close span {
    color: #000;
}

/* Ensure navbar drop-downs or external components aren't forced white unintentionally */
.navbar,
.dropdown-menu {
    color: inherit;
}

/* Optional: make labels white if used */
.login-page label.form-label {
    color: #000;
}

/* Landing page tweaks */
.hero {
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.15), rgba(13, 110, 253, 0.06)), url('../img/cyberland.jpg') center/cover no-repeat;
    color: var(--etg-text);
}

/* Index hero specific background */
#hero {
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.15), rgba(13, 110, 253, 0.06)), url('../img/SlipOnMyShoes_cover.jpg') center/cover no-repeat;
    color: #ffffff;
}

.parallax {
    /* The image used */
    background-image: url("../../assets/img/tj_moore02.jpg");

    /* Set a specific height */
    min-height: 500px;

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    color: #ffffff;
}