/* .training-details {
  max-width: 700px;
  margin: 0 auto;
  padding: 2rem;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.training-title {
  font-size: 2rem;
  margin-bottom: 1rem;
  color: #222;
}

.training-description {
  font-size: 1.1rem;
  margin-bottom: 1.5rem;
  line-height: 1.6;
}

.training-meta p {
  margin: 0.4rem 0;
  font-size: 1rem;
}

.training-meta strong {
  color: #444;
} */



.center {
    text-align: center;
}

.training-h1-smaller {
    max-width: 740px;
    margin: 0 auto;  
    font-size: min(var(--wp--preset--font-size--huge), 2.5rem);
}




/* styles for trainings list START */

/* Main container for the list of training cards */
.training-list {
    display: grid; /* Use grid for a flexible, modern layout */
    grid-template-columns: repeat(auto-fill, 1fr); /* Creates responsive columns minmax(300px, 1fr) */
    gap: 1.5rem; /* Space between each training card */
    margin: 2rem 0;
}

/* Link that wraps the entire card */
.training-item-link {
    text-decoration: none;
    color: inherit; /* Inherit text color from the parent */
    display: block;
    height: 100%; /* Ensures the link fills the entire card height */
    border-radius: 12px; /* Match the card's border radius */
}

/* The main training card style */
.training-item {
    border: 1px solid var(--wp--preset--color--raft-bg-alt);
    border-radius: 12px;
    padding: 1.5rem;
    background: var(--wp--preset--color--raft-accent);
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    cursor: pointer;
    display: flex; /* Use flexbox for better internal alignment */
    flex-direction: column;
    height: 100%; /* Make all cards in a row the same height */
    box-sizing: border-box; /* Ensures padding is included in the height calculation */
}

/* Hover and focus states for better accessibility and interaction */
.training-item-link:focus-visible .training-item, /* Use :focus-visible for keyboard nav */
.training-item-link:hover .training-item {
    transform: translateY(-5px); /* A more noticeable lift effect */
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
    border-color: var(--wp--preset--color--raft-fg);
}


.training-header {
    border-bottom: 1px solid var(--wp--preset--color--raft-bg-alt);
    padding-bottom: 1rem;
    margin: 0 0 1rem 0;
}

/* Styling for the main title of the training */
.training-title {
    font-size: 1.5rem; /* Larger for more importance */
    font-weight: 700;  /* Bolder */
    color: var(--wp--preset--color--raft-fg-alt);
    margin: 0 0 0.75rem 0; /* Adjusted margin */
}

/* Styling for the main date, positioned right under the title */
.training-date {
    font-size: 1rem;
    font-weight: 600; /* Semi-bold to make it stand out */
    color: var(--wp--preset--color--raft-fg); /* A slightly different color for emphasis */
    margin: 0 0 0 0;
}

/* The wrapper for all the smaller details */
.training-details p {
    font-size: 0.9rem;
    color: var(--wp--preset--color--raft-fg-alt);
    margin: 0 0 0.5rem 0; /* Consistent spacing between details */
    line-height: 1.5;
}

.training-details p strong {
    color: var(--wp--preset--color--raft-fg); /* Make the labels slightly more prominent */
}

/* Responsive tweaks for smaller screens */
@media (max-width: 768px) {
    .training-list {
        grid-template-columns: 1fr; /* Stack to a single column on mobile */
    }
    .training-item {
        padding: 1rem;
    }
    .training-title {
        font-size: 1.25rem;
    }
}

/* styles for trainings list END */



/* styles for trainings details   START */
/* Grid layout for details with grey background, theme font and width retained */
.training-details-grid {
    display: grid;
    grid-template-columns: 1fr 1fr; /* two columns */
    gap: 15px; /* spacing between items */
}

.training-details-grid p {
    background-color: #f2f2f2; /* light grey background */
    padding: 10px 12px;
    border-radius: 5px;
    margin: 0;
}

/* Responsive: single column on mobile */
@media (max-width: 768px) {
    .training-details-grid {
        grid-template-columns: 1fr;
    }
}

/* Optional: spacing between description and details */
.training-description-section {
    margin-bottom: 30px;
}

.training-details-section h2,
.training-description-section h2 {
    margin-bottom: 15px;
}



/* styles for trainings details   END */