/* Kalkulaatori kaart */
.calculator-card {
    background-color: var(--kerge-taust);
    border: 1px solid #d6e0ea;
    border-left: 5px solid var(--taltech-burgundy);
    border-radius: var(--border-radius);
    padding: 20px;
    margin-bottom: 25px;
}

.calculator-content {
    display: flex;
    align-items: center;
    gap: 20px;
}

.calculator-icon-wrapper {
    background-color: var(--taltech-burgundy);
    color: white;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.calculator-text {
    flex-grow: 1;
}

.calculator-action {
    flex-shrink: 0;
}

.btn-taltech-burgundy,
.btn-taltech-sinine {
    border: none;
    padding: 10px 20px;
    border-radius: var(--border-radius);
    text-decoration: none;
    font-weight: 600;
    transition: background-color 0.2s;
    display: inline-block;
    color: white;
}

.btn-taltech-burgundy {
    background-color: var(--taltech-burgundy);
}

.btn-taltech-burgundy:hover,
.btn-taltech-burgundy:focus {
    background-color: #8a0f42;
    /* Veidi tumedam burgundy */
    color: white;
    text-decoration: none;
}

.btn-taltech-sinine {
    background-color: var(--taltech-sinine);
}

.btn-taltech-sinine:hover,
.btn-taltech-sinine:focus {
    background-color: #001c3d;
    /* Tumedam TalTech sinine hoveriks */
    color: white;
    text-decoration: none;
}

.btn-taltech-burgundy.btn-sm,
.btn-taltech-sinine.btn-sm {
    padding: 6px 14px;
    font-size: 0.875rem;
}

@media (max-width: 768px) {
    .calculator-content {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .calculator-action {
        width: 100%;
    }

    .btn-taltech-burgundy,
    .btn-taltech-sinine {
        display: block;
        text-align: center;
        width: 100%;
    }

    .calculator-icon-wrapper {
        width: 40px;
        height: 40px;
    }
}

:root {
    --taltech-burgundy: #aa1352;
    --taltech-magenta: #e4067e;
    --taltech-punane: #e4067e;
    --taltech-sinine: #342b60;
    --taltech-tumesinine: #221c3f;
    --taltech-hele-sinine: #4dbed2;
    --taltech-hall-1: #9396b0;
    --taltech-hall-2: #dadae4;
    --tekst-varv: #333;
    --taust-varv: #f4f4f4;
    --element-taust: #fff;
    --kerge-taust: #eef2f7;
    --hall-tekst: #555;
    --link-varv: #0066cc;
    --border-radius: 6px;
    --indent-step: 1.5em;
    --alternate-bg: #f9f9f9;
    --bs-accordion-active-bg: #eef2f7;
    /* Lisatud tegevuskava jaoks */
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(0, 48, 135, 0.25);
    /* Universaalsed tabelite ja kaartide disainitokenid */
    --table-header-bg: var(--taltech-sinine);
    --table-header-color: #ffffff;
    --table-stripe-bg: rgba(0, 0, 0, 0.025);
    --table-hover-bg: #e6edf5;
    --table-warning-bg: #fff9e6;
    --table-warning-hover-bg: #fae287;
    --card-clickable-hover-bg: #f0f5fa;
}

/* SVG ikoonide baasstiilid */
.icon-svg {
    display: inline-block;
    vertical-align: -0.15em;
    fill: currentColor;
    flex-shrink: 0;
}

.icon-pin {
    color: var(--taltech-burgundy);
    margin-right: 6px;
}

.pin-icon {
    display: inline-block;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    vertical-align: middle;
    color: var(--taltech-burgundy);
    margin-right: 5px;
}

/* Päise profiilinupp */
.user-data-btn {
    border-color: rgba(255, 255, 255, 0.4);
    color: #ffffff !important;
    padding: 0.25rem 0.6rem;
    font-size: 0.82rem;
    font-weight: 500;
    border-radius: 4px;
    text-decoration: none !important;
    transition: background-color 0.2s, border-color 0.2s;
}

.user-data-btn:hover,
.user-data-btn:focus {
    background-color: rgba(255, 255, 255, 0.15);
    border-color: #ffffff;
    color: #ffffff !important;
}

/* KPI statistika kaartide võrgustik */
.kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.kpi-card {
    background: #ffffff;
    border: 1px solid var(--taltech-hall-2);
    border-top: 4px solid var(--taltech-sinine);
    border-radius: var(--border-radius);
    padding: 16px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s, box-shadow 0.2s;
}

.kpi-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

.kpi-card.kpi-burgundy {
    border-top-color: var(--taltech-burgundy);
}

.kpi-card.kpi-magenta {
    border-top-color: var(--taltech-magenta);
}

.kpi-card.kpi-blue {
    border-top-color: var(--taltech-hele-sinine);
}

.kpi-label {
    font-size: 0.85rem;
    color: var(--hall-tekst);
    font-weight: 600;
    text-transform: none;
    letter-spacing: normal;
    margin-bottom: 6px;
}

.kpi-value {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--taltech-sinine);
    line-height: 1.2;
}

.kpi-card.kpi-burgundy .kpi-value {
    color: var(--taltech-burgundy);
}

.kpi-subtext {
    font-size: 0.8rem;
    color: var(--hall-tekst);
    margin-top: 6px;
}

/* Leivapuru viimistlus - TalTech stiil ja puhas minimalistlik esitus */
.breadcrumb-nav {
    margin-bottom: 1rem;
}

.breadcrumb-nav .breadcrumb,
.breadcrumb {
    background: transparent !important;
    padding: 0 !important;
    font-size: 0.9rem;
    margin-bottom: 1rem;
    list-style: none;
}

.breadcrumb-nav .breadcrumb-item a,
.breadcrumb-item a {
    color: var(--taltech-sinine);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
    transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

.breadcrumb-nav .breadcrumb-item a:hover,
.breadcrumb-item a:hover {
    color: var(--taltech-burgundy);
    text-decoration-color: var(--taltech-burgundy);
}

.breadcrumb-nav .breadcrumb-item.active,
.breadcrumb-item.active {
    color: var(--hall-tekst);
    text-decoration: none;
    font-weight: 500;
}


/* Bootstrap 5 tabelite integratsioon disainitokenitega */
.table {
    --bs-table-striped-bg: var(--table-stripe-bg);
    --bs-table-hover-bg: var(--table-hover-bg);
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-bg-type: var(--table-stripe-bg);
}

.table-hover > tbody > tr:hover > * {
    --bs-table-bg-state: var(--table-hover-bg);
}

/* Olekurea (lähenev tähtaeg) kaitsmine hoveri all */
.table-hover > tbody > tr.table-warning:hover > *,
.table-hover.dates-table tbody tr.table-warning:hover > *,
.table-hover.dates-table tbody tr.table-warning:hover,
tr.table-warning:hover {
    --bs-table-bg-state: var(--table-warning-hover-bg) !important;
    background-color: var(--table-warning-hover-bg) !important;
}

/* Möödunud tähtajaga rea hover kuupäevade tabelis */
.table-hover.dates-table tbody tr.table-secondary:hover > *,
.table-hover.dates-table tbody tr.table-secondary:hover,
.dates-table tbody tr.table-secondary:hover > *,
.dates-table tbody tr.table-secondary:hover {
    --bs-table-bg-state: var(--table-hover-bg) !important;
    background-color: var(--table-hover-bg) !important;
    opacity: 1 !important;
}

body {
    font-family: Verdana, sans-serif;
    font-weight: normal;
    /* 'normal' vastab 'regular' kaalule */
    background-color: var(--taust-varv);
    margin: 0;
    padding: 0;
    line-height: 1.6;
    color: var(--tekst-varv);
    font-size: 16px;
}

header {
    background-color: var(--taltech-sinine);
    color: white;
    padding: 20px;
    text-align: center;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

main {
    max-width: 900px;
    margin: 25px auto;
    padding: 0 20px;
}

footer {
    background-color: var(--taltech-sinine);
    color: white;
    padding: 15px 20px;
    text-align: center;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    margin-top: 20px;
}

.terminology-link {
    margin-top: 12px;
    font-size: 0.9rem;
    color: var(--hall-tekst);
}

.terminology-link a {
    color: var(--link-varv);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.terminology-link a:hover {
    text-decoration: underline;
}

.meta-info {
    border-top: 1px solid #eee;
    padding-top: 10px;
    margin-top: 15px;
    font-size: 0.9rem;
    color: var(--hall-tekst);
}

.meta-info .info-line {
    display: block;
    margin-bottom: 5px;
}

.meta-info span {
    font-weight: 600;
    color: var(--tekst-varv);
}

.meta-info .favourite-link-wrapper {
    margin-top: 5px;
}

.meta-info .favourite-link-wrapper a,
.meta-info .favourite-link-wrapper span {
    cursor: pointer;
    color: var(--link-varv);
    white-space: nowrap;
    display: inline-block;
}

.meta-info .favourite-link-wrapper a:hover,
.meta-info .favourite-link-wrapper span:hover {
    text-decoration: underline;
}

/*Materjalid*/

.materials-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.materials-section h2,
.materials-section h3,
.materials-section h4 {
    color: var(--taltech-sinine);
    margin-top: 1.5em;
    margin-bottom: 0.8em;
}

.materials-section h2:first-child,
.materials-section h3:first-child,
.materials-section h4:first-child {
    margin-top: 0;
}

.materials-section h2 {
    font-size: 1.6rem;
}

.materials-section h3 {
    font-size: 1.4rem;
}

.materials-section h4 {
    font-size: 1.2rem;
}

.material-card {
    border: 1px solid #ddd;
    border-left: 5px solid var(--taltech-sinine);
    border-radius: var(--border-radius);
    margin-bottom: 15px;
    padding: 15px;
    transition: background-color 0.2s ease-in-out;
    position: relative;
}

.material-card.odd-card,
.material-card.even-card {
    background-color: var(--element-taust);
}

.material-card:hover {
    background-color: var(--element-taust);
}

.material-card.highlight {
    border-left-color: var(--taltech-punane);
}

/* LISATUD: Loetud materjali stiil (vähem silmatorkav) */
.material-card.is-read {
    opacity: 0.65;
    border-left-color: #b0bec5; /* Neutraalne hall */
    background-color: #fcfcfc; /* Väga õrn kontrast */
    transition: opacity 0.3s ease, border-color 0.3s ease, background-color 0.3s ease;
}

.material-card.is-read:hover {
    opacity: 0.95; /* Tagasi nähtavaks hoveril, kui soovitakse sisu uurida */
    background-color: var(--element-taust);
}

.material-card.is-read .material-name {
    color: var(--hall-tekst);
}

/* LISATUD: Roheline linnuke pealkirja või otsingu fragmendi ette */
.material-card.is-read .material-name::before,
.material-card.is-read .search-fragment::before {
    content: "✓ "; /* Unicode checkmark */
    color: #28a745; /* Bootstrap "success" green */
    font-weight: bold;
    font-size: 1.1em;
    padding-right: 5px;
}

.material-name {
    font-weight: bold;
    /* LISATUD: Muudab pealkirja paksuks */
    font-size: 1em;
    line-height: 1.4;
}

/* See reegel tagab, et kirjelduse konteineril endal on piisav vahe teiste elementidega */
.material-description {
    margin-top: 12px;
    font-size: 0.95rem;
    color: var(--hall-tekst);
}

/* See on kõige olulisem reegel. See ütleb:
   "Iga <p> element, mis asub .material-description sees, peab omama ülemist marginaali".
   See loob visuaalse vahe iga lõigu vahele. */
.material-description p {
    margin-top: 1em;
    /* Loob tühja ruumi lõikude vahele */
    margin-bottom: 0;
}

/* See reegel tagab, et esimene lõik ei oleks konteineri ülaservast liiga kaugel. */
.material-description p:first-child {
    margin-top: 0;
}

/* --- LISATUD: Materjali tegevusviidete stiilid --- */
.material-action-links {
    margin-top: 15px;
    padding-top: 10px;
    border-top: 1px solid #eee;
    display: flex;
    flex-direction: column;
    gap: 8px;
    /* Vahe linkide vahel, kui neid on mitu */
}

.action-link a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    /* Vahe ikooni ja teksti vahel */
    text-decoration: none;
    color: var(--link-varv);
    font-weight: 500;
    /* Veidi paksem kui tavatekst */
}

.action-link a:hover {
    text-decoration: underline;
    color: var(--taltech-punane);
}

.action-link svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}


/* Nimekirjade liigse ruumi eemaldamine */

/* 1. Üldine konteineri stiil */
.material-description {
    margin-top: 12px;
    font-size: 0.95rem;
    color: var(--hall-tekst);
    line-height: 1.6;
}

/* 2. KÕIGE OLULISEM REEGEL: Nullime nimekirjade ülemise marginaali */
/* See reegel eemaldab brauseri poolt lisatud tühja ruumi ENNE nimekirja.
   !important on lisatud tagavaraks, et see reegel kirjutaks üle kõik muud
   potentsiaalsed stiilid, mis seda mõjutada võiksid. */
.material-description ul,
.material-description ol {
    margin-top: 0 !important;
    padding-left: 25px;
}

/* 3. Lisame kontrollitud vahe PÄRAST nimekirja, et tagada ühtlane rütm */
.material-description ul,
.material-description ol {
    margin-bottom: 0;
}

/* 4. Nimekirja punktide stiilid */
.material-description li {
    margin-bottom: 0.1em;
}

.material-description li:last-child {
    margin-bottom: 0;
}


.card-header {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 10px;
}

.material-number {
    font-weight: bold;
    color: var(--hall-tekst);
    flex-shrink: 0;
}


.file-info {
    margin-top: 12px;
}

.file-link-line {
    display: flex;
    align-items: baseline;
    /* Joondab teksti paremini, kui toimub murdmine */
    gap: 8px;
}

.file-info a.file-download-link {
    color: var(--link-varv);
    text-decoration: none;
    font-size: 1.05em;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.file-info a.file-download-link:hover {
    text-decoration: underline;
}

.file-icon {
    width: 24px;
    height: 24px;
    vertical-align: middle;
    flex-shrink: 0;
}

.file-size {
    font-size: 0.95em;
    color: var(--hall-tekst);
    white-space: nowrap;
    padding-left: 5px;
}

.related-docs {
    margin-top: 12px;
    font-size: 0.9rem;
    color: var(--hall-tekst);
}

.related-docs ul {
    list-style-type: disc;
    padding-left: 20px;
    margin: 5px 0 0 0;
}

.related-docs li {
    margin-bottom: 3px;
}

.related-docs a {
    color: var(--link-varv);
    text-decoration: none;
}

.related-docs a:hover {
    text-decoration: underline;
}

.related-docs .related-file-size {
    font-size: 1em;
    color: var(--hall-tekst);
    white-space: nowrap;
    padding-left: 5px;
}

.sub-nav ul {
    list-style: none;
    padding: 0;
    margin: 10px 0 15px 0;
    display: block;
    column-count: 1;
    column-gap: 20px;
}

@media (min-width: 768px) {
    .sub-nav ul {
        column-count: 2;
    }
}

@media (min-width: 1200px) {
    .sub-nav ul {
        column-count: 3;
    }
}

.sub-nav li {
    break-inside: avoid;
    page-break-inside: avoid;
    margin-bottom: 8px;
}

.week-nav ul {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.week-nav li a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    border-radius: var(--border-radius);
    background-color: var(--kerge-taust);
    color: var(--taltech-sinine);
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s;
    border: 1px solid transparent;
}

.week-nav li a:hover,
.week-nav li a:focus-visible {
    background-color: var(--tume-taust);
    color: var(--taltech-sinine);
    border-color: var(--taltech-sinine);
}

.week-nav li a.active {
    background-color: var(--taltech-sinine);
    color: #fff;
    font-weight: bold;
}

.sub-nav li a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: var(--border-radius);
    text-decoration: none;
    color: var(--taltech-sinine);
    font-size: 0.95rem;
    font-weight: 500;
    border: 1px solid transparent;
    transition: all 0.2s;
    width: 100%;
    box-sizing: border-box;
}

.sub-nav li a:hover {
    color: var(--taltech-punane);
    background-color: var(--kerge-taust);
    text-decoration: underline;
}

.sub-nav li a:focus-visible {
    outline: 3px solid var(--taltech-sinine);
    outline-offset: 2px;
    background-color: var(--kerge-taust);
    text-decoration: underline;
}

.sub-nav-title {
    font-weight: bold;
    color: var(--taltech-sinine);
    margin-bottom: 5px;
    font-size: 1.1rem;
    display: block;
}

.tooltip {
    position: relative;
    display: inline-block;
    cursor: help;
}

.tooltip .tooltiptext {
    visibility: hidden;
    background-color: #555;
    color: #fff;
    text-align: center;
    padding: 5px 8px;
    border-radius: 4px;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s;
    white-space: nowrap;
    font-size: 0.85rem;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

/* --- PARANDUS: Tudengi ID esiletõstmine märgina (badge) --- */

.student-id-badge {
    display: inline-block;
    /* Tagab, et taust ja padding rakenduvad korrektselt */
    font-weight: bold;
    color: var(--taltech-sinine);
    /* Kasutame brändi tumesinist värvi */
    background-color: var(--kerge-taust);
    /* Helehall taust, mis eristub */
    border: 1px solid #d6e0ea;
    /* Kerge ääris */
    font-size: 0.9rem;
    /* Veidi väiksem kui põhitekst */
    padding: 4px 10px;
    /* Vertikaalne ja horisontaalne polsterdus */
    border-radius: var(--border-radius);
    /* Ümarad nurgad */
    margin-top: 8px;
    /* Eraldab selle pealkirjast */
    margin-bottom: 12px;
    /* Eraldab selle kirjeldusest */
}

@media (max-width: 768px) {
    header h1 {
        font-size: 1.5rem;
    }

    main {
        margin: 15px auto;
        padding: 0 10px;
    }

    .materials-section {
        padding: 15px;
    }

    .materials-section h2 {
        font-size: 1.4rem;
    }

    .materials-section h3 {
        font-size: 1.2rem;
    }

    .materials-section h4 {
        font-size: 1.1rem;
    }

    .material-card {
        padding: 10px;
    }

    .material-name {
        font-size: 1em;
        line-height: 1.3;
        /* LISATUD: Parandab reavahet pikkade pealkirjade puhul mobiilis */
    }

    .student-id-badge {
        /* LISATUD: Tagab märgi korrektse suuruse mobiilis */
        padding: 3px 8px;
        font-size: 0.85rem;
    }

    .file-link-line {
        flex-wrap: wrap;
    }

    .file-size {
        padding-left: 0;
        display: inline;
    }

    .related-docs .related-file-size {
        padding-left: 5px;
    }

    :root {
        --indent-step: 1em;
    }
}

/* Stiil vastuvõtuaegade sektsioonile (kasutab olemasolevat materials-section klassi) */

/* Stiil vastuvõtuaegade kaardile */
.material-card.reception-card {
    padding: 20px;
    border-left-width: 8px;
    background-color: var(--element-taust);
}

.material-card.reception-card:hover {
    background-color: var(--element-taust);
}

/* Vastuvõtuaegade detailide ühtlane vasakule joondamine */
.reception-details {
    display: block;
    /* Muudame flex asemel blockiks, et tagada täielik kontroll */
    font-size: 16px;
    line-height: 1.5;
}

.reception-details .detail-row {
    display: flex;
    flex-wrap: nowrap;
    /* Takistame ridade murdumist */
    align-items: flex-start;
    margin-bottom: 8px;
    /* Ridade vahe */
}

.reception-details .detail-label {
    font-weight: 600;
    color: var(--tekst-varv);
    width: 120px;
    /* Fikseeritud laius siltidele */
    flex-shrink: 0;
    /* Sildid ei kahane */
    margin-right: 10px;
    /* Vahe sildi ja väärtuse vahel */
}

.reception-details .detail-value {
    color: var(--hall-tekst);
    flex-grow: 1;
    /* Väärtused võtavad ülejäänud ruumi */
    word-wrap: break-word;
    /* Pikad tekstid murtakse */
}

/* Mobiilisõbralikkus */
@media (max-width: 576px) {
    .reception-details .detail-row {
        flex-direction: column;
        /* Mobiilis vertikaalne paigutus */
        margin-bottom: 12px;
    }

    .reception-details .detail-label {
        width: auto;
        /* Mobiilis ei fikseeri laiust */
        margin-right: 0;
    }

    .reception-details .detail-value {
        margin-left: 0;
        /* Eemaldame lisavahe */
    }
}

/* Teated */

/* Teadete kaardi täiendused */
.material-card.notification-card {
    padding: 20px;
    border-left-width: 8px;
    background-color: var(--element-taust);
}

.material-card.notification-card:hover {
    background-color: var(--element-taust);
}

/* Teadete sisu vormindamine */
.notification-content {
    font-size: 16px;
    line-height: 1.5;
}

.notification-content .sender {
    font-weight: 600;
    color: var(--tekst-varv);
}

.notification-content .title {
    font-style: italic;
    margin-bottom: 10px;
}

.notification-content .message {
    color: var(--hall-tekst);
}

.notification-content .files {
    margin-top: 10px;
}

.notification-content .files ul {
    list-style-type: disc;
    padding-left: 20px;
}

.notification-content .files li {
    margin-bottom: 5px;
}

.notification-content .files a {
    color: var(--link-varv);
    text-decoration: none;
}

.notification-content .files a:hover {
    text-decoration: underline;
}

/* Mobiilisõbralikkuse tagamine */
@media (max-width: 576px) {
    .material-card.notification-card {
        padding: 15px;
    }

    .notification-content {
        font-size: 14px;
    }
}

/*Sõnapilv*/

/* Sõnapilve konteiner */
.wordcloud-container {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

/* Sõnapilve pealkiri */
.wordcloud-heading {
    color: var(--taltech-sinine);
    font-size: 1.6rem;
    margin-bottom: 1em;
}

/* Sõnapilve kirjeldus */
.wordcloud-description {
    font-size: 0.95rem;
    color: var(--hall-tekst);
    margin-bottom: 15px;
}

/* Sõnapilve stiil */
.wordcloud {
    text-align: center;
    line-height: 1.2;
}

.wordcloud a {
    text-decoration: none;
    color: var(--link-varv);
    margin: 0 5px;
    transition: color 0.2s ease-in-out;
}

.wordcloud a:hover {
    color: var(--taltech-punane);
}

/* Erinevad fondisuurused sõnapilves */
.wordcloud a.size1 {
    font-size: 1em;
}

.wordcloud a.size2 {
    font-size: 1.2em;
}

.wordcloud a.size3 {
    font-size: 1.4em;
}

.wordcloud a.size4 {
    font-size: 1.6em;
}

.wordcloud a.size5 {
    font-size: 1.8em;
}

.wordcloud a.size6 {
    font-size: 2em;
}

.wordcloud a.size7 {
    font-size: 2.2em;
}

.wordcloud a.size8 {
    font-size: 2.4em;
}

.wordcloud a.size9 {
    font-size: 2.6em;
}

.wordcloud a.size10 {
    font-size: 2.8em;
}

/* Mobiilisõbralikkus */
@media (max-width: 576px) {
    .wordcloud-container {
        padding: 15px;
    }

    .wordcloud-heading {
        font-size: 1.4rem;
    }

    .wordcloud a {
        margin: 0 3px;
    }
}

/* Mõisted */
.terms-navigation {
    margin-bottom: 20px;
    padding: 10px;
    background-color: var(--kerge-taust, #f8f9fa);
    border-radius: var(--border-radius, 5px);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* Pagination styling */
.terms-navigation .pagination {
    justify-content: center;
    flex-wrap: wrap;
}

/* Ensure left alignment for term names */
.term-name {
    text-align: left;
}

/* Adjust pagination and letter selection for better wrapping */
.terms-navigation .pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 5px;
}


.terms-navigation .pagination .page-link {
    padding: 5px 10px;
    font-size: 0.9rem;
}

/* Adjust material card for terms */
.terms-list .material-card.term-card {
    margin-bottom: 15px;
}

/* Mobile-friendly adjustments */
@media (max-width: 576px) {
    .terms-navigation {
        padding: 5px;
    }

    .terms-navigation .pagination .page-link {
        padding: 3px 6px;
        font-size: 0.8rem;
    }

    .terms-list .material-card.term-card {
        margin-bottom: 10px;
    }
}

/* Viited */
.references-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.references-section h2 {
    color: var(--taltech-sinine);
    margin-bottom: 20px;
}

.reference-card {
    border: 1px solid #ddd;
    border-left: 5px solid var(--taltech-sinine);
    border-radius: var(--border-radius);
    padding: 15px;
    margin-bottom: 15px;
    background-color: var(--element-taust);
}

/* Lingi stiil */
.reference-link {
    word-break: break-all;
    /* Murra pikad URL-id */
    display: inline;
    /* Muuda inline-iks, et ikoon püsiks teksti järel */
}

/* Ikooni stiil lingi sees */
.reference-link svg {
    vertical-align: middle;
    margin-left: 4px;
    display: inline-block;
    position: relative;
    /* Võimaldab elementi nihutada */
    top: -2px;
    /* Tõstab ikooni 2 pikslit kõrgemale */
}

/* Mobile adjustments */
@media (max-width: 576px) {
    .references-section {
        padding: 15px;
    }

    .reference-card {
        padding: 10px;
    }
}

.reference-item h4 {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--taltech-sinine);
    margin-bottom: 5px;
}

.reference-card h3 {
    font-size: 1.5rem;
    color: var(--taltech-sinine);
    margin-bottom: 10px;
}

.reference-card p {
    font-size: 1rem;
    color: var(--hall-tekst);
    margin-bottom: 15px;
}

/* Sündmused */
.events-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.event-card {
    border: 1px solid #ddd;
    border-left: 5px solid var(--taltech-sinine);
    border-radius: var(--border-radius);
    padding: 15px;
    margin-bottom: 15px;
    background-color: var(--element-taust);
    transition: background-color 0.2s ease-in-out;
}

.event-card.odd-card,
.event-card.even-card {
    background-color: var(--element-taust);
}

.event-card:hover {
    background-color: var(--element-taust);
}

.event-header {
    font-weight: bold;
    color: var(--taltech-sinine);
    margin-bottom: 10px;
    font-size: 1.2rem;
}

.event-details p {
    margin-bottom: 5px;
}

.event-actions {
    margin-top: 10px;
}

.alert-message {
    margin-bottom: 20px;
}


/* Mobile adjustments */
@media (max-width: 576px) {
    .events-section {
        padding: 15px;
    }

    .event-card {
        padding: 10px;
    }

    .event-header {
        font-size: 1.1rem;
    }
}


/* Optional additions for document_moisted.php */
/* Ensure terms list has proper spacing */
.terms-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/* Enhance sorting buttons appearance */
.sorting-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

/* Accessibility improvements for screen readers */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

/* Mobile adjustments for terms list */
@media (max-width: 576px) {
    .terms-list {
        gap: 10px;
    }

    .sorting-buttons {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* Question and answer content styles */
.question-content {
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
}

.answer-content {
    margin-top: 20px;
}

/* --- Täiendused ülesannete lehtede jaoks --- */

/* Üldine konteiner ülesannete sektsioonidele */
.assignments-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.assignments-section h2 {
    color: var(--taltech-sinine);
    margin-bottom: 1.5em;
    font-size: 1.6rem;
}

/* Ülesannete loendi kaart (t_ylesanded_.php) */
.assignment-card {
    border: 1px solid #ddd;
    border-left: 5px solid var(--taltech-sinine);
    border-radius: var(--border-radius);
    padding: 15px;
    margin-bottom: 15px;
    background-color: var(--element-taust);
    transition: background-color 0.2s ease-in-out;
    position: relative;
}

.assignment-card.odd-card,
.assignment-card.even-card {
    background-color: var(--element-taust);
}

.assignment-card:hover {
    background-color: var(--element-taust);
}

.assignment-card.important-assignment {
    border-left-color: var(--taltech-punane);
}

.assignment-card .card-body {
    padding: 0;
}

.assignment-card .assignment-title {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--tekst-varv);
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 8px;
}

.assignment-card .important-icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}


.assignment-details {
    font-size: 0.95rem;
    color: var(--hall-tekst);
    margin-bottom: 1rem;
}

.assignment-details p {
    margin-bottom: 0.3rem;
}

.assignment-details strong {
    color: var(--tekst-varv);
    min-width: 140px;
    display: inline-block;
}

.assignment-deadline-modified {
    color: var(--taltech-punane);
    font-weight: bold;
}

.assignment-status-message {
    font-style: italic;
}

.assignment-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 1rem;
}

.assignment-actions .btn {
    font-size: 0.9rem;
}


/* Ülesande vormi sektsioon (t_uus_ylesanne_, t_muuda_ylesanne_) */
.assignment-form-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.assignment-form-section h2 {
    color: var(--taltech-sinine);
    margin-bottom: 1em;
    font-size: 1.5rem;
}

/* Ülesande spetsifikatsiooni detailid (GRID paigutusega) */
.assignment-specs dl {
    display: grid;
    grid-template-columns: max-content 1fr;
    /* Lipik : Väärtus */
    gap: 5px 10px;
    /* Reavahe : Veergudevahe */
    margin-bottom: 0.5rem;
}

.assignment-specs dt {
    grid-column: 1;
    font-weight: 600;
    color: var(--tekst-varv);
}

.assignment-specs dd {
    grid-column: 2;
    margin-left: 0;
    /* Eemalda vaikemargin */
    color: var(--hall-tekst);
    word-break: break-word;
}


/* Ülesande failide nimekiri (spetsifikatsioonis) - PARANDATUD Joondus */
.assignment-files ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.assignment-files li {
    margin-bottom: 5px;
    display: flex;
    /* Sea flex paigutus */
    align-items: baseline;
    /* Joonda teksti alusjooned */
    flex-wrap: wrap;
    /* Luba murdmist kitsal ekraanil */
    gap: 0px 8px;
    /* Vertikaalne : Horisontaalne vahe elementide vahel */
}

.assignment-files .file-description {
    /* Eemaldatud tühi reegel */
    /* Kirjeldus võib olla pikem, lubame võtta ruumi */
}

.assignment-files a {
    color: var(--link-varv);
    text-decoration: none;
    display: inline-flex;
    align-items: baseline;
    /* Hoia ikoon ja tekst samal joonel */
    gap: 5px;
    /* white-space: nowrap; */
    /* Võib põhjustada ülemäärast laienemist, eemaldame */
}

.assignment-files a:hover {
    text-decoration: underline;
}

.assignment-files .file-icon-small {
    width: 20px;
    height: 20px;
    vertical-align: middle;
    flex-shrink: 0;
    /* Ära luba ikoonil kahaneda */
}

.assignment-files .file-size {
    font-size: 0.9em;
    color: var(--hall-tekst);
    white-space: nowrap;
    /* Suurus jääb kokku */
    flex-shrink: 0;
}

/* Küsimuste plokk */
.question-block {
    border: 1px solid #ddd;
    border-radius: var(--border-radius);
    padding: 15px;
    margin-bottom: 20px;
    background-color: #fdfdfd;
}

.question-block label {
    font-weight: 600;
    color: var(--tekst-varv);
    display: block;
    margin-bottom: 0.5rem;
}

.question-block .required-indicator {
    color: var(--taltech-punane);
    font-weight: bold;
    margin-left: 5px;
}

.question-block .form-control {
    margin-bottom: 0.5rem;
}

/* Varem esitatud failide nimekiri (muutmise lehel) - PARANDATUD Joondus */
.uploaded-files-list {
    list-style: none;
    padding-left: 0;
    margin-top: 10px;
}

.uploaded-files-list li {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    /* Joonda baasjooned */
    flex-wrap: wrap;
    gap: 5px 15px;
    /* Vertikaalne : Horisontaalne vahe */
    padding: 8px 0;
    border-bottom: 1px solid #eee;
    font-size: 0.9rem;
}

.uploaded-files-list li:last-child {
    border-bottom: none;
}

.uploaded-files-list .file-info {
    display: inline-flex;
    /* Sea flexiks, et lapsed reastuks */
    align-items: baseline;
    flex-wrap: nowrap;
    /* Hoia nimi ja suurus koos */
    gap: 8px;
    /* Vahe nime ja suuruse vahel */
    flex-grow: 1;
    /* Luba sellel elemendil kasvada */
    min-width: 150px;
    /* Väldi liigset kokkusurumist */
}

.uploaded-files-list .file-info a {
    color: var(--link-varv);
    text-decoration: none;
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    /* Eemalda siit margin-right, gap hoolitseb vahe eest */
}

.uploaded-files-list .file-info a:hover {
    text-decoration: underline;
}

.uploaded-files-list .file-size {
    font-size: 0.9em;
    color: var(--hall-tekst);
    white-space: nowrap;
    flex-shrink: 0;
    /* Ära lase suurusel kokku minna */
    /* Eemalda siit margin-right/left, gap hoolitseb vahe eest */
}

.uploaded-files-list .file-timestamp {
    font-size: 0.85em;
    color: var(--hall-tekst);
    white-space: nowrap;
    text-align: right;
    flex-shrink: 0;
    /* Ära luba ajal kahaneda */
}

.uploaded-files-list .delete-file-btn {
    padding: 3px 8px;
    font-size: 0.8rem;
    flex-shrink: 0;
    /* Ära luba nupul kahaneda */
}

/* --- TÄIENDUSED: UUS FAILIDE ÜLESLAADIMISE ALA (VARIANT B - LOHISTAMISEGA) --- */

.file-upload-area {
    margin-top: 15px;
}

.drop-zone {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 30px;
    border: 2px dashed #ccc;
    border-radius: var(--border-radius);
    background-color: var(--kerge-taust);
    color: var(--hall-tekst);
    cursor: pointer;
    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

.drop-zone.dragover {
    background-color: #e0eaf3;
    /* Helesinine taust, kui fail on ala kohal */
    border-color: var(--taltech-sinine);
}

.drop-zone .drop-zone-input {
    /* Peidame tegeliku sisendi, kuid hoiame selle ligipääsetavana */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.drop-zone-icon {
    width: 48px;
    height: 48px;
    color: var(--taltech-sinine);
    margin-bottom: 15px;
}

.drop-zone-prompt {
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--tekst-varv);
}

.drop-zone-prompt .prompt-link {
    color: var(--link-varv);
    text-decoration: underline;
}

.drop-zone-filename {
    font-family: monospace;
    font-size: 1rem;
    margin-top: 10px;
    color: var(--taltech-sinine);
    font-weight: bold;
}

.drop-zone-info {
    font-size: 0.85rem;
    margin-top: 10px;
}

/* Üleslaadimise staatuse teavitus */
.upload-status {
    font-size: 0.9rem;
    margin-top: 8px;
    min-height: 24px;
    /* Hoiab ära lehe hüplemise */
    display: flex;
    align-items: center;
    gap: 8px;
}

.upload-status.uploading {
    color: var(--taltech-sinine);
}

.upload-status.success {
    color: #198754;
}

.upload-status.error {
    color: #dc3545;
    font-weight: bold;
}

/* Lihtne CSS laadimisindikaator (spinner) */
.spinner {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 3px solid rgba(0, 0, 0, .1);
    border-radius: 50%;
    border-top-color: var(--taltech-sinine);
    animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* Minu esituse andmed (GRID paigutusega - PARANDATUD Hinde/Seisundi joondus) */
.submission-meta-info {
    background-color: var(--kerge-taust);
    padding: 15px;
    border-radius: var(--border-radius);
    margin-bottom: 25px;
    font-size: 0.95rem;
}

.submission-meta-info h3 {
    font-size: 1.2rem;
    color: var(--taltech-sinine);
    margin-top: 0;
    margin-bottom: 1em;
}

.submission-meta-info dl {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 5px 10px;
    margin-bottom: 0.5rem;
}

.submission-meta-info dt {
    grid-column: 1;
    font-weight: 600;
    color: var(--tekst-varv);
}

.submission-meta-info dd {
    grid-column: 2;
    margin-left: 0;
    word-break: break-word;
    color: var(--hall-tekst);
    /* Vaikimisi tekstivärv */
}

.submission-meta-info dd.assignment-deadline-modified {
    color: var(--taltech-punane);
    font-weight: bold;
}

.submission-meta-info .comment-block {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #ddd;
}

.submission-meta-info .comment-block dl {
    grid-template-columns: 1fr;
    gap: 2px;
}

.submission-meta-info .comment-block dt {
    grid-column: 1;
    font-weight: bold;
}

.submission-meta-info .comment-block dd {
    grid-column: 1;
    padding: 5px;
    background-color: #fff;
    border-radius: 4px;
    border: 1px solid #eee;
    margin-top: 5px;
    color: var(--tekst-varv);
}

.submission-meta-info .grade-info dd {
    font-weight: bold;
    color: var(--taltech-punane);
}


/* Teavitusribad */
.alert-box {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: var(--border-radius);
}

.alert-warning-custom {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Responsiveness Adjustments */
@media (max-width: 768px) {

    .assignments-section h2,
    .assignment-form-section h2 {
        font-size: 1.4rem;
    }

    .uploaded-files-list li {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }

    .uploaded-files-list .file-timestamp {
        text-align: left;
        width: 100%;
    }

    .uploaded-files-list .delete-file-btn {
        align-self: flex-start;
    }

    .uploaded-files-list .file-info {
        min-width: 0;
    }
}

@media (max-width: 576px) {

    /* Kitsam ekraan - Grid muutub 1 veeruliseks */
    .submission-meta-info dl,
    .assignment-specs dl {
        grid-template-columns: 1fr;
        gap: 2px 0;
    }

    .submission-meta-info dt,
    .assignment-specs dt,
    .submission-meta-info dd,
    .assignment-specs dd {
        grid-column: 1;
    }

    .assignment-specs dd {
        margin-bottom: 0.8rem;
    }

    .submission-meta-info dd {
        margin-bottom: 0.5rem;
    }

    .submission-meta-info .comment-block dl {
        margin-bottom: 0;
    }
}

/* Lõputöödest */
.thesis-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.thesis-section h2 {
    color: var(--taltech-sinine);
    margin-bottom: 20px;
}

.thesis-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.thesis-item {
    border: 1px solid #ddd;
    border-left: 5px solid var(--taltech-sinine);
    border-radius: var(--border-radius);
    padding: 15px;
    background-color: var(--element-taust);
    transition: background-color 0.2s ease-in-out;
}

.thesis-item.odd {
    background-color: var(--element-taust);
}

.thesis-item:hover {
    background-color: var(--element-taust);
}

.thesis-item .thesis-header {
    display: flex;
    align-items: baseline;
    gap: 10px;
}

.thesis-item .thesis-number {
    font-weight: bold;
    color: var(--taltech-sinine);
    font-size: 1.2em;
}

.thesis-item .thesis-content {
    flex-grow: 1;
}

.search-form {
    margin-bottom: 20px;
}

.search-form input {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

/* Mobile Adjustments */
@media (max-width: 576px) {
    .thesis-section {
        padding: 15px;
    }

    .thesis-item {
        padding: 10px;
    }

    .thesis-item .thesis-number {
        font-size: 1em;
    }
}

/* Otsing */
.search-form {
    margin-bottom: 30px;
}

.search-form .help-text {
    margin-top: 15px;
    font-size: 0.9rem;
    color: var(--hall-tekst);
}

/* Search category sections */
.search-category {
    margin-bottom: 40px;
}

.search-category h2 {
    font-size: 1.4rem;
    color: var(--taltech-sinine);
    margin-bottom: 15px;
}

/* Results container */
.results {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/* Otsingutulemuste kirjed (result-item) */
.result-item {
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: var(--border-radius);
    background-color: var(--element-taust);
    margin-bottom: 10px;
}

.result-item:last-child {
    margin-bottom: 0;
}

.result-item:hover {
    background-color: var(--element-taust);
}

/* Lisaruum materjalide failide ümber */
.material-card .file-link-line {
    margin: 12px 0 0px 0;
    /* Lisab 12px vaba ruumi faili kohale, säilitab 10px all */
}

/* Styling for important questions */
.result-item.important-question {
    border-left-color: var(--taltech-punane);
}

.result-item .important-icon {
    width: 18px;
    height: 18px;
    vertical-align: middle;
    margin-right: 5px;
}

/* --- Täiendused otsingulehele (otsing2.php) --- */
/* MÄRKUS: Sisukord (TOC) kasutab nüüd globaalset '.sub-nav' stiili,
 mistõttu on varasemad .search-toc spetsiifilised reeglid siit eemaldatud.
 (Javascript leiab DOM elemendi endiselt 'search-toc' nime järgi) */

/* Materjalide kaardi sees oleva fragmendi ja sisu vahe */
.material-card .search-fragment+div {
    margin-top: 8px;
    /* Lisa väike vahe fragmendi ja järgneva sisu vahele */
}

/* Teadete kaardi sees oleva fragmendi ja sisu vahe */
.material-card .search-fragment+strong {
    margin-top: 8px;
    display: inline-block;
    /* Vajalik margin-top rakendumiseks strong elemendile */
}

/* Küsimuste kaardi sees oleva fragmendi ja sisu vahe */
.material-card .search-fragment+a {
    margin-top: 8px;
    display: inline-block;
    /* Vajalik margin-top rakendumiseks */
}

/* Lihtsa result-item sees oleva fragmendi ja sisu vahe */
.result-item .search-fragment+strong,
.result-item .search-fragment+a,
.result-item .search-fragment+div {
    margin-top: 8px;
    /* display: inline-block; Või block, sõltuvalt elemendist */
}

.result-item .search-fragment+div {
    display: block;
    /* Või inline-block kui vaja */
}

.result-item .search-fragment+a {
    display: inline-block;
}

.result-item .search-fragment+strong {
    display: inline-block;
}

/* Visually hidden class (kui seda pole juba Bootstrapist) */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}


/* kkk */

.theme-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.theme-navigation li a {
    text-decoration: none;
    color: var(--link-varv);
    padding: 5px 10px;
    border-radius: 4px;
    background-color: var(--kerge-taust);
}

.theme-navigation li a:hover {
    background-color: #dce4ec;
}

/* viimased küsimused */

.timestamp {
    font-size: 0.85rem;
    color: var(--hall-tekst);
    margin-top: 5px;
    display: block;
}

/* helpdesk */

/* --- Täiendused failile helpdesk_.php --- */

/* Teemade loetelu konteiner */
.themes-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.themes-section h2 {
    color: var(--taltech-sinine);
    margin-bottom: 1.5em;
    font-size: 1.6rem;
    margin-top: 0;
    /* Eemalda ülemine margin esimeselt pealkirjalt */
}

/* Teemade loetelu (list-group stiil) */
.theme-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.theme-list-item {
    border: 1px solid #ddd;
    border-left: 5px solid var(--taltech-sinine);
    border-radius: var(--border-radius);
    margin-bottom: 10px;
    transition: background-color 0.2s ease-in-out;
}

.theme-list-item:last-child {
    margin-bottom: 0;
}

.theme-list-item a {
    display: block;
    padding: 12px 15px;
    text-decoration: none;
    color: var(--tekst-varv);
    font-weight: 500;
}

.theme-list-item a:hover,
.theme-list-item a:focus {
    background-color: var(--kerge-taust);
    color: var(--taltech-sinine);
    text-decoration: none;
}

.theme-list-item a.active {
    background-color: var(--taltech-sinine);
    color: white;
    border-color: var(--taltech-sinine);
    font-weight: bold;
}

/* Nupp uue küsimuse lisamiseks */
.add-question-button-container {
    margin-top: 20px;
    margin-bottom: 20px;
}

/* Küsimuse lisamise vorm */
.add-question-form-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.add-question-form-section h2 {
    color: var(--taltech-sinine);
    margin-bottom: 1.5em;
    font-size: 1.6rem;
    margin-top: 0;
}

/* Vormi nuppude konteiner */
.form-buttons {
    margin-top: 1.5rem;
    display: flex;
    gap: 10px;
    /* Vahe nuppude vahel */
    flex-wrap: wrap;
    /* Luba nuppudel murduda kitsal ekraanil */
}

/* Kohustusliku välja tärn vormis */
.add-question-form-section label .required-indicator {
    color: var(--taltech-punane);
    font-weight: bold;
    margin-left: 3px;
}

/* Info/hoiatus teated */
.info-message {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: var(--border-radius);
    background-color: var(--kerge-taust);
    color: var(--hall-tekst);
    align-items: center;
    gap: 10px;
}

.info-message img {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

/* Stiilid küsimuste loetelule (kasutab kkk.php stiile nagu material-card) */
.questions-list-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.questions-list-section h2 {
    color: var(--taltech-sinine);
    margin-bottom: 1.5em;
    font-size: 1.6rem;
    margin-top: 0;
}

/* Tagasi teemade juurde link */
.back-to-themes-link {
    margin-top: 20px;
    display: inline-block;
    /* Vajalik margin-top jaoks */
}

.search-container {
    margin-bottom: 20px;
    text-align: center;
}

#searchInput {
    width: 100%;
    max-width: 600px;
    padding: 10px;
    font-size: 1rem;
    border: 1px solid #ddd;
    border-radius: var(--border-radius);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: border-color 0.2s ease-in-out;
}

#searchInput:focus {
    border-color: var(--taltech-sinine);
    outline: none;
}

/*nädalate kaupa*/
/* Tegevuskava kaart */
.tegevuskava-card {
    border: 1px solid #ddd;
    border-radius: var(--border-radius);
    padding: 15px;
    margin-bottom: 15px;
    background-color: var(--element-taust);
    transition: background-color 0.2s ease-in-out;
}

.tegevuskava-card:hover {
    background-color: var(--element-taust);
}

/* Kuupäevade tabel */
.kuupaevad-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 15px;
}

.kuupaevad-table th,
.kuupaevad-table td {
    border: 1px solid #ddd;
    padding: 10px;
    text-align: left;
}

.kuupaevad-table th {
    background-color: var(--table-header-bg);
    color: var(--table-header-color);
}

.kuupaevad-table tr:nth-child(even) {
    background-color: var(--table-stripe-bg);
}

.kuupaevad-table tr:nth-child(odd) {
    background-color: var(--element-taust);
}

/* Teadete kaart */
.teade-card {
    border: 1px solid #ddd;
    border-radius: var(--border-radius);
    padding: 15px;
    margin-bottom: 15px;
    background-color: var(--element-taust);
    transition: background-color 0.2s ease-in-out;
}

.teade-card:hover {
    background-color: var(--element-taust);
}

.teade-card.important {
    border-left-color: var(--taltech-punane);
}

/* Filtreerimise sisend */
.filter-input {
    width: 100%;
    padding: 10px;
    margin-bottom: 20px;
    border: 1px solid #ddd;
    border-radius: var(--border-radius);
    font-size: 16px;
}

/* Materjali järjekorranumbri stiil */
.material-number {
    font-weight: bold;
    color: var(--hall-tekst);
    margin-right: 10px;
}

/* Materjalide kaardi stiil */
.materials-card {
    border: 1px solid #ddd;
    border-radius: var(--border-radius);
    padding: 20px;
    margin-bottom: 25px;
    background-color: var(--element-taust);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
}

/* Materjalide alajaotuste stiil */
.sub-section {
    margin-top: 20px;
    padding: 15px;
    background-color: var(--alternate-bg);
    border-radius: var(--border-radius);
}

/* Hover effect for dates table rows */
.kuupaevad-table tr {
    transition: background-color 0.15s ease;
}

.kuupaevad-table tr:hover {
    background-color: var(--table-hover-bg);
}

/* Styling for week selection text */
.nadal-valik-tekst {
    font-weight: bold;
    margin-bottom: 10px;
}

/* Styling for material URLs */
.material-url {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    text-decoration: none;
}

.material-url:hover {
    text-decoration: underline;
}

/* Styling for the materials heading */
.materials-heading {
    font-size: 1.5rem;
    color: var(--taltech-sinine);
    margin-bottom: 1rem;
}

/* Filter options for doc_minu_lugemata_.php */
.filter-options {
    margin-top: 15px;
    padding: 10px;
    background-color: var(--kerge-taust);
    border-radius: var(--border-radius);
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.filter-options label {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.95rem;
    color: var(--tekst-varv);
    cursor: pointer;
}

.filter-options input[type="radio"] {
    margin: 0;
    accent-color: var(--taltech-sinine);
}

/* Ensure accessibility for radio buttons */
.filter-options input[type="radio"]:focus+label {
    outline: 2px solid var(--taltech-sinine);
    outline-offset: 2px;
}

/* Mobile adjustments */
@media (max-width: 576px) {
    .filter-options {
        padding: 8px;
    }

    .filter-options label {
        font-size: 0.9rem;
    }
}

/* Tabelite täiustused aruannete jaoks */
.report-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
    background-color: var(--element-taust);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    border-radius: var(--border-radius);
    overflow: hidden;
    /* Ümarate nurkade jaoks */
}

.report-table th,
.report-table thead th {
    background-color: var(--table-header-bg);
    color: var(--table-header-color);
    padding: 12px 15px;
    text-align: left;
    font-weight: 600;
}

.report-table td {
    padding: 10px 15px;
    border-bottom: 1px solid #ddd;
}

.report-table tr:nth-child(even),
.report-table tbody tr:nth-child(even) {
    background-color: var(--table-stripe-bg);
}

.report-table tr:nth-child(odd),
.report-table tbody tr:nth-child(odd) {
    background-color: var(--element-taust);
}

.report-table tr,
.report-table tbody tr {
    transition: background-color 0.15s ease;
}

.report-table tr:hover,
.report-table tbody tr:hover {
    background-color: var(--table-hover-bg);
}

/* Graafikute konteiner */
.chart-container {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* --- PERIOODI VALIK --- */
.period-picker {
    margin-bottom: 20px;
    padding: 15px;
    background-color: var(--kerge-taust);
    border-radius: var(--border-radius);
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    align-items: center;
    border: 1px solid #dce4ec;
    /* Lisatud õrn raam eristamiseks */
}

/* Tagame, et kuupäevaväljad oleksid mobiilis piisavalt laiad */
.period-picker input[type="date"] {
    min-width: 160px;
    background-color: #fff;
}

/* Mobiilivaate kohandused */
@media (max-width: 768px) {
    .period-picker {
        flex-direction: column;
        align-items: stretch;
        /* Venita nupud ja väljad täislaiusesse */
    }

    .period-picker>div {
        /* Flex ümbrised siltide ja väljade ümber */
        width: 100%;
        justify-content: space-between;
    }

    .period-picker input[type="date"] {
        width: 100% !important;
        /* Mobiilis täislaius */
    }

    .period-picker button {
        width: 100%;
        /* Nupud täislaiusesse */
    }
}

/* Statistika sektsioon */
.stats-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.stats-section .stat-item {
    margin-bottom: 15px;
    font-size: 1rem;
    color: var(--hall-tekst);
}

.stats-section .stat-item strong {
    color: var(--tekst-varv);
    font-weight: 600;
}

.stats-section .highlight-text {
    color: var(--taltech-punane);
    font-weight: bold;
}

/* Mobiilisõbralikkus */
@media (max-width: 576px) {

    .report-table th,
    .report-table td {
        padding: 8px 10px;
        font-size: 0.9rem;
    }

    .chart-container {
        padding: 15px;
    }

    .period-picker {
        flex-direction: column;
        align-items: flex-start;
        padding: 10px;
    }

    .period-picker label,
    .period-picker input,
    .period-picker button {
        width: 100%;
        margin-bottom: 10px;
    }
}

/* --- Täiendused kasutaja andmete lehtede jaoks --- */

/* --- LISATUD STIILID --- */

/* Vormide ja andmete kuvamise sektsioonid */
.content-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.content-section h2 {
    color: var(--taltech-sinine);
    margin-top: 0;
    margin-bottom: 1.5em;
    font-size: 1.6rem;
}

/* Vormi gruppide paigutus */
.form-group {
    margin-bottom: 1rem;
}

/* Tabelid andmete esitamiseks (mitte paigutuseks) */
.data-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1.5rem;
}

.data-table th,
.data-table td {
    padding: 12px 10px;
    text-align: left;
    border-bottom: 1px solid #ddd;
    vertical-align: middle;
}

.data-table th {
    background-color: var(--table-header-bg);
    font-weight: 600;
    color: var(--table-header-color);
}

/* Ridade triibutus (zebra striping) */
.data-table tbody tr:nth-child(odd) {
    background-color: var(--element-taust, #ffffff);
}

.data-table tbody tr:nth-child(even) {
    background-color: var(--table-stripe-bg);
}

.data-table tbody tr {
    transition: background-color 0.15s ease;
}

.data-table tbody tr:hover {
    background-color: var(--table-hover-bg);
}

/* Sorteeritavad päised - kolmetasemeline esiletõstmine (Valdkonna parim tava ja EN 301 549) */
.data-table th.sortable-header,
.report-table th.sortable-header,
.dates-table th.sortable-header {
    cursor: pointer;
    user-select: none;
    position: relative;
    transition: background-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

/* 3. tase: Sorteerimata veergude hõljukolek (:hover) - pehme toon-toonis helendus */
.data-table th.sortable-header:hover,
.report-table th.sortable-header:hover,
.dates-table th.sortable-header:hover {
    background-color: #403572 !important;
    background-image: linear-gradient(rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.08)) !important;
    color: #ffffff !important;
}

.data-table th.sortable-header:focus-visible,
.report-table th.sortable-header:focus-visible,
.dates-table th.sortable-header:focus-visible {
    outline: 2px solid var(--taltech-punane, #e4067e);
    outline-offset: -2px;
}

/* 2. tase: Aktiivselt sorditud päiselahter (veerg ise) - väärikas tumelilla toon ja TalTechi aktsentjoon */
.data-table th[aria-sort="ascending"],
.data-table th[aria-sort="descending"],
.report-table th[aria-sort="ascending"],
.report-table th[aria-sort="descending"],
.dates-table th[aria-sort="ascending"],
.dates-table th[aria-sort="descending"] {
    background-color: #4c3e86 !important;
    background-image: linear-gradient(rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.16)) !important;
    color: #ffffff !important;
    box-shadow: inset 0 -3px 0 var(--taltech-punane, #e4067e) !important;
}

/* 1. tase: Aktiivne nooleindikaator (kontrastne valge vektorkolmnurk / caret) */
.sort-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 8px;
    color: #ffffff !important;
    vertical-align: middle;
}

.sort-arrow-svg {
    display: inline-block;
    vertical-align: -0.05em;
    width: 13px;
    height: 13px;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.4));
}

/* Päise selgitavad lisatekstid ja vihjed tumedal päisel (nt "(klõpsa real avamiseks)") */
.dates-table th small,
.dates-table th .text-muted,
.data-table th small,
.data-table th .text-muted,
.report-table th small,
.report-table th .text-muted,
.taltech-table th small,
.taltech-table th .text-muted,
th.sortable-header small,
th.sortable-header .text-muted,
th .header-hint {
    color: rgba(255, 255, 255, 0.85) !important;
    font-weight: 400;
}

/* Variant B: Mobiilne sorteerimisriba (< 768px) */
.mobile-sort-bar {
    display: none;
    align-items: center;
    gap: 10px;
    margin-top: 1rem;
    margin-bottom: 0.75rem;
    padding: 8px 12px;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: var(--border-radius, 6px);
    box-sizing: border-box;
    width: 100%;
}

.mobile-sort-label {
    display: inline-flex;
    align-items: center;
    font-size: 0.85rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
    margin-bottom: 0;
}

.mobile-sort-select {
    flex: 1;
    font-size: 0.85rem;
    min-height: 38px;
    border-color: #ced4da;
    border-radius: 4px;
}

.mobile-sort-select:focus {
    border-color: var(--taltech-burgundy, #701038);
    box-shadow: 0 0 0 0.2rem rgba(112, 16, 56, 0.15);
}

@media (max-width: 768px) {
    .mobile-sort-bar {
        display: flex;
    }
}

.data-table td .action-icon {
    width: 20px;
    height: 20px;
    vertical-align: middle;
}

/* Mobiilisõbralik tabel */
@media (max-width: 768px) {
    .data-table thead {
        display: none;
    }

    .data-table,
    .data-table tbody,
    .data-table tr,
    .data-table th,
    .data-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }

    .data-table tr,
    .data-table tbody tr,
    .data-table tbody tr:nth-child(even),
    .data-table tbody tr:nth-child(odd) {
        margin-bottom: 15px;
        border: 1px solid #ddd;
        border-radius: var(--border-radius);
        background-color: var(--element-taust) !important;
        overflow: hidden;
        transition: none !important;
    }

    .data-table th,
    .data-table tbody th {
        background-color: var(--table-header-bg) !important;
        color: var(--table-header-color) !important;
        padding: 10px 15px;
        font-weight: 600;
        text-align: left;
        border-bottom: 1px solid #ddd;
    }

    .data-table td {
        text-align: right;
        padding-left: 50%;
        position: relative;
        border-bottom: 1px solid #eee;
        background-color: transparent !important;
    }

    .data-table tr:hover,
    .data-table tbody tr:hover {
        background-color: var(--element-taust) !important;
        cursor: default !important;
    }

    .data-table td:hover {
        background-color: transparent !important;
        cursor: default !important;
    }

    .data-table th:hover,
    .data-table tbody th:hover,
    .data-table tr:hover th,
    .data-table tr:hover > th,
    .data-table tbody tr:hover th,
    .data-table tbody tr:hover > th {
        background-color: var(--table-header-bg) !important;
        color: var(--table-header-color) !important;
        cursor: default !important;
    }

    .data-table td:last-child {
        border-bottom: 0;
    }

    .data-table td::before {
        content: attr(data-label);
        position: absolute;
        left: 10px;
        width: calc(50% - 20px);
        padding-right: 10px;
        text-align: left;
        font-weight: 600;
        color: var(--tekst-varv);
    }
}

/* Infokastid ja selgitused */
.info-card {
    background-color: var(--kerge-taust);
    border: 1px solid #dce4ec;
    border-left: 5px solid var(--taltech-sinine);
    padding: 15px;
    margin-top: 20px;
    border-radius: var(--border-radius);
    font-size: 0.95rem;
}

.info-card p:last-child {
    margin-bottom: 0;
}

/* Nuppude konteiner vormidel */
.form-actions {
    margin-top: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}



/* --- Uued stiilid aine_index.php jaoks --- */

/* Peamine paigutuskonteiner */
.main-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 25px;
    align-items: flex-start;
    max-width: 1600px;
    margin: 25px auto;
    padding: 0 20px;
}

/* Navigatsioonipaneel */
.nav-panel {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 15px;
    position: sticky;
    top: 25px;
    /* Jätab paneeli kerides lehe ülaserva külge */
    z-index: 10;
}

.nav-panel h2,
.nav-panel h3 {
    color: var(--taltech-sinine);
    font-size: 1.2rem;
    margin-top: 0;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #ddd;
}

/* Kiirvalikud */
.quick-links-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 10px;
    margin-bottom: 20px;
}

.quick-link-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 8px 4px;
    background-color: var(--kerge-taust);
    border-radius: var(--border-radius);
    text-decoration: none;
    color: var(--tekst-varv);
    font-size: 0.85rem;
    font-weight: 500;
    transition: background-color 0.2s, transform 0.2s;
    min-height: 85px;
    height: 100%;
}

.quick-link-item:hover {
    background-color: #dce4ec;
    transform: translateY(-3px);
    text-decoration: none;
    color: var(--taltech-sinine);
}

.quick-link-item svg {
    width: 28px;
    height: 28px;
    margin-bottom: 5px;
    color: var(--taltech-sinine);
}

.quick-link-item > svg {
    min-width: 28px;
    min-height: 28px;
    flex-shrink: 0;
    margin-bottom: 4px;
}

.quick-link-item.important {
    background-color: #fff9e6;
    border: 1px solid #ffe8a1;
}

.quick-link-item.important svg {
    color: #8a5d00;
}

.quick-link-meta {
    font-size: 0.72rem;
    line-height: 1.15;
    /* Muudab fondi väiksemaks (baas on 0.85rem) */
    color: var(--hall-tekst);
    /* Muudab teksti veidi heledamaks, et eristuda */
    margin-top: 2px;
    /* Lisab väikese vahe pealkirjaga */
    display: block;
    /* Tagab, et see on eraldi real */
}

/* Menüü akordion */
.nav-accordion .accordion-item {
    border: none;
    background-color: transparent;
}

.nav-accordion .accordion-button {
    font-weight: 600;
    padding: 10px 15px;
    background-color: var(--element-taust);
    color: var(--tekst-varv);
    border-radius: var(--border-radius) !important;
    margin-bottom: 5px;
    border: 1px solid #ddd;
}

.nav-accordion .accordion-button:not(.collapsed) {
    background-color: var(--bs-accordion-active-bg);
    color: var(--taltech-sinine);
    box-shadow: var(--bs-accordion-btn-focus-box-shadow);
}

.nav-accordion .accordion-button:focus {
    box-shadow: var(--bs-accordion-btn-focus-box-shadow);
}

.nav-accordion .accordion-body {
    padding: 0;
}

.nav-accordion .nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.nav-accordion .nav-list li a {
    display: flex;
    /* 1. Muudab lingi flex-konteineriks */
    align-items: center;
    /* 2. Joondab ikooni ja teksti vertikaalselt keskele */
    gap: 0.4em;
    /* 3. Lisab väikese vahe ikooni ja teksti vahele */
    padding: 6px 15px;
    text-decoration: none;
    color: var(--link-varv);
    border-radius: 4px;
    transition: background-color 0.2s ease;
    /* Lisab sujuva ülemineku */
}

.nav-accordion .nav-list li a:hover {
    background-color: #dce4ec;
    /* 4. Kasutab selgelt eristuvat hover-värvi */
    text-decoration: none;
}

.nav-accordion .nav-list li a b {
    color: var(--taltech-sinine);
}


/* Sisu ala */
.content-area {
    min-width: 0;
    width: 100%;
    /* Takistab sisu ülevoolu flex/grid konteinerites */
}

/* Sisu kaardid */
.content-card {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

.content-card h2 {
    color: var(--taltech-sinine);
    margin-top: 0;
    font-size: 1.6rem;
    margin-bottom: 1.5rem;
}

/* Teadete ja küsimuste kaartide stiilid (arendatud edasi olemasolevast) */
.item-card {
    border: 1px solid #ddd;
    border-left: 5px solid var(--taltech-sinine);
    border-radius: var(--border-radius);
    margin-bottom: 15px;
    padding: 15px;
    transition: background-color 0.2s ease-in-out;
}

.item-card:hover {
    background-color: var(--element-taust);
}

.item-card.highlight {
    border-left-color: var(--taltech-punane);
    background-color: #fff9f9;
}

.item-card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.item-card-header .item-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.item-card-header .item-title {
    font-weight: 600;
    color: var(--tekst-varv);
    font-size: 1.1em;
}

.item-card-header .item-sender {
    font-size: 0.9em;
    color: var(--hall-tekst);
}

.item-card-content {
    padding-left: 30px;
    /* Taane sisu jaoks */
    color: var(--hall-tekst);
}

.item-card-content ul {
    margin-top: 10px;
    padding-left: 20px;
}

.item-card a {
    color: var(--link-varv);
    text-decoration: none;
}

.item-card a:hover {
    text-decoration: underline;
}


/* LISATUD: Stiilid oluliste kuupäevade tabeli ja lingi jaoks */
.dates-table .date-description {
    word-break: break-word;
}

.all-dates-link {
    display: block;
    text-align: right;
    margin-top: 1rem;
    font-size: 0.9rem;
}

/* Mobiilisõbralikkus */
@media (max-width: 1200px) {
    .main-layout {
        grid-template-columns: 240px 1fr;
    }
}

@media (max-width: 992px) {
    .main-layout {
        display: block;
        /* Eemaldab grid-paigutuse ja sunnib elemendid üksteise alla */
    }

    .nav-panel {
        margin-bottom: 25px;
        /* Säilitame menüü ja sisu vahelise tühimiku */
        position: static;
    }
}

/* --- index.php --- */

/* Lõputööde teemade bänner avalehel */
.thesis-banner-section {
    border: 2px solid var(--taltech-burgundy);
    border-radius: 8px;
    background-color: #fdfafb;
}

.thesis-banner-icon {
    background-color: var(--taltech-burgundy);
    color: #fff;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 70px;
    height: 70px;
    border-radius: 50%;
}

.thesis-banner-btn {
    background-color: var(--taltech-sinine);
    color: #fff;
    padding: 0.5rem 1.5rem;
    border-radius: 4px;
    transition: background-color 0.2s;
}

.thesis-banner-btn:hover {
    background-color: var(--taltech-tumesinine);
    color: #fff;
}

/* Avalehe paigutuse ruudustik (grid) */
.main-grid {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

@media (min-width: 992px) {
    .main-grid {
        display: grid;
        grid-template-columns: 7fr 5fr;
        gap: 1.5rem;
        align-items: start;
    }

    .grid-ained {
        grid-column: 1;
        grid-row: 1;
    }

    .grid-teated {
        grid-column: 1;
        grid-row: 2 / span 3;
    }

    .grid-toimingud {
        grid-column: 2;
        grid-row: 1;
    }

    .grid-loputood {
        grid-column: 2;
        grid-row: 2;
    }

    .grid-lingid {
        grid-column: 2;
        grid-row: 3;
    }

    /* Eemaldame elementide alumise margini, et gridi gap hoolitseks vahede eest */
    .main-grid > section {
        margin-bottom: 0 !important;
    }
}

/* Hero/Welcome sektsioon */
.hero-section {
    text-align: center;
    padding: 3rem 1rem;
    background-color: var(--kerge-taust);
    border-radius: var(--border-radius);
    margin-bottom: 25px;
}

.hero-section h1 {
    color: var(--taltech-sinine);
    font-weight: bold;
}

/* Kiirvalikute kaardid */
.quick-access-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 25px;
}

.access-card {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.08);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    display: flex;
    flex-direction: column;
}

.access-card:hover {
    transform: none;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.08);
}

.access-card-header {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #eee;
}

.access-card-header h2 {
    color: var(--taltech-sinine);
    font-size: 1.3rem;
    margin: 0;
}

.access-card-body {
    padding: 1.25rem;
    flex-grow: 1;
}

.access-card-body .list-group-item {
    border: none;
    padding: 0.75rem 0;
}

.access-card-body .list-group-item a {
    text-decoration: none;
    color: var(--link-varv);
    font-weight: 500;
}

.access-card-body .list-group-item a:hover {
    text-decoration: underline;
    color: var(--taltech-punane);
}

.external-link-icon {
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    margin-left: 0.3rem;
    opacity: 0.7;
}

/* Üldiste teadete sektsioon */
.announcements-section {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.08);
    padding: 20px;
    margin-bottom: 25px;
}

.announcements-section h2 {
    color: var(--taltech-sinine);
    font-size: 1.6rem;
    margin-top: 0;
}

.announcement-card {
    border-radius: var(--border-radius);
    margin-bottom: 15px;
    padding: 15px;
}

.announcement-card.even-card,
.announcement-card.odd-card {
    background-color: var(--element-taust);
}

/* Lisalinkide akordion */
.more-links-accordion {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    padding: 20px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.08);
}

.more-links-accordion .accordion-button {
    font-weight: 600;
    color: var(--tekst-varv);
}

.more-links-accordion .accordion-button:not(.collapsed) {
    color: var(--taltech-sinine);
    background-color: var(--kerge-taust);
}

.more-links-accordion .list-group-item {
    padding: .5rem 1rem;
}

.more-links-accordion a {
    text-decoration: none;
}

.more-links-accordion a:hover {
    text-decoration: underline;
}



/* --- LISATUD STIILID FUNKTSIOONIDELE naita_kp, naita_kp_nadal, naita_tk --- */

/* Konteiner kuupäevade ja sündmuste kaartidele */
.info-card-container {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Üldine stiil kuupäeva/sündmuse kaardile */
.deadline-card {
    display: flex;
    flex-wrap: nowrap;
    gap: 1.5rem;
    padding: 1rem;
    border: 1px solid #ddd;
    border-left-width: 5px;
    border-left-color: var(--taltech-sinine);
    border-radius: var(--border-radius);
    background-color: var(--element-taust);
    transition: background-color 0.2s ease;
    align-items: center;
}

.deadline-card:hover {
    background-color: var(--element-taust);
}

/* Kaart tänase või möödunud tähtaja jaoks */
.deadline-card.is-urgent {
    border-left-color: var(--taltech-punane);
    background-color: #fff9f9;
}

.deadline-card.is-urgent:hover {
    background-color: #fff9f9;
}

/* "Päevi jäänud" plokk */
.deadline-countdown {
    flex-shrink: 0;
    text-align: center;
    width: 80px;
}

.deadline-countdown .days-left {
    font-size: 2rem;
    font-weight: bold;
    line-height: 1;
    color: var(--taltech-sinine);
    display: block;
}

.deadline-card.is-urgent .deadline-countdown .days-left {
    color: var(--taltech-punane);
}

.deadline-countdown .days-text {
    font-size: 0.8rem;
    color: var(--hall-tekst);
    text-transform: none;
}

/* Tähtaja info plokk (kuupäev ja kirjeldus) */
.deadline-info {
    flex-grow: 1;
    min-width: 0;
    /* Väldib ülevoolu flex konteineris */
}

.deadline-info .deadline-date {
    font-weight: 600;
    color: var(--tekst-varv);
    margin-bottom: 0.25rem;
    display: block;
}

.deadline-info .deadline-description {
    color: var(--hall-tekst);
    word-wrap: break-word;
}

.deadline-info .deadline-description p:last-child {
    margin-bottom: 0;
}

/* Stiilid naita_tk funktsiooni jaoks (Bootstrap alertide täiendus) */
.event-alert {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}

.event-alert .alert-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    margin-top: 0.1rem;
}

.event-alert .alert-content {
    flex-grow: 1;
}

.event-alert .alert-heading {
    margin-bottom: 0.5rem;
}

.event-alert ul {
    padding-left: 1.2rem;
    margin-top: 0.5rem;
    margin-bottom: 0;
}

.event-alert ul li {
    margin-bottom: 0.5rem;
}

.event-alert .action-link-container {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/* Mobiilisõbralikkus lisatud stiilidele */
@media (max-width: 576px) {
    .deadline-card {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .deadline-countdown {
        display: flex;
        align-items: baseline;
        gap: 0.5rem;
        text-align: left;
        width: auto;
        padding: 0.5rem;
        background-color: var(--kerge-taust);
        border-radius: var(--border-radius);
        margin-bottom: 0.5rem;
    }

    .deadline-countdown .days-left {
        font-size: 1.5rem;
    }
}

/* --- LISATUD PARANDUS: Tagame, et nupuks stiilitud lingid akordionis on valge tekstiga --- */

/* 
 * See reegel on spetsiifilisem kui '.accordion-body a' ja tagab,
 * et .btn-primary klassiga 'a' elemendid säilitavad korrektse valge teksti,
 * mida Bootstrap vaikimisi eeldab.
 */
.accordion-body a.btn.btn-primary {
    color: #fff;
    /* Jõustame valge teksti värvi */
}

.accordion-body a.btn.btn-primary:hover,
.accordion-body a.btn.btn-primary:focus {
    color: #fff;
    /* Säilitame valge värvi ka hiirega peal olles või fookuses olles */
}


/* --- Stiilid helpdesk.php markdown lingi kasti jaoks --- */

.info-card {
    background-color: var(--kerge-taust);
    border: 1px solid #dce4ec;
    border-left: 5px solid var(--taltech-sinine);
    padding: 15px 20px;
    border-radius: var(--border-radius);
    font-size: 0.95rem;
}

.copy-link-container {
    display: flex;
    align-items: center;
    gap: 15px;
    /* Vahe lingi ja nupu vahel */
    flex-wrap: wrap;
    /* Lubab murdumist kitsal ekraanil */
}

.copy-link-container a {
    flex-grow: 1;
    /* Link võtab enamuse ruumist */
    word-break: break-all;
    /* Murrab pika URL-i vajadusel */
    color: var(--link-varv);
    text-decoration: none;
    font-family: monospace;
    /* Muudab URL-i paremini loetavaks */
    font-size: 0.9rem;
    background-color: #fff;
    padding: 5px 8px;
    border-radius: 4px;
    border: 1px solid #ccc;
}

.copy-link-container a:hover {
    text-decoration: underline;
}

.copy-link-container button {
    flex-shrink: 0;
    /* Nupp ei kahane */
}

/* --- LISATUD: Stiilid sisselogimist nõudvate linkide jaoks --- */

/* Stiil Kiirvaliku nupule */
.quick-link-item.requires-login {
    opacity: 0.8;
    /* Tuhmistame vähem, et see ei näeks välja deaktiveeritud */
    position: relative;
    background-color: #e9ecef;
    cursor: pointer;
    /* MUUDETUD: not-allowed -> pointer */
    transition: transform 0.2s, box-shadow 0.2s;
    padding-left: 30px;
}

/* PARANDUS: Tagab, et 'tähtis' nupp on pehmelt esile tõstetud ka siis, kui see nõuab sisselogimist */
.quick-link-item.important.requires-login {
    background-color: #fff9e6;
    border: 1px solid #ffe8a1;
}

/* MUUDETUD: Lisame tagasi interaktiivse hover-efekti */
.quick-link-item.requires-login:hover {
    transform: translateY(-3px);
    /* Lisame kerge tõusu efekti */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    /* Lisame varju, et näidata aktiivsust */
}

/* Ülekattega tabaluku ikoon Kiirvaliku nupu jaoks */
.login-overlay-icon {
    position: absolute;
    top: 5px;
    left: 5px;
    width: 22px;
    height: 22px;
    background-color: rgba(255, 255, 255, 0.85);
    /* Poolläbipaistev taust, et ikoon eristuks */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.login-overlay-icon svg {
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    flex-shrink: 0;
    color: var(--hall-tekst);
}

/* --- LISATUD: Töökindel Flexbox lahendus ikooni ja teksti joondamiseks --- */

/* Rakendame stiili otse lingile (<a>), millel on klass .requires-login */
a.requires-login {
    /* See on võti nr 1: Muudame lingi flex-konteineriks.
       'inline-flex' tagab, et link ise käitub endiselt nagu reasisene element. */
    display: inline-flex;

    /* See on võti nr 2: Joondame kõik elemendi sees olevad asjad (ikoon ja tekst)
       vertikaalselt keskele teineteise suhtes. */
    align-items: center;

    /* See on võti nr 3: Loome ilusa ja dünaamilise vahe ikooni ja teksti vahele. */
    gap: 0.4em;
}

/* --- LISATUD: Spetsiifiline parandus menüüs olevate ikoonide joondamiseks --- */

/* See reegel on piisavalt spetsiifiline, et kirjutada üle vaikimisi 'display: block'
   ainult nende linkide puhul, millel on ikoon. */
.nav-accordion .nav-list li a.requires-login {
    /* Muudame lingi flex-konteineriks. Kuna link on juba plokktaseme element,
       kasutame 'display: flex', mis säilitab selle käitumise. */
    display: flex;

    /* Joondame ikooni ja teksti vertikaalselt keskele. */
    align-items: center;

    /* Loome vahe ikooni ja teksti vahele. */
    gap: 0.4em;
}


/* --- Kalendri stiilid (aine_kalender.php) --- */
/* --- TÄIENDATUD VASTAVALT LIGIPÄÄSETAVUSE NÕUETELE --- */

.calendar-container {
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin: 25px auto;
    max-width: 1200px;
}

.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid var(--taltech-sinine);
}

.calendar-title {
    margin: 0;
    font-size: 1.8rem;
    color: var(--taltech-sinine);
    font-weight: 600;
    text-align: center;
    flex-grow: 1;
}

.calendar-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}

.view-switcher.btn-group,
.filter-switcher.btn-group {
    flex-shrink: 0;
}

.calendar-table {
    table-layout: fixed;
    border-color: #ddd;
}

.calendar-table th {
    text-align: center;
    font-weight: 600;
    background-color: var(--kerge-taust);
    border-bottom: 2px solid #ddd;
    padding: 10px 5px;
}

.calendar-day {
    height: 140px;
    padding: 8px;
    vertical-align: top;
    position: relative;
    overflow: hidden;
    transition: background-color 0.2s;
}

.calendar-day:hover {
    background-color: var(--kerge-taust);
}

.calendar-day-empty {
    background-color: #f9f9f9;
    border-color: #eee;
}

.day-number {
    font-weight: 600;
    color: var(--hall-tekst);
    font-size: 0.9em;
    position: absolute;
    top: 5px;
    right: 8px;
}

/* Tänase päeva esiletõstmine (parandatud servade kuvamine) */
.calendar-day.today,
.week-day-row.today {
    background-color: #fff9e6;
    /* Kasutame border asemel inset varju, et raam ei jääks konteineri serva taha peitu */
    box-shadow: inset 0 0 0 2px #ffc107;
    border: none;
    position: relative;
    z-index: 1;
}

.calendar-day.today .day-number {
    font-weight: bold;
    color: #856404;
    background-color: #ffc107;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.events-list {
    margin-top: 25px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.event-item {
    font-size: 0.85em;
    padding: 4px 8px;
    border-radius: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background-color 0.2s, transform 0.2s;
}

.event-item:hover {
    transform: scale(1.02);
    z-index: 10;
    position: relative;
}

/*
 * Sündmuste värvid on valitud vastavalt TalTech stiiliraamatule ja digiligipääsetavuse standardile EN 301 549 (WCAG 2.1 AA).
 * Värvidele, mis ei taga piisavat kontrasti valge tekstiga (#FFFFFF), on loetavuse tagamiseks määratud must tekstivärv (#000000).
*/

/* Perioodi algus: TT Tumesinine (#342b60). Kontrastsus valge tekstiga: 9.87:1 (Suurepärane) */
.event-item.event-multi-start {
    background-color: #342b60;
    color: #FFFFFF;
}

.event-item.event-multi-start:hover {
    background-color: #493f7d;
}

/* Perioodi lõpp: TT Kirsipunane (#aa1352). Kontrastsus valge tekstiga: 6.55:1 (Väga hea) */
.event-item.event-multi-end {
    background-color: #aa1352;
    color: #FFFFFF;
}

.event-item.event-multi-end:hover {
    background-color: #c02a68;
}

/* Perioodi vahepäevad: TT Helesinine (#4dbed2). Kontrastsus musta tekstiga: 7.29:1 (Suurepärane) */
.event-item.event-multi {
    background-color: #4dbed2;
    color: #000000;
    /* LIGIPÄÄSETAVUS: Nõutud must tekst */
    border-color: #3aa8bb;
}

.event-item.event-multi:hover {
    background-color: #63c8d8;
}

/* Üksik sündmus: TT Roheline (#62bb46). Kontrastsus musta tekstiga: 6.48:1 (Väga hea) */
.event-item.event-single {
    background-color: #62bb46;
    color: #000000;
    /* LIGIPÄÄSETAVUS: Nõutud must tekst */
    border-color: #53a03b;
}

.event-item.event-single:hover {
    background-color: #72c955;
}


.event-item:focus {
    outline: none;
    border-color: var(--taltech-punane);
    box-shadow: 0 0 0 2px rgba(228, 6, 126, 0.4);
}

.event-date-in-modal {
    color: var(--hall-tekst);
    font-size: 0.9rem;
    font-weight: bold;
    border-bottom: 1px solid #eee;
    padding-bottom: 0.5rem;
}

.event-description-in-modal {
    margin-top: 1rem;
    line-height: 1.6;
}

.event-description-in-modal a {
    font-weight: 500;
}

.week-view-container {
    display: flex;
    flex-direction: column;
}

.week-day-row {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 20px;
    border-bottom: 1px solid #eee;
    padding: 15px;
    transition: background-color 0.2s;
}

.week-day-row:last-child {
    border-bottom: none;
}

.week-day-row:hover {
    background-color: #f9f9f9;
}

.week-day-date {
    font-size: 1.1rem;
    color: var(--tekst-varv);
}

.week-day-date span {
    display: block;
    font-size: 0.9rem;
    color: var(--hall-tekst);
}

.week-day-events {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.week-day-events .event-item {
    white-space: normal;
    overflow: visible;
}

.week-day-events .no-events {
    color: var(--hall-tekst);
    font-style: italic;
    padding: 4px 8px;
}

@media (max-width: 992px) {
    .calendar-container {
        padding: 15px;
    }

    .calendar-title {
        font-size: 1.5rem;
        order: -1;
        flex-basis: 100%;
        margin-bottom: 10px;
    }

    .calendar-day {
        height: 120px;
        padding: 5px;
    }

    .event-item {
        font-size: 0.8em;
    }

    .calendar-header {
        justify-content: center;
    }
}

@media (max-width: 768px) {
    .calendar-table {
        font-size: 0.9em;
    }

    .calendar-day {
        height: auto;
        min-height: 80px;
    }

    .day-number {
        position: static;
        float: right;
    }

    .events-list {
        margin-top: 5px;
        clear: both;
    }

    .week-day-row {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .week-day-date {
        border-bottom: 1px dashed #ddd;
        padding-bottom: 10px;
    }
}

.rating-selection-area {
    margin-bottom: 0.5rem;
    /* Või muu sobiv väärtus, nt 10px */
}

/* --- TÄIENDUSED AUTOMAATSEKS FAILILAADIMISEKS (t_muuda_ylesanne.php) --- */

.file-upload-wrapper {
    position: relative;
    display: inline-block;
    width: 100%;
    cursor: pointer;
}

/* Peidame tegeliku faili sisendvälja, aga hoiame selle ligipääsetavana */
.file-upload-wrapper .auto-upload-input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 10;
}

/* Stiilime visuaalse osa, mis näeb välja nagu sisendväli */
.file-upload-display {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: var(--border-radius);
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.file-upload-wrapper:hover .file-upload-display {
    border-color: #86b7fe;
}

/* Stiilime "Vali fail" nupu osa */
.file-upload-button {
    padding: 0.375rem 0.75rem;
    background-color: #e9ecef;
    border-right: 1px solid #ced4da;
    color: var(--tekst-varv);
    white-space: nowrap;
}

/* Stiilime failinime kuvamise ala */
.file-upload-filename {
    padding: 0.375rem 0.75rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--hall-tekst);
    flex-grow: 1;
}


.file-upload-display .file-upload-button {
    background-color: var(--taltech-sinine);
    /* Kasutame primaarvärvi */
    color: #fff;
    /* Valge tekst tagab kontrastsuse */
    border-right: 1px solid var(--taltech-sinine);
    font-weight: 500;
    transition: background-color 0.2s ease;
}

.file-upload-wrapper:hover .file-upload-display .file-upload-button {
    background-color: #2a234f;
    /* Veidi tumedam sinine hover-efekti jaoks */
}

/* --- LISATUD LIGIPÄÄSETAVUSE TAGAMISEKS --- */

/*
 * Klass elemendi visuaalseks peitmiseks, jättes selle alles ekraanilugejate jaoks.
 * See on vajalik standardi EN 301 549 järgimiseks olukordades, kus visuaalne
 * disain ei näe ette silti (nt otsingukast), kuid funktsionaalsuse mõistmiseks
 * on see ekraanilugeja kasutajale hädavajalik.
*/
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Lisame väikese paranduse päise otsinguvormile, et see reastuks korrektselt */
.search-form-header .input-group {
    min-width: 200px;
    /* Väldib liigset kokkusurumist kitsastes vaadetes */
}

/* --- LISATUD STIILID GLOBAALSE PÄISE JA JALUSE JAOKS --- */

/* Päise üldine konteiner */
.site-header {
    background-color: var(--taltech-sinine, #342b60);
    /* TalTech sinine */
    color: white;
    padding: 1rem 1.5rem;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.header-content-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.header-brand {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-width: 200px;
    flex: 1 1 40%;
    /* Lubab kasvada ja kahaneda */
}

.logo-image {
    height: 42px;
    width: 42px;
}

.header-title h1 {
    color: white;
    text-align: left;
    line-height: 1.2;
}

.header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1.5rem;
    flex: 1 1 50%;
    /* Lubab kasvada ja kahaneda */
    flex-wrap: wrap;
}

.user-info-login-wrapper {
    white-space: nowrap;
}

.user-info .user-data-link {
    color: white;
    text-decoration: none;
    margin-left: 0.5rem;
}

.user-info .user-data-link:hover {
    text-decoration: underline;
}

.login-link a {
    text-decoration: none;
}

.search-form-header .input-group {
    min-width: 220px;
    max-width: 350px;
}

/* UUENDATUD JA ROBUSTSEM REEGEL */
/*
 * Kasutame ".btn.btn-search", et reegel rakenduks ainult elemendile, millel on MÕLEMAD klassid.
 * Lisame selektorisse ka ".site-header", et muuta reegel veelgi spetsiifilisemaks ja tagada,
 * et see kirjutaks üle kõik Bootstrap'i vaikeseaded just päise sees oleva nupu jaoks.
*/
/*
 * See reegel kehtib nüüd igale nupule, millel on klass .btn-search,
 * olenemata sellest, kas see asub päises või lehe sisus.
*/
.btn.btn-search {
    background-color: var(--taltech-punane, #e4067e);
    color: white;
    border-color: var(--taltech-punane, #e4067e);
    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.btn.btn-search:hover,
.btn.btn-search:focus {
    background-color: #c0056a;
    /* Tumedam magenta */
    color: white;
    border-color: #c0056a;
}

/* Globaalne jalus */
.site-footer {
    background-color: var(--taltech-sinine, #342b60);
    color: white;
    padding: 1rem 1.5rem;
    text-align: center;
    margin-top: 2rem;
}

.site-footer p {
    margin-bottom: 0;
}

/* Mobiilisõbralikkuse parandused */
@media (max-width: 992px) {
    .header-content-wrapper {
        flex-direction: column;
        align-items: center;
        /* Keskele joondamine */
    }

    .header-brand {
        flex-direction: column;
        justify-content: center;
        text-align: center;
        gap: 0.5rem;
    }

    .header-title h1 {
        text-align: center;
    }

    .header-actions {
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 576px) {
    .site-header {
        padding: 0.75rem 1rem;
    }

    .header-actions {
        flex-direction: column;
        align-items: center;
        gap: 0.75rem;
    }

    .search-form-header .input-group {
        width: 100%;
    }
}

/* --- LISATUD STIILID MITTE-SISSELOGITAVA LEHE PÄISE JAOKS --- */

/*
 * Kuna selles päise versioonis on ainult üks põhielement (bränding),
 * siis tagame, et see joondub korrektselt vasakule ega veni üleliia.
*/
.site-header.header-logimata .header-content-wrapper {
    justify-content: space-between;
    align-items: center;
}

.site-header.header-logimata .header-brand {
    flex: 0 1 auto;
}

/* --- LISATUD: KÜLGMENÜÜ ISESEISEV KERIMINE --- */

/*
 * Muudame .nav-panel flex-konteineriks ja piirame selle maksimaalse kõrguse.
 * Kõrgus arvutatakse dünaamiliselt vastavalt ekraani kõrgusele (100vh),
 * jättes 50px puhvrit üles ja alla.
*/
.nav-panel {
    display: flex;
    flex-direction: column;
    /* max-height on oluline, et overflow: auto hakkaks tööle */
    max-height: calc(100vh - 50px);
}

/* 
 * Anname menüü sisule (.nav-panel-content) käsu võtta kogu ülejäänud vaba ruum 
 * .nav-panel konteineris ja lisame vajadusel kerimisriba.
 * Kasutame klassi, et see töötaks kõigi menüüdega (avaleht, materjalid, jne).
*/
.nav-panel-content {
    overflow-y: auto;
    /* Lisab vertikaalse kerimisriba AINULT VAJADUSEL */
    flex-grow: 1;
    /* Laseb elemendil täita kogu saadaolev vaba ruum */
    min-height: 0;
    /* Oluline flexboxi parandus, et vältida sisu ülevoolu */
    padding-bottom: 20px;
    /* Lisame veidi ruumi alla, et sisu ei lõppeks järsku */
}

/* --- LISATUD: MINU LEMMIKUTE LINGI KOMPONENT --- */

.favorites-link-container {
    margin-bottom: 1.5rem;
    /* Eraldab lingi muust sisust */
}

a.favorites-link {
    display: inline-flex;
    /* Tagab ikooni ja teksti korrektse joondumise */
    align-items: center;
    gap: 0.5rem;
    /* Vahe ikooni ja teksti vahel */
    padding: 8px 15px; /* Sama mis kataloogide linkidel! */
    background-color: var(--kerge-taust);
    border: none; /* Ühtlustatud disain ilma ääriseta */
    border-radius: var(--border-radius);
    color: #004d99; /* Tumedam sinine tugevamaks kontrastiks */
    text-decoration: none;
    font-weight: 500;
    font-size: 0.95rem; /* Ühtlustatud suurus */
    transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
}

a.favorites-link:hover {
    background-color: #dce4ec;
    text-decoration: underline; /* Selgem affordance */
    color: var(--taltech-punane);
}

a.favorites-link:focus-visible {
    outline: 3px solid var(--taltech-sinine);
    outline-offset: 2px;
    background-color: #dce4ec;
    text-decoration: underline;
}

a.favorites-link svg {
    color: currentColor; /* Pärib värvi lingi tekstilt, sünkroonis hover efektiga! */
}

/* --- TÄIENDUSED TAGASISIDE TEADETELE (ALERTS) --- */

/* Muudame teadete pealkirjad veidi kompaktsemaks */
.alert .alert-heading {
    font-size: 1.25rem;
    /* Vaikimisi h4 suurus, aga saame vajadusel muuta */
    margin-bottom: 0.5rem;
    color: inherit;
    /* Pärib värvi alert-success, alert-danger jne klassilt */
}

/* Tagame, et ikoon ja tekst oleksid alati kenasti joondatud */
.alert svg.flex-shrink-0 {
    margin-top: 0.15rem;
}

/* --- LISATUD: BRÄNDIPÕHISED KOMPONENDID (NUPUD JA TEATED) --- */

/* 1. Brändikohane esmane nupp (kehtib nii <button> kui <a> siltidele) */
/* ================================================================= */
.btn.btn-taltech-primary {
    background-color: var(--taltech-punane, #e4067e);
    border-color: var(--taltech-punane, #e4067e);
    color: #fff;
    font-weight: 500;
    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

.btn.btn-taltech-primary:hover,
.btn.btn-taltech-primary:focus {
    background-color: #c0056a;
    /* Tumedam magenta hover-efekti jaoks */
    border-color: #b50463;
    color: #fff;
}

/* Ligipääsetavuse märkus:
 * Värvikontrast TT Magenta (#e4067e) ja valge (#FFFFFF) vahel on 4.53:1.
 * See vastab WCAG AA nõudele (min 4.5:1) tavalise teksti jaoks, tagades hea loetavuse.
*/


/* 2. Brändikohane eduka tegevuse teade */
/* ===================================== */
.alert.alert-taltech-success {
    background-color: var(--kerge-taust, #eef2f7);
    color: var(--tekst-varv, #333);
    border: 1px solid #d6e0ea;
    border-left-width: 5px;
    border-left-color: var(--taltech-sinine, #342b60);
    align-items: flex-start;
}

.alert.alert-taltech-success .alert-heading {
    color: var(--taltech-sinine, #342b60);
    font-size: 1.2rem;
}

.alert.alert-taltech-success svg {
    color: var(--taltech-sinine, #342b60);
    margin-top: 0.15rem;
}

.alert.alert-taltech-success hr {
    border-top-color: rgba(0, 0, 0, 0.1);
}

.alert.alert-taltech-success p {
    color: var(--hall-tekst, #555);
}

.alert.alert-taltech-success p.mb-0 {
    color: var(--tekst-varv, #333);
}


/* --- UUS LISATUD STIIL --- */
/* 3. Brändikohane ohu/veateade */
/* ============================ */
.alert.alert-taltech-danger {
    background-color: #f8d7da;
    /* Bootstrap'i standardne helepunane */
    color: #58151c;
    /* Bootstrap'i standardne tumepunane tekst */
    border: 1px solid #f5c2c7;
    border-left-width: 5px;
    border-left-color: var(--taltech-punane, #e4067e);
    /* Brändi magenta ääriseks */
    align-items: flex-start;
}

.alert.alert-taltech-danger .alert-heading {
    color: #842029;
    /* Tumedam punane pealkirjale */
}

.alert.alert-taltech-danger .alert-heading,
.alert.alert-taltech-danger svg {
    color: #842029;
}

/* Ligipääsetavuse märkus:
 * Teksti värv (#333, #555) ja pealkirja värv (#342b60) on heledal taustal (#eef2f7)
 * väga kõrge kontrastsusega, mis ületab WCAG AAA nõudeid.
*/
/* --- TÄIENDUSED: MÕISTETE LEHE BRÄNDIKOHANE KUJUNDUS --- */

/* 1. Filtreerimisvormi konteiner */
/* =============================== */
.filter-form-container {
    background-color: var(--kerge-taust, #eef2f7);
    padding: 1.5rem;
    border-radius: var(--border-radius);
    border: 1px solid #ddd;
    margin-bottom: 2rem;
}

/* 2. Mõistete kaardi sisu parem joondamine */
/* ======================================= */
.term-card .card-body {
    padding: 0;
    /* Eemaldame vaikepolsterduse, et <dl> saaks ruumi kontrollida */
}

.term-card .term-definitions dl {
    display: grid;
    grid-template-columns: max-content 1fr;
    /* Silt : Sisu */
    gap: 0.25rem 1rem;
    /* Reavahe : Veergudevahe */
    margin-bottom: 0;
    /* Eemaldame vaikemarginaali */
}

.term-card .term-definitions dt {
    font-weight: 600;
    color: var(--tekst-varv);
}

.term-card .term-definitions dd {
    margin-bottom: 0;
    color: var(--hall-tekst);
}

/* 3. Leheküljenumbrite (Pagination) brändikohane välimus */
/* ======================================================== */
.pagination .page-item.active .page-link {
    background-color: var(--taltech-punane, #e4067e);
    border-color: var(--taltech-punane, #e4067e);
    color: #fff;
    z-index: 3;
}

.pagination .page-link {
    color: var(--taltech-sinine, #342b60);
}

.pagination .page-link:hover {
    background-color: var(--kerge-taust, #eef2f7);
    color: var(--taltech-sinine, #342b60);
}

.pagination .page-item.disabled .page-link {
    color: #6c757d;
    background-color: #fff;
    border-color: #dee2e6;
}

/* Ligipääsetavuse tagamiseks fookuse stiil */
.pagination .page-link:focus {
    box-shadow: 0 0 0 0.25rem rgba(228, 6, 126, 0.3);
    /* TalTech roosa fookuse vari */
}

.btn.btn-outline-primary {
    --bs-btn-color: var(--taltech-punane, #e4067e);
    --bs-btn-border-color: var(--taltech-punane, #e4067e);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--taltech-punane, #e4067e);
    --bs-btn-hover-border-color: var(--taltech-punane, #e4067e);
    --bs-btn-focus-shadow-rgb: 228, 6, 126;
    /* TalTech punase RGB väärtused */
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #c0056a;
    /* Tumedam punane aktiivseks olekuks */
    --bs-btn-active-border-color: #b50463;
}

/* --- TÄIENDUSED: AINE TUTVUSTUSE LEHT --- */

/* 1. Üldised lingid ja tegevuskava (info-card sees) */
/* ================================================= */

/* Lisame pealkirjale stiili, kui see on info-kaardi sees */
.info-card .info-card-title {
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--taltech-sinine, #001a70);
    margin-top: 0;
    margin-bottom: 0.85rem;
    padding-bottom: 0.6rem;
    border-bottom: 1px solid #d6e0ea;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Eesmärgi plokk */
.course-goal {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 0.95rem;
    line-height: 1.55;
    color: #334155;
    margin-bottom: 0.85rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

.course-goal strong {
    color: var(--taltech-sinine, #001a70);
    font-weight: 600;
}

/* Aine viidete ruudustik */
.course-links-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 10px;
    margin-top: 0.65rem;
    margin-bottom: 0.25rem;
}

.course-link-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background-color: #ffffff;
    border: 1px solid #d9e2ec;
    border-radius: 8px;
    color: #1e293b;
    text-decoration: none;
    font-size: 0.925rem;
    font-weight: 500;
    min-height: 48px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

.course-link-card:hover,
.course-link-card:focus {
    color: var(--taltech-sinine, #001a70);
    border-color: #001a70;
    background-color: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 26, 112, 0.09);
    transform: translateY(-2px);
    text-decoration: none;
}

.course-link-card:focus-visible {
    outline: 2px solid var(--taltech-punane, #e40046);
    outline-offset: 2px;
}

.course-link-card:active {
    transform: translateY(0);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.course-link-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    flex-shrink: 0;
    transition: transform 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

.course-link-card:hover .course-link-icon {
    transform: scale(1.06);
}

/* Teemavärvid viiteikoonidele */
.course-link-icon.icon-ois {
    background-color: rgba(0, 26, 112, 0.08);
    color: #001a70;
}
.course-link-card:hover .course-link-icon.icon-ois {
    background-color: #001a70;
    color: #ffffff;
}

.course-link-icon.icon-schedule {
    background-color: rgba(13, 148, 136, 0.1);
    color: #0f766e;
}
.course-link-card:hover .course-link-icon.icon-schedule {
    background-color: #0f766e;
    color: #ffffff;
}

.course-link-icon.icon-moodle {
    background-color: rgba(234, 88, 12, 0.1);
    color: #c2410c;
}
.course-link-card:hover .course-link-icon.icon-moodle {
    background-color: #ea580c;
    color: #ffffff;
}

.course-link-icon.icon-teams {
    background-color: rgba(70, 78, 184, 0.12);
    color: #464eb8;
}
.course-link-card:hover .course-link-icon.icon-teams {
    background-color: #464eb8;
    color: #ffffff;
}

.course-link-icon.icon-live {
    background-color: rgba(220, 38, 38, 0.1);
    color: #dc2626;
}
.course-link-card:hover .course-link-icon.icon-live {
    background-color: #dc2626;
    color: #ffffff;
}

.course-link-icon.icon-recordings {
    background-color: rgba(2, 132, 199, 0.1);
    color: #0284c7;
}
.course-link-card:hover .course-link-icon.icon-recordings {
    background-color: #0284c7;
    color: #ffffff;
}

.course-link-icon.icon-practice {
    background-color: rgba(79, 70, 229, 0.1);
    color: #4f46e5;
}
.course-link-card:hover .course-link-icon.icon-practice {
    background-color: #4f46e5;
    color: #ffffff;
}

.course-link-icon.icon-media {
    background-color: rgba(147, 51, 234, 0.1);
    color: #7e22ce;
}
.course-link-card:hover .course-link-icon.icon-media {
    background-color: #7e22ce;
    color: #ffffff;
}

.course-link-icon.icon-plan {
    background-color: rgba(228, 0, 70, 0.08);
    color: #e40046;
}
.course-link-card:hover .course-link-icon.icon-plan {
    background-color: #e40046;
    color: #ffffff;
}

.course-link-icon.icon-guide {
    background-color: rgba(100, 116, 139, 0.1);
    color: #475569;
}
.course-link-card:hover .course-link-icon.icon-guide {
    background-color: #475569;
    color: #ffffff;
}

.course-link-title {
    flex: 1 1 auto;
    font-weight: 500;
    line-height: 1.35;
}

.course-link-meta {
    flex-shrink: 0;
    color: #94a3b8;
    transition: transform 0.18s ease, color 0.18s ease;
}

.course-link-card:hover .course-link-meta {
    color: var(--taltech-sinine, #001a70);
    transform: translate(2px, -2px);
}

.course-link-card:hover .course-link-meta.meta-internal {
    transform: translateX(3px);
}

.course-ois-comment {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 10px 14px;
    font-size: 0.875rem;
    color: #64748b;
    line-height: 1.5;
}

.course-ois-comment .comment-icon {
    flex-shrink: 0;
    color: #001a70;
    margin-top: 2px;
}

@media (max-width: 576px) {
    .course-links-grid {
        grid-template-columns: 1fr;
    }
}

/* Tagasiühilduvus vanadele loenditele */
.course-links-list {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

.course-links-list li {
    margin-bottom: 0.5rem;
}

.course-links-list li a {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    text-decoration: none;
    font-weight: 500;
}

.course-links-list li a:hover {
    text-decoration: underline;
}

/* 2. Oluliste kuupäevade tabel */
/* ============================= */
.dates-table thead th,
.dates-table th {
    background-color: var(--table-header-bg);
    color: var(--table-header-color);
}

/* Muudame möödunud tähtajaga read vähem silmatorkavaks ligipääsetaval viisil */
.dates-table tr.table-secondary {
    background-color: #f8f9fa;
    color: var(--hall-tekst);
    opacity: 0.8;
    transition: opacity 0.15s ease, background-color 0.15s ease;
}

.table-hover.dates-table tbody tr.table-secondary:hover,
.table-hover.dates-table tbody tr.table-secondary:hover > *,
.dates-table.table-hover tbody tr.table-secondary:hover,
.dates-table.table-hover tbody tr.table-secondary:hover > * {
    --bs-table-bg-state: var(--table-hover-bg) !important;
    background-color: var(--table-hover-bg) !important;
    opacity: 1 !important;
}

/* Ligipääsetavuse märkus:
 * Tekstivärv #555 taustal #f8f9fa annab kontrastsuseks 8.35:1, mis on WCAG AAA tasemel.
*/


/* 3. Aine kirjelduse plokk (spetsiifiline reegel) */
/* ================================================= */

/* See reegel mõjutab AINULT aine_tutvustus.php lehel olevat kirjeldust
   tänu unikaalsele .course-description-card klassile. */
.material-card.course-description-card {
    border: none;
    /* Eemaldame kõik äärised */
    box-shadow: none;
    /* Eemaldame varju, et see ei näeks välja nagu kaart */
    background-color: transparent;
    /* Muudame tausta läbipaistvaks */
    padding: 0;
    /* Eemaldame lisapolsterduse, et sisu joonduks normaalselt */
}

/* --- TÄIENDUSED: DOC_NAGU_MOODLE LEHE ÜHTLUSTAMINE --- */

/* 1. Brändikohane hoiatusteade (Warning Alert) */
/* ============================================= */
.alert.alert-taltech-warning {
    background-color: #fff9e6;
    /* Kerge kollane taust */
    color: var(--tekst-varv, #333);
    border: 1px solid #ffeeba;
    border-left-width: 5px;
    border-left-color: #ffc107;
    /* Bootstrap'i standardne kollane sobib siia hästi */
    align-items: flex-start;
}

.alert.alert-taltech-warning .alert-heading {
    color: #856404;
    /* Tume kollane tekst */
}

.alert.alert-taltech-warning .alert-icon svg {
    color: #856404;
}

/* Brändikohane infoteade (Info Alert) */
.alert.alert-taltech-info {
    background-color: #f0f4f8;
    color: var(--tekst-varv, #333);
    border: 1px solid #d9e2ec;
    border-left-width: 5px;
    border-left-color: var(--taltech-sinine);
    align-items: flex-start;
}

.alert.alert-taltech-info .alert-heading {
    color: var(--taltech-sinine);
}

.alert.alert-taltech-info .alert-icon svg {
    color: var(--taltech-sinine);
}

/* Teatekasti sees asuvate nuppude ikoonid pärivad alati nupu teksti värvi */
.alert .btn svg,
.btn-taltech-burgundy svg,
.btn-taltech-sinine svg,
.btn-taltech-primary svg {
    color: inherit !important;
    fill: currentColor !important;
}

/* 2. Brändikohane märk (Badge) */
/* ============================= */
.badge.badge-taltech {
    background-color: var(--taltech-punane, #e4067e);
    color: #fff;
}

/* 3. Pesastatud (sub-accordion) akordioni stiilid */
/* ================================================= */
/* Lisame sisemistele akordionitele taande ja kergema välimuse */
.accordion-branded .sub-accordion .accordion-item {
    border: 1px solid #e9ecef;
    /* Heledam ääris */
    box-shadow: none;
    /* Eemaldame varju, et vähendada visuaalset müra */
}

.accordion-branded .sub-accordion .accordion-button {
    background-color: var(--kerge-taust, #eef2f7);
    font-size: 1rem;
    /* Veidi väiksem font */
}

.accordion-branded .sub-accordion .accordion-button:not(.collapsed) {
    background-color: var(--bs-accordion-active-bg, #eef2f7);
    color: var(--taltech-sinine);
}

.accordion-branded .sub-accordion .accordion-button:not(.collapsed)::after {
    filter: none;
    /* Jätame noole tumedaks */
}

/* Brändikohane akordion ühtse ja ligipääsetava kujundusega */
/* See plokk tagab kõikidele akordionitele ühtse välimuse nii avatud kui ka suletud olekus. */

/* 1. Üldised akordioni konteineri ja elemendi stiilid */
/* =================================================== */
.accordion-branded .accordion-item {
    border: 1px solid #d6e0ea;
    border-radius: var(--border-radius);
    margin-bottom: 0.5rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    width: 100%;
}

.accordion-branded .accordion-item:last-child {
    margin-bottom: 0;
}

/* 2. Nupu üldised stiilid (sh SULETUD OLEK) - PARANDATUD SPETSIIFILISUSEGA */
/* ========================================================================= */
/* VÕTI: Kasutame spetsiifilisemat selektorit (.accordion-header), et tagada reegli rakendumine. */
.accordion-branded .accordion-header .accordion-button {
    font-weight: 600;
    /* Kõik peataseme nupud on vaikimisi paksus kirjas (bold) */
    color: var(--tekst-varv, #333);
    background-color: var(--element-taust, #fff);
    /* Valge taust vaikimisi (suletud olek) */
    position: relative;
    white-space: normal;
    text-align: left;
}

.accordion-branded .accordion-button:focus {
    box-shadow: none;
    z-index: 3;
}

.accordion-branded .accordion-button:focus-visible {
    outline: 2px solid var(--taltech-punane, #e4067e);
    outline-offset: 2px;
}

/* 3. AVATUD AKORDIONI ÜHTNE STIIL */
/* ================================== */
.accordion-branded .accordion-button:not(.collapsed) {
    background-color: var(--taltech-sinine, #342b60);
    color: #fff;
}

.accordion-branded .accordion-button:not(.collapsed)::after {
    filter: brightness(0) invert(1);
    /* Valge nool */
}

/* 4. HIERARHIA JA ERISTIILID */
/* ============================ */
/* Alamakordioni nupud on kergema fondiga, et säilitada visuaalset hierarhiat. */
/* Ka siin on suurendatud spetsiifilisust (.accordion-header), et tagada reegli rakendumine. */
.accordion-branded .accordion-branded .accordion-header .accordion-button {
    font-size: 1rem;
    font-weight: 500;
    /* ERAND: Alamakordionid on tavalises kirjas (regular) */
}

/* Brändikohase märgi stiil jääb samaks. */
.accordion-branded .badge.badge-taltech {
    background-color: var(--taltech-punane, #e4067e) !important;
    color: #fff;
}

/* 5. Sisu (body) stiilid */
/* ======================== */
.accordion-branded .accordion-body {
    padding: 1.25rem;
    overflow-x: auto;
}

.accordion-branded .accordion-branded .accordion-body {
    padding: 1rem;
    /* Alamakordioni sisu on kompaktsem */
}

.accordion-branded .accordion-body h3 {
    color: var(--taltech-sinine);
    margin-top: 0;
    margin-bottom: 1rem;
}

/* --- TÄIENDAV PARANDUS (v10): Akordioni fondi paksuse ühtlustamine --- */
/* See reegel on loodud ülima spetsiifilisusega, et sundida peale õige fondi paksus
   mõlemale peamisele akordionile lehel doc_nagu_moodle.php. */

/* Rakendame paksu kirja KÕIKIDELE esimese taseme akordioninuppudele. */
#accordion_yldine>.accordion-item>.accordion-header .accordion-button,
#accordion_nadal>.accordion-item>.accordion-header .accordion-button {
    font-weight: 600 !important;
}

/* Seejärel kirjutame selle üle AINULT pesastatud (teise taseme) akordionite jaoks,
   tagades, et need on kergemas kirjas. */
#accordion_nadal .accordion-branded .accordion-header .accordion-button {
    font-weight: 500 !important;
}


/* 2. Akordioni SISU stiilid (kohandatud uue .accordion-branded süsteemiga) */
/* ======================================================================= */
/* Need reeglid ei mõjuta akordioni nuppe, vaid ainult sisu, mis ilmub selle avamisel. */
.accordion-branded .accordion-body h1,
.accordion-branded .accordion-body h2,
.accordion-branded .accordion-body h3,
.accordion-branded .accordion-body h4 {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    color: var(--tekst-varv);
}

.accordion-branded .accordion-body p {
    margin-bottom: 1rem;
}

.accordion-branded .accordion-body ul,
.accordion-branded .accordion-body ol {
    padding-left: 2rem;
    margin-bottom: 1rem;
}

.accordion-branded .accordion-body .tv1,
.accordion-branded .accordion-body .tv2 {
    padding: 10px;
    margin-bottom: 10px;
    border-radius: var(--border-radius);
}

.accordion-branded .accordion-body .tv1 {
    background-color: var(--element-taust);
}

.accordion-branded .accordion-body .tv2 {
    background-color: var(--alternate-bg);
}


/* 3. Materjalide, teadete ja küsimuste kaartide stiilid */
/* ===================================================== */
/* Need on kõige olulisemad stiilid lehe sisu korrektseks kuvamiseks. */

.card-header-custom {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 10px;
}

/* 4. Ligipääsetavuse "Otse sisuni" link */
/* ===================================== */
.skip-link {
    position: absolute;
    top: -50px;
    left: 0;
    background: var(--taltech-sinine);
    color: white;
    padding: 8px 15px;
    z-index: 1000;
    transition: top 0.3s;
    text-decoration: none;
    border-radius: 0 0 var(--border-radius) 0;
}

.skip-link:focus {
    top: 0;
}

/* 5. Mobiilivaate parandused */
/* =========================== */
@media (max-width: 768px) {
    .file-link-line {
        flex-wrap: wrap;
        /* Lubab murda faili suuruse uuele reale */
    }

    .file-size {
        padding-left: 0;
        display: inline;
    }
}

/* Kasutame olemasolevat card-header-custom klassi, et hoida stiil ühtsena */
.card-header-custom {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 10px;
}


.material-card .student-id {
    display: block;
    /* Tagab, et element on omaette real */
    font-weight: bold;
    color: var(--tekst-varv);
    font-size: 0.95rem;
    /* Veidi väiksem, et eristuda pealkirjast */
    margin-top: 5px;
    margin-bottom: 10px;
    /* Eraldab selle visuaalselt kirjeldusest/failist */
}

/* --- LISATUD: Universaalne materjalide filtreerimiskasti kujundus --- */

.filter-container {
    margin-bottom: 1.5rem;
    /* Eraldab kasti muust sisust */
    position: relative;
    /* text-align: left; on vaikimisi, seega pole vaja lisada */
}

/* Kasutame visuaalselt peidetud silti ligipääsetavuse tagamiseks (EN 301 549) */
.filter-container .visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.filter-container .form-control {
    height: 44px;
    /* Tagab piisava kõrguse ja mugava kasutuse */
    padding-left: 2.5rem;
    /* Teeb ruumi ikooni jaoks */
    border-radius: var(--border-radius) !important;
    /* Tagab ühtsed ümarad nurgad */
}

.filter-container .form-control:focus {
    border-color: var(--taltech-punane, #e4067e);
    box-shadow: 0 0 0 0.25rem rgba(228, 6, 126, 0.25);
    /* TalTech roosa fookuse vari */
}

.filter-container .search-icon {
    position: absolute;
    top: 50%;
    left: 0.75rem;
    transform: translateY(-50%);
    z-index: 4;
    /* Tagab, et ikoon on sisendvälja peal */
    color: var(--hall-tekst, #555);
    pointer-events: none;
    /* Laseb klikkidel minna läbi ikooni sisendväljale */
}


/*
 * Spetsiifiline stiil küsimuste kaartidele.
 * Terve kaart on mugavalt klõpsatav (Fitts's Law), toetades nii hiirega kui klaviatuuriga kasutust.
*/
.material-card.question-card {
    position: relative;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.material-card.question-card:hover {
    background-color: var(--card-clickable-hover-bg, #f0f5fa) !important;
    border-color: #b0c4de;
}

/* Venitatud link tagab terve kaardi klõpsatavuse ilma HTML-struktuuri vigadeta */
.material-card.question-card .material-name a::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
}

/* Ikoonid ja sildid ei tohi klikki takistada */
.material-card.question-card .pin-icon,
.material-card.question-card .critical-info-label {
    position: relative;
    z-index: 2;
    pointer-events: none;
}

/* Ligipääsetav klaviatuurifookus (EN 301 549) */
.material-card.question-card:focus-within {
    outline: 2px solid var(--taltech-punane);
    outline-offset: 2px;
}

.material-card.question-card .card-header {
    /* Enamik stiile päritakse .card-header klassilt, siin on vaid täpsustused */
    align-items: flex-start;
    /* Joondab ikooni ja pika teksti ülaservad */
    margin-bottom: 5px;
    /* Vähendame veidi vahet ajatempli jaoks */
}

/* Tagame, et ajatempel on alati korrektse välimusega */
.material-card.question-card .timestamp {
    font-size: 0.85rem;
    color: var(--hall-tekst);
    display: block;
    /* Tagab, et see on alati omaette real */
    padding-left: 26px;
    /* Joondub pealkirjaga, kui pin-ikoon on olemas */
}

/* Kui pin-ikooni pole, siis taanet pole vaja */
.material-card.question-card .card-header:not(:has(.pin-icon))+.timestamp {
    padding-left: 0;
}

/* --- KASUTATAVUSE PARANDUS: Küsimuste fondi paksuse optimeerimine --- */
/*
 * See reegel muudab küsimuste pealkirjad kergelt paksemaks (semi-bold, 600),
 * mis on paremini loetav kui täisrasvane font (bold, 700), kuid siiski
 * eristub tavalisest tekstist (regular, 400).
 * Kasutame spetsiifilist selektorit `.question-card .material-name`, et
 * see muudatus mõjutaks AINULT küsimusi, mitte teisi materjale.
*/
.question-card .material-name {
    font-weight: normal;
    /* Asendab 'bold' väärtusega '600' (semi-bold) */
}

/* --- TÄIENDATUD STIILID TEADETE (Notice) KUVA JAOKS (v2) --- */

/* Annab teate kaardile spetsiifilise klassi ja tagab korrektse sisu paigutuse. */
.material-card.notice-card {
    cursor: default;
}

.material-card.notice-card:hover {
    background-color: var(--element-taust) !important;
}

.material-card.notice-card .card-header-custom {
    align-items: flex-start;
    /* Joondab ikooni ja pika teksti ülaservad */
    margin-bottom: 0.5rem;
}

/* Stiilib päise (saatja, pealkiri) ja ajatempli */
.material-card.notice-card .material-name {
    display: block;
    /* Tagab, et ajatempel läheb alla */
}

.material-card.notice-card .material-name .timestamp {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.85rem;
    font-weight: normal;
    font-style: normal;
    color: var(--hall-tekst);
}

/* Stiilib teate sisu ja manuste plokid, lisades taande, kui on pin-ikoon */
.material-card.notice-card .notice-content,
.material-card.notice-card .notice-attachments {
    padding-left: 26px;
    /* Taane pin-ikooni laiuse võrra */
}

/* Eemaldab taande, kui pin-ikooni pole, et sisu joonduks vasakule */
.material-card.notice-card .card-header-custom:not(:has(.pin-icon))~.notice-content,
.material-card.notice-card .card-header-custom:not(:has(.pin-icon))~.notice-attachments {
    padding-left: 0;
}

/* Lisab eralduse sisu ja manuste vahele */
.material-card.notice-card .notice-content+.notice-attachments {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #eee;
}

/* --- PARANDUS: Filtrikasti paigutus aine avalehel --- */
/*
 * See reegel tagab, et aine avalehel asuv filtrikast on
 * visuaalselt eraldatud nii ülemisest info-ribast kui ka
 * alumistest sisukaartidest.
*/
.content-area .filter-container {
    margin-top: 1.5rem;
    /* Lisab tühja ruumi filtrikasti kohale */
    margin-bottom: 1.5rem;
    /* Säilitab tühja ruumi filtrikasti alla */
}

/* Kriitilise info kaardi ja sildi stiilid */

/* Stiil, mis rakendub tervele kaardile (vasak äär ja kerge taustavärv) */
.material-card.critical-info {
    border-left-color: var(--taltech-burgundy);
    background-color: #fef7fa;
    /* Väga hele kirsipunane toon eristumiseks */
}

/* Uus kriitilise info silt */
.critical-info-label {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 4px 10px;
    margin-bottom: 12px;
    /* Eraldab sildi kaardi sisust */
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--taltech-burgundy);
    background-color: #fff;
    border: 1px solid var(--taltech-burgundy);
    border-radius: 20px;
    /* Ümarate nurkadega "pill" kuju */
}

.critical-info-label svg {
    width: 1.1em;
    height: 1.1em;
    flex-shrink: 0;
}

.file-icon-sm {
    width: 16px;
    height: 16px;
    vertical-align: -3px;
    /* Joondab ikooni visuaalselt paremini tekstiga */
    margin-right: 5px;
    /* Tekitab väikese vahe ikooni ja teksti vahele */
}

/* --- TÄIENDUSED TEGEVUSKAVA JA KRIITILISE INFO KUVA JAOKS --- */

/* Annab tegevuskava kaardile spetsiifilise klassi ja tagab korrektse sisu paigutuse. */
.material-card.activity-plan-card .card-header-custom {
    align-items: flex-start;
    /* Joondab ikooni ja pika teksti ülaservad */
    margin-bottom: 0.5rem;
}

/* Tegevuskava pealkiri on h3, aga pärib .material-name stiilid */
.material-card.activity-plan-card .activity-plan-heading {
    /* Eemaldatud tühi reegel */
    /* Hetkel pole lisastiile vaja, pärib .material-name omadused */
}

/* Tegevuskava sisu taane, et see joonduks pealkirjaga */
.material-card.activity-plan-card .activity-plan-content {
    padding-left: 26px;
    /* Taane pin-ikooni laiuse võrra */
}

#kysimused-section .material-name {
    font-weight: normal;
}


/* --- LISATUD: Mobiilisõbralik tabelite "kaartideks" muutmine (nt aine avalehe kuupäevad) --- */
@media (max-width: 768px) {

    /* Peidame tabeli klassikalise päise */
    .table-responsive .table thead {
        display: none;
    }

    /* Muudame tabeli elemendid plokkidena käituvaks */
    .table-responsive .table,
    .table-responsive .table tbody,
    .table-responsive .table tr,
    .table-responsive .table td {
        display: block;
        width: 100%;
    }

    /* Stiilime iga rea eraldi kaardina */
    .table-responsive .table tr {
        margin-bottom: 1rem;
        border: 1px solid #ddd;
        border-radius: var(--border-radius);
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
        overflow: hidden;
        background-color: var(--element-taust);
    }

    .table-responsive .table tr.table-warning {
        background-color: var(--table-warning-bg) !important;
    }

    .table-responsive .table tr.table-secondary {
        background-color: #f8f9fa !important;
        opacity: 0.85;
    }

    .table-responsive .table tr:last-child {
        margin-bottom: 0;
    }

    /* Kaardi "rea" (endise lahtri) üldine stiil */
    .table-responsive .table td {
        display: grid;
        grid-template-columns: 40% 60%;
        /* Silt : Sisu */
        align-items: center;
        padding: 0.75rem 1rem;
        border-bottom: 1px solid #eee;
        text-align: left;
        /* Joondame sisu vasakule */
        background-color: transparent !important;
        --bs-table-bg: transparent !important;
        --bs-table-bg-type: transparent !important;
        --bs-table-bg-state: transparent !important;
    }

    .table-responsive .table tr td:last-child {
        border-bottom: none;
    }

    /* Loome sildi data-label atribuudi väärtusest */
    .table-responsive .table td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--taltech-sinine);
        padding-right: 1rem;
        word-break: break-word;
    }

    /* Eriregeel pika sisuga lahtrile (nt. kirjeldus) */
    .table-responsive .table td.date-description,
    .table-responsive .table td[data-label="Kirjeldus"] {
        display: block;
    }

    .table-responsive .table td.date-description::before,
    .table-responsive .table td[data-label="Kirjeldus"]::before {
        display: block;
        padding-bottom: 0.5rem;
        padding-right: 0;
    }

    /* Eemaldame mobiilikaartidelt eksitava hover-efekti täielikult */
    .table-responsive .table tbody tr:hover,
    .table-responsive .table-hover tbody tr:hover,
    .table-responsive .dates-table tbody tr:hover,
    .table-responsive .dates-table.table-hover tbody tr:hover,
    .table-responsive .table tbody tr td:hover,
    .table-responsive .dates-table tbody tr td:hover {
        --bs-table-bg-state: transparent !important;
        --bs-table-hover-bg: transparent !important;
        background-color: transparent !important;
        box-shadow: none !important;
        cursor: default !important;
    }

    .table-responsive .table th,
    .table-responsive .table tbody th,
    .table-responsive .table th:hover,
    .table-responsive .table tbody th:hover,
    .table-responsive .table tr:hover th,
    .table-responsive .table tbody tr:hover th {
        background-color: var(--table-header-bg) !important;
        color: var(--table-header-color) !important;
        cursor: default !important;
    }

    .table-responsive .table tbody tr:hover {
        background-color: var(--element-taust) !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    }

    .table-responsive .table tbody tr.table-warning:hover,
    .table-responsive .table-hover tbody tr.table-warning:hover,
    .table-responsive .dates-table tbody tr.table-warning:hover,
    .table-responsive .dates-table.table-hover tbody tr.table-warning:hover {
        --bs-table-bg-state: var(--table-warning-bg) !important;
        background-color: var(--table-warning-bg) !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    }

    .table-responsive .table tbody tr.table-secondary:hover,
    .table-responsive .table-hover tbody tr.table-secondary:hover,
    .table-responsive .dates-table tbody tr.table-secondary:hover,
    .table-responsive .dates-table.table-hover tbody tr.table-secondary:hover {
        --bs-table-bg-state: #f8f9fa !important;
        background-color: #f8f9fa !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
        opacity: 0.85 !important;
    }
}


/* --- LISATUD: Mobiilisõbralik tabelite "kaartideks" muutmine (minu_aine_lugemiste_aruanne.php) --- */
@media (max-width: 768px) {

    /* Peidame tabeli klassikalise päise */
    .table-responsive .report-table thead {
        display: none;
    }

    /* Muudame tabeli elemendid plokkidena käituvaks */
    .table-responsive .report-table,
    .table-responsive .report-table tbody,
    .table-responsive .report-table tr,
    .table-responsive .report-table td {
        display: block;
        width: 100%;
    }

    /* Stiilime iga rea eraldi kaardina */
    .table-responsive .report-table tr,
    .table-responsive .report-table tbody tr,
    .table-responsive .report-table tbody tr:nth-child(even),
    .table-responsive .report-table tbody tr:nth-child(odd) {
        margin-bottom: 1rem;
        border: 1px solid #ddd;
        border-radius: var(--border-radius);
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
        overflow: hidden;
        background-color: var(--element-taust) !important;
        transition: none !important;
    }

    .table-responsive .report-table tr:last-child {
        margin-bottom: 0;
    }

    /* Kaardi "rea" (endise lahtri) üldine stiil */
    .table-responsive .report-table td {
        display: grid;
        grid-template-columns: 40% 60%;
        /* Silt : Sisu */
        align-items: center;
        padding: 0.75rem 1rem;
        border-bottom: 1px solid #eee;
        text-align: left;
        background-color: transparent !important;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .table-responsive .report-table tr td:last-child {
        border-bottom: none;
    }

    /* Loome sildi data-label atribuudi väärtusest */
    .table-responsive .report-table td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--taltech-sinine);
        padding-right: 1rem;
        word-break: break-word;
    }

    /* Mobiilikaartide hoveri eemaldamine aruannete tabelites */
    .table-responsive .report-table tr:hover,
    .table-responsive .report-table tbody tr:hover {
        background-color: var(--element-taust) !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
        cursor: default !important;
    }

    .table-responsive .report-table td:hover,
    .table-responsive .report-table tbody tr td:hover {
        background-color: transparent !important;
        box-shadow: none !important;
        cursor: default !important;
    }

    .table-responsive .report-table td a {
        cursor: pointer;
    }

    .table-responsive .report-table th,
    .table-responsive .report-table tbody th,
    .table-responsive .report-table th:hover,
    .table-responsive .report-table tbody th:hover,
    .table-responsive .report-table tr:hover th,
    .table-responsive .report-table tbody tr:hover th {
        background-color: var(--table-header-bg) !important;
        color: var(--table-header-color) !important;
        cursor: default !important;
    }
}


/* Pikkade failinimede murdmine Flexbox'is */

/* See on konteiner, mis hoiab endas linki ja suurust */
.file-link-line {
    display: flex;
    /* 1. Seame elemendid ritta */
    flex-wrap: wrap;
    /* 2. Lubame neil kitsal ekraanil uuele reale minna */
    align-items: center;
    /* 3. VÕTI: Joondame nad vertikaalselt keskele, mis lahendab kõrguse vahe */
    gap: 8px;
    /* 4. Loob ilusa ja ühtlase vahe lingi ja suuruse vahele */
}

/* 
 * 2. See on kõige olulisem reegel, mis on suunatud otse lingile endale.
*/
.file-download-link {
    /* VÕTI nr 1: See on ülioluline! See käsk tühistab brauseri vaikimisi
       arvutuse, mis takistab flex-elemendil kahanemast väiksemaks kui tema
       sisu (pikk failinimi). See annab lingile loa kahaneda. */
    min-width: 0;

    /* VÕTI nr 2: Kuna failinimed võivad käituda ühe pika sõnana, kasutame
       kõige agressiivsemat murdmise reeglit, mis tagab teksti murdumise
       igas olukorras. */
    word-break: break-all;
}

/* 
 * 3. Rakendame leebema murdmisreegli seotud dokumentidele ja manustele,
 *    mis ei ole flex-konteineris ja kus standardne lahendus töötab.
*/
.related-docs a,
.notice-attachments a {
    overflow-wrap: break-word;
    word-wrap: break-word;
    /* Tagasiühilduvus */
}

/* 
 * 4. Tagame, et faili suurus "[XXXX KB]" ei murduks kunagi pooleks.
*/
.file-size,
.related-file-size {
    white-space: nowrap;
}

/* Lugemise koha info stiil "Dokumendi" veerus */
.reading-location-info {
    font-size: 0.85em;
    color: var(--hall-tekst);
    margin-top: 5px;
}


/* Faili kirjelduse stiil */
.assignment-file-description {
    display: block;
    /* Tagab, et kirjeldus on eraldi real */
    margin-bottom: 0.25rem;
    /* Väike vahe kirjelduse ja faili lingi vahel */
    color: var(--hall-tekst);
    /* Kasutame halli teksti, et eristada kirjeldust lingist */
}

/* --- PARANDUSED KALENDRI NUPPUDE PAIGUTUSELE MOBIILIVAATES --- */

/* See reegel rakendub ekraanidele, mille laius on 992px või vähem (tahvelarvutid ja mobiilid) */
@media (max-width: 992px) {

    /*
     * Muudame nuppude üldkonteineri vertikaalseks ja täislaiusesse.
     * Tulemus: Filtri- ja vaatevaliku nupugrupid paigutuvad üksteise alla.
    */
    .calendar-controls {
        flex-direction: column;
        width: 100%;
        align-items: stretch;
        /* Venitab nupugrupid täislaiusesse */
    }

    /*
     * Anname Bootstrap'i nupugrupile (filter-switcher) loa oma sisu (nupud)
     * murda mitmele reale, kui need ei mahu ühele reale ära.
    */
    .filter-switcher.btn-group {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        /* Lisab vahe murtud nuppude vahele */
    }

    /* 
     * Kirjutame üle Bootstrap'i vaikestiili, mis eemaldab nurgad grupi-sisestelt nuppudelt.
     * See on vajalik, et kui nupud murduvad uuele reale, oleksid neil kõigil korrektsed ümarad nurgad.
     */
    .filter-switcher.btn-group .btn {
        border-radius: var(--bs-btn-border-radius) !important;
    }
}

.table-hover.dates-table tbody tr,
.dates-table.table-hover tbody tr {
    /* Sujuv üleminek puhtale tasapinnalisele fookusele */
    transition: background-color 0.15s ease;
}

.table-hover.dates-table tbody tr:hover,
.table-hover.dates-table tbody tr:hover > *,
.dates-table.table-hover tbody tr:hover,
.dates-table.table-hover tbody tr:hover > * {
    --bs-table-bg-state: var(--table-hover-bg) !important;
    background-color: var(--table-hover-bg) !important;
    box-shadow: none;
    cursor: default;
}



.nav-accordion .accordion-button:focus-visible,
.nav-accordion .nav-list li a:focus-visible,
.category-nav-list li a:focus-visible,
.content-section .list-group-item a:focus-visible,
.accordion-branded .accordion-button:focus-visible {
    outline: 2px solid var(--taltech-punane);
    /* Kasutame brändi esiletõstuvärvi */
    outline-offset: 2px;
    /* Lisab väikese vahe elemendi ja äärejoone vahele */
    box-shadow: none;
    /* Eemaldab Bootstrap'i vaikimisi sinise kuma, et vältida konflikti */
    border-radius: var(--border-radius);
    /* Tagab, et outline järgib nurkade ümarust */
}

.nav-accordion .nav-list li a:not(.requires-login) {
    padding-left: calc(15px + 1em + 0.4em);
    /* Vaikimisi padding + ikooni laius + vahe */
}


/* Kataloogimenüü pealkirja stiil (parandatud tühimikega) */
.nav-panel .nav-panel-title {
    color: var(--taltech-sinine);
    font-size: 1.2rem;
    margin-top: 0.25rem;
    /* LISATUD: Väike vahe paneeli ülaservast */
    margin-bottom: 0.75rem;
    /* VÄHENDATUD: Tasakaalustab vahet joone all */
    padding-bottom: 0.75rem;
    /* SUURENDATUD: Tasakaalustab vahet joone kohal */
    border-bottom: 1px solid #ddd;
}

/* Kataloogimenüü nimekirja stiilid */
.category-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.category-nav-list li a {
    display: block;
    padding: 8px 15px;
    text-decoration: none;
    color: var(--link-varv);
    border-radius: 4px;
    font-weight: 500;
    transition: background-color 0.2s ease;
    border: 1px solid transparent;
    /* Äärise jaoks ruumi hoidmiseks */
}

/* Hover-efekt */
.category-nav-list li a:hover {
    background-color: #dce4ec;
    text-decoration: none;
}

/* Aktiivse lingi stiil (kui kasutaja on selles kataloogis) */
.category-nav-list li a.active {
    background-color: var(--kerge-taust);
    color: var(--taltech-sinine);
    font-weight: 600;
    /* Muudab aktiivse lingi rasvaseks */
}

/* Ligipääsetavuse parandus: Fookuse indikaator */
.category-nav-list li a:focus-visible {
    outline: 2px solid var(--taltech-punane);
    outline-offset: 2px;
}


/*
 * PARANDUS: Kataloogimenüü linkide korrektne joondamine.
 * 1. Rakendame flexboxi linkidele, millel on ikoon (.requires-login),
 *    et joondada ikoon ja tekst vertikaalselt keskele.
*/
.category-nav-list li a.requires-login {
    display: flex;
    align-items: center;
    gap: 0.4em;
}

/*
 * 2. Lisame linkidele, millel ikooni POLE, vasakpoolse lisapolsterduse,
 *    mis on võrdne ikooni ja selle vahe laiusega, et tekstid joonduksid.
*/
.category-nav-list li a:not(.requires-login) {
    /* Algne padding-left (15px) + ikooni laius (ca 1em) + vahe (0.4em) */
    padding-left: calc(15px + 1em + 0.4em);
}



/* Eemaldame akordioni ümber olevalt sektsioonilt polsterduse, kuna akordionil on see juba olemas */
.content-section.more-links-accordion {
    padding: 0;
    box-shadow: none;
    background-color: transparent;
}

/*
 * PARANDUS: Eemaldab liigse tühja ruumi avalehe akordioni sisu algusest ja lõpust,
 * kui seal sees kasutatakse .list-group-flush klassi.
*/
.accordion-branded .accordion-body .list-group-flush .list-group-item:first-child {
    padding-top: 0;
}

.accordion-branded .accordion-body .list-group-flush .list-group-item:last-child {
    padding-bottom: 0;
}

/* 
 * 1. Avalehe interaktiivsete sektsioonide hover/focus efekt.
 * See stiil jäljendab index_vana.php .access-card efekti,
 * andes kasutajale selge visuaalse tagasiside.
*/
.content-section.interactive-section {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.content-section.interactive-section:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.12);
}

/* 
 * 2. Kõrge kontrastsusega fookuse indikaator linkidele kaartide ja akordionide sees.
 * See tagab ühtse ja ligipääsetava fookuse stiili kogu lehel.
*/
.content-section .list-group-item a:focus-visible,
.accordion-branded .list-group-item a:focus-visible {
    outline: 2px solid var(--taltech-punane);
    outline-offset: 2px;
    border-radius: var(--border-radius);
    /* Tagab, et outline järgib nurkade ümarust */
    box-shadow: none;
    /* Eemaldab Bootstrap'i vaikimisi sinise kuma */
}

/*
 * Avalehe nimekirjade linkide ühtlustamine.
 * Need reeglid tagavad, et kõigis kolmes sektsioonis ("Ained", "Toimingud", "Lingid ja ressursid")
 * on linkide välimus ja käitumine identsed.
*/

/* 1. Muudame KÕIKIDE nimekirjade lingid siniseks ja eemaldame allajoone */
#ained .list-group-item a,
#toimingud .list-group-item a,
.accordion-branded .list-group-item-action {
    color: var(--link-varv);
    text-decoration: none;
    font-weight: 500;
}

/* 2. Lisame ühtse hover-efekti KÕIKIDELE nimekirja ridadele */
#ained .list-group-item:hover,
#toimingud .list-group-item:hover,
.accordion-branded .list-group-item-action:hover {
    background-color: var(--kerge-taust);
}

/* 3. Muudame lingi teksti punaseks ja lisame allajoone KÕIKIDEL ridadel hiirega peale minnes */
#ained .list-group-item:hover a,
#toimingud .list-group-item:hover a,
.accordion-branded .list-group-item-action:hover {
    color: var(--taltech-punane);
    text-decoration: underline;
}

/* 4. Kõrge kontrastsusega fookuse indikaator jääb KÕIGILE ühiseks */
#ained .list-group-item a:focus-visible,
#toimingud .list-group-item a:focus-visible,
.accordion-branded .list-group-item a:focus-visible {
    outline: 2px solid var(--taltech-punane);
    outline-offset: 2px;
    border-radius: var(--border-radius);
    background-color: var(--kerge-taust);
}

.material-card.critical-info:hover {
    background-color: var(--element-taust);
}

/*
 * PARANDUS: Taastab hover-efekti akordionitel, kui need on fookuses.
 * See reegel tagab, et ka klaviatuuriga fookuses oleval nupul on
 * hiirega peale minnes selgelt nähtav taustavärvi muutus.
*/
.nav-accordion .accordion-button:hover,
.accordion-branded .accordion-button:hover {
    background-color: var(--kerge-taust);
    color: var(--taltech-sinine);
    /* Tagab ühtse stiili teiste menüüdega */
}

/*
 * PARANDUS: Uuendatud ja täiustatud jaluse stiilid.
 * Need reeglid tagavad, et jalus on visuaalselt kooskõlas päisega,
 * sisaldab kasulikke linke ja on täielikult mobiilisõbralik.
*/

/* 1. Jaluse üldine konteiner */
.site-footer {
    padding: 1.5rem 1.5rem;
    /* Suurendame polsterdust, et sisu saaks hingata */
    text-align: center;
    /* Vaikimisi keskjoondus (mobiil-first) */
}

/* 2. Sisu wrapper (Flexbox konteiner) */
.footer-content-wrapper {
    display: flex;
    flex-direction: column;
    /* Mobiilis on elemendid üksteise all */
    align-items: center;
    gap: 1rem;
    /* Loob vahe linkide ja autoriõiguse teksti vahele */
}

/* 3. Linkide nimekirja stiilid */
.footer-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    /* Lubab linkidel vajadusel uuele reale murduda */
    justify-content: center;
    gap: 0.5rem 1.5rem;
    /* Reavahe ja linkidevaheline vahe */
}

.footer-nav-list a {
    color: white;
    text-decoration: none;
    transition: text-decoration 0.2s ease, opacity 0.2s ease;
}

.footer-nav-list a:hover,
.footer-nav-list a:focus {
    text-decoration: underline;
    opacity: 0.85;
    /* Annab lisatagasisidet */
}

/* 4. Autoriõiguse teksti stiil */
.footer-copyright p {
    margin: 0;
    font-size: 0.9em;
    opacity: 0.8;
    /* Muudame selle visuaalselt vähem dominantseks */
}

/* 5. Responsiivsuse reeglid suurematele ekraanidele */
@media (min-width: 768px) {
    .site-footer {
        text-align: left;
        /* Suurel ekraanil joondame vasakule */
    }

    .footer-content-wrapper {
        flex-direction: row;
        /* Suurel ekraanil on elemendid kõrvuti */
        justify-content: space-between;
        /* Lükkab lingid ja teksti vastas-servadesse */
    }

    .footer-nav-list {
        justify-content: flex-start;
        /* Joondame lingid vasakule */
    }

    .footer-copyright {
        text-align: right;
        /* Joondame autoriõiguse teksti paremale */
    }
}

/*
 * ===================================================================
 *  ÜHTNE PÄISE STIIL (page_header.php)
 * ===================================================================
 * See plokk sisaldab kõiki vajalikke stiile sisselogitud kasutaja päise jaoks,
 * tagades korrektse paigutuse, brändiühtsuse ja mobiilisõbralikkuse.
*/

/* 1. Päise pealkirja link (nt "[aine] - Aine nimi") */
a.header-title-link,
a.header-title-link:hover,
a.header-title-link:focus {
    color: inherit;
    /* Pärib päise valge värvi */
    text-decoration: none;
    transition: opacity 0.2s ease;
}

a.header-title-link:hover {
    opacity: 0.85;
    /* Annab tagasisidet hiirega peale minnes */
}

/* 2. Sisselogitud kasutaja info ("Kasutaja: nimi (Andmed)") */
.site-header .user-info {
    color: white;
    text-align: right;
}

.site-header .user-data-link {
    color: white;
    text-decoration: none;
    font-size: 0.9em;
    opacity: 0.85;
    margin-left: 0.5rem;
    /* Eraldab lingi nimest */
    transition: opacity 0.2s ease, text-decoration 0.2s ease;
}

.site-header .user-data-link:hover,
.site-header .user-data-link:focus {
    opacity: 1;
    text-decoration: underline;
}

/* 3. Sisselogimise nupu konteiner (tagab vertikaalse joonduse) */
.site-header .login-link {
    display: flex;
    align-items: center;
}


/* --- LISATUD: Suletud küsimuste stiilid (t_ylesanded) --- */

.question-block.closed {
    background-color: #f2f2f2;
    /* Veidi tumedam hall kui tavaline taust */
    border-color: #ccc;
    position: relative;
}

.question-block.closed .form-control:disabled,
.question-block.closed .form-control[readonly] {
    background-color: #e9ecef;
    opacity: 1;
    color: var(--hall-tekst);
}

.closed-indicator {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.85rem;
    color: var(--hall-tekst);
    margin-left: 10px;
    font-weight: normal;
    background-color: #e9ecef;
    padding: 2px 8px;
    border-radius: 10px;
    border: 1px solid #ccc;
}

.closed-indicator svg {
    width: 14px;
    height: 14px;
}

/* --- TAGASI ÜLES NUPP --- */

.back-to-top-btn {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    /* Ringikujuline */
    background-color: var(--taltech-punane, #e4067e);
    color: #fff;
    border: none;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    z-index: 9999;
    /* Alati sisu peal */
    display: none;
    /* Vaikimisi peidetud */
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s, transform 0.3s, opacity 0.3s;
    padding: 0;
}

.back-to-top-btn:hover,
.back-to-top-btn:focus {
    background-color: #c0056a;
    /* Tumedam toon hoveril */
    color: #fff;
    transform: translateY(-3px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
    outline: 2px solid var(--taltech-sinine);
    /* Ligipääsetavuse fookus */
    outline-offset: 2px;
}

.back-to-top-btn svg {
    width: 24px;
    height: 24px;
    fill: currentColor;
}

/* Mobiilis tõstame veidi kõrgemale, et ei segaks jaluse linke */
@media (max-width: 576px) {
    .back-to-top-btn {
        bottom: 15px;
        right: 15px;
        width: 40px;
        height: 40px;
    }
}

/* --- KÄIMASOLEVA NÄDALA HÜPPENUPP --- */
.pehme-kerimine-nupp {
    position: fixed;
    bottom: 75px;
    right: 20px;
    z-index: 1000;
    transition: opacity 0.3s, transform 0.3s;
    opacity: 1;
}

@media (max-width: 576px) {
    .pehme-kerimine-nupp {
        bottom: 65px;
        right: 15px;
        font-size: 0.85rem;
        padding: 6px 14px;
    }
}

/* --- PÄISE ABI NUPP --- */

.header-actions .btn-outline-light {
    border-color: rgba(255, 255, 255, 0.5);
    color: rgba(255, 255, 255, 0.9);
}

.header-actions .btn-outline-light:hover,
.header-actions .btn-outline-light:focus {
    background-color: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.8);
    color: #fff;
}

/* Tume tekst modaalis on juba tagatud Bootstrap klassiga text-dark, 
   aga igaks juhuks täpsustame, et lingid modaalis oleksid loetavad */
#loginHelpModal .btn-outline-primary {
    color: var(--taltech-sinine);
    border-color: var(--taltech-sinine);
}

#loginHelpModal .btn-outline-primary:hover {
    background-color: var(--taltech-sinine);
    color: #fff;
}

/* --- TÄIENDUS: Lukuikooniga faililingid seotud materjalides --- */

.related-docs .requires-login {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    /* Väike vahe luku ja failiikooni vahel */
    color: var(--link-varv);
    text-decoration: none;
}

.related-docs .requires-login:hover {
    text-decoration: underline;
}

/* Väike abiklass vasaku veerise jaoks (Bootstrap stiilis) */
.ms-1 {
    margin-left: 0.25rem;
}

/* --- OTSINGU LEHE TÄIENDUSED --- */

/* Uuenda/Lisa search-fragment stiil */
.search-fragment {
    font-size: 0.9rem;
    color: var(--hall-tekst);
    display: block;
    /* Tee plokiks, et oleks eraldi real */
    margin-bottom: 8px;
    /* Vahe pealkirja/sisuga */
    padding-left: 10px;
    border-left: 3px solid #eee;
    /* Visuaalne eraldaja */
    font-style: italic;
}

/* Täpsusta result-item sisu paigutust */
.result-item {
    display: flex;
    flex-direction: column;
}

/* Veendu, et lingid result-item sees on piisavalt suured ja eristatavad */
.result-item a {
    font-weight: 600;
    color: var(--link-varv);
    text-decoration: none;
    display: inline-block;
    /* Parandab klikitavust mobiilis */
    margin-top: 4px;
}

.result-item a:hover {
    text-decoration: underline;
}

/* Paranda materjali kaardi sisu paigutust otsingus */
.material-card .search-fragment {
    border-left: none;
    /* Kaardi sees pole äärist vaja */
    padding-left: 0;
    margin-bottom: 10px;
    border-bottom: 1px solid #eee;
    /* Eralda joonega alt */
    padding-bottom: 5px;
}

/* --- VIIDETE LEHE TÄIENDUSED --- */

/* Kindlusta, et viidete loendil oleks vahed */
.references-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Üksik viite kaart */
.reference-item {
    background-color: var(--element-taust);
    /* Vaikimisi valge */
    border: 1px solid #ddd;
    border-radius: var(--border-radius);
    padding: 15px;
    margin-bottom: 10px;
    /* Lisame sujuva ülemineku taustale ja varjule */
    transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

/* Efekt hiirega peale liikudes - mitteklõpsatav kaart jääb stabiilseks */
.reference-item:hover {
    background-color: var(--element-taust);
    border-color: #ddd;
    box-shadow: none;
}

/* Viite pealkiri */
.reference-item h4 {
    margin-top: 0;
    margin-bottom: 5px;
    font-size: 1.05rem;
    color: var(--tekst-varv);
}

/* Viite kirjeldus */
.reference-item p {
    margin-bottom: 0;
    margin-top: 5px;
    font-size: 0.9rem;
    color: var(--hall-tekst);
}

/* Lingi stiil */

/* Peida ja näita loogika jaoks */
.reference-card[style*="display: none"] {
    /* Eemaldatud tühi reegel */
    /* See on abiks debugimisel, aga funktsionaalselt teeb töö JS */
}

/* --- KATALOOGIDE SEKTSIOONID --- */

/* Üldine konteiner kataloogi grupile (pealkiri + sisu) */
.catalog-section {
    margin-top: 30px;
    /* Vahe eelmise sektsiooni lõpust */
    margin-bottom: 20px;
    /* Vahe järgmise sektsiooni alguseni */
    /* Soovi korral võib lisada ka visuaalse eraldaja, nt border-top */
}

/* Kataloogi pealkirja stiil (kehtib h2, h3 jne. mis on .catalog-section sees) */
.catalog-section h2,
.catalog-section h3,
.catalog-section h4 {
    color: var(--taltech-sinine);
    margin-bottom: 15px;
    /* Vahe pealkirja ja sisu (kaartide) vahel */
    padding-top: 10px;
    /* Väike siseruum ülal */
    font-weight: 600;
}

/* Kui kasutatakse eraldi .subsection klassi (nagu vaata_kohustuslikud.php), siis ühtlustame ka selle */
.subsection {
    margin-top: 30px;
    margin-bottom: 20px;
}

.subsection h3 {
    color: var(--taltech-sinine);
    margin-bottom: 15px;
}

/* --- NÄDALA INFO KAART --- */
.current-week-info {
    background-color: var(--kerge-taust);
    padding: 12px 20px;
    border-radius: var(--border-radius);
    margin-bottom: 25px;
    text-align: center;
    border: 1px solid #e0e0e0;
}

.current-week-info .info-content {
    font-size: 1.05rem;
    font-weight: 500;
    color: var(--tekst-varv);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.5rem;
    /* Vahe kuupäeva ja nädala vahel */
}

.current-week-info .date-part,
.current-week-info .week-part {
    white-space: normal;
    /* Lubame tekstil murduda, et see mahuks mobiiliekraanile */
}

/* Eraldaja peitmine flex-gap kasutamisel */
.current-week-info .separator {
    display: none;
}

@media (max-width: 576px) {
    .main-layout {
        padding: 0 10px;
        margin: 15px auto;
    }

    .nav-panel,
    .content-card {
        padding: 15px;
    }

    .quick-links-grid {
        grid-template-columns: 1fr 1fr;
    }

    .current-week-info .info-content {
        gap: 0.5rem;
        flex-direction: column;
        /* Mobiilis üksteise alla */
    }
}

/* --- OTSINGU ABIINFO --- */

/* Pealkiri summary sees */
.search-help-summary {
    cursor: pointer;
    color: var(--link-varv);
    font-weight: 500;
    display: flex;
    align-items: center;
}

.search-help-summary:hover {
    color: var(--taltech-sinine);
    text-decoration: underline;
}

.search-help-summary svg {
    vertical-align: text-bottom;
}

/* Abiinfo pealkirjad (h4) */
.search-help-card h4 {
    font-size: 1rem;
    color: var(--taltech-sinine);
    margin-bottom: 10px;
    font-weight: 600;
}

/* Abiinfo tekst */
.search-help-card p,
.search-help-card ul {
    font-size: 0.95rem;
    color: var(--hall-tekst);
    margin-bottom: 0.5rem;
}

/* Loendi elemendid */
.search-help-card li {
    margin-bottom: 0.25rem;
}

/* Koodinäited */
.search-help-card code {
    color: var(--taltech-sinine);
    background-color: rgba(0, 0, 0, 0.05);
    /* Õrn taust koodile */
    padding: 2px 4px;
    border-radius: 3px;
}

/* Märkuse tekst */
.search-help-card .search-note {
    font-size: 0.9rem;
    color: var(--taltech-burgundy);
    margin-top: 10px;
}

/* Päises oleva otsingu abinupu stiil */
.search-form-header .btn-outline-light {
    color: rgba(255, 255, 255, 0.7);
    border-color: transparent;
    /* Eemaldame äärejoone, et oleks puhtam */
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.search-form-header .btn-outline-light:hover,
.search-form-header .btn-outline-light:focus {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
}

/* Kohandused otsingu lehele main-layout sees */
.main-layout .search-form {
    margin-bottom: 20px;
    /* Tagame, et otsinguvorm ei oleks liiga lai suurel ekraanil, kui see on content-area sees */
    max-width: 100%;
}



/* Kui on vajahttps://maurus.ttu.ee/vaata_doc_voog.php?m_doc_catalog=4874&aine=389, et otsingutulemuste tabelid vms mahuksid ilusti ära */
.content-area .search-category .results {
    width: 100%;
    overflow-wrap: break-word;
}

/* --- LISATUD: Kataloogide esiletõstmine --- */

/* Väikesed vahed ikoonidele */
.me-1 {
    margin-right: 0.25rem !important;
}

.me-2 {
    margin-right: 0.5rem !important;
}

/* Paks kiri esiletõstetud linkidele */
.fw-bold {
    font-weight: 700 !important;
}

/* Esiletõstetud kataloogi pealkiri sisulehel */
.highlighted-catalog-title {
    color: var(--taltech-punane) !important;
    /* Muudab pealkirja punaseks */
    display: flex;
    /* Sunnib sisu (ikoon ja tekst) ühele reale */
    align-items: center;
    /* Joondab ikooni ja teksti vertikaalselt keskele */
    flex-wrap: wrap;
    /* Lubab murduda, kui pealkiri on väga pikk */
}

/* Tagame, et menüüs olevad ikoonid joonduvad tekstiga */
.nav-list li a svg,
.category-nav-list li a svg {
    flex-shrink: 0;
    /* Ikoon ei lähe kokku */
}

/* Parandus tooltipi ümbrisel, et see ei rikuks joondust */
.tooltip-wrapper {
    display: inline-block;
    line-height: 1;
}

/* --- PARANDUS: Esiletõstetud teksti loetavus akordionis --- */

/* 1. Vaikimisi (suletud akordion, valge taust): Tekst on TalTech punane */
.highlight-text {
    color: var(--taltech-punane);
    transition: color 0.2s ease;
}

/* 2. Avatud akordion (tumesinine taust): Tekst peab olema VALGE */
/* Kasutame !important, et kirjutada üle kõik muud võimalikud värvimäärangud */
.accordion-button:not(.collapsed) .highlight-text {
    color: #fff !important;
}

/* Lisaparandus: Tagame, et ka esiletõstu ikoon oleks avatud olekus selgelt nähtav */
/* Valikuline: võib jätta punaseks, aga heledam punane või valge on sinisel taustal parem */
.accordion-button:not(.collapsed) .bi-exclamation-circle-fill {
    /* Eemaldatud tühi reegel */
    /* Jätame ikooni punaseks, kuna see on universaalne hoiatusvärv, 
       teksti valgeks muutmine on loetavuse jaoks kriitilisem. */
}

/* --- PARANDUS: Esiletõstetud teksti loetavus hover-olekus --- */

/* 
   Kui kursor on avatud nupu kohal (:hover), muutub taust heledaks.
   Seetõttu peame teksti värvi muutma tagasi punaseks, et see oleks loetav.
*/
.accordion-button:not(.collapsed):hover .highlight-text {
    color: var(--taltech-punane) !important;
}

/* --- PARANDUS: Noole nähtavus hover-olekus --- */

/* 
   Vaikimisi teeb meie CSS avatud akordioni noole valgeks (filter: invert).
   Kuna hover-olekus on taust hele, peame selle filtri tühistama, 
   et nool oleks taas tume ja nähtav.
*/
.accordion-branded .accordion-button:not(.collapsed):hover::after {
    filter: none !important;
}

/* --- LISATUD: Aktiivse menüüpunkti stiil --- */

/* Aktiivne "Kiirvalik" nupp */
.quick-link-item.active {
    background-color: #dce4ec;
    /* Sama mis hover värv või veidi tumedam */
    color: var(--taltech-sinine);
    font-weight: 700;
    /* Paks kiri eristumiseks */
    box-shadow: inset 0 0 0 2px var(--taltech-sinine);
    /* Sinine raam seespool */
    transform: translateY(1px);
    /* Väike visuaalne efekt */
}

/* Erisus kollastele (important) nuppudele, kui need on aktiivsed */
.quick-link-item.important.active {
    background-color: #ffeeba;
    /* Veidi tumedam kollane */
    color: #856404;
    border-color: #856404;
}

/* --- Parandused: Automaatne kerimine ja fookus --- */

/* B: Tagab, et ankruga #main-content liikudes ei jää sisu päise alla peitu (sticky header fix) */
#main-content {
    scroll-margin-top: 100px;
    /* Varu üleval, et päis sisu ei kataks */
    outline: none;
    /* Eemaldab vaikimisi outline'i fookuse korral... */
}

/* C: ...aga näitab seda, kui fookus on pandud skripti poolt (ligipääsetavus) */
#main-content:focus-visible,
.alert:focus-visible,
h2:focus-visible {
    outline: 2px solid var(--taltech-sinine);
    outline-offset: 4px;
    border-radius: var(--border-radius);
}

/* Abiklass fookuse haldamiseks mitte-interaktiivsetel elementidel (nt pealkirjad, div-id) */
.js-focus-target {
    outline: none;
}

/* --- PARANDUS: Fookuse nähtavus teadetel --- */
.alert-taltech-success:focus,
.alert-taltech-danger:focus {
    outline: 2px solid var(--taltech-sinine);
    outline-offset: 2px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    /* Lisab kerge varju esiletõstuks */
}

/* --- PARANDUS: Fookus registreerimisvormil --- */
.registration-form:focus {
    outline: 2px solid var(--taltech-sinine) !important;
    outline-offset: 2px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

/* --- MOBIILNE HAMBURGER-MENÜÜ --- */

/* Vaikimisi peidame hamburgeri nupu desktopis */
.menu-toggler {
    display: none;
    width: 100%;
    padding: 10px 15px;
    background-color: var(--element-taust);
    border: 1px solid #ddd;
    border-radius: var(--border-radius);
    text-align: left;
    font-weight: 600;
    color: var(--taltech-sinine);
    margin-bottom: 10px;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

.menu-toggler:focus {
    outline: 2px solid var(--taltech-punane);
    outline-offset: 2px;
}

.menu-toggler-icon {
    width: 24px;
    height: 24px;
    fill: currentColor;
}

/* Mobiilivaate reeglid (sama breakpoint mis main-layout'il) */
@media (max-width: 992px) {

    /* Näitame hamburgeri nuppu */
    .menu-toggler {
        display: flex;
    }

    /* Peidame menüü sisu vaikimisi */
    .nav-panel-content {
        display: none;
        margin-top: 10px;
    }

    /* Kui menüü on avatud (JS lisab klassi 'show'), näitame sisu */
    .nav-panel-content.show {
        display: block;
        animation: fadeIn 0.3s ease-in-out;
    }

    /* Väike animatsioon sujuvaks avanemiseks */
    @keyframes fadeIn {
        from {
            opacity: 0;
            transform: translateY(-5px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    /* Eemaldame sticky positsioneerimise mobiilis, et menüü ei jääks ette */
    .nav-panel {
        position: static;
        padding: 0;
        /* Eemaldame paddingu, et nupp oleks äärest ääreni */
        background-color: transparent;
        box-shadow: none;
    }

    /* Taastame paddingu ja tausta sisu jaoks, kui see on avatud */
    .nav-panel-content {
        background-color: var(--element-taust);
        padding: 15px;
        border-radius: var(--border-radius);
        box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    }
}

/* --- KALENDRI PARENDUSED (UX/A11Y) --- */

/* 1. Parem loetavus kuu vaates */
.calendar-table th {
    text-transform: none;
    font-size: 0.85rem;
    letter-spacing: normal;
    background-color: var(--kerge-taust);
    border-bottom-width: 2px;
}

/* Desktopi vaade: hoiame tabeli puhtana */
.event-item {
    margin-bottom: 2px;
    font-weight: 500;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(0, 0, 0, 0.05);

    /* UUS: Teksti kärpimine CSS-iga, mitte PHP-ga */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    max-width: 100%;
}

/* Fookuse stiil klaviatuuriga liikumisel (tabindex=0 on juba PHP-s) */
.event-item:focus-visible {
    outline: 2px solid var(--taltech-punane);
    outline-offset: 1px;
    z-index: 50;
    /* Tõsta fookuses element teiste peale */
}


/* 4. Mobiilivaate kohandused */
@media (max-width: 992px) {
    /* --- 1. PÄIS JA NUPUD --- */

    .calendar-header {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
    }

    .calendar-title {
        width: 100%;
        text-align: center;
        order: -1;
        margin-bottom: 10px;
        font-size: 1.5rem;
    }

    /* Nupud "Eelmine" ja "Järgmine" */
    .calendar-header>.btn-outline-primary {
        flex-grow: 1;
        max-width: 48%;
    }

    /* Filtrid ja vaate nupud */
    .calendar-controls {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 10px;
        margin-top: 10px;
    }

    .calendar-controls .btn-group {
        display: flex;
        width: 100%;
    }

    .calendar-controls .btn {
        flex: 1;
        padding: 8px 2px;
        font-size: 0.85rem;
        white-space: normal;
    }

    /* --- 2. KALENDRI PÄEV (NIMEKIRJA VAADE) --- */

    /* Muudame tabeli elemendid plokkideks */
    .calendar-table,
    .calendar-table tbody,
    .calendar-table tr,
    .calendar-table td {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Peidame päise ja tühjad päevad */
    .calendar-table thead,
    .calendar-day-empty {
        display: none !important;
    }

    .table-responsive,
    .calendar-table {
        border: none !important;
        min-width: 0 !important;
    }

    /* Päeva kasti stiil */
    .calendar-day {
        height: auto !important;
        min-height: auto !important;
        margin-bottom: 15px;
        border: 1px solid #ddd !important;
        border-radius: var(--border-radius);
        background-color: #fff !important;
        padding: 15px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    }

    .calendar-day:hover {
        background-color: #fff !important;
        cursor: default !important;
    }

    /* --- 3. PÄEVA NUMBER JA JOON --- */

    .calendar-day .day-number {
        display: flex !important;
        /* Flex tagab sisu joonduse */
        width: 100% !important;
        /* Täislaius tagab joone pikkuse */
        position: static !important;
        float: none !important;
        text-align: left;
        font-weight: bold;
        font-size: 1.1rem;
        color: var(--taltech-sinine);
        border-bottom: 1px solid #eee;
        /* Joon all */
        margin-bottom: 10px;
        padding-bottom: 8px;
        align-items: baseline;
        justify-content: flex-start;
    }

    /* Lisame sõna "Kuupäev" */
    .calendar-day .day-number::before {
        content: "Kuupäev: ";
        font-weight: normal;
        font-size: 0.9rem;
        color: var(--hall-tekst);
        margin-right: 5px;
    }

    /* Tänase päeva number */
    .calendar-day.today .day-number {
        background-color: transparent !important;
        color: inherit !important;
        border-radius: 0;
    }

    .calendar-day.today .day-number::after {
        content: " (TÄNA)";
        color: #856404;
        font-weight: bold;
        font-size: 0.9rem;
        margin-left: 5px;
    }

    /* --- 4. SÜNDMUSED (TÄISLAIUS) --- */

    .events-list {
        width: 100% !important;
        /* Konteiner täislaiusesse */
        margin-top: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    /* Sündmuse kast */
    .event-item {
        display: block !important;
        width: 100% !important;
        /* Kast täislaiusesse */
        max-width: 100% !important;
        white-space: normal !important;
        /* Tekst murdub */
        height: auto !important;
        padding: 12px 15px;
        font-size: 0.95rem;
        line-height: 1.4;
        box-sizing: border-box;
    }

    /* --- 5. NÄDALA VAADE --- */
    .week-day-row {
        grid-template-columns: 1fr !important;
        gap: 10px;
        padding: 15px;
        background-color: var(--element-taust);
    }

    .week-day-row:hover {
        background-color: var(--element-taust) !important;
        cursor: default !important;
    }

    .week-day-date {
        border-bottom: 1px dashed #ddd;
        padding-bottom: 5px;
        margin-bottom: 10px;
        font-size: 1.1rem;
        display: block !important;
        width: 100% !important;
    }
}

/* 5. Prindivaade (üliõpilased prindivad vahel graafikuid) */
@media print {
    .main-layout {
        display: block;
    }

    .nav-panel,
    .calendar-controls,
    .btn,
    header,
    footer {
        display: none !important;
    }

    .calendar-container {
        box-shadow: none;
        border: none;
    }

    .calendar-day {
        height: auto !important;
        min-height: 80px;
    }

    .event-item {
        border: 1px solid #000;
        color: #000 !important;
        background: #fff !important;
    }
}

/* --- KALENDRI LEGEND --- */
.calendar-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
    margin-bottom: 20px;
    padding: 10px;
    background-color: var(--element-taust);
    border-radius: var(--border-radius);
    font-size: 0.9rem;
    color: var(--hall-tekst);
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.legend-dot {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    /* Veidi ümarad nurgad nagu sündmustel */
    display: inline-block;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

/* Mobiilivaate kohandus legendile */
@media (max-width: 992px) {
    .calendar-legend {
        justify-content: flex-start;
        /* Mobiilis joondame vasakule */
        gap: 10px;
    }

    .legend-item {
        width: 48%;
        /* Kaks tükki reas */
        font-size: 0.8rem;
    }
}

/* --- KALENDRI LEGENDI VÄRVID --- */

/* Ühepäevane sündmus / Tähtaeg (Roheline) */
.legend-dot.event-single {
    background-color: #62bb46;
    border-color: #53a03b;
}

/* Perioodi algus (Tumesinine) */
.legend-dot.event-multi-start {
    background-color: #342b60;
    border-color: #342b60;
}

/* Kestev sündmus (Helesinine) */
.legend-dot.event-multi {
    background-color: #4dbed2;
    border-color: #3aa8bb;
}

/* Perioodi lõpp (Kirsipunane) */
.legend-dot.event-multi-end {
    background-color: #aa1352;
    border-color: #c02a68;
}

/* --- Kalendri nädala vaate eesliited --- */
.event-prefix {
    font-weight: 700;
    /* Bold, vastab brändi nõuetele */
    margin-right: 4px;
    display: inline-block;
}

/* Tagame, et eesliide ei murduks ebasobivalt */
.week-day-events .event-item {
    word-break: break-word;
    /* Pikad kirjeldused murduvad korrektselt */
}

/* --- REGISTREERIMISE VORM --- */

/* Tingimuste kasti stiil, et see eristuks vormist */
#tingimused_tekst {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: var(--border-radius);
    padding: 15px;
    font-size: 0.9rem;
    color: var(--tekst-varv);
    margin-bottom: 10px;
}

/* Tagame, et märkeruut on joondatud */
.form-check-input {
    margin-top: 0.3rem;
    /* Joondab teksti esimese reaga */
}

/* Lülitite ja märkeruutude sisselülitatud/aktiivse oleku värv (TalTech tumesinine) */
.form-check-input:checked {
    background-color: #342b60 !important;
    border-color: #342b60 !important;
}


/* --- MENÜÜ KASUTATAVUSE PARANDUSED --- */

/* 1. Suurendame linkide puuteala ja vahesid (Kasutatavus + Ligipääsetavus) */
.category-nav-list li a,
.nav-list li a {
    padding-top: 10px;
    /* Rohkem ruumi üles */
    padding-bottom: 10px;
    /* Rohkem ruumi alla */
    line-height: 1.4;
}

/* 2. Tekitame paremale serva ruumi, et tekst ei läheks vastu kerimisriba */
.nav-panel-content {
    padding-right: 10px;
    /* Lisa-puhver kerimisriba jaoks */
}

/* 3. Disainitud kerimisriba (WebKit: Chrome, Edge, Safari) */
.nav-panel-content::-webkit-scrollbar {
    width: 8px;
    /* Kitsam kui tavaline (tavaliselt 17px) */
}

.nav-panel-content::-webkit-scrollbar-track {
    background: transparent;
    /* Taust on läbipaistev */
}

.nav-panel-content::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    /* Helehall "pöial" */
    border-radius: 4px;
    /* Ümarad otsad */
    border: 2px solid var(--element-taust);
    /* Tekitab "hõljumise" efekti */
}

.nav-panel-content::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0, 0, 0, 0.4);
    /* Tumedam, kui hiirega peale minna */
}

/* Firefoxi jaoks (standardne meetod) */
.nav-panel-content {
    scrollbar-width: thin;
    /* Kitsas kerimisriba */
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
    /* Pöidla ja raja värv */
}


/* --- ICAL EKSPORDI SEKTSIOON --- */

/* Tagame väikese teksti loetavuse ja kontrasti */
.info-card .text-muted {
    color: var(--hall-tekst) !important;
}

/* Nuppude vahe ja ikoonide paigutus */
.btn-group .btn svg {
    vertical-align: -0.125em;
    /* Joondab ikooni tekstiga visuaalselt keskele */
}

/* Mobiilisõbralikkuse tagamine flex-konteinerile */
@media (max-width: 576px) {
    .info-card .d-flex {
        flex-direction: column;
        align-items: flex-start !important;
    }

    .info-card .btn-group {
        width: 100%;
        margin-top: 10px;
    }

    .info-card .btn-group .btn {
        flex: 1;
        /* Nupud võtavad mobiilis võrdse laiuse */
    }
}

/* --- Lõputöö lehe teemade menüü (TalTech stiiliga, asendab Bootstrapi vaikimisi sinise) --- */
.thesis-section .list-group-item.active {
    background-color: var(--taltech-burgundy);
    border-color: var(--taltech-burgundy);
    color: white;
}

.thesis-section .list-group-item {
    color: var(--tekst-varv);
    transition: background-color 0.2s, color 0.2s;
}

.thesis-section .list-group-item:hover:not(.active) {
    background-color: var(--kerge-taust);
    color: var(--taltech-burgundy);
}

/* Lülitite ja märkeruutude sisselülitatud/aktiivse oleku värv (TalTech jätkusuutlik roheline) */
.form-check-input:checked {
    background-color: #62bb46 !important;
    border-color: #62bb46 !important;
}

/* --- LUGEMISVÄLJAD JA MITTEMUUDETAVAD ANDMED --- */
.form-control-readonly,
.form-control[readonly],
input[readonly].form-control {
    background-color: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
    color: #334155 !important;
    cursor: default;
}

/* --- VORMI ABITEKSTID JA ALAMLÕIGUD --- */
.form-subheading {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--taltech-navy, #1a1a3a);
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid #e2e8f0;
}

.form-text-hint {
    font-size: 0.85rem;
    color: #64748b;
    margin-top: 0.25rem;
    margin-bottom: 0;
}

/* --- E-POSTI DOMEENI PEHME SUUNAMINE (NUDGE) --- */
.email-domain-hint {
    display: none;
    font-size: 0.85rem;
    background-color: #f0f7ff;
    border: 1px solid #bae0ff;
    border-radius: 6px;
    padding: 6px 12px;
    margin-top: 6px;
    color: #003a8c;
    line-height: 1.4;
}

.email-domain-hint.show {
    display: flex;
    align-items: flex-start;
    gap: 6px;
}

.email-domain-hint svg,
.email-domain-hint i {
    flex-shrink: 0;
    margin-top: 2px;
}

/* --- MATERJALIDE FAILIDE ALLALAADIMISE NUPP --- */
.file-download-btn,
.file-info a.btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0.15rem 0.6rem !important;
    font-size: 0.85rem !important;
    border: 1px solid #ced4da !important;
    background-color: #f8f9fa !important;
    color: #495057 !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.file-download-btn:hover,
.file-info a.btn:hover {
    background-color: #e2e6ea !important;
    border-color: #adb5bd !important;
    color: var(--taltech-sinine) !important;
    text-decoration: none !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.file-download-btn:focus-visible,
.file-info a.btn:focus-visible {
    outline: 2px solid var(--taltech-punane) !important;
    outline-offset: 2px;
}

/* Seotud dokumentide väike allalaadimise ikoon */
.related-docs a[download],
.file-download-btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 4px !important;
    border-radius: 3px !important;
    background-color: #f8f9fa !important;
    border: 1px solid #dee2e6 !important;
    color: #6c757d !important;
    cursor: pointer !important;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.related-docs a[download]:hover,
.file-download-btn-icon:hover {
    background-color: #e2e6ea !important;
    border-color: #adb5bd !important;
    color: var(--taltech-sinine) !important;
}

/* --- LEMMIKUKS JA LOETUKS MÄRKIMISE LÜLITID (FORM-SWITCH) --- */
.favourite-link-wrapper .form-check.form-switch,
.form-check.form-switch {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0;
}

.form-check.form-switch .form-check-input {
    cursor: pointer !important;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out;
}

.form-check.form-switch .form-check-label {
    cursor: pointer !important;
    user-select: none;
    color: var(--tekst-varv);
    transition: color 0.15s ease-in-out;
}

/* Mikro-hover tagasiside lülitil */
.form-check.form-switch:hover .form-check-input,
.form-check.form-switch .form-check-input:hover {
    border-color: var(--taltech-sinine) !important;
}

.form-check.form-switch:hover .form-check-label,
.form-check.form-switch .form-check-label:hover {
    color: var(--taltech-sinine) !important;
}

.form-check.form-switch .form-check-input:focus-visible {
    border-color: var(--taltech-sinine) !important;
    box-shadow: 0 0 0 0.25rem rgba(52, 43, 96, 0.25) !important;
    outline: none !important;
}

/* --- TEGEVUSKAVA JA AVALEHE UI/UX TÄIUSTUSED --- */
.btn-taltech-primary {
    background-color: var(--taltech-burgundy);
    color: #ffffff !important;
    border: 1px solid var(--taltech-burgundy);
    font-weight: 600;
    transition: all 0.2s ease-in-out;
}
.btn-taltech-primary:hover,
.btn-taltech-primary:focus {
    background-color: #8a0f42;
    border-color: #8a0f42;
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(170, 19, 82, 0.3);
}

.current-week-info {
    background-color: #ffffff;
    border: 1px solid #d6e0ea;
    border-left: 5px solid var(--taltech-burgundy);
    border-radius: var(--border-radius);
    padding: 16px 20px;
    margin-bottom: 20px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    text-align: center;
}
.current-week-info .week-part {
    font-weight: 700;
    color: var(--taltech-burgundy);
}
.current-week-actions {
    margin-top: 12px;
}

/* Kuupäevade tabeli kirjelduste kompaktne kuvamine */
.date-description-content {
    max-height: 4.8em;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    line-height: 1.5;
    transition: max-height 0.25s ease-out;
}
.date-description-content:not(.expanded)::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1.8em;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.95));
    pointer-events: none;
}
.table-warning .date-description-content:not(.expanded)::after {
    background: linear-gradient(to bottom, rgba(255, 243, 205, 0), rgba(255, 243, 205, 0.95));
}
.date-description-content.expanded {
    max-height: 2000px;
}
.date-description-content:hover {
    opacity: 0.92;
}

/* Tegevuskava käimasoleva nädala esiletõst */
.accordion-item.current-week-item {
    border: 2px solid var(--taltech-burgundy) !important;
    border-radius: var(--border-radius) !important;
    box-shadow: 0 4px 12px rgba(170, 19, 82, 0.12);
    margin-bottom: 12px;
}
.accordion-item.current-week-item .accordion-button {
    background-color: #fdf5f8 !important;
    color: var(--taltech-burgundy) !important;
    font-weight: 700;
}
.accordion-item.current-week-item .accordion-body {
    background-color: #fff;
    padding: 24px;
}

/* Tegevuskava loetelude tüpograafiline õhulisus */
#accordion_nadal .accordion-body ul {
    padding-left: 1.2rem;
    margin-top: 0.5rem;
    margin-bottom: 1.2rem;
}
#accordion_nadal .accordion-body li {
    margin-bottom: 0.65rem;
    line-height: 1.6;
    color: #2b2b2b;
    list-style-type: none;
    position: relative;
    padding-left: 0.2rem;
}

/* Interaktiivne kontroll-leht (Checklist) */
.tk-checkbox {
    cursor: pointer;
    width: 1.15em;
    height: 1.15em;
    margin-top: 0.2em;
    vertical-align: top;
    border-color: #999;
}
.tk-checkbox:checked {
    background-color: #198754 !important;
    border-color: #198754 !important;
}
li.tk-item-done {
    color: #6c757d;
    background-color: #f8fff9;
    border-radius: 4px;
    padding: 2px 6px;
    transition: all 0.2s ease;
}
li.tk-item-done a {
    color: #49715a;
}

/* ==========================================================================
   Avalehe teadete akordioni ja küsimuste sektsiooni stiilid
   ========================================================================== */

.material-card.notice-card.is-collapsible {
    transition: all 0.2s ease;
}

.material-card.notice-card.is-collapsible .notice-toggle-header {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 8px;
    border-radius: var(--border-radius);
    transition: background-color 0.15s ease-in-out;
    margin-bottom: 0.25rem;
    user-select: none;
}

.material-card.notice-card.is-collapsible .pin-icon {
    flex-shrink: 0;
    align-self: center;
    margin: 0;
}

.material-card.notice-card.is-collapsible .material-name {
    flex-grow: 1;
    min-width: 0;
}

.material-card.notice-card.is-collapsible .notice-toggle-header:hover,
.material-card.notice-card.is-collapsible .notice-toggle-header:focus-visible {
    background-color: rgba(0, 0, 0, 0.04);
    outline: none;
}

.material-card.notice-card.is-collapsible.is-open .notice-toggle-header {
    margin-bottom: 0.75rem;
}

.material-card.notice-card.is-collapsed {
    padding-top: 10px;
    padding-bottom: 10px;
    opacity: 0.94;
}

.material-card.notice-card.is-collapsed:hover {
    opacity: 1;
    background-color: var(--card-clickable-hover-bg) !important;
    border-color: #b0c4de;
}

.notice-chevron-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--hall-tekst);
    margin-left: 12px;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    flex-shrink: 0;
}

.material-card.notice-card.is-open .notice-chevron-icon,
.notice-toggle-header[aria-expanded="true"] .notice-chevron-icon {
    transform: rotate(0deg);
}

.material-card.notice-card.is-collapsed .notice-chevron-icon,
.notice-toggle-header[aria-expanded="false"] .notice-chevron-icon {
    transform: rotate(-90deg);
}

.questions-section-header {
    border-top: 2px solid #e2e8f0;
    margin-top: 2.2rem;
    padding-top: 1.5rem;
    margin-bottom: 1.2rem;
}

.questions-section-header h3 {
    color: var(--taltech-sinine);
    font-size: 1.25rem;
    font-weight: 600;
}

/* ==========================================================================
   Tegevuskava alalõikude visuaalne liigendamine (Callout blocks)
   ========================================================================== */

.tk-callout {
    padding: 14px 18px !important;
    border-radius: var(--border-radius);
    margin-top: 0.4rem !important;
    margin-bottom: 1.5rem !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

/* Tähtajad */
.tk-callout-deadline {
    background-color: #fff8f8 !important;
    border: 1px solid #fed7d7;
    border-left: 4px solid var(--taltech-burgundy) !important;
}
.tk-callout-deadline-header b,
.tk-callout-deadline-header strong {
    color: var(--taltech-burgundy);
    font-size: 1.05rem;
}

/* Teooria */
.tk-callout-theory {
    background-color: #f6f8fc !important;
    border: 1px solid #d9e2ec;
    border-left: 4px solid var(--taltech-sinine) !important;
}
.tk-callout-theory-header b,
.tk-callout-theory-header strong {
    color: var(--taltech-sinine);
    font-size: 1.05rem;
}

/* Praktika / iseseisev töö */
.tk-callout-practice {
    background-color: #f4faf6 !important;
    border: 1px solid #cbe9d7;
    border-left: 4px solid #198754 !important;
}
.tk-callout-practice-header b,
.tk-callout-practice-header strong {
    color: #0f5132;
    font-size: 1.05rem;
}

/* Nõuanded ja meelespea */
.tk-callout-tips {
    background-color: #fffdf5 !important;
    border: 1px solid #f9eed0;
    border-left: 4px solid #d99b00 !important;
}
.tk-callout-tips-header b,
.tk-callout-tips-header strong {
    color: #856404;
    font-size: 1.05rem;
}

/* ==========================================================================
   Tegevuskava kleepuv ülariba (Sticky Bar)
   ========================================================================== */

#sticky-week-nav.sticky-week-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1040;
    background-color: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    border-bottom: 1px solid #dee2e6;
    animation: slideDownStickyNav 0.25s ease-out;
}

@keyframes slideDownStickyNav {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
    }
}

.sticky-nav-title {
    font-weight: 600;
    color: var(--taltech-sinine);
    font-size: 0.95rem;
}

#sticky-scroll-top-btn {
    font-size: 0.85rem;
    padding: 4px 12px;
}

/* ==========================================================================
   KKK akordioni konteineri stiilid (Avalehel)
   ========================================================================== */

.faq-accordion-card {
    background-color: var(--element-taust);
    border: 1px solid #d9e2ec;
    border-radius: var(--border-radius);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    transition: all 0.2s ease;
}

.faq-accordion-header {
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    background-color: #f8fafc;
    border-bottom: 1px solid transparent;
    user-select: none;
    transition: background-color 0.15s ease-in-out;
}

.faq-accordion-header:hover,
.faq-accordion-header:focus-visible {
    background-color: #edf2f7;
    outline: none;
}

.faq-accordion-card.is-open .faq-accordion-header {
    border-bottom-color: #e2e8f0;
    background-color: #f1f5f9;
}

.faq-accordion-card.is-open .notice-chevron-icon,
.faq-accordion-header[aria-expanded="true"] .notice-chevron-icon {
    transform: rotate(0deg);
}

.faq-accordion-card.is-collapsed .notice-chevron-icon,
.faq-accordion-header[aria-expanded="false"] .notice-chevron-icon {
    transform: rotate(-90deg);
}

.faq-accordion-body {
    padding: 14px 16px;
    background-color: #fff;
}

.faq-accordion-title {
    color: var(--taltech-sinine);
    font-weight: 600;
}

.notices-bulk-actions .btn {
    font-size: 0.8rem;
    padding: 2px 8px;
}

/* ==========================================================================
   Tegevuskava täiendavad ja neutraalsed esiletõsted
   ========================================================================== */

/* Neutraalne alalõik */
.tk-callout-neutral {
    background-color: #f8f9fa !important;
    border: 1px solid #e9ecef;
    border-left: 4px solid #6c757d !important;
}
.tk-callout-neutral-header b,
.tk-callout-neutral-header strong {
    color: #495057;
    font-size: 1.05rem;
}

/* Loetelude sees olevate alapealkirjade esiletõst */
.tk-subitem-callout {
    padding: 4px 10px;
    border-radius: 4px;
    margin-top: 4px;
    margin-bottom: 4px;
    display: block;
}
.tk-subitem-deadline {
    background-color: #fff5f5;
    border-left: 3px solid var(--taltech-burgundy);
}
.tk-subitem-theory {
    background-color: #f0f4f8;
    border-left: 3px solid var(--taltech-sinine);
}
.tk-subitem-practice {
    background-color: #f0fdf4;
    border-left: 3px solid #198754;
}
.tk-subitem-tips {
    background-color: #fefce8;
    border-left: 3px solid #d99b00;
}
.tk-subitem-neutral {
    background-color: #f8f9fa;
    border-left: 3px solid #6c757d;
}