/* ============================================================================
   Transitional re-skin of the Bootstrap 2.1.1 buttons, dropdown buttons,
   search boxes and native selects of the old Plantivo website to the look of
   Plantivo Reloaded.

   Reference: Kendo Bootstrap theme 14.4 as used by the Angular client of Rld.
   Every colour below is the resolved value of the theme token named in the
   comment. Sizes (padding, font size, line height) are deliberately NOT
   touched, so no layout can break - only colour, border, radius and relief.

   Rules: markup stays untouched, only bootstrap.css is overridden. The file is
   the LAST entry of the style bundles basecss, settingscss and
   preconditionskendocss and is linked after plantivo.css in BuyLayout and
   BuyLayout_WP. Delete it once the last page has moved to Reloaded.
   Kendo widgets are handled by reloaded-look-kendo.css.
   ========================================================================== */

/* ---- 1. Strip the Bootstrap-2 relief: gradient, text shadow, inset shadow -- */
.btn, .btn:hover, .btn:focus, .btn:active, .btn.active,
.btn.disabled, .btn[disabled],
.btn-group > .btn + .dropdown-toggle,
.btn-group.open .dropdown-toggle {
  background-image: none;
  text-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  filter: none;
}

/* ---- 2. Base (grey) button = Kendo themeColor "base" ----------------------- */
.btn {
  color: #212529;                 /* --kendo-color-on-base */
  background-color: #dee2e6;      /* --kendo-color-base */
  border: 1px solid #dee2e6;      /* Kendo: border-color = base */
  border-radius: 5px;             /* --kendo-border-radius-md = .375rem at 14px */
  -webkit-transition: color .15s, background-color .15s, border-color .15s, box-shadow .15s;
  transition: color .15s, background-color .15s, border-color .15s, box-shadow .15s;
}
.btn:hover, .btn:focus,
.btn-group.open .btn.dropdown-toggle {
  color: #212529;
  background-color: #d0d4d8;      /* --kendo-color-base-hover */
  border-color: #d0d4d8;
}
.btn:active, .btn.active {
  color: #212529;
  background-color: #c0c4c7;      /* --kendo-color-base-active */
  border-color: #c0c4c7;
}
.btn:focus {
  outline: 0;
  box-shadow: 0 0 0 4px rgba(33, 37, 41, .07);   /* .25rem, border at 50 % */
}
.btn.disabled, .btn[disabled] {
  color: #212529;
  background-color: #dee2e6;
  border-color: #dee2e6;
  opacity: .65;
}

/* ---- 3. Primary (blue) button = Kendo themeColor "primary" ----------------- */
.btn-primary {
  color: #fff;                    /* --kendo-color-on-primary */
  background-color: #0d6efd;      /* --kendo-color-primary */
  border-color: #0d6efd;
}
.btn-primary:hover, .btn-primary:focus,
.btn-group.open .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #0e5ed7;      /* --kendo-color-primary-hover */
  border-color: #0e5ed7;
}
.btn-primary:active, .btn-primary.active {
  color: #fff;
  background-color: #0d58ca;      /* --kendo-color-primary-active */
  border-color: #0d58ca;
}
.btn-primary:focus {
  box-shadow: 0 0 0 4px rgba(13, 110, 253, .5);
}
.btn-primary.disabled, .btn-primary[disabled] {
  color: #fff;
  background-color: #0d6efd;
  border-color: #0d6efd;
}

/* ---- 4. Further colour variants (decided 2026-09-02) ------------------------ */
/* btn-info marks the chosen button of a toggle group -> Kendo k-selected. The Ja/Nein groups carry it
   together with "active"; the selection groups Alle/Eigene/Zuletzt verwendet of the activity masks,
   the field selection of the reports and the customer filters of the admin pages carry it alone.
   So the class itself is the selected look, with or without "active": a chosen button that reads
   like its neighbours is no choice at all. */
.btn-info, .btn-info.active, .btn-info:active {
  color: #fff;                    /* --kendo-color-on-primary */
  background-color: #0d58ca;      /* --kendo-color-primary-active */
  border-color: #0d58ca;
}
.btn-info:hover, .btn-info:focus {
  color: #fff;
  background-color: #0e5ed7;      /* --kendo-color-primary-hover */
  border-color: #0e5ed7;
}
/* delete buttons (btn-danger) -> Kendo themeColor "error" */
.btn-danger { color: #fff; background-color: #dc3545; border-color: #dc3545; }
.btn-danger:hover, .btn-danger:focus { color: #fff; background-color: #bb2d3b; border-color: #bb2d3b; }
.btn-danger:active, .btn-danger.active { color: #fff; background-color: #b02a37; border-color: #b02a37; }
/* order/confirm buttons (btn-success) -> Kendo themeColor "success" */
.btn-success { color: #fff; background-color: #198754; border-color: #198754; }
.btn-success:hover, .btn-success:focus { color: #fff; background-color: #157347; border-color: #157347; }
.btn-success:active, .btn-success.active { color: #fff; background-color: #146c43; border-color: #146c43; }
/* btn-warning -> Kendo themeColor "warning" */
.btn-warning { color: #212529; background-color: #ffc107; border-color: #ffc107; }
.btn-warning:hover, .btn-warning:focus { color: #212529; background-color: #ffca2c; border-color: #ffca2c; }
/* btn-link stays a text link */

/* ---- 5. Radii only - sizes stay as in Bootstrap 2 ---------------------------- */
.btn-large { border-radius: 7px; }                     /* --kendo-border-radius-lg */
.btn-small, .btn-mini { border-radius: 3.5px; }        /* --kendo-border-radius-sm */
.btn-group > .btn:first-child { border-top-left-radius: 5px; border-bottom-left-radius: 5px; }
.btn-group > .btn:last-child, .btn-group > .dropdown-toggle { border-top-right-radius: 5px; border-bottom-right-radius: 5px; }
.input-append .btn:last-child, .input-append .btn-group:last-child > .dropdown-toggle { border-radius: 0 5px 5px 0; }
.input-prepend .btn:first-child { border-radius: 5px 0 0 5px; }
.input-append input, .input-append select { border-radius: 5px 0 0 5px; }
.input-prepend input, .input-prepend select { border-radius: 0 5px 5px 0; }

/* ---- 6. Search boxes: square like a normal input, matching the button ------- */
.search-query {
  border-radius: 5px;
  padding-left: 8px;
  padding-right: 8px;
}
.form-search .input-append .search-query { border-radius: 5px 0 0 5px; }
.form-search .input-prepend .search-query { border-radius: 0 5px 5px 0; }
.form-search .input-append .btn { border-radius: 0 5px 5px 0; }
.form-search .input-prepend .btn { border-radius: 5px 0 0 5px; }

/* ---- 7. Menu buttons ("Mehr", "Filtern", "Sortieren"): caret like Kendo ---- */
.btn .caret {
  border-top-color: #212529;
  opacity: .8;
}
.btn-primary .caret { border-top-color: #fff; }

/* ---- 8. Value selectors built as dropdown buttons -> Kendo DropDownList ----
   Matches the shared partials (HarvestYearSelection, CalendarYearSelection,
   MonthSelection, CommercialUnitSelection, FertilizerSourceSelection,
   DuengerKlassifizierungSelection, DuengemittelNaehrstoffeinheitSelection,
   DropdownControl) via their *DropDownBtn class, the unit and value selectors
   of the activity masks via the marker class ValueDropDownBtn (a class for
   this rule alone, so the sizing NewActivity.css puts on .DropDownBtn stays
   off them), plus the filter-year selector of the fields list. Width grows
   by a few px for the chevron, height stays.                                */
.btn.dropdown-toggle[class*="DropDownBtn"],
.btn.filterharvestyear {
  position: relative;
  padding-right: 24px;
  text-align: left;
  color: #212529;                 /* --kendo-color-on-app-surface */
  background-color: #fff;         /* --kendo-color-surface-alt */
  border-color: rgba(33, 37, 41, .13);   /* --kendo-color-border */
}
.btn.dropdown-toggle[class*="DropDownBtn"]:hover,
.btn.filterharvestyear:hover {
  background-color: #f8f9fa;      /* --kendo-color-surface */
  border-color: rgba(33, 37, 41, .2);    /* --kendo-color-border-alt */
}
.btn.dropdown-toggle[class*="DropDownBtn"]:focus,
.btn-group.open .btn.dropdown-toggle[class*="DropDownBtn"],
.btn-group.open .btn.filterharvestyear {
  background-color: #fff;
  border-color: rgba(13, 110, 253, .4);  /* --kendo-color-primary-emphasis */
  box-shadow: 0 0 0 4px rgba(13, 110, 253, .25);
}
/* chevron-down instead of the caret triangle; !important beats the inline
   margins the partials put on the caret                                        */
.btn.dropdown-toggle[class*="DropDownBtn"] .caret,
.btn.filterharvestyear .caret {
  position: absolute;
  right: 9px;
  top: 50%;
  width: 6px;
  height: 6px;
  margin: -5px 0 0 0 !important;
  border: 0;
  border-right: 1.5px solid #212529;
  border-bottom: 1.5px solid #212529;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  opacity: 1;
}
.btn.dropdown-toggle[class*="DropDownBtn"][disabled] { background-color: #f8f9fa; }

/* ---- 9. Native <select> (e.g. order page) -> Kendo DropDownList ------------ */
select {
  color: #212529;
  background-color: #fff;
  border: 1px solid rgba(33, 37, 41, .13);
  border-radius: 5px;
  padding-right: 26px;
  /* Bootstrap 2 gives a select 30px of height and 30px of line height for a content box; Kendo's
     stylesheet turns every box into border-box, which leaves 20px inside the padding, and the
     text hung at the top. The line height follows the room that is actually there. */
  line-height: 20px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 10px 10px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
select::-ms-expand { display: none; }
select[multiple], select[size] { background-image: none; padding-right: 6px; }
select:hover { border-color: rgba(33, 37, 41, .2); }
select:focus {
  outline: 0;
  border-color: rgba(13, 110, 253, .4);
  -webkit-box-shadow: 0 0 0 4px rgba(13, 110, 253, .25);
  box-shadow: 0 0 0 4px rgba(13, 110, 253, .25);
}

/* ---- 10. Opened list = Kendo popup list (colours only) ---------------------- */
.dropdown-menu {
  border: 1px solid rgba(33, 37, 41, .13);
  border-radius: 5px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, .1);   /* --kendo-elevation-2 */
  box-shadow: 0 4px 8px rgba(0, 0, 0, .1);
}
.dropdown-menu > li > a { color: #212529; }
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus,
.dropdown-submenu:hover > a {
  color: #212529;
  background-color: #e8ecf0;      /* --kendo-color-base-subtle */
  background-image: none;
}
.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover {
  color: #fff;
  background-color: #0d6efd;      /* selected list item */
  background-image: none;
}
