/*
Theme Name: Seerah Conference 2025
Theme URI: https://seerahconference2025.org
Description: A custom WordPress theme for the Seerah Conference featuring modern design with Tailwind CSS, speaker management, countdown timer, and event functionality. Perfect for Islamic conferences and events.
Author: ICNA Inland Empire
Author URI: https://icna.org 
Version: 1.0.0
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: seerah-theme
Domain Path: /languages
Tags: conference, event, islamic, speakers, responsive, custom-post-types, tailwind
Requires at least: 5.0
Tested up to: 6.3
Requires PHP: 7.4

This theme is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* Reset and Base Styles */
* {
    box-sizing: border-box;
}

body {
    font-family: 'Inter', sans-serif;
    background-color: #f8fafc;
    margin: 0;
    padding: 0;
    line-height: 1.6;
}
.hero-gradient {
    /*background: linear-gradient(135deg, #34d399, #10b981);*/
    background-image: url('/wp-content/uploads/2025/08/bg-1200x1500-1.png');
    background-repeat: no-repeat; /* Prevents the image from repeating */
    background-position: top center; /* Centers the image horizontally */
    /* Optional: Adjust background-size as needed */
    background-size: cover; /* Scales the image to cover the entire element */
}
.section-title {
    font-weight: 800;
    font-size: 2.25rem;
    letter-spacing: -0.025em;
    color: #1e293b;
}
.section-subtitle {
    font-size: 1.125rem;
    color: #475569;
    max-width: 60ch;
    margin: 0.5rem auto 0;
}
.speaker-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.speaker-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
}
.modal {
    display: none;
    position: fixed;
    z-index: 100;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.6);
    animation: fadeIn 0.3s;
}
.modal-content {
    background-color: #fefefe;
    margin: 5% auto;
    padding: 2.5rem;
    border-radius: 0.75rem;
    width: 90%;
    max-width: 700px;
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    animation: slideIn 0.4s;
}
.close-button {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
}
.bg-green-600 {
    background-image: url('/wp-content/uploads/2025/08/bg-1200x1500-1.png') !important;
    background-repeat: no-repeat; /* Prevents the image from repeating */
    background-position: top center; /* Centers the image horizontally */
    /* Optional: Adjust background-size as needed */
    background-size: cover; /* Scales the image to cover the entire element */
}
@keyframes fadeIn { from {opacity: 0;} to {opacity: 1;} }
@keyframes slideIn { from {transform: translateY(-50px); opacity: 0;} to {transform: translateY(0); opacity: 1;} }