/* 🌐 Base layout for the entire page */
body {
    font-family: Arial, sans-serif;       /* Clean, readable sans-serif font */
    background-color: #f4f4f4;            /* Light grey background for soft contrast */
    margin: 0 10%;                        /* Horizontal centering with 10% side margins */
    padding: 0;                           /* No internal padding */
    color: #000703;                       /* Deep green text color */
    font-size: 18px;                      /* Standard readable base font size */
    padding-bottom: 80px;                 /* Prevent content overlap with fixed footer */
}
/* 🧱 Header styling */
header {
    background-color: #9dc6b0;            /* Soft green background for header */
    color: white;                         /* White text for contrast */
    padding: 11px 17px;                   /* Balanced vertical and horizontal spacing */
    text-align: center;                   /* Centered header content */
}
/* 📎 Footer styling */
footer {
    background-color: #9dc6b0;            /* Soft green footer background */
    color: rgb(10, 0, 0);                 /* Dark footer text */
    text-align: center;                   /* Centered footer content */
    padding: 11px 0;                      /* Vertical spacing only */
    position: fixed;                      /* Footer stays pinned to bottom */
    bottom: 0;                            /* Anchored to bottom of viewport */
    width: 80%;                           /* Matches body width (margin-aware) */
    left: 10%;                            /* Aligns with body margin */
    font-size: 16px;                      /* Slightly smaller than body text */
}
/* 🧭 Headings */
h1 {
    color: black;                         /* Black for main page title */
    font-size: 36px;                      /* Large font for emphasis */
    margin-bottom: 11px;                  /* Space below heading */
}
h2 {
    color: #458764;                       /* Signature green for section titles */
    font-size: 28px;                      /* Medium-large font size */
    margin: 30px 0 11px;                  /* Top and bottom spacing */
}
h3 {
    color: #458764;                       /* Signature green for subsection titles */
    font-size: 22px;                      /* Smaller than h2 */
    margin-top: 25px;                     /* Space above subsection */
    font-weight: bold;                    /* Emphasize subsection titles */
}
/* 🧾 Form styling */
form {
    margin-bottom: 30px;                  /* Space below form before next element */
}
/* 🧾 Form row layout for aligned labels and inputs */
.form-row {
    display: flex;                        /* Align label and input horizontally */
    align-items: center;                 /* Vertically center input with label */
    margin-bottom: 12px;                  /* Space between rows */
    max-width: 600px;                     /* Optional: constrain form width */
}
.form-row label {
    width: 160px;                         /* Fixed width for alignment */
    font-weight: bold;                    /* Emphasize field names */
}
.form-row input {
    flex: 1;                              /* Input takes remaining space */
    padding: 6px;                         /* Comfortable click/tap area */
    box-sizing: border-box;              /* Prevent overflow */
}
input[type="date"] {
    font-size: 16px;
    font-family: inherit;
    padding: 6px;
}
label {
    font-weight: bold;                    /* Make labels stand out */
    font-size: 16px;                      /* Match input text size */
}
select,
button {
    font-size: 16px;                      /* Uniform input text size */
    padding: 8px 12px;                    /* Comfortable click/tap area */
    margin-top: 8px;                      /* Space above input */
    margin-right: 10px;                   /* Space between inputs */
    border-radius: 4px;                   /* Rounded corners for modern look */
    border: 1px solid #ccc;               /* Light grey border */
}
button {
    background-color: #458764;            /* Signature green background */
    color: white;                         /* White text for contrast */
    border: none;                         /* Remove default button border */
    cursor: pointer;                      /* Pointer cursor on hover */
}
button:hover {
    background-color: #356a54;            /* Darker green on hover */
}
/* 📊 Table styling */
table {
    width: 100%;                          /* Full width table */
    border-collapse: collapse;            /* Remove spacing between cells */
    margin-bottom: 30px;                  /* Space below table */
}
th,
td {
    padding: 10px;                        /* Internal cell spacing */
    border: 1px solid #ccc;               /* Light grey cell borders */
    text-align: left;                     /* Default left alignment */
}
th {
    background-color: #9dc6b0;            /* Soft green header background */
    font-weight: bold;                    /* Emphasize header text */
}
/* 📐 Fixed column widths for alignment */
table th:nth-child(1),
table td:nth-child(1) {
    width: 100px;                         /* Fixed width for name column */
    white-space: nowrap;                  /* Prevent line breaks */
    overflow: hidden;                     /* Hide overflow text */
    text-overflow: ellipsis;             /* Add "..." to long names */
}
table th:nth-child(2),
table td:nth-child(2),
table th:nth-child(3),
table td:nth-child(3) {
    width: 100px;                         /* Fixed width for score and countback */
    text-align: left;                     /* Align numbers for clarity */
}
/* 🧭 Dashboard menu styling */
.dashboard-menu ul {
    list-style-type: none;                /* Removes bullet points */
    padding: 0;                           /* No internal padding */
    margin: 20px 0;                       /* Vertical spacing around menu */
}
.dashboard-menu li {
    margin-bottom: 10px;                  /* Space between menu items */
}
.dashboard-menu a {
    font-size: 24px;                      /* Controls menu text size */
    color: #458764;                       /* Signature green for links */
    text-decoration: none;                /* Removes underline */
    font-weight: bold;                   /* Emphasize menu links */
    display: inline-block;                /* Allows padding and spacing */
}
.dashboard-menu a:visited {
    color: #458764;                       /* Ensures visited links stay green */
}
.dashboard-menu a:hover {
    text-decoration: underline;           /* Optional hover effect */
    color: #356a54;                       /* Darker green on hover */
}
/* 🖨️ Print adjustments */
@media print {
    body {
        background-color: white;          /* White background for print */
        color: black;                     /* High contrast text */
    }
    form {
        display: none;                    /* Hide form elements in print */
    }
    header h1 {
        font-size: 24px;                  /* Slightly smaller print heading */
        margin-bottom: 20px;              /* Space below heading */
        color: #458764;                   /* Signature green retained */
    }
    table {
        page-break-inside: avoid;         /* Prevent table splitting across pages */
    }
    footer {
        margin-top: 60px;                 /* Extra space before footer */
        display: block !important;        /* Ensure footer prints */
    }
}  /* ✅ End of @media print */

/* 📱 Mobile readability enhancements — NEW */
@media screen and (max-width: 600px) {
    body {
        margin: 0 5%;                      /* Reduce side margins for small screens */
        font-size: 20px;                   /* Slightly larger base font for readability */
    }
    h1 {
        font-size: 30px;                   /* Scale down slightly for mobile */
    }
    h2 {
        font-size: 24px;                   /* Adjust section title size */
    }
    h3 {
        font-size: 20px;                   /* Adjust subsection title size */
    }
    select,
    button,
    input,
    label {
        font-size: 18px;                   /* Larger tap targets and readable labels */
    }
    table th,
    table td {
        font-size: 16px;                   /* Improve legibility in tables */
        padding: 8px;                      /* Slightly tighter spacing */
    }
    table th:nth-child(1),
    table td:nth-child(1),
    table th:nth-child(2),
    table td:nth-child(2),
    table th:nth-child(3),
    table td:nth-child(3) {
        width: auto;                       /* Allow flexible column widths on mobile */
        white-space: normal;              /* Allow wrapping if needed */
    }
    footer {
        font-size: 14px;                   /* Slightly smaller footer text */
        width: 90%;                        /* Match reduced body margin */
        left: 5%;                          /* Align with new margin */
    }
/* 📊 Fixed column widths for Competitions Overview — NEW */
.overview-table {
    table-layout: fixed;               /* Ensures consistent column widths */
    width: 100%;                       /* Full width table */
}

.overview-table th,
.overview-table td {
    text-align: center;                /* Center-align for clarity */
    overflow: hidden;                  /* Prevent overflow */
    text-overflow: ellipsis;          /* Add "..." if content is too long */
    white-space: nowrap;              /* Prevent wrapping */
    padding: 10px;                     /* Match existing table cell spacing */
    border: 1px solid #ccc;           /* Match existing table borders */
}  /* ✅ This closing brace was missing */

/* 📐 Fixed widths for each shooter class column */
.overview-table th:nth-child(2),
.overview-table td:nth-child(2) { width: 80px; }  /* AAA */
.overview-table th:nth-child(3),
.overview-table td:nth-child(3) { width: 80px; }  /* AA */
.overview-table th:nth-child(4),
.overview-table td:nth-child(4) { width: 80px; }  /* A */
.overview-table th:nth-child(5),
.overview-table td:nth-child(5) { width: 80px; }  /* B */
.overview-table th:nth-child(6),
.overview-table td:nth-child(6) { width: 80px; }  /* C */
.overview-table th:nth-child(7),
.overview-table td:nth-child(7) { width: 90px; }  /* Ladies */
.overview-table th:nth-child(8),
.overview-table td:nth-child(8) { width: 90px; }  /* Junior */
.overview-table th:nth-child(9),
.overview-table td:nth-child(9) { width: 100px; } /* Total */
}  /* ✅ End of @media screen and (max-width: 600px) */
.provisional {
    color: red;
    font-weight: bold;
    animation: flashText 2s infinite;
}

@keyframes flashText {
    0%   { content: attr(data-place); }
    50%  { content: "Provisional"; }
    100% { content: attr(data-place); }
}
.note-below-select {
    margin-top: 32px;
    font-style: italic;
    color: #555;
    text-align: left;
}