/*
 * IMS Coveto Jobs – Elementor Widget
 * Die Regeln sind absichtlich auf das Widget begrenzt, damit die normale
 * Coveto-Ausgabe außerhalb von Elementor unverändert bleibt.
 */

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget {
    width: 100%;
}

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-tabs-layout {
    display: grid;
    grid-template-columns: 500px minmax(0, 1fr);
    gap: 32px;
    align-items: start;
}

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-tabs-nav {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-tab-button {
    width: 100%;
    box-sizing: border-box;
}

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-tab-button-title,
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-tab-button-count {
    font-family: inherit;
}

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-tabs-content {
    min-width: 0;
}

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-panel-title {
    margin-top: 0;
}

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .single-job-item {
    box-sizing: border-box;
}

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .single-job-item h4 {
    margin-top: 0;
}

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .single-job-item p:last-child {
    margin-bottom: 0;
}

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .single-job-item a {
    text-decoration: none;
}

.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget__notice {
    padding: 16px 18px;
    border: 1px solid currentColor;
    border-radius: 12px;
}

/* Tablet/Mobil: Navigation über den Stellen */
@media (max-width: 980px) {
    .elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-tabs-layout {
        grid-template-columns: 1fr !important;
    }
}

/* Ohne Kategorienavigation nutzt der Inhaltsbereich die volle Breite. */
.ims-coveto-jobs-widget .coveto-tabs-layout.coveto-tabs-no-nav {
    display: block;
}

.ims-coveto-jobs-widget .coveto-tabs-layout.coveto-tabs-no-nav .coveto-tab-panel {
    display: block;
    margin-bottom: 40px;
}

/* Jobinfo-Layout: die Coveto-Ausgabe kann die Klasse auf dem Container
   ODER auf jeder einzelnen Kachel verwenden. Beide Strukturen unterstuetzen. */
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget {
    --ims-jobinfo-columns: 4;
    --ims-jobinfo-gap: 20px;
}
/* Variante A: Container ist .coveto-section-jobinfos */
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-section-jobinfos:not(:has(> .coveto-section-jobinfos)) {
    min-width: 0;
    box-sizing: border-box;
}
/* Variante B: .coveto-section-jobinfos bezeichnet einzelne Kacheln.
   Hier muss der gemeinsame Elterncontainer das Grid erhalten. */
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget :has(> .coveto-section-jobinfos ~ .coveto-section-jobinfos):not(.coveto-contact):not(:has(> .coveto-contact)) {
    display: grid !important;
    grid-template-columns: repeat(var(--ims-jobinfo-columns), minmax(0, 1fr)) !important;
    gap: var(--ims-jobinfo-gap) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
}
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget :has(> .coveto-section-jobinfos ~ .coveto-section-jobinfos):not(.coveto-contact):not(:has(> .coveto-contact)) > .coveto-section-jobinfos {
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    box-sizing: border-box;
}
/* Variante A: Wenn .coveto-section-jobinfos selbst mehrere direkte Kacheln
   enthaelt, wird das Grid dort aufgebaut. */
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-section-jobinfos:has(> :not(.coveto-section-jobinfos)) {
    /* Kein pauschales Grid: kann auch eine einzelne Kachel sein. */
}
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-section-jobinfos,
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-section-jobinfos * {
    overflow-wrap: normal;
    word-break: normal;
}
@media (max-width: 1024px) {
    .elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget { --ims-jobinfo-columns: 2; }
}
@media (max-width: 767px) {
    .elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget { --ims-jobinfo-columns: 1; }
}

/* Kontaktbereich strikt vom Jobinfo-Grid trennen.
   Diese Regeln greifen nur auf die Kontaktsektion und ihre unmittelbaren
   Layout-Kinder; die Jobinfo-Spaltenzahl darf sie nicht beeinflussen. */
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-contact {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-contact :is(p, a, strong) {
    overflow-wrap: break-word;
    word-break: normal;
}

/* Separate Kontaktspalten, unabhaengig von den Jobinfos.
   Coveto verwendet je nach Ausgabe eine Datenhuelle oder direkte Kontaktfelder. */
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget {
    --ims-contact-columns: 3;
    --ims-contact-gap: 24px;
}
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-contact :is(.coveto-contact-data, .coveto-contact-info, .coveto-contact-details) {
    display: grid !important;
    grid-template-columns: repeat(var(--ims-contact-columns), minmax(0, 1fr)) !important;
    gap: var(--ims-contact-gap) !important;
    width: 100%;
    min-width: 0;
    align-items: start;
}
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-contact :is(.coveto-contact-data, .coveto-contact-info, .coveto-contact-details) > * {
    min-width: 0;
    max-width: 100%;
    text-align: var(--ims-contact-align, left);
}
/* Auch die Variante mit drei direkten Datenfeldern ohne Zwischencontainer. */
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-contact:has(> .coveto-contact-item ~ .coveto-contact-item) {
    display: grid !important;
    grid-template-columns: repeat(var(--ims-contact-columns), minmax(0, 1fr)) !important;
    gap: var(--ims-contact-gap) !important;
}
.elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget .coveto-contact > .coveto-contact-item {
    min-width: 0;
    text-align: var(--ims-contact-align, left);
}
@media (max-width: 1024px) {
    .elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget { --ims-contact-columns: 2; }
}
@media (max-width: 767px) {
    .elementor-widget-ims-coveto-jobs .ims-coveto-jobs-widget { --ims-contact-columns: 1; }
}
