/**
 * Bridge: v1 functional components inside the v2 theme (.donamic_redesign2).
 *
 * The v2 bundle deliberately ships no v1 component CSS. Functional v1
 * components (license calculator, addon forms) that are reused 1:1 on v2
 * pages reference v1 classes (btn-donamic*) and sit in dark bands where the
 * v2 heading color (dark ink) is unreadable. This file maps just enough.
 *
 * Loaded only by v2 pages that embed such components (via $additionalCss).
 * Dies together with v1 once the functional components are rebuilt (S10).
 */

/* v1 button family -> v2 button look */
.donamic_redesign2 .btn-donamic {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 13px 24px;
    border-radius: 10px;
    border: none;
    font-family: 'IBM Plex Sans', 'Segoe UI', system-ui, sans-serif;
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.donamic_redesign2 .btn-donamic-primary {
    background: #63E526;
    color: #102530;
}
.donamic_redesign2 .btn-donamic-primary:hover {
    background: #55d51d;
    color: #102530;
}

.donamic_redesign2 .btn-donamic-outline-light {
    background: transparent;
    border: 1.5px solid rgba(255, 255, 255, 0.55);
    color: #ffffff;
    padding: 12px 22px;
}
.donamic_redesign2 .btn-donamic-outline-light:hover {
    border-color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

.donamic_redesign2 .btn-donamic-lg {
    padding: 16px 30px;
    font-size: 1.0625rem;
}

/* Headings inside the calculator sit on a dark band - the v2 theme paints
   h1-h4 in dark ink, override inside the component scope */
.donamic_redesign2 .lc-calculator h1,
.donamic_redesign2 .lc-calculator h2,
.donamic_redesign2 .lc-calculator h3,
.donamic_redesign2 .lc-calculator h4,
.donamic_redesign2 .lc-calculator .lc-summary-title,
.donamic_redesign2 .lc-calculator .lc-section-title {
    color: #ffffff;
}

/* Links inside the dark calculator (privacy note etc.) */
.donamic_redesign2 .lc-calculator a {
    color: #63E526;
}
.donamic_redesign2 .lc-calculator a:hover {
    color: #55d51d;
}

/* v1 form primitives used by the reused components (bundle configurator,
   addon forms) - minimal dark-context styling */
.donamic_redesign2 .form-group-donamic {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.donamic_redesign2 .form-label-donamic {
    font-size: 0.875rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.88);
}
.donamic_redesign2 .input-donamic {
    appearance: none;
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    padding: 12px 15px;
    font-family: 'IBM Plex Sans', 'Segoe UI', system-ui, sans-serif;
    font-size: 0.9375rem;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.06);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.donamic_redesign2 .input-donamic::placeholder { color: rgba(255, 255, 255, 0.35); }
.donamic_redesign2 .input-donamic:focus {
    outline: none;
    border-color: #63E526;
    box-shadow: 0 0 0 3px rgba(99, 229, 38, 0.15);
}
.donamic_redesign2 select.input-donamic option { color: #14303d; background: #ffffff; }

/* Dark component bands: headings inside reused v1 markup */
.donamic_redesign2 .bdl-configurator h3,
.donamic_redesign2 .bdl-configurator h4,
.donamic_redesign2 .ao-calculator h3,
.donamic_redesign2 .ao-calculator h4,
.donamic_redesign2 .ao-trial h3,
.donamic_redesign2 .ao-trial h4 {
    color: #ffffff;
}
.donamic_redesign2 .bdl-configurator a,
.donamic_redesign2 .ao-calculator a,
.donamic_redesign2 .ao-trial a {
    color: #63E526;
}

/* Form titles (h2.ao-title "Add-on anfragen", h2.ao-trial-title
   "Kostenlose Testversion", the contact step #ao-contact-form) sit in the same
   dark band but were painted in v2 dark ink - invisible */
.donamic_redesign2 #ao-forms-section h2,
.donamic_redesign2 #ao-forms-section h3,
.donamic_redesign2 #ao-forms-section h4,
.donamic_redesign2 .ao-calculator h2,
.donamic_redesign2 .ao-trial h2,
.donamic_redesign2 #ao-contact-form h2,
.donamic_redesign2 #ao-contact-form h3 {
    color: #ffffff;
}

/* License calculator on phones: the v1 grid uses a plain 1fr and a nowrap
   price column, both push the page sideways below ~420px */
.donamic_redesign2 .lc-calculator {
    grid-template-columns: minmax(0, 1fr) 340px;
}
@media (max-width: 900px) {
    .donamic_redesign2 .lc-calculator {
        grid-template-columns: minmax(0, 1fr);
    }
}
.donamic_redesign2 .lc-calculator > *,
.donamic_redesign2 .lc-addon-info {
    min-width: 0;
}
@media (max-width: 479px) {
    .donamic_redesign2 .lc-addon-item {
        flex-wrap: wrap;
    }
    .donamic_redesign2 .lc-addon-price {
        flex-basis: 100%;
        text-align: left;
        padding-left: 32px; /* align under the name, past the checkbox */
    }
}
