/* Global variables */
:root {
    --primary-color: #01a7b7;
    --gray: #2e2f2f;
    --white: #fff;
}

/* Body styles */
body {
    background-color: var(--primary-color);
    font-family: Arial, sans-serif;
}

/* General styles */
.cursor-pointer {
    cursor: pointer;
}

/* Header styles */
header {
    background-color: var(--gray);
    padding: 1rem;
}

/* Navbar syles */
#navbarDropdown:not(:hover) {
    color: var(--white);
}

.navbar {
    background-color: var(--gray);
    max-height: 100px;
}

.navbar-brand {
    max-height: 100px; 
    max-width: 200px;
}

.navbar-toggler {
    border: none;
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='white' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.navbar-nav .nav-link {
    color: var(--white);
}

.navbar-nav .nav-link:hover {
    color: var(--primary-color);
}

/* Search button styles */
.btn-outline-success {
    background-color: #e6e6e6;
}

/* Dropdown styles */
.dropdown-menu {
    background-color: var(--white);
    border: none;
    position: absolute;
}

.dropdown-menu a {
    color: #111;
}

.dropdown-menu a:hover {
    color: var(--primary-color);
}

/* card's styles */
.book-card {
    color: #000;
}

/* Estilos para la sección principal */
.first-element {
    margin-top: 2rem;
    background-color: var(--white);
    border-radius: 0.5rem;
    padding: 2rem;
}

/* Estilos para el pie de página */
footer {
    background-color: #007982;
    padding: 1rem;
    color: var(--white);
    text-align: center;
}