:root {
  --form-font-family: var(
    --font-sans,
    -apple-system,
    BlinkMacSystemFont,
    "SF Pro Display",
    "SF Pro Text",
    "Helvetica Neue",
    Helvetica,
    Arial,
    sans-serif
  );
  --form-font-weight: 400;
  --fs-lg: 1.125rem !important;
  --fs-md: 1rem !important;
  --fs-sm: 0.875rem !important;
  --fs-xs: 0.75rem !important;

  --btn-fs-xxs: 0.6rem;
  --btn-fs-xs: 0.69rem;
  --btn-fs-sm: 0.74rem;
  --btn-fs-md: 0.79rem;
  --btn-fs-lg: 0.86rem;
  --btn-fs-xl: 0.92rem;

  --btn-h-xxs: 24px;
  --btn-h-xs: 30px;
  --btn-h-sm: 34px;
  --btn-h-md: 38px;
  --btn-h-lg: 42px;
  --btn-h-xl: 46px;

  --btn-px-xxs: 0.4rem;
  --btn-px-xs: 0.62rem;
  --btn-px-sm: 0.82rem;
  --btn-px-md: 1rem;
  --btn-px-lg: 1.15rem;
  --btn-px-xl: 1.3rem;
}

button,
.btn,
input,
select,
textarea,
label {
  font-family: var(--form-font-family);
  font-weight: var(--form-font-weight);
}

/* =========================
   INPUTS & SELECTS
========================= */

.form-control,
.form-select {
  font-size: var(--fs-md);
  height: var(--h-md);
  padding: 0.45rem 1rem;
  line-height: 1.4;
  border-radius: 0.6rem !important;
  font-weight: var(--form-font-weight) !important;
}

.form-control-lg,
.form-select-lg {
  font-size: var(--fs-lg);
  height: var(--h-lg);
  padding: 0.55rem 1.1rem;
  font-size: 15px !important;
}

.form-control-sm,
.form-select-sm {
  font-size: var(--fs-sm);
  height: var(--h-sm);
  padding: 0.3rem 0.85rem;
}

.form-control-xs,
.form-select-xs {
  font-size: var(--fs-xs);
  height: var(--h-xs);
  padding: 0.2rem 0.7rem;
}

select.form-control,
select.form-select {
  padding-right: 2.75rem;
}

textarea.form-control {
  height: auto;
  min-height: 100px;
}

/* =========================
   BUTTONS
========================= */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: var(--btn-h-md);
  padding: 0.48rem var(--btn-px-md);
  font-size: var(--btn-fs-md);
  line-height: 1.2;
  font-weight: 600;
  text-decoration: none !important;
  border-radius: 9px !important;
  border-width: 0.6px !important;
}

.btn-xxs,
.btn-xs,
.btn-sm,
.btn-md,
.btn-lg,
.btn-xl {
  line-height: 1.2 !important;
  font-weight: 600 !important;
}

.btn-xxs {
  font-size: var(--btn-fs-xxs) !important;
  min-height: var(--btn-h-xxs);
  padding: 0.22rem var(--btn-px-xxs) !important;
}

.btn-xs {
  font-size: var(--btn-fs-xs) !important;
  min-height: var(--btn-h-xs);
  padding: 0.3rem var(--btn-px-xs) !important;
}

.btn-sm {
  font-size: var(--btn-fs-sm) !important;
  min-height: var(--btn-h-sm);
  padding: 0.38rem var(--btn-px-sm) !important;
}

.btn-md {
  font-size: var(--btn-fs-md) !important;
  min-height: var(--btn-h-md);
  padding: 0.46rem var(--btn-px-md) !important;
}

.btn-lg {
  font-size: var(--btn-fs-lg) !important;
  min-height: var(--btn-h-lg);
  padding: 0.54rem var(--btn-px-lg) !important;
}

.btn-xl {
  font-size: var(--btn-fs-xl) !important;
  min-height: var(--btn-h-xl);
  padding: 0.62rem var(--btn-px-xl) !important;
}

.btn-normalize-xs .btn {
  font-size: 0.65em !important;
}
.btn-normalize .btn {
  font-size: 0.9em !important;
}

a.btn-secondary {
  color: #fff !important;
}
a.btn-light {
  color: #222 !important;
}

/* Dropdowns */
.dropdown-sm ul li a {
  font-size: 13px !important;
  font-weight: 400 !important;
}
.dropdown-menu {
  background-color: #fff !important;
  margin: 0 !important;
}

/* =========================
   ICONS INSIDE CONTROLS
========================= */

.btn i,
.btn svg,
.form-control i {
  font-size: 1em;
  line-height: 1;
  vertical-align: middle;
}

/* Buttons with icon only */
.btn-icon {
  width: var(--btn-h-md);
  padding: 0 !important;
}

.btn-icon.btn-sm {
  width: var(--btn-h-sm);
}
.btn-icon.btn-lg {
  width: var(--btn-h-lg);
}
.btn-icon.btn-xs {
  width: var(--btn-h-xs);
}
.btn-icon.btn-xl {
  width: var(--btn-h-xl);
}
.btn-icon.btn-xxs {
  width: var(--btn-h-xxs);
}

/* =========================
   INPUT GROUP HEIGHTS
========================= */

.input-group > .form-control,
.input-group > .form-select,
.input-group > .btn {
  height: var(--h-md);
}

.input-group-sm > .form-control,
.input-group-sm > .form-select,
.input-group-sm > .btn {
  height: var(--h-sm);
}

.input-group-lg > .form-control,
.input-group-lg > .form-select,
.input-group-lg > .btn {
  height: var(--h-lg);
}

/* =========================
   BRANDY BUTTON COLORS (SOFT)
   (Unificado: antes tenías versión sólida y luego “soft”; ganaba la última)
========================= */

.btn-success,
.btn-danger,
.btn-info {
  font-weight: 700;
}

.btn-success {
  background: rgba(25, 135, 84, 0.12);
  border-color: rgba(25, 135, 84, 0.35) !important;
  color: #198754;
}

.btn-danger {
  background: rgba(220, 53, 69, 0.12);
  border-color: rgba(220, 53, 69, 0.35) !important;
  color: #dc3545;
}

.btn-info {
  background: rgba(13, 202, 240, 0.12);
  border-color: rgba(13, 202, 240, 0.35) !important;
  color: #0dcaf0;
}

.btn-success:hover,
.btn-danger:hover,
.btn-info:hover,
.btn-success:focus,
.btn-danger:focus,
.btn-info:focus {
  filter: brightness(0.98);
}

.btn-success:disabled,
.btn-danger:disabled,
.btn-info:disabled,
.btn-success.disabled,
.btn-danger.disabled,
.btn-info.disabled {
  opacity: 0.65;
}

/* =========================
   OUTLINES
========================= */

.btn-outline-danger {
  border: #dc3546ad solid 1px !important;
  color: #dc3545 !important;
}

.btn-outline-secondary:hover {
  background: rgba(108, 117, 125, 0.12) !important;
  color: #000 !important;
}

.btn-outline-danger:hover {
  background: rgba(255, 0, 0, 0.05) !important;
  color: #dc3545 !important;
}

/* =========================
   FILE INPUTS
========================= */

input[type="file"].form-control {
  padding: 0.4rem;
  line-height: 1.2;
}
input[type="file"].form-control-lg {
  padding: 0.4rem;
  line-height: 1.2;
}

input[type="file"].form-control::file-selector-button,
input[type="file"].form-control::-webkit-file-upload-button {
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid var(--bs-orange, #fd7e14);
  background: var(--bs-orange, #fd7e14);
  color: #fff;
  border-radius: 10px;
  min-height: calc(var(--h-md) - 8px);
  padding: 0.52rem 1rem;
  margin: 0 0.95rem 0 0;
  font-size: var(--btn-fs-md);
  font-weight: 600;
  line-height: 1 !important;
  vertical-align: middle;
  box-shadow: none;
}

input[type="file"].form-control:hover::file-selector-button,
input[type="file"].form-control:hover::-webkit-file-upload-button,
input[type="file"].form-control:focus::file-selector-button,
input[type="file"].form-control:focus::-webkit-file-upload-button {
  filter: brightness(0.98);
}

/* =========================
   CENTRALIZED FORM OWNERSHIP
========================= */

/* Academy form typography now lives only here */
body.academy-app label,
body.academy-app input,
body.academy-app textarea,
body.academy-app select {
  font-weight: 400 !important;
  color: var(--academy-text, inherit);
  line-height: 1.5;
  font-size: 0.97rem !important;
}

/* Shared search inputs/buttons */
.ui-search .form-control,
.ui-search .btn {
  border-radius: 0.95rem;
}

/* Shared close button for alert/modal patterns */
.alert .btn-close,
.modal .btn-close,
.offcanvas .btn-close {
  margin-left: auto;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 0.85rem;
  box-shadow: none !important;
  opacity: 0.65;
}
.alert .btn-close:hover,
.modal .btn-close:hover,
.offcanvas .btn-close:hover {
  opacity: 0.9;
}
.alert .btn-close:focus,
.modal .btn-close:focus,
.offcanvas .btn-close:focus,
.alert .btn-close:active,
.modal .btn-close:active,
.offcanvas .btn-close:active {
  box-shadow: none !important;
}

/* Centralized field colors/focus states used by shared themes */
.form-control,
.form-select,
.form-check-input,
.input-group-text {
  border-color: var(
    --bd,
    var(--c-border, var(--form-border, rgba(50, 50, 93, 0.18)))
  ) !important;
}
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  border-color: rgba(0, 71, 119, 0.45) !important;
  box-shadow: var(--focus, 0 0 0 0.2rem rgba(0, 71, 119, 0.18)) !important;
}
.form-check-input:checked {
  background-color: var(--c-blue, #004777) !important;
  border-color: rgba(0, 71, 119, 0.45) !important;
}

/* Centralized button system */
.btn {
  cursor: pointer;
  white-space: nowrap;
  background-color: #f8f8f8;
  border-color: #e5e5e5;
  color: #222;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
  transition:
    background-color 0.12s ease-out,
    border-color 0.12s ease-out,
    box-shadow 0.12s ease-out,
    transform 0.05s ease-out;
  border-style: solid;
}
.btn:hover {
  background-color: #ececec;
  border-color: #d1d1d1;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
}
.btn:focus {
  outline: none;
  box-shadow: var(--focus, 0 0 0 0.2rem rgba(0, 71, 119, 0.18)) !important;
}
.btn-primary,
.btn-primary:link,
.btn-primary:visited {
  background: var(--c-blue, var(--color-primary, #004777)) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  color: #fff !important;
}
.btn-primary:hover {
  background: var(--c-blue, var(--color-primary-dark, #004777)) !important;
  filter: brightness(1.05);
  color: #fff !important;
}
.btn-secondary,
.btn-secondary:link,
.btn-secondary:visited {
  background: var(--c-orange, var(--color-gray, #ff7d00)) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  color: #fff !important;
}
.btn-secondary:hover {
  background: var(--c-orange, var(--color-gray-dark, #ff7d00)) !important;
  filter: brightness(1.05);
  color: #fff !important;
}
.btn-outline-primary {
  background-color: transparent;
  color: var(--color-primary, var(--c-blue, #004777));
  border-color: rgba(136, 32, 55, 0.5);
}
.btn-outline-primary:hover {
  background-color: rgba(136, 32, 55, 0.06);
}
.btn-outline-secondary {
  background-color: transparent;
  color: var(--c-blue, var(--color-gray-dark, #222)) !important;
  border-color: rgba(0, 71, 119, 0.22) !important;
}
.btn-outline-secondary:hover {
  background: rgba(0, 71, 119, 0.06) !important;
  border-color: rgba(0, 71, 119, 0.28) !important;
  color: var(--c-blue, var(--color-gray-dark, #222)) !important;
}
.btn-light {
  background: var(--c-white, #fff) !important;
  color: var(--c-gray-dark, #646769) !important;
  border-color: var(--c-border, #e5e5e5) !important;
}

/* Responsive form sizing */
@media screen and (max-width: 580px) {
  .btn {
    margin-bottom: 0.4rem !important;
  }
  .btn-sm,
  .btn-xs,
  select,
  input,
  .text-xs {
    margin-bottom: 0.4rem !important;
    font-size: 0.92rem !important;
  }
  label {
    font-size: 0.7rem !important;
    line-height: 1.35 !important;
  }
}

@media (min-width: 768px) and (max-width: 979px) {
  input.dateinput {
    width: 70%;
  }
}

.form-control-new {
  cursor: pointer !important;
  display: block !important;
  z-index: 2 !important;
  transition: border-color 0.2s ease !important;
  border: 2px solid #fff !important;
  border-radius: 12px !important;
  font-size: 17px;
  outline: none;
}

@media (max-width: 580px) {
  .form-control-new {
    font-size: 15.3px;
  }
}

.custom-control-label {
  padding-top: 3px;
}
