/* 
File: style.css
Custom color scheme for Divine House of Prayers theme
*/

:root {
    --primary-color: #8945B5; /* Purple */
    --primary-hover: #7434A8;
    --text-light: #FFFFFF;
    --text-dark: #333333;
}

/* Custom styles for the primary navigation menu */
.menu-item {
    padding: 1rem 0.5rem;
    color: #6B7280; /* Text-gray-500 */
    transition: color 0.3s, border-color 0.3s;
}

.menu-item:hover {
    color: #6D28D9; /* Text-purple-600 */
}

.menu-item.current-menu-item {
    color: #6D28D9; /* Text-purple-600 */
    border-bottom: 4px solid #6D28D9; /* Border-purple-600 */
}

/* Logo styles */
.custom-logo-link {
    display: block;
    padding: 0.5rem 0;
}

.custom-logo {
    max-height: 120px !important; /* Increased height */
    width: auto;
    height: auto;
}

/* Add padding to the nav to accommodate larger logo */
.site-header nav {
    padding: 0.5rem 0;
}

/* Adjust the navigation height to match logo */
.nav-container {
    min-height: 120px;
}

/* Override button styles */
.btn-primary {
    background-color: #6D28D9; /* Background-purple-600 */
    color: white;
}

.btn-primary:hover {
    background-color: #4C1D95; /* Background-purple-700 */
}

/* Custom background colors */
.bg-primary {
    background-color: var(--primary-color);
}

.bg-primary:hover {
    background-color: var(--primary-hover);
}

/* Text colors */
.text-primary {
    color: var(--primary-color);
}

.text-primary:hover {
    color: var(--primary-color);
}

/* Banner and registration button styles */
.banner-container {
    max-width: 100%;
    overflow: hidden;
}

.banner-container img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 1200px; /* Adjust based on your preference */
    object-fit: cover;
}

/* Large register button styles */
.register-button {
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.register-button:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.speaker-image {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.speaker-image.loaded {
    opacity: 1;
}

/* Speaker container styles */
.speaker-section {
    display: flex;
    flex-wrap: nowrap;
    gap: 1.5rem;
    justify-content: center;
    align-items: flex-start;
    overflow-x: auto; /* Allows horizontal scroll on small screens */
    padding: 2rem 1rem;
}

/* General speaker image styles */
.speaker-image {
    height: 300px;
    object-fit: cover;
    border-radius: 10px;
    transition: transform 0.3s ease;
}

/* Specific overrides */
.speaker-image.bahati,
.speaker-image.ditto {
    width: 200px;
}

.speaker-image.fondong {
    width: auto; /* Keeps natural width */
    max-width: 250px;
}