/* style.css */
/* Custom styles to supplement Bootstrap or override its defaults */

body {
    font-family: 'Inter', sans-serif;
    /* Bootstrap's bg-light is used in HTML, this ensures fallback */
}

/* Custom message box for alerts */
.message-box {
    position: fixed;
    top: 1rem;
    right: 1rem;
    background-color: #28a745; /* Bootstrap's success green */
    color: white;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    z-index: 1050; /* Higher than Bootstrap modals */
    display: none; /* Hidden by default */
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}
.message-box.error {
    background-color: #dc3545; /* Bootstrap's danger red */
}
.message-box.show {
    display: block;
    opacity: 1;
}

/* Custom hover effects for category cards in index.html */
.card.hover-shadow-lg:hover {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important; /* Bootstrap's shadow-lg */
}
.card.hover-border-primary:hover {
    border-color: #0d6efd !important; /* Bootstrap's primary blue */
}

/* Custom action buttons for admin.php tables */
/* Base styles are defined in admin.php inline style block */
/* Add any additional shared styles here if needed */

/* Ensure font is applied consistently */
h1, h2, h3, h4, h5, h6, .navbar-brand, .btn, .form-control, .form-select, .list-group-item {
    font-family: 'Inter', sans-serif;
}

/* Adjustments for Bootstrap's form-control to match previous form-input */
.form-control, .form-select {
    padding: 0.75rem;
    border-radius: 0.5rem;
}

/* Ensure custom modal styles are compatible with Bootstrap's .modal-dialog, .modal-content */
/* The HTML structure for modals now uses Bootstrap's .modal, .modal-dialog, .modal-content */
/* The custom .modal-overlay and .modal-content classes are no longer directly used for Bootstrap modals */
/* but the .message-box still uses a similar concept. */

/* For the prose content in Privacy Policy modal */
.prose {
    font-size: 1rem;
    line-height: 1.6;
    color: #343a40; /* Bootstrap's dark text */
}
.prose h3 {
    font-size: 1.5rem;
    font-weight: bold;
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
    color: #212529; /* Bootstrap's darker text */
}
.prose ul {
    list-style-type: disc;
    padding-left: 1.5rem;
}
.prose ul li {
    margin-bottom: 0.5rem;
}
.prose strong {
    font-weight: 600;
}

div.email > span:nth-child(2) {
	display: none;
}