/* ============================================================
   07-ELEMENTOR.CSS
   Elementor-spezifische Overrides (Dark-Theme)
   ------------------------------------------------------------
   Buttons = Outline-Gold-Pill (CD). Headlines = Libre Baskerville.
   Gescoped via body.gourmet-broker.
   ============================================================ */


/* 1. CONTAINER & SECTIONS */
.elementor-section.elementor-section-boxed > .elementor-container,
.e-con.e-con-boxed > .e-con-inner {
    max-width: var(--cd-container-max);
}


/* 2. HEADINGS IM HEADING-WIDGET */
.elementor-widget-heading .elementor-heading-title {
    font-family: var(--cd-font-heading);
    line-height: var(--cd-lh-tight);
    color: var(--cd-color-text);
}

.elementor-heading-title .cd-dot,
.elementor-heading-title .cd-highlight {
    color: var(--cd-color-primary);
}


/* 3. TEXT-EDITOR-WIDGET */
.elementor-widget-text-editor {
    font-family: var(--cd-font-body);
    font-weight: var(--cd-fw-medium);
    color: var(--cd-color-text);
    line-height: var(--cd-lh-relaxed);
}


/* 4. BILDER */
.elementor-widget-image.cd-img-rounded img {
    border-radius: var(--cd-radius-md);
}


/* 5. ICON-WIDGETS */
.elementor-widget-icon .elementor-icon,
.elementor-widget-icon-box .elementor-icon {
    color: var(--cd-color-text);
    transition: color var(--cd-transition-base);
}

.elementor-widget-icon:hover .elementor-icon,
.elementor-widget-icon-box:hover .elementor-icon {
    color: var(--cd-color-primary);
}


/* 6. ICON-BOX-WIDGET */
.elementor-widget-icon-box .elementor-icon-box-title {
    font-family: var(--cd-font-heading);
    font-weight: var(--cd-fw-semibold);
    color: var(--cd-color-text);
}

.elementor-widget-icon-box .elementor-icon-box-description {
    font-family: var(--cd-font-body);
    color: var(--cd-color-text-muted);
    line-height: var(--cd-lh-normal);
}


/* 7. ELEMENTOR FORMS */
body.gourmet-broker .elementor-form .elementor-field-group {
    margin-bottom: var(--cd-space-md);
}

body.gourmet-broker .elementor-form .elementor-field {
    border-radius: var(--cd-radius-md);
    background-color: var(--cd-color-surface);
    color: var(--cd-color-text);
    border-color: var(--cd-color-border);
}

.elementor-form .elementor-field-label {
    font-family: var(--cd-font-body);
    font-weight: var(--cd-fw-semibold);
    font-size: var(--cd-fs-small);
    color: var(--cd-color-text);
    margin-bottom: var(--cd-space-2xs);
}

.elementor-form .elementor-button {
    border-radius: var(--cd-radius-pill);
}

.elementor-message.elementor-message-success { color: #8FB98A; font-size: var(--cd-fs-small); }
.elementor-message.elementor-message-danger  { color: #E1655B; font-size: var(--cd-fs-small); }


/* ============================================================
   BUTTON-WIDGET — Outline-Gold-Pill (CD)
   ============================================================ */

body.gourmet-broker .elementor-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--cd-space-xs);
    padding: 0.8em 1.9em;
    border-radius: var(--cd-radius-pill);
    border: 1px solid var(--cd-color-primary);
    font-family: var(--cd-font-body);
    font-weight: var(--cd-fw-medium);
    font-size: var(--cd-fs-body);
    line-height: 1.2;
    letter-spacing: 0.02em;
    text-decoration: none;
    text-align: center;
    white-space: nowrap;
    background-color: transparent;
    color: var(--cd-color-primary);
    cursor: pointer;
    transition:
        background-color var(--cd-transition-base),
        border-color var(--cd-transition-base),
        color var(--cd-transition-base),
        transform var(--cd-transition-fast);
}

body.gourmet-broker .elementor-button:hover {
    background-color: var(--cd-color-primary);
    border-color: var(--cd-color-primary);
    color: var(--cd-color-text-on-primary);
}

body.gourmet-broker .elementor-button:focus-visible {
    outline: 2px solid var(--cd-color-primary);
    outline-offset: 3px;
}

body.gourmet-broker .elementor-button:active {
    transform: translateY(1px);
}

/* — Varianten — */
body.gourmet-broker .elementor-button.cd-btn--solid {
    background-color: var(--cd-color-primary);
    border-color: var(--cd-color-primary);
    color: var(--cd-color-text-on-primary);
}

body.gourmet-broker .elementor-button.cd-btn--solid:hover {
    background-color: var(--cd-color-primary-soft);
    border-color: var(--cd-color-primary-soft);
    color: var(--cd-color-text-on-primary);
}

body.gourmet-broker .elementor-button.cd-btn--light {
    background-color: transparent;
    border-color: var(--cd-color-text);
    color: var(--cd-color-text);
}

body.gourmet-broker .elementor-button.cd-btn--light:hover {
    background-color: var(--cd-color-text);
    color: var(--cd-color-bg);
}

body.gourmet-broker .elementor-button.cd-btn--ghost {
    background-color: transparent;
    border-color: transparent;
    color: var(--cd-color-primary);
    padding-inline: 0;
}

body.gourmet-broker .elementor-button.cd-btn--ghost:hover {
    color: var(--cd-color-primary-soft);
}


/* ============================================================
   ICON-LIST-WIDGET
   ============================================================ */

body.gourmet-broker .elementor-widget-icon-list .elementor-icon-list-item {
    margin-bottom: var(--cd-space-xs);
    transition: transform var(--cd-transition-base);
}

body.gourmet-broker .elementor-widget-icon-list .elementor-icon-list-item:hover {
    transform: translateX(4px);
}

body.gourmet-broker .elementor-widget-icon-list .elementor-icon-list-icon i,
body.gourmet-broker .elementor-widget-icon-list .elementor-icon-list-icon svg {
    color: var(--cd-color-primary);
    transition: color var(--cd-transition-base);
}

body.gourmet-broker .elementor-widget-icon-list .elementor-icon-list-text {
    color: var(--cd-color-text);
    font-family: var(--cd-font-body);
    font-weight: var(--cd-fw-medium);
    transition: color var(--cd-transition-base);
}

body.gourmet-broker .elementor-widget-icon-list .elementor-icon-list-item:hover .elementor-icon-list-text {
    color: var(--cd-color-primary);
}


/* 9. DIVIDER-WIDGET */
body.gourmet-broker .elementor-widget.elementor-widget-divider {
    --divider-color: var(--cd-color-primary);
    --divider-border-style: solid;
    --divider-border-width: 1px;
}

body.gourmet-broker .elementor-widget.elementor-widget-divider .elementor-divider-separator {
    border-top-color: var(--divider-color);
}


/* 10. PROGRESS-BAR-WIDGET */
.elementor-widget-progress .elementor-progress-bar {
    background-color: var(--cd-color-primary);
}


/* ============================================================
   AKKORDEON / TOGGLE
   ============================================================ */

body.gourmet-broker .elementor-accordion .elementor-accordion-item {
    border: 1px solid var(--cd-color-border);
    border-radius: var(--cd-radius-md);
    margin-bottom: var(--cd-space-xs);
    overflow: hidden;
    background-color: var(--cd-color-surface);
}

body.gourmet-broker .elementor-accordion .elementor-tab-title,
body.gourmet-broker .elementor-toggle .elementor-toggle-title {
    background-color: var(--cd-color-surface);
    color: var(--cd-color-text);
    font-family: var(--cd-font-heading);
    font-weight: var(--cd-fw-semibold);
    padding: var(--cd-space-sm) var(--cd-space-md);
    border: none;
    transition: background-color var(--cd-transition-base), color var(--cd-transition-base);
}

body.gourmet-broker .elementor-accordion .elementor-tab-title:hover,
body.gourmet-broker .elementor-toggle .elementor-toggle-title:hover {
    background-color: var(--cd-color-primary-tint);
    color: var(--cd-color-primary);
}

body.gourmet-broker .elementor-accordion .elementor-tab-title.elementor-active,
body.gourmet-broker .elementor-toggle .elementor-toggle-title.elementor-active {
    background-color: var(--cd-color-primary);
    color: var(--cd-color-text-on-primary);
}

body.gourmet-broker .elementor-accordion .elementor-tab-content,
body.gourmet-broker .elementor-toggle .elementor-tab-content {
    background-color: var(--cd-color-surface);
    color: var(--cd-color-text);
    padding: var(--cd-space-md);
    line-height: var(--cd-lh-relaxed);
    border-top: 1px solid var(--cd-color-border);
}


/* NESTED ACCORDION */
body.gourmet-broker .elementor-widget-n-accordion {
    --n-accordion-title-normal-color: var(--cd-color-text);
    --n-accordion-title-hover-color: var(--cd-color-primary);
    --n-accordion-title-active-color: var(--cd-color-text-on-primary);
    --n-accordion-title-normal-background-color: var(--cd-color-surface);
    --n-accordion-title-hover-background-color: var(--cd-color-primary-tint);
    --n-accordion-title-active-background-color: var(--cd-color-primary);
    --n-accordion-border-color: var(--cd-color-border);
    --n-accordion-border-width: 1px;
    --n-accordion-border-radius: var(--cd-radius-md);
    --n-accordion-padding: var(--cd-space-sm) var(--cd-space-md);
}

body.gourmet-broker .elementor-widget-n-accordion .e-n-accordion-item {
    margin-bottom: var(--cd-space-xs);
}

body.gourmet-broker .elementor-widget-n-accordion .e-n-accordion-item-title {
    font-family: var(--cd-font-heading);
    font-weight: var(--cd-fw-semibold);
    transition: background-color var(--cd-transition-base), color var(--cd-transition-base);
}

body.gourmet-broker .elementor-widget-n-accordion .e-n-accordion-item[open] > .e-n-accordion-item-title {
    background-color: var(--cd-color-primary);
    color: var(--cd-color-text-on-primary);
}


/* 12. POSTS-WIDGET */
.elementor-posts .elementor-post__title {
    font-family: var(--cd-font-heading);
    font-weight: var(--cd-fw-semibold);
}

.elementor-posts .elementor-post__title a {
    color: var(--cd-color-text);
    text-decoration: none;
    transition: color var(--cd-transition-base);
}

.elementor-posts .elementor-post__title a:hover {
    color: var(--cd-color-primary);
}


/* ICON-WIDGET */
body.gourmet-broker .elementor-widget-icon .elementor-icon {
    color: var(--cd-color-primary);
    transition: color var(--cd-transition-base), transform var(--cd-transition-base);
}

body.gourmet-broker .elementor-widget-icon .elementor-icon:hover {
    color: var(--cd-color-primary-soft);
    transform: scale(1.05);
}


/* ============================================================
   13. HEADER & NAVIGATION (dunkel)
   ============================================================ */

.site-header,
header.elementor-location-header {
    background-color: var(--cd-color-bg);
    border-bottom: 1px solid var(--cd-color-border);
    box-shadow: var(--cd-shadow-sm);
}

.site-branding img,
.custom-logo,
.elementor-widget-site-logo img {
    max-height: 60px;
    width: auto;
}

.main-navigation,
.elementor-nav-menu--main {
    font-family: var(--cd-font-body);
    font-weight: var(--cd-fw-medium);
    font-size: var(--cd-fs-small);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.main-navigation a,
.elementor-nav-menu .elementor-item {
    color: var(--cd-color-text);
    text-decoration: none;
    transition: color var(--cd-transition-base);
}

.main-navigation a:hover,
.elementor-nav-menu .elementor-item:hover {
    color: var(--cd-color-primary);
    text-decoration: none;
}

.main-navigation .current-menu-item > a,
.elementor-nav-menu .elementor-item.elementor-item-active {
    color: var(--cd-color-primary);
    border-bottom: 1px solid var(--cd-color-primary);
}

.main-navigation .sub-menu,
.elementor-nav-menu .sub-menu {
    background-color: var(--cd-color-surface);
    border-top: 2px solid var(--cd-color-primary);
    box-shadow: var(--cd-shadow-md);
    border-radius: 0 0 var(--cd-radius-md) var(--cd-radius-md);
}

.main-navigation .sub-menu a,
.elementor-nav-menu .sub-menu a {
    font-weight: var(--cd-fw-medium);
    text-transform: none;
    padding: var(--cd-space-xs) var(--cd-space-sm);
}

.elementor-menu-toggle {
    color: var(--cd-color-primary);
}


/* ============================================================
   14. FOOTER (Schwarz mit Gold-Akzenten)
   ============================================================ */

.site-footer,
footer.elementor-location-footer {
    background-color: #1D1918;
    color: var(--cd-color-text-muted);
    font-size: var(--cd-fs-small);
    border-top: 1px solid var(--cd-color-primary);
    padding-block: var(--cd-space-lg) var(--cd-space-sm);
}

.site-footer a,
footer.elementor-location-footer a {
    color: var(--cd-color-text-muted);
    text-decoration: none;
    transition: color var(--cd-transition-base);
}

.site-footer a:hover,
footer.elementor-location-footer a:hover {
    color: var(--cd-color-primary);
    text-decoration: none;
}

.site-footer h4,
.site-footer h5,
footer.elementor-location-footer h4,
footer.elementor-location-footer h5,
.cd-footer-widget__title {
    font-family: var(--cd-font-heading);
    color: var(--cd-color-primary);
    font-size: var(--cd-fs-h6);
    font-weight: var(--cd-fw-semibold);
    margin-bottom: var(--cd-space-xs);
    padding-bottom: var(--cd-space-2xs);
    border-bottom: 1px solid rgba(200, 145, 22, 0.3);
}

.cd-footer-widget {
    margin-bottom: var(--cd-space-md);
}

.cd-footer-bottom {
    border-top: 1px solid rgba(235, 235, 236, 0.10);
    margin-top: var(--cd-space-md);
    padding-top: var(--cd-space-sm);
    font-size: 0.75rem;
    color: var(--cd-color-text-muted);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--cd-space-2xs);
}

@media (max-width: 480px) {
    .cd-footer-bottom {
        flex-direction: column;
        text-align: center;
    }
}


/* ============================================================
   ZUSATZ-INFO — BACKEND (keine CSS)
   ──────────────────────────────────────────────────────────
   Elementor → Site Settings → Globale Farben:
      Akzent (Gold)   #C89116
      Hintergrund     #262122
      Text            #EBEBEC
      Bordeaux        #5F2B2A
   Globale Schriftarten: Libre Baskerville (überall)
   Layout: Container 1200 · Padding 24
   ============================================================ */
