/*====================================================================|
| Admin Settings styles - Estilos de configuración del administrador  |
|=====================================================================|*/
/* General spacing - Espaciado general */
form .form-table th {
  padding-top: 18px;
  vertical-align: top;
  width: 260px;
  font-weight: 600;
  color: #1d2327; /* Color de texto admin WP */
}
form .form-table td {
  padding-top: 18px;
}
/* More comfortable and organized inputs - Inputs más cómodos y ordenados */
input[type="text"],
input[type="email"],
select,
textarea {
  max-width: 420px;
  width: 100%;
  box-sizing: border-box;
}
input[type="text"]::placeholder {
  color: #999999;
  opacity: 1;
}
/* Logo image buttons - Botones de imagen (logo) */
#little-message-lite-logo-upload-button,
#little-message-lite-logo-remove-button {
  margin-top: 10px;
  margin-right: 6px;
}
/* Logo preview - Vista previa del logo */
#little-message-lite-logo-preview {
  margin-bottom: 10px;
  border: 1px solid #ddd;
  padding: 5px;
  background: #f8f8f8;
  border-radius: 6px;
  max-width: 100px;
  max-height: 100px;
  display: block;
}
/* More visible descriptions - Descripciones más visibles */
.form-table p.description {
  font-size: 13px;
  color: #555d66;
  margin: 6px 0 0;
}
/* Nice-looking title - Título bonito */
.wrap h1 {
  margin-bottom: 28px;
  font-size: 26px;
  font-weight: 700;
  color: #0073aa;
}
/* Better layout for radio buttons and checkboxes - Mejor organización para los radios y checkbox */
.form-table label input[type="radio"],
.form-table label input[type="checkbox"] {
  margin-right: 6px;
  vertical-align: middle;
}
.form-table label {
  font-weight: 500;
  color: #2c3338;
}
/* Slightly more elegant selects - Selects un poco más elegantes */
select {
  padding: 5px 8px;
  font-size: 14px;
}
/* reCAPTCHA block - Bloque de reCAPTCHA */
#little_message_lite_recaptcha_version,
#little_message_lite_recaptcha_site_key,
#little_message_lite_recaptcha_secret_key {
  transition: opacity 0.3s ease;
}
/* Styles for disabled inputs - Estilos para campos deshabilitados */
input[disabled],
select[disabled],
textarea[disabled] {
  background-color: #f1f1f1;
  color: #999;
  cursor: not-allowed;
}
/* Submit button - Botón de enviar */
.wp-core-ui .button-primary {
  margin-top: 20px;
  padding: 0.6em 1.4em;
  font-size: 15px;
}


/*  BOTONES ADICIONALES  */
.little-message-combo-field {
    display: flex;
    align-items: center;
    gap: 10px; /* Separación visual entre el select y el input */    
}

.little-message-combo-field select,
.little-message-combo-field input[type="text"] {
    height: 32px;
    line-height: 32px;
    font-size: 14px;
    padding: 0 8px;
    border: 1px solid #ccd0d4;
    border-radius: 4px;
    box-sizing: border-box;
}

.little-message-combo-field select:focus,
.little-message-combo-field input[type="text"]:focus {
    border-color: #2271b1;
    box-shadow: 0 0 0 1px #2271b1;
    outline: none;
}

.little-message-combo-field input[type="text"]::placeholder {
    color: #999999; /* Más tenue que el gris por defecto */
    opacity: 1; /* Firefox necesita esto para respetar el color */
}

@media (max-width: 480px) {
    .little-message-combo-field {
        flex-direction: column;
        align-items: flex-start;
    }

    .little-message-combo-field select,
    .little-message-combo-field input[type="text"] {
        width: 100%;
    }
}