@charset "utf-8";


/* --- Page Header Control --- */

/* --- Unique Monthly Course Header --- */

.course-schedule-header {
    width: 100% !important;
    padding-top: 60px !important; /* Large gap from nav */
    padding-bottom: 0px !important;
    display: block !important;
}



.header-content-block {
    width: 80% !important;      /* Matches table width */
    margin: 0 auto !important;  /* Centers the block on page */
    text-align: left !important; /* Forces content inside to the left */
}



/* Ensure the table section doesn't have huge top padding now */
.courses-section {
    padding-top: 10px !important;
}



.page-header .container {
    width: 80%;           /* Matches the table width */
    margin: 0 auto;       /* Centers the container on the page */
    padding: 0;           /* Removes default padding to align text to the far left edge */
}



/* Courses Table Styling */
.courses-section {
    padding: 60px 0;
}



.course-table {
    width: 80%;           /* Increased for better fit, adjust as needed */
    margin: 30px auto;    /* Centers the table */
    table-layout: fixed;  /* MANDATORY: This allows you to control widths exactly */
    border-collapse: collapse;
    background: #fff;
    border-radius: 10px;
    /* overflow: hidden;   switched off ensures table headings do not hide behind dropnav */
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    font-family: 'Open Sans', sans-serif;
}



/* Header Specifics */
.course-table thead {
    background-color: #212427;
    color: #ffffff;
}



/* total should equal 100% */

.col-logo     { width: 15%; text-align: center; }    /* Course Image */
.col-date     { width: 18%; text-align: center; }    /* Day / Date */
.col-reg      { width: 7%; text-align: center; }    /* Registration Begins */
.col-start    { width: 7%; text-align: center; }    /* Scheduled Start Time */
.col-duration { width: 13%; text-align: center; }    /* Course Duration */
.col-dvsa     { width: 9%; text-align: center; }    /* DVSA Approved For */
.col-price    { width: 20%; text-align: center; }    /* Price (Needs more room for text) */
.col-book     { width: 11%; text-align: center; }    /* Book Now Button */




.course-table th {
    position: sticky;
    top: 60px;
    z-index: 10;   /* ensures header stays on top of the scrolling table rows */
    background-color: #212427;
    text-align: center !important;   /* Horizontal Centering */
    vertical-align: middle !important;   /* Vertical Centering */
    
    /* Spacing and Typography */
    padding: 15px 10px;
    color: #ffffff;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
    line-height: 1.3;
    white-space: normal;   /* Allows text to wrap if it's long */
    box-sizing: border-box;   /* CRITICAL: Padding won't break the % math */
}



/* Cell Styling */
.course-table td {
    font-size: 15px;
    padding: 15px 10px;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
    color: #444;
    box-sizing: border-box;   /* CRITICAL: Padding won't break the % math */
}



.col-logo img, 
.col-dvsa img {
    max-width: 100%;   /* Ensures it never pushes the column wider */
    height: auto;
    display: block;
    margin: 0 auto;
    border-radius: 5px;
}



/* Zebra stripes : targets every even row and applies it to the cells inside */
.course-table tbody tr:nth-child(even) td {
    background-color: #f7f7f7 !important;   /*alternatives #fcfcfc; #f2f2f2; */
}



.course-table th {
    white-space: normal;    /* Allows the text to wrap */
    vertical-align: bottom; /* Aligns all headers to the bottom for a clean look */
    line-height: 1.2;       /* Keeps the two lines of text tight and readable */
    padding: 12px 10px;
}



.course-table td.col-date strong#force-date-style {
    font-size: 24px !important;
    font-weight: 600 !important;
    color: #212427 !important;
    display: block !important;
    line-height: 1.2 !important;
}



.course-table td.col-reg {
    font-size: 16px !important;   /* Smaller than the start time */
    font-weight: 400 !important;
    color: #666 !important;
    vertical-align: middle !important;
}



.course-table td.col-start strong {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #212427 !important;
    line-height: 1.2 !important;
    display: block !important; /* Ensures it behaves like the other "big" numbers */
    text-align: center !important;
}



.course-table td.col-duration {
    display: table-cell !important;
    vertical-align: middle !important;
    text-align: center !important;
    width: 13%; /* Matches your header width */
}



.course-table td.col-price.price {
    font-size: 24px !important;
    font-weight: 600 !important;
    color: #212427 !important;
    line-height: 1.4 !important;
    text-align: center !important;
}



.course-table td.col-price {
    display: table-cell !important;
    text-align: center !important;  /* Horizontal */
    vertical-align: middle !important; /* Vertical */
    padding: 15px 5px !important;     /* Remove side padding that might push text */
    width: 23%;
}



.course-duration {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #212427 !important;
    display: block !important;
    width: 100% !important;        /* Fill the blue box */
    margin-left: auto !important;  /* Force equal margins */
    margin-right: auto !important; /* Force equal margins */
    text-align: center !important; /* Center the text inside the 100% width */
    padding: 0 !important;         /* Kill any inherited padding */
}



.course-note {
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #666 !important;
    display: block !important;
    font-size: 13px !important;
    color: #666 !important;
    width: 100% !important;
    margin: 0 auto !important;
}



.price-value {
    font-size: 24px !important;
    font-weight: 600 !important;
    color: #212427 !important;
    display: block !important;
    width: 100% !important;        /* Fill the blue box */
    margin-left: auto !important;  /* Force equal margins */
    margin-right: auto !important; /* Force equal margins */
    text-align: center !important; /* Center the text inside the 100% width */
    padding: 0 !important;         /* Kill any inherited padding */
}



.price-note {
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #666 !important;
    display: block !important;
    font-size: 13px !important;
    color: #666 !important;
    width: 100% !important;
    margin: 0 auto !important;
}



.course-table td.col-book {
    text-align: left !important;
    padding-left: 0px !important;  /* Optional: adds a little breathing room from the price column */
}



/* Button Refinement */
.book-btn {
    background-color: #f40000;
    color: #ffffff;
    padding: 12px 0;      /* Fixed vertical padding */
    width: 130px;         /* Uniform button width */
    text-align: center;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 800;
    font-size: 16px;
    transition: all 0.3s ease;
    display: inline-block;
    margin-left: 0 !important;
    margin-right: auto !important;
}



.book-btn:hover {
    background-color: #008000;
    color: #ffffff;
    transform: translateY(-2px);
    text-decoration: none;
}



/* --- DEBUGGING TOOL: The "Blue Box" Trip --- 
* {
    outline: 1px solid blue !important;
}
*/


/* Nuclear override for the table row */
.course-table tr {
    text-align: center !important;
}