/* mobile.css - mobile-first form and select2 helpers */
@charset "utf-8";

/* Basic form controls sizing */
input.form-control, select.form-control, textarea.form-control {
  box-sizing: border-box;
  width: 100%;
  padding: 10px 12px;
  font-size: 16px;
  line-height: 1.25;
  border-radius: 3px;
}

/* Larger tappable buttons on mobile */
.btn-large, .btn.btn-large {
  padding: 12px 16px;
  font-size: 17px;
}
.btn-block { width: 100%; }

/* Labels stack on mobile, align on wider screens */
.form-horizontal .control-label {
  display: block;
  margin-bottom: 6px;
  font-weight: 600;
}

@media (min-width: 768px) {
  .form-horizontal .control-label { float: left; width: 28%; text-align: right; padding-right: 12px; }
  .form-horizontal .controls { margin-left: 32%; }
}

/* Compact helper classes for small numeric fields */
.compact { max-width: 120px; display: inline-block; }
.compact-field { max-width: 90px; display: inline-block; }

/* Help blocks and links */
.help-block { margin-top: 6px; display: block; }
.help-block a { color: #337ab7; text-decoration: underline; }

/* Make help-block links more readable and easier to tap */
.form-horizontal .help-block a,
#fColaborador .help-block a {
  display: inline-block;
  font-size: 13px; /* match label size */
  line-height: 1.2;
  padding: 2px 0;
  color: #337ab7;
  text-decoration: underline;
  cursor: pointer;
}

@media (max-width: 480px) {
  .form-horizontal .help-block a,
  #fColaborador .help-block a {
    display: block;
    width: 100%;
    padding: 6px 0;
    font-size: 14px; /* slightly larger on mobile for touch */
  }
}

/* Keep .btn-setting as a plain-looking anchor but slightly larger and easier to tap */
.btn-setting {
  font-size: 14px; /* slightly smaller than inputs */
  font-weight: 500;
  padding: 2px 0; /* small tappable area without button look */
  background: none;
  border: none;
  text-decoration: underline;
  color: #337ab7;
  display: inline;
}

/* Select2 compatibility (v3 and v4 selectors) */
.select2-container .select2-choice,
.select2-container--default .select2-selection--single,
.select2-selection--single {
  min-height: 40px;
  line-height: normal;
}
.select2-container .select2-choice .select2-chosen,
.select2-container--default .select2-selection--single .select2-selection__rendered {
  padding: 6px 8px;
}
.select2-container, .select2-selection { width: 100% !important; }

/* Align button sizing to form controls */
.box-content-login .controls .btn {
  box-sizing: border-box;
  padding: 10px 12px;
  font-size: 16px;
  line-height: 1.25;
  min-height: 40px;
  height: auto;
  border-radius: 3px;
}

/* Make cadastro form buttons match login appearance and behavior */
.controls .btn {
  box-sizing: border-box;
  padding: 10px 12px;
  font-size: 16px;
  line-height: 1.25;
  min-height: 40px;
  height: auto;
  border-radius: 3px;
  display: block;
  width: 100%;
}

/* Make Select2 rendered area match inputs */
.select2-container--default .select2-selection--single,
.select2-container .select2-choice,
.select2-selection--single {
  padding: 0 8px; /* inner padding kept small; rendered content has its own padding */
  min-height: 40px;
  display: flex;
  align-items: center;
}
.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container .select2-choice .select2-chosen {
  padding: 6px 8px;
  line-height: 1.25;
  font-size: 16px;
}

/* Reduce vertical gaps between select and other controls for consistent rhythm */
.form-horizontal .controls > * {
  margin-bottom: 8px;
}

/* Ensure select2 dropdown container margins align with form controls */
.select2-container { margin: 0 0 6px 0; }

/* Force labels on top for all screen sizes (remove left-aligned layout) */
.form-horizontal .control-label {
  float: none !important;
  width: auto !important;
  text-align: left !important;
  padding-right: 0 !important;
  display: block !important;
  margin-bottom: 6px !important;
}
.form-horizontal .controls {
  margin-left: 0 !important;
}

/* Visual badge for 'vagas' display */
.vagas-badge {
  float: right;
  background: #f0ad4e;
  color: #fff;
  padding: 6px 10px;
  border-radius: 12px;
  font-weight: 700;
  font-size: 13px;
}

/* Minor adjustments */
input[disabled], select[disabled], textarea[disabled] { opacity: 0.65; }

/* Increase touch targets for anchors used as buttons/links */
a.button-like { display: inline-block; padding: 10px 12px; }

/* Make sure form fields remain readable on small devices */
@media (max-width: 480px) {
  input.form-control, select.form-control, textarea.form-control { font-size: 18px; padding: 12px; }
  .btn-large { font-size: 18px; padding: 14px 16px; }
}

/* Cleanup overrides to reduce conflicts with legacy CSS */
.form-horizontal .controls .input { width: 100%; }

/* Global spacing for DataTables search filter */
.dataTables_wrapper .dataTables_filter {
  margin: 10px;
}

/* Increase input/select/textarea height specifically for the colaborador cadastro form */
#fColaborador input.form-control,
#fColaborador select.form-control,
#fColaborador textarea.form-control {
  padding: 12px 14px;
  font-size: 16px;
  min-height: 44px;
  line-height: 1.2;
}

/* Ensure compact fields in that form keep readable height */
#fColaborador .compact, #fColaborador .compact-field {
  min-height: 38px;
  padding-top: 6px;
  padding-bottom: 6px;
}

/* Stronger overrides to counter legacy Bootstrap 2 span/input sizing */
#fColaborador input, #fColaborador textarea, #fColaborador .input {
  display: block !important;
  width: 100% !important;
  padding: 12px 14px !important;
  font-size: 16px !important;
  min-height: 44px !important;
  line-height: 1.2 !important;
}

/* If any span* classes set height, reset here */
#fColaborador [class*="span"] {
  height: auto !important;
  min-height: 0 !important;
}

/* Hide the original select element when Select2 is applied (support v3/v4) */
select.select2-hidden-accessible,
select.select2-offscreen {
  display: none !important;
}

/* Make login buttons full-width on small screens without changing markup */
@media (max-width: 480px) {
  .box-content-login .controls .btn,
  .box-content-login .controls a.button-like {
    display: block;
    width: 100% !important;
    margin-bottom: 8px;
  }
  .box-content-login .controls .btn + .btn {
    margin-top: 6px;
  }
}

/* Keep login/new-password card centered and readable on desktop */
.box-content-login {
  width: 100%;
  max-width: 460px;
  margin-left: auto;
  margin-right: auto;
}

.login-header {
  text-align: center;
  margin: 24px 0 14px;
}

#loading {
  display: none;
}

#loading.show {
  display: block;
}

/* Desktop/tablet: keep login action buttons compact */
.box-content-login .controls .btn,
.box-content-login .controls a.button-like {
  display: inline-block;
  width: auto;
  box-sizing: border-box;
}

/* Bootstrap 2 button compatibility under Bootstrap 5 */
.btn-inverse {
  --bs-btn-color: #fff;
  --bs-btn-bg: #212529;
  --bs-btn-border-color: #212529;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #1c1f23;
  --bs-btn-hover-border-color: #1a1e21;
  --bs-btn-focus-shadow-rgb: 66, 70, 73;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #1a1e21;
  --bs-btn-active-border-color: #191c1f;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #212529;
  --bs-btn-disabled-border-color: #212529;
}

.btn-mini {
  padding: 0.1rem 0.4rem;
  font-size: 0.75rem;
  border-radius: 0.2rem;
}

.btn .icon,
.btn [class^="icon-"],
.btn [class*=" icon-"] {
  margin-top: 0 !important;
  vertical-align: middle;
  line-height: 1;
}

/* Mobile: action buttons remain full-width for touch */
@media (max-width: 767px) {
  .box-content-login .controls .btn,
  .box-content-login .controls a.button-like {
    display: block;
    width: 100%;
    margin-bottom: 8px;
  }

  #btPrint {
    display: none !important;
  }
}

/* Global Select2 height: match default input/form-select height */
select,.select2-container .select2-choice,
.select2-container--default .select2-selection--single,
.select2-container--bootstrap-5 .select2-selection--single {
  min-height: 44px !important;
  height: 44px !important;
}

select,.select2-container .select2-choice .select2-chosen,
.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
  padding-left: 12px !important;
  padding-right: 28px !important;
}

select,.select2-container--default .select2-selection--single .select2-selection__arrow,
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__arrow {
  height: 42px !important;
}

select,.select2-container--default .select2-selection--multiple,
.select2-container--bootstrap-5 .select2-selection--multiple {
  min-height: 44px !important;
}
/* end of mobile.css overrides */