/**
 * CRM form controls — aligned with Cuba input-group.html / main-custom-form / input-radius.
 * Covers .theme-form site-wide (drawers, page forms, auth). Load after style.css (+ task-management-offcanvas if any).
 */
:root {
  --crm-input-radius: 10px;
  --crm-input-border: #e8ecf3;
  --crm-input-bg: #ffffff;
  --crm-primary: #7366ff;
  --crm-primary-rgb: 115, 102, 255;
  --crm-addon-bg: rgba(115, 102, 255, 0.1);
  --crm-placeholder: #9ca3af;
}

/* —— Labels —— */
.theme-form .col-form-label,
.theme-form .form-label {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #111827 !important;
  margin-bottom: 6px !important;
  display: block;
}

.theme-form .form-label {
  font-weight: 500 !important;
}

/* —— Text, email, number, etc. —— */
.theme-form input.form-control:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.theme-form select.form-select {
  min-height: 44px !important;
  height: auto !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  border: 1px solid var(--crm-input-border) !important;
  border-radius: var(--crm-input-radius) !important;
  background: var(--crm-input-bg) !important;
  color: #111827 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}

.theme-form input.form-control:not([type="checkbox"]):not([type="radio"]):hover,
.theme-form select.form-select:hover {
  border-color: #c7d2fe !important;
  box-shadow: 0 2px 6px rgba(99, 102, 241, 0.08) !important;
}

.theme-form input.form-control:not([type="checkbox"]):not([type="radio"]):focus,
.theme-form select.form-select:focus {
  border-color: var(--crm-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--crm-primary-rgb), 0.15) !important;
  outline: none !important;
  background: #fff !important;
}

.theme-form input.form-control::placeholder,
.theme-form textarea.form-control::placeholder {
  color: var(--crm-placeholder) !important;
}

.theme-form input[type="date"].form-control,
.theme-form input[type="datetime-local"].form-control,
.theme-form input[type="time"].form-control {
  min-height: 44px !important;
}

.theme-form input[type="file"].form-control {
  padding: 10px 14px !important;
  min-height: 44px !important;
}

/* —— Textarea —— */
.theme-form textarea.form-control {
  min-height: 96px !important;
  height: auto !important;
  padding: 12px 14px !important;
  font-size: 14px !important;
  border: 1px solid var(--crm-input-border) !important;
  border-radius: var(--crm-input-radius) !important;
  background: var(--crm-input-bg) !important;
  color: #111827 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  resize: vertical;
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}

.theme-form textarea.form-control:hover {
  border-color: #c7d2fe !important;
  box-shadow: 0 2px 6px rgba(99, 102, 241, 0.08) !important;
}

.theme-form textarea.form-control:focus {
  border-color: var(--crm-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--crm-primary-rgb), 0.15) !important;
  outline: none !important;
}

.theme-form textarea.form-control.tm-task-form-textarea {
  min-height: 80px !important;
}

/* —— Input groups (input-group.html: Left Addon, input-radius) —— */
.theme-form .input-group {
  flex-wrap: nowrap;
  border-radius: var(--crm-input-radius);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.theme-form .input-group > .form-control,
.theme-form .input-group > .form-select {
  box-shadow: none !important;
}

.theme-form .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.theme-form .input-group > :not(:last-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.theme-form .input-group-text {
  background-color: var(--crm-addon-bg) !important;
  border: 1px solid var(--crm-input-border) !important;
  color: var(--crm-primary) !important;
  font-size: 15px !important;
  padding: 0 14px !important;
  min-height: 44px;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 0 !important;
}

.theme-form .input-group > .input-group-text:first-child {
  border-top-left-radius: var(--crm-input-radius) !important;
  border-bottom-left-radius: var(--crm-input-radius) !important;
}

.theme-form .input-group > .input-group-text:last-child {
  border-top-right-radius: var(--crm-input-radius) !important;
  border-bottom-right-radius: var(--crm-input-radius) !important;
}

.theme-form .input-group-text .txt-primary,
.theme-form .input-group-text i.icofont,
.theme-form .input-group-text [class*="icon-"] {
  color: var(--crm-primary) !important;
}

.theme-form .input-group-text.bg-light-primary {
  background-color: var(--crm-addon-bg) !important;
}

.theme-form .input-group:focus-within .input-group-text {
  border-color: var(--crm-primary) !important;
}

.theme-form .input-group .form-control:focus,
.theme-form .input-group .form-select:focus {
  z-index: 2;
}

/* Pill / rounded group variant */
.theme-form .pill-input-group {
  border-radius: 50rem;
}

.theme-form .pill-input-group > .input-group-text:first-child {
  border-top-left-radius: 50rem !important;
  border-bottom-left-radius: 50rem !important;
}

.theme-form .pill-input-group > .input-group-text:last-child,
.theme-form .pill-input-group > .form-control:last-child,
.theme-form .pill-input-group > .form-select:last-child {
  border-top-right-radius: 50rem !important;
  border-bottom-right-radius: 50rem !important;
}

/* —— Labels multiselect (dropdown toggle) —— */
.theme-form .labels-dropdown-toggle {
  min-height: 44px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--crm-input-border) !important;
  border-radius: var(--crm-input-radius) !important;
  background: var(--crm-input-bg) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px;
  font-size: 14px !important;
  color: #374151 !important;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}

.theme-form .labels-dropdown-toggle:hover {
  border-color: #c7d2fe !important;
  box-shadow: 0 2px 6px rgba(99, 102, 241, 0.08) !important;
}

.theme-form .labels-dropdown-toggle.active {
  border-color: var(--crm-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--crm-primary-rgb), 0.12) !important;
}

.theme-form .labels-dropdown-wrapper {
  position: relative;
  width: 100%;
  z-index: 1;
}

.theme-form .labels-dropdown-wrapper.labels-dropdown-open {
  z-index: 90;
}

/* Open only: never force display without .labels-dropdown-open (keeps default closed) */
.theme-form .labels-dropdown-wrapper.labels-dropdown-open .labels-dropdown-menu {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: calc(100% + 8px) !important;
  top: auto !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  max-height: min(260px, 42vh) !important;
  overflow: hidden !important;
  z-index: 5 !important;
  border-radius: var(--crm-input-radius) !important;
  border: 1px solid var(--crm-input-border) !important;
  background: #fff !important;
  box-shadow: 0 -6px 28px rgba(15, 23, 42, 0.12), 0 4px 16px rgba(15, 23, 42, 0.06) !important;
  padding: 0 !important;
}

.theme-form .labels-dropdown-menu .labels-search {
  flex-shrink: 0 !important;
  padding: 8px 10px 6px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  background: #fff !important;
}

.theme-form .labels-dropdown-menu .labels-search-input {
  width: 100% !important;
  height: 38px !important;
  padding: 0 10px !important;
  font-size: 13px !important;
  border: 1px solid var(--crm-input-border) !important;
  border-radius: 8px !important;
  background: #f9fafb !important;
}

.theme-form .labels-dropdown-menu .labels-search-input:focus {
  outline: none !important;
  border-color: #a5b4fc !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important;
}

.theme-form .labels-dropdown-menu .labels-list {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  padding: 6px 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

.theme-form .labels-dropdown-menu .labels-list-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  margin: 0 6px 2px !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  transition: background 0.12s ease !important;
}

.theme-form .labels-dropdown-menu .labels-list-item:hover {
  background: #f8fafc !important;
}

.theme-form .labels-dropdown-menu .labels-list-item input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
  accent-color: var(--crm-primary) !important;
}

.theme-form .labels-dropdown-menu .labels-list-item-label {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  cursor: pointer !important;
  flex: 1 !important;
  min-width: 0 !important;
}

.theme-form .labels-dropdown-menu .label-color-indicator {
  width: 10px !important;
  height: 10px !important;
  border-radius: 3px !important;
  flex-shrink: 0 !important;
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.08) !important;
}

.theme-form .labels-dropdown-menu .labels-dropdown-footer {
  flex-shrink: 0 !important;
  padding: 8px 10px !important;
  border-top: 1px solid #f1f5f9 !important;
  background: #fafafa !important;
}

.theme-form .labels-dropdown-menu .labels-clear-btn {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--crm-primary) !important;
  background: none !important;
  border: none !important;
  padding: 4px 0 !important;
  cursor: pointer !important;
}

.theme-form .labels-dropdown-menu .labels-clear-btn:hover {
  color: #5b4cdb !important;
  text-decoration: underline !important;
}

/* —— Modal footer buttons (drawers / dialogs) —— */
.modal .modal-footer .btn {
  min-height: 42px !important;
  padding: 0 20px !important;
  font-size: 14px !important;
  border-radius: var(--crm-input-radius) !important;
  transition: all 0.2s ease !important;
}

.modal .modal-footer .btn-primary {
  background: linear-gradient(135deg, #6366f1, #7c3aed) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(99, 102, 241, 0.35) !important;
}

.modal .modal-footer .btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(99, 102, 241, 0.45) !important;
  color: #fff !important;
}

.modal .modal-footer .btn-secondary {
  background: #f1f5f9 !important;
  color: #374151 !important;
  border: none !important;
}

.modal .modal-footer .btn-secondary:hover {
  background: #e5e7eb !important;
  color: #111827 !important;
}

/* —— Invalid state —— */
.theme-form .form-control.is-invalid,
.theme-form .form-select.is-invalid {
  border-color: #dc3545 !important;
}

.theme-form .form-control.is-invalid:focus,
.theme-form .form-select.is-invalid:focus {
  box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.15) !important;
}

/* —— Auth logo sizing fix —— */
.login-card .logo {
  display: inline-flex;
  align-items: center;
}

.login-card .auth-brand-wrap {
  text-align: center;
}

.login-card .logo img {
  width: auto !important;
  height: auto !important;
  max-height: 76px !important;
  max-width: min(280px, 70vw) !important;
  object-fit: contain;
}