/* MINT Zukunft file: _main.css */

/* Schriften -- vom eigenen Server, nicht von Google: keine externen Abrufe
   aus dem Backoffice, und nichts bricht, wenn ein CDN wegfaellt.
   Lizenz: SIL OFL 1.1, siehe fonts/LICENSE-*.txt. Absolute Pfade, weil
   RiverLea Stream-CSS ueber den Asset-Builder ausliefern kann. */
@font-face { font-family: "Cooper Hewitt"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/extensions/mint-oberflaeche/fonts/cooper-hewitt-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Cooper Hewitt"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("/extensions/mint-oberflaeche/fonts/cooper-hewitt-latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Cooper Hewitt"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("/extensions/mint-oberflaeche/fonts/cooper-hewitt-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Archivo Narrow"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/extensions/mint-oberflaeche/fonts/archivo-narrow-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Archivo Narrow"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("/extensions/mint-oberflaeche/fonts/archivo-narrow-latin-700-normal.woff2") format("woff2"); }

/*
    Name: MINT Zukunft;
    Description: Corporate Design von MINT Zukunft e. V. Grundlage ist der
    Stream "Walbrook" aus RiverLea; geaendert sind Farben, Schriften und
    Rundungen. Werte am 13.11.2026 von mintzukunftschaffen.de gemessen
    (berechnete Stile im Browser, nicht aus Annahmen).
*/

:root {
/* Colour names */
  --crm-c-gray-900: #192930;
  --crm-c-gray-800: #2c3d44;
  --crm-c-gray-700: #6f6d66;
  --crm-c-gray-300: #d4d1ca;
  --crm-c-gray-200: #e2dfd8;
  --crm-c-gray-100: #eeece8;
  --crm-c-gray-050: #f6f5f2;
  --crm-c-gray-025: #fcfbf9;
  --crm-c-blue: #00b2ff;
  --crm-c-blue-dark: #2f5aae;
  --crm-c-blue-light: #e3f4fd;
  --crm-c-blue-darker: #1f3f7d;
  --crm-c-green: #00ab8e;
  --crm-c-green-light: #d4f1ea;
  --crm-c-green-dark: #005c4d;
  --crm-c-red: #91223c;
  --crm-c-red-light: #ecb1bc;
  --crm-c-red-dark: var(--crm-text-color);
  --crm-c-amber: #d7b221;
  --crm-c-yellow: #d7b221;
  --crm-c-teal: #007a66;
/* Practical colours */
  --crm-text-color: #192930;
  --crm-link-color: #007a66;
  --crm-link-hover-color: #005c4d;
  --crm-page-bg-color: #f6f5f2;
  --crm-container-bg-color: var(--crm-paper);
  --crm-drag-bg-color: var(--crm-c-gray-200); /* background for drag/drop regions, select2 highlight */
  --crm-code-bg-color: var(--crm-layer2-bg-color); /* bg for code blocks */
/* Emphasis colours */
  --crm-primary-color: #007a66;
  --crm-secondary-color: #2f5aae;
  --crm-success-color: var(--crm-c-green);
  --crm-success-text-color: var(--crm-text-color);
  --crm-success-light-color: var(--crm-c-green-light);
  --crm-success-ink-color: var(--crm-c-green-dark);
  --crm-warning-color: var(--crm-c-amber);
  --crm-warning-text-color: #192930;
  --crm-warning-light-color: #f6edc6;
  --crm-warning-ink-color: #6b5609;
  --crm-danger-color: var(--crm-c-red);
  --crm-danger-text-color: var(--crm-text-light-color);
  --crm-danger-light-color: var(--crm-c-red-light);
  --crm-danger-ink-color: var(--crm-danger-color);
  --crm-info-color: var(--crm-c-blue);
  --crm-info-text-color: #192930;
  --crm-info-light-color: var(--crm-c-blue-light);
  --crm-info-ink-color: #004a6b;
/* Shadows */
  --crm-shadow-block: 0 3px 18px 0 rgba(48,40,40,.25);
  --crm-shadow-popup: var(--crm-shadow-block);
/* Sizes */
  --crm-l-radius: 4px;
  --crm-padding-inset: 0; /* to support flush theme variations */
  --crm-page-padding: 0; /* Margin left/right */
/* Type */
  --crm-font-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue",sans-serif;
  --crm-font: "Cooper Hewitt", "Helvetica Neue", Helvetica, Arial, var(--crm-font-system);
  --crm-link-decoration-hover: none;
  --crm-heading-bg-color: var(--crm-layer2-bg-color);
  --crm-heading-color: var(--crm-text-dark-color);
  --crm-heading-padding: var(--crm-l-medium-2) var(--crm-l-medium);
  --crm-heading-margin: 0;
  --crm-heading-radius: 0;
/* Buttons */
  --crm-btn-radius: 4px;
  --crm-btn-padding-block: var(--crm-l-medium); /* padding for top and bottom, one value */
  --crm-btn-padding-inline: var(--crm-l-reg-2); /* padding for left and right, one value */
  --crm-btn-small-padding: var(--crm-l-small-1) var(--crm-l-medium-1);
  --crm-btn-height: 40px;
/* Tables */
  --crm-table-row-bg-color: var(--crm-container-bg-color);
  --crm-table-row-hover-color: var(--crm-c-gray-200);
  --crm-table-sort-color: var(--crm-c-gray-500);
  --crm-table-nested-padding: 0 0 var(--crm-l-reg) 0;
  --crm-table-nested-border: 0 solid transparent;
/* Panels */
  --crm-panel-head-margin: var(--crm-l-medium-2);
  --crm-panel-head-height: 48px;
/* Accordions */
  --crm-accordion-icon: "\f105"; /* unicode value for FontAwesome icon */
  --crm-accordion-icon-color: unset;
  --crm-accordion-icon-spacing: var(--crm-l-medium-3);
  --crm-accordion-gap: 0;
/* .crm-accordion-bold */
  --crm-accordion-header-bg-color: var(--crm-layer1-bg-color);
  --crm-accordion-header-bg-active-color: var(--crm-layer2-bg-color);
  --crm-accordion-header-color: var(--crm-text-color);
  --crm-accordion-header-padding: var(--crm-l-medium-2) var(--crm-l-medium-3);
  --crm-accordion-border: unset;
  --crm-accordion-border-width: unset;
  --crm-accordion-body-bg-color: transparent;
  --crm-accordion-body-box-shadow: inset 0 10px 8px -10px rgba(0,0,0,.15),inset 0 -11px 8px -9px rgba(0,0,0,.15);
/* .crm-accordion-light */
  --crm-accordion2-header-bg-color: var(--crm-primary-color);
  --crm-accordion2-header-bg-active-color: var(--crm-primary-hover-color);
  --crm-accordion2-header-weight: bold;
  --crm-accordion2-header-color: var(--crm-primary-text-color);
  --crm-accordion2-header-padding: var(--crm-accordion-header-padding);
  --crm-accordion2-border: 0;
  --crm-accordion2-body-bg-color: transparent;
  --crm-accordion2-body-padding: 0;
/* Alerts */
  --crm-alert-padding: var(--crm-l-reg) var(--crm-l-reg-2);
  --crm-alert-success-text-color: var(--crm-success-ink-color);
  --crm-alert-danger-text-color: var(--crm-text-color);
  --crm-alert-info-text-color: var(--crm-info-ink-color);
/* Form */
  --crm-form-block-padding: var(--crm-l-reg);
  --crm-form-block-border-radius: 0;
  --crm-input-bg-color: var(--crm-container-bg-color);
  --crm-input-border-color: #c2cfd8;
  --crm-input-border-radius: var(--crm-l-radius);
  --crm-input-box-shadow: inset 0 0 3px 0 rgba(0,0,0,.2);
  --crm-input-padding: var(--crm-l-xsmall-1) var(--crm-l-medium-1);
  --crm-input-label-weight: bold;
  --crm-input-radio-color: var(--crm-primary-color);
  --crm-form-fieldset-border-color: unset;
  --crm-form-fieldset-border-width: 0;
  --crm-form-fieldset-padding: 0;
/* Tabs */
  --crm-tabs-bg-color: var(--crm-layer1-bg-color);
  --crm-tabs-padding: var(--crm-l-medium) var(--crm-l-medium) 0 var(--crm-l-medium);
  --crm-tabs-border: var(--crm-border);
  --crm-tab-radius: 2px 2px 0 0;
  --crm-tab-hover-bg-color: var(--crm-paper);
  --crm-tab-bg-active: var(--crm-container-bg-color);
  --crm-tab-hang: 0 0 -1px 0; /* lip to extend tab flush with active region - set to 0 for no lip */
  --crm-tab-padding: var(--crm-l-medium-2) var(--crm-l-reg-1) var(--crm-l-medium);
  --crm-tab-weight: bold;
  --crm-tab-count-bg-color: transparent;
  --crm-tab-count-color: var(--crm-text-color);
  --crm-tab-active-border: var(--crm-border);
/* Contact dashboard */
  --crm-contact-border: 0 solid transparent;
  --crm-contact-radius: 0;
  --crm-contact-direction: grid; /* choose 'flex' for tabs at top, or 'grid' for tabs at side */
  --crm-contact-side-tabs-width: 220px;
  --crm-contact-tabs-flow: column; /* choose 'row' for tabs at top, or 'column' for tabs at side */
  --crm-contact-tabs-gap: 0;
  --crm-contact-tabs-bg-color: var(--crm-container-bg-color);
  --crm-contact-tabs-padding: unset;
  --crm-contact-tab-bg-color: transparent;
  --crm-contact-tab-hover-bg-color: var(--crm-layer2-bg-color);
  --crm-contact-tab-padding: var(--crm-l-reg) var(--crm-l-reg-1);
  --crm-contact-tab-border: var(--crm-contact-border);
  --crm-contact-tab-hover-border: unset;
  --crm-contact-tab-count-bg-color: var(--crm-primary-color);
  --crm-contact-tab-count-color: var(--crm-text-light-color);
  --crm-contact-tab-hang: 0 0 -1px 0; /* lip to extend tab flush with active region - set to 0 for no lip */
  --crm-contact-icon-size: var(--crm-l-medium-2);
  --crm-contact-box-shadow: inset 0 3px 18px -5px rgba(0, 0, 0, 0.25);
  --crm-contact-panel-padding: var(--crm-l-reg-2);
  --crm-contact-edit-border: 1px dashed var(--crm-c-gray-900);
  --crm-contact-block-padding: var(--crm-l-medium-2);
  --crm-contact-block-bg-color: var(--crm-container-bg-color);
  --crm-contact-label-bg-color: var(--crm-container-bg-color);
  --crm-contact-header-bg-color: var(--crm-c-gray-900);
  --crm-contact-header2-bg-color: var(--crm-c-gray-800);
  --crm-contact-header-color: var(--crm-text-light-color);
  --crm-contact-header-size: var(--crm-l-large);
  --crm-contact-header-padding: var(--crm-l-reg) var(--crm-l-reg-1);
  --crm-contact-image-size: 100px;
  --crm-contact-image-radius: 200px;
  --crm-contact-image-right: 30px; /* distance from right of dashboard */
  --crm-contact-image-top: 30px; /* distance from top of dashboard */
  --crm-contact-image-border: 2px solid #fff;
/* Dialog */
  --crm-dialog-bg-color: var(--crm-container-bg-color);
  --crm-dialog-padding: 0;
  --crm-dialog-footer-border: var(--crm-border);
  --crm-dialog-header-bg-color: var(--crm-layer2-bg-color);
  --crm-dialog-header-color: var(--crm-text-color);
/* Dashlet */
  --crm-dashlet-border: var(--crm-tab-border);
  --crm-dashlet-bg-color: var(--crm-container-bg-color);
  --crm-dashlet-padding: 0;
  --crm-dashlet-header-bg-color: var(--crm-secondary-color);
  --crm-dashlet-header-color: var(--crm-text-light-color);
  --crm-dashlet-header-padding: var(--crm-padding-reg);
  --crm-dashlet-tabs-border: var(--crm-tabs-border);
/* Notifications */
  --crm-notify-bg-color: var(--crm-paper);
  --crm-notify-color: var(--crm-text-color);
  --crm-notify-accent-border-width: 0 0 0 3px; /* adds a border to one/several sides of the notification - set to 0 for none */
  --crm-notify-danger-color: #d02e2e;
  --crm-notify-warning-color: #c45008;
  --crm-notify-success-color: #5a803c;
  --crm-notify-info-color: #277fa5;
  /* Wizard */
  --crm-wizard-width: auto;
  --crm-wizard-margin: calc(-1 * var(--crm-form-block-padding)) calc(-1 * var(--crm-form-block-padding)) 0;
  --crm-wizard-height: 62px;
  --crm-wizard-radius: 0;
  --crm-wizard-angle: 20px;
  --crm-wizard-arrow-thickness: 2px;
  --crm-wizard-active-color: var(--crm-link-color);
  --crm-wizard-active-bg-color: var(--crm-page-bg-color);
  --crm-wizard-border: 1px solid var(--crm-page-bg-color);
/* Frontend */
  --crm-f-fieldset-padding: var(--crm-padding-reg);
  --crm-f-fieldset-bg-color: var(--crm-container-bg-color);
  --crm-f-legend-size: var(--crm-l-reg-2);
  --crm-f-label-position: unset; /* 'unset' = stacked, 'left' = left align, in combination with width below */
  --crm-f-label-align: left;
  --crm-f-label-margin: 0;
  --crm-f-label-width: unset;
}

/* Ueberschriften wie auf der Website: Archivo Narrow, fett. RiverLea hat
   dafuer keine eigene Variable. */
.crm-container h1, .crm-container h2, .crm-container h3, .crm-container .crm-title,
#crm-container .crm-section-title, .crm-dashlet-header h3, .page-title, h1.page-title {
  font-family: "Archivo Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  letter-spacing: 0.01em;
}

:root { color-scheme: light; }