/* Content-age selector: keep styles in the versioned stylesheet, not the
   AJAX-loaded settings Blade fragment (its inline style tag is not reliable). */
#leo_app .ap-preferences .ap-age-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 12px 0 2px !important;
  align-items: stretch;
}
#leo_app .ap-preferences .ap-age-option {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto !important;
  align-content: center !important;
  column-gap: 10px !important;
  row-gap: 2px !important;
  position: relative !important;
  min-width: 0 !important;
  min-height: 80px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 9px 12px 9px 29px !important;
  border: 1px solid #e1e4eb !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: #172438 !important;
  cursor: pointer !important;
  white-space: normal !important;
  text-align: right !important;
}
#leo_app .ap-preferences .ap-age-option input[type="radio"] {
  position: absolute !important;
  top: 12px !important;
  left: 9px !important;
  right: auto !important;
  width: 15px !important;
  height: 15px !important;
  margin: 0 !important;
  opacity: 1 !important;
  appearance: auto !important;
  accent-color: #d99824;
}
#leo_app .ap-preferences .ap-age-option__number {
  grid-row: 1 / span 3 !important;
  grid-column: 1 !important;
  display: grid !important;
  place-items: center !important;
  min-height: 43px !important;
  padding: 2px !important;
  border-radius: 9px !important;
  background: #fff3d9 !important;
  color: #9f6417 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  direction: ltr;
}
#leo_app .ap-preferences .ap-age-option__title {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: inherit !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1.45 !important;
  white-space: normal !important;
}
#leo_app .ap-preferences .ap-age-option__subtitle {
  grid-column: 2 !important;
  grid-row: 2 !important;
  display: block !important;
  margin: 0 !important;
  color: #667085 !important;
  font-size: 10px !important;
  line-height: 1.45 !important;
  white-space: normal !important;
}
#leo_app .ap-preferences .ap-age-option__count {
  grid-column: 2 !important;
  grid-row: 3 !important;
  display: block !important;
  margin: 0 !important;
  color: #9a681d !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  line-height: 1.4 !important;
  white-space: normal !important;
}
#leo_app .ap-preferences .ap-age-option:has(input:checked) {
  border-color: #dfa43d !important;
  background: #fff9e9 !important;
  box-shadow: none !important;
}
body.dark #leo_app .ap-preferences .ap-age-option {
  background: #27282c !important;
  color: #f6f4f0 !important;
  border-color: #505057 !important;
}
body.dark #leo_app .ap-preferences .ap-age-option__subtitle {
  color: #b5b7c0 !important;
}
body.dark #leo_app .ap-preferences .ap-age-option__count {
  color: #efc377 !important;
}
body.dark #leo_app .ap-preferences .ap-age-option:has(input:checked) {
  background: #3b3325 !important;
  border-color: #e0ab51 !important;
}
body.dark #leo_app .ap-preferences .ap-age-option__number {
  background: #4d3a23 !important;
  color: #efc377 !important;
}
@media (max-width: 650px) {
  #leo_app .ap-preferences .ap-age-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 7px !important;
  }
  #leo_app .ap-preferences .ap-age-option {
    min-height: 74px !important;
  }
}
