/**
 * Custom Modifier Styles for Bootstrap Components
 */

 /* Add to assets/css/style.css */
html, body {
    height: 100%;
    font-family: 'Lexend', sans-serif;
}

body {
    display: flex;
    flex-direction: column;
    background-color: #ffffff;
    background-image: url('../images/bg-pattern-2.svg');
    background-repeat: repeat;
}

main {
    flex-shrink: 0;
}

.hero-section {
    background: url('../images/hero-bg.png') no-repeat center center;
    background-size: 15%;
    background-position: right center;
    box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.7); /* Dark overlay */
}


/* Adds a colored left border to a heading */
.section-title {
    border-left: 4px solid var(--bs-primary);
    padding-left: 1rem;
}

/* Modifies the default .card component for our resource grid */
.resource-card {
    transition: all 0.2s ease-in-out;
    color: var(--bs-body-color);
}

.resource-card:hover {
    border-color: var(--bs-secondary);
    box-shadow: var(--bs-box-shadow-sm);
    transform: translateY(-2px);
    color: var(--bs-body-color);
}

.resource-card .card-img {
    max-height: 40px; /* Adjusted for better spacing */
    max-width: 100%;
    margin-bottom: 0.5rem;
}

.resource-card .card-icon {
    font-size: 2.25rem;
    margin-bottom: 0.5rem;
    color: var(--bs-primary);
}

/* A unique component for the 'View All' link */
.view-all-card {
    border: 1px solid var(--bs-border-color);
    background-color: var(--bs-light);
    width: 80px;
    height: 80px;
    border-radius: 50%; /* Makes it a circle */
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.2s ease-in-out;
    color: var(--bs-body-color);
}

.view-all-card:hover {
    background-color: var(--bs-secondary-bg);
    border-color: var(--bs-secondary);
}

.view-all-card i {
    font-size: 1.5rem;
}



/* --- Document View Styles --- */

/* Grid View (Default) */
.view-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); /* Responsive columns */
    gap: 1.5rem; /* Space between cards */
}
.view-grid .document-item .card {
    height: 100%; /* Ensure cards fill grid cell */
}


/* List View */
.view-list {
    display: block; /* Each item takes full width */
}
.view-list .document-item .card {
    margin-bottom: 1rem; /* Space between list items */
    /* Optional: Make list view card layout horizontal */
    /* display: flex; */
    /* flex-direction: row; */
}
/* .view-list .document-item .card-body {
     
} */

footer{
    background-color: #212121;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='16' viewBox='0 0 12 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 .99C4 .445 4.444 0 5 0c.552 0 1 .45 1 .99v4.02C6 5.555 5.556 6 5 6c-.552 0-1-.45-1-.99V.99zm6 8c0-.546.444-.99 1-.99.552 0 1 .45 1 .99v4.02c0 .546-.444.99-1 .99-.552 0-1-.45-1-.99V8.99z' fill='%23040304' fill-opacity='0.25' fill-rule='evenodd'/%3E%3C/svg%3E");
}