/**
 * Red Theme for BirthdayCard.online
 */

body.theme-red {
    --primary-color: #e74c3c;
    --secondary-color: #c0392b;
    --accent-color: #e67e22;
    --text-color: #2c3e50;
    --light-color: #ecf0f1;
    --border-color: #bdc3c7;
    
    /* Apply a subtle background tint to the whole page */
    /* background-color: rgba(231, 76, 60, 0.05); */ /* Optional: Can be too much */
}

/* Use the theme variable for the logo */
body.theme-red .site-logo span {
    color: var(--primary-color);
}

/* General link styling */
body.theme-red a {
    color: var(--primary-color);
}
body.theme-red a:hover {
    color: var(--secondary-color);
}

/* Style festive headings */
body.theme-red h1.festive-heading,
body.theme-red h2.festive-heading {
    color: var(--primary-color);
}

/* Style primary festive buttons */
body.theme-red .festive-button.primary {
    background-color: var(--primary-color);
    border-color: var(--secondary-color);
    color: white;
}
body.theme-red .festive-button.primary:hover {
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
}

.theme-red .card-header,
.theme-red .btn-primary {
    background-color: var(--primary-color);
    border-color: var(--secondary-color);
}

.theme-red .btn-primary:hover,
.theme-red .btn-primary:focus {
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
}

.theme-red .card-title,
.theme-red h1,
.theme-red h2,
.theme-red a {
    color: var(--primary-color);
}

.theme-red a:hover {
    color: var(--secondary-color);
}

.theme-red .form-control:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.25rem rgba(231, 76, 60, 0.25);
}

/* Card preview overlay styles */
.preview-overlay.theme-red {
    background-color: rgba(231, 76, 60, 0.7);
    color: #fff;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

/* Card view styles */
.card-view.theme-red {
    background-color: rgba(231, 76, 60, 0.1);
    border: 2px solid var(--primary-color);
}

.card-view.theme-red .card-header {
    background-color: var(--primary-color);
    color: white;
}

.card-view.theme-red .card-footer {
    background-color: rgba(231, 76, 60, 0.1);
    border-top: 1px solid var(--primary-color);
}