/* Public Bosch (Perfect Cooking) registration pages */

@font-face {
    font-family: 'SiemensSansRoman';
    src: url('../bosch/fonts/siemenssans-roman-webfont.eot');
    src: url('../bosch/fonts/siemenssans-roman-webfont.eot?#iefix') format('embedded-opentype'),
         url('../bosch/fonts/siemenssans-roman-webfont.woff2') format('woff2'),
         url('../bosch/fonts/siemenssans-roman-webfont.woff') format('woff'),
         url('../bosch/fonts/siemenssans-roman-webfont.ttf') format('truetype'),
         url('../bosch/fonts/siemenssans-roman-webfont.svg#siemens_sansroman') format('svg');
    font-weight: normal;
    font-style: normal;
}

:root {
    --bosch-blue: #215f8b;
    --bosch-blue-dark: #004664;
    --bosch-red: #ea0016;
    --bosch-border: #c7cdd3;
    --bosch-bg: #f3f5f7;
    --bosch-text: #1c2b36;
}

*, *::before, *::after { box-sizing: border-box; }

body.bosch {
    margin: 0;
    padding: 20px 10px;
    background: var(--bosch-bg);
    color: var(--bosch-text);
    font-family: 'SiemensSansRoman', Helvetica, Arial, sans-serif;
    font-size: 15px;
    line-height: 1.5;
}

.bosch a { color: var(--bosch-blue); text-decoration: underline; }
.bosch a:hover { color: var(--bosch-blue-dark); }

#wrap-bosch {
    max-width: 780px;
    margin: 0 auto;
    background: #fff;
    border-top: 5px solid var(--bosch-red);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .08);
}

.bosch-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 40px;
    border-bottom: 1px solid var(--bosch-border);
}
.bosch-header img { display: block; width: auto; }
.bosch-header .bosch-logo { height: 64px; }
.bosch-header .bosch-claim { height: 30px; }

.bosch-body { padding: 30px 40px 40px; }

.bosch h1 { margin: 0 0 6px; font-size: 28px; line-height: 1.25; font-weight: normal; color: var(--bosch-text); }
.bosch h2 { margin: 0 0 14px; font-size: 18px; font-weight: normal; color: var(--bosch-blue); }
.bosch p { margin: 0 0 12px; }

.bosch-event {
    background: var(--bosch-bg);
    border-left: 4px solid var(--bosch-blue);
    padding: 14px 18px;
    margin: 18px 0 28px;
}
.bosch-event strong { display: block; }
.bosch-event .price { margin-top: 4px; color: var(--bosch-blue); }

.bosch-section { margin-bottom: 30px; }
.bosch-section > h2 { padding-bottom: 6px; border-bottom: 1px solid var(--bosch-border); }

.b-row { display: flex; gap: 20px; align-items: flex-start; margin-bottom: 14px; }
.b-row > label, .b-row > .b-label { flex: 0 0 38%; padding-top: 8px; }
.b-row > .b-field { flex: 1 1 auto; min-width: 0; }

.b-field input[type="text"],
.b-field input[type="email"],
.b-field input[type="tel"],
.b-field select,
.b-field textarea {
    display: block;
    width: 100%;
    font: inherit;
    color: var(--bosch-text);
    background: #fff;
    border: 1px solid var(--bosch-border);
    border-radius: 2px;
    padding: 8px 10px;
    transition: border-color .15s, box-shadow .15s;
}
.b-field input, .b-field select { height: 40px; }
.b-field textarea { resize: vertical; }

.b-field input:focus, .b-field select:focus, .b-field textarea:focus {
    outline: none;
    border-color: var(--bosch-blue);
    box-shadow: 0 0 0 2px rgba(33, 95, 139, .2);
}

.b-field select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 34px;
    background: #fff url('../bosch/pfeil_dropdown.png') no-repeat right 10px center / 14px;
}

.b-field .is-invalid, .is-invalid.b-field input { border-color: var(--bosch-red) !important; }
.field-error { color: var(--bosch-red); font-size: 13px; margin-top: 4px; }

.bosch-alert {
    background: #fdecee;
    border: 1px solid #f3b4bb;
    color: #8a0010;
    padding: 12px 16px;
    margin: 0 0 24px;
}
.bosch-alert ul { margin: 6px 0 0; padding-left: 18px; }

.hide { display: none !important; }

/* checkboxes */
.b-check { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 10px; cursor: pointer; }
.b-check input { margin: 4px 0 0; width: 16px; height: 16px; flex: 0 0 auto; accent-color: var(--bosch-blue); }
.b-check.is-invalid span { color: var(--bosch-red); }
.b-offset { margin-left: calc(38% + 20px); }

.b-companion { background: var(--bosch-bg); padding: 16px 18px 6px; margin-bottom: 14px; }

/* buttons */
.b-btn {
    display: inline-block;
    border: 0;
    cursor: pointer;
    background: var(--bosch-blue);
    color: #fff;
    font: inherit;
    font-weight: bold;
    text-decoration: none;
    padding: 12px 34px 12px 22px;
    position: relative;
    border-radius: 2px;
}
.b-btn::after {
    content: '';
    position: absolute;
    right: 14px;
    top: 50%;
    width: 7px;
    height: 7px;
    margin-top: -5px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
}
.b-btn:hover { background: var(--bosch-blue-dark); color: #fff; }

.b-link-btn { background: none; border: 0; padding: 0; font: inherit; color: var(--bosch-blue); cursor: pointer; text-decoration: underline; }
.b-link-btn:hover { color: var(--bosch-blue-dark); }

.b-actions { display: flex; justify-content: space-between; align-items: center; gap: 15px; flex-wrap: wrap; margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--bosch-border); }
.b-actions.right { justify-content: flex-end; }

.b-interests { display: flex; gap: 20px; align-items: flex-start; }
.b-interests > .b-label { flex: 0 0 38%; }

/* summary */
.bosch-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 30px; margin-bottom: 20px; }
.bosch-summary .block { background: var(--bosch-bg); padding: 14px 18px; }
.bosch-summary .block.wide { grid-column: 1 / -1; }
.bosch-summary h2 { font-size: 15px; margin-bottom: 8px; }
.bosch-summary dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 2px 14px; }
.bosch-summary dt { color: #6b7782; }
.bosch-summary dd { margin: 0; }

.price_detail { margin-top: 10px; }
.price_amt { display: flex; justify-content: space-between; gap: 20px; }
.price_amt.total { border-top: 1px solid var(--bosch-text); margin-top: 6px; padding-top: 6px; font-weight: bold; }

.privacy-text { background: var(--bosch-bg); padding: 12px 16px; margin: 6px 0 16px; font-size: 13px; }

@media (max-width: 700px) {
    .bosch-header, .bosch-body { padding-left: 18px; padding-right: 18px; }
    .bosch-header .bosch-logo { height: 46px; }
    .bosch-header .bosch-claim { height: 20px; }
    .b-row, .b-interests { display: block; }
    .b-row > label, .b-row > .b-label, .b-interests > .b-label { display: block; padding-top: 0; margin-bottom: 4px; }
    .b-offset { margin-left: 0; }
    .bosch-summary { grid-template-columns: 1fr; }
}