/* App-wide theming layered on top of Quasar's defaults.
   Palette: teal #2e6b7e (primary), sage #B9D2B1 (secondary), orange #e8763a (accent).

   DOM note: NiceGUI does not nest <q-card> inside <q-card> — page content sits
   in a layout column (.nicegui-content), not a card. So a `.q-card .q-card`
   descendant rule never matches here. For an intentional sub-panel look inside
   a card, add the `.subcard` class to that inner card (or any element). */

/* ---------- Ordinary cards (low-key, themed) ---------- */
.q-card:not(.feature-card):not(.subcard) {
    border-radius: 10px;
    border: 1px solid #cdddc6;
    /* soft sage outline */
    border-left: 4px solid #b9d2b1;
    /* slightly stronger sage accent edge */
    box-shadow: 0 1px 5px rgba(46, 107, 126, 0.10);
}

/* ---------- Sub-panels (opt-in) ---------- */
/* Apply `.subcard` to a card/element that lives inside another card so it reads
   as grouped content rather than a peer: flat, faint sage fill, no shadow. */
.subcard {
    border-radius: 8px;
    border: 1px solid #d7e3d1;
    background-color: #f3f7f1;
    box-shadow: none;
}

/* ---------- Qualifying rows (best-thirds "top 8") ---------- */
/* Soft sage fill + an inset teal marker (inset shadow avoids the layout shift a
   real left border would cause on these flex rows). */
.qualifies {
    background-color: #e3efdb;
    /*box-shadow: inset 1px 0 0 #2e6b7e;*/
}

/* ---------- Tables ---------- */
.q-table {
    border-radius: 10px;
    box-shadow: 0 1px 5px rgba(46, 107, 126, 0.10);
}

.q-table thead th {
    background-color: #2e6b7e;
    color: #ffffff;
    font-weight: 600;
    font-size: 0.78rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

/* Zebra striping + hover in palette tints. */
.q-table tbody tr:nth-child(even) {
    background-color: #f3f7f1;
}

.q-table tbody tr:hover {
    background-color: #dcebef;
}

/* Round the header's outer corners to match the table card. */
.q-table thead tr:first-child th:first-child {
    border-top-left-radius: 10px;
}

.q-table thead tr:first-child th:last-child {
    border-top-right-radius: 10px;
}