/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

/* Tailwind Config Wrapper - In a real build this would be in tailwind.config.js */
/* Since we use CDN, we configure it in JS in the HTML head, but we keep custom CSS here. */

body {
    background-color: #fdfbf7;
    color: #2c2c2c;
    font-family: 'Merriweather', serif;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Playfair Display', serif;
}

/* Custom colors variables if needed for non-Tailwind contexts */
:root {
    --poterne-bg: #fdfbf7;
    --poterne-text: #2c2c2c;
    --poterne-primary: #8B4513;
    --poterne-accent: #d97706;
    --poterne-card: #f4efe6;
}

/* Agenda Widget Styles */
.agenda-row {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #e0c57f;
    padding: 0.75rem 0;
    text-align: left;
    opacity: 1;
    transform: translateY(0);
    transition: all 0.6s ease;
}

.agenda-row.fade-in {
    opacity: 0;
    transform: translateY(10px);
    animation: fadeInUp 0.6s ease forwards;
}

.agenda-row > div {
    flex: 1;
    padding: 0 0.5rem;
    min-width: 120px;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 600px) {
    .agenda-row {
        flex-direction: column;
    }
    .agenda-row > div {
        padding: 0.25rem 0;
    }
}

/* Brevo/Sendinblue Form Overrides */
#sib-container {
    background-color: #f4efe6 !important;
    border: 1px solid #e0c57f !important;
    font-family: 'Merriweather', serif !important;
}

#sib-container input {
    border: 1px solid #dcdcdc !important;
    background-color: #fff !important;
}

.sib-image-form-block img {
    max-width: 100px;
    border-radius: 50%;
}
