/**
 * Desplegables nativos MWS — sitio público, admin y paneles (facturación, CRM, finanzas).
 * Chevron verde, sin appearance por defecto del SO.
 */

:root {
  --mws-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath fill='%23C9FF00' d='M1 1.2 7 7.2 13 1.2' stroke='%23C9FF00' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
  --mws-select-bg: rgba(255, 255, 255, 0.05);
  --mws-select-border: rgba(255, 255, 255, 0.12);
  --mws-select-text: #d5d5d5;
  --mws-select-muted: rgba(213, 213, 213, 0.45);
  --mws-select-focus-ring: rgba(201, 255, 0, 0.18);
  --mws-select-focus-border: rgba(201, 255, 0, 0.45);
  --mws-select-hover-border: rgba(201, 255, 0, 0.28);
  --mws-select-option-bg: #1d1d1b;
}

html.mws-admin-root[data-theme="light"] {
  --mws-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath fill='none' d='M1 1.2 7 7.2 13 1.2' stroke='%233d5200' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --mws-select-bg: #fafaf7;
  --mws-select-border: #c8c8c0;
  --mws-select-text: #1f1f1c;
  --mws-select-muted: #6c6c6c;
  --mws-select-focus-ring: rgba(61, 82, 0, 0.15);
  --mws-select-focus-border: #6b8f00;
  --mws-select-hover-border: #9ab300;
  --mws-select-option-bg: #f0f0ec;
}

/* Selectores unificados */
.form-select,
.mws-native-select,
.mws-admin-root .form-row select:not([multiple]):not([size]),
.mws-admin-root .related-widget-wrapper select:not([multiple]),
.be-form select,
.mws-form select,
.mws-ia-cfg select,
.mws-quote-field select,
.mws-seo-period select,
.mws-seo-dialog__select,
.ak-select,
.ak-train-form select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  box-sizing: border-box;
  max-width: 100%;
  width: 100%;
  min-height: 2.65rem;
  padding: 0.55rem 2.75rem 0.55rem 0.85rem;
  border-radius: 10px;
  border: 1px solid var(--mws-select-border);
  background-color: var(--mws-select-bg);
  background-image: var(--mws-select-chevron);
  background-repeat: no-repeat;
  background-position: right 0.85rem center;
  background-size: 14px 9px;
  color: var(--mws-select-text);
  font-family: var(--font-secondary, "Roboto", ui-sans-serif, system-ui, sans-serif);
  font-size: 0.9rem;
  font-weight: 500;
  line-height: 1.35;
  cursor: pointer;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease;
}

.mws-admin-root .form-row select,
.mws-admin-root .related-widget-wrapper select {
  font-family: var(--mws-font-body, "Inter", ui-sans-serif, system-ui, sans-serif);
}

.be-form select,
.mws-form select {
  font-size: 0.88rem;
  min-height: 2.5rem;
}

.form-select:hover,
.mws-native-select:hover,
.mws-admin-root .form-row select:hover,
.be-form select:hover,
.mws-form select:hover,
.mws-ia-toolbar select:hover,
.mws-fin-toolbar select:hover,
.mws-quote-filters__field select:hover,
.mws-seo-filters select:hover,
.blog-list-filters__select:hover {
  border-color: var(--mws-select-hover-border);
}

.form-select:focus,
.form-select:focus-visible,
.mws-native-select:focus,
.mws-native-select:focus-visible,
.mws-admin-root .form-row select:focus,
.mws-admin-root .form-row select:focus-visible,
.be-form select:focus,
.be-form select:focus-visible,
.mws-form select:focus,
.mws-form select:focus-visible,
.mws-ia-toolbar select:focus,
.mws-ia-toolbar select:focus-visible,
.mws-fin-toolbar select:focus,
.mws-fin-toolbar select:focus-visible,
.mws-quote-filters__field select:focus,
.mws-quote-filters__field select:focus-visible,
.mws-seo-filters select:focus,
.mws-seo-filters select:focus-visible,
.blog-list-filters__select:focus,
.blog-list-filters__select:focus-visible {
  outline: none;
  border-color: var(--mws-select-focus-border);
  box-shadow: 0 0 0 3px var(--mws-select-focus-ring);
  background-color: var(--mws-select-bg);
}

.form-select:disabled,
.mws-native-select:disabled,
.mws-admin-root .form-row select:disabled,
.be-form select:disabled,
.mws-form select:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  background-image: var(--mws-select-chevron);
}

.form-select option,
.mws-native-select option,
.mws-admin-root select option,
.be-form select option,
.mws-form select option,
.blog-list-filters__select option {
  background-color: var(--mws-select-option-bg);
  color: var(--mws-select-text);
  font-weight: 500;
}

/* Placeholder de primera opción vacía */
.form-select option[value=""],
.mws-native-select option[value=""],
.be-form select option[value=""] {
  color: var(--mws-select-muted);
}

/* Blog: ya tenía reglas propias — alinear sin duplicar chevron distinto */
.blog-list-filters__select {
  padding: 10px 36px 10px 14px;
  font-size: 0.95rem;
  border-radius: 10px;
}

/* Contenedor opcional (accesibilidad / layout) */
.mws-select-wrap {
  position: relative;
  display: block;
  width: 100%;
}

.mws-select-wrap > select {
  width: 100%;
}

/* Selects en barras de filtros: apariencia MWS (layout en mws-filter-bar.css) */
.mws-toolbar select,
.mws-fin-toolbar select,
.mws-seo-filters select,
.mws-quote-filters__field select,
.be-toolbar select,
.be-toolbar .be-select,
.blog-list-filters__select,
.mws-ia-toolbar select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  box-sizing: border-box;
  min-height: 2.5rem;
  padding: 0.5rem 2.75rem 0.5rem 0.85rem;
  border-radius: 10px;
  border: 1px solid var(--mws-select-border);
  background-color: var(--mws-select-bg);
  background-image: var(--mws-select-chevron);
  background-repeat: no-repeat;
  background-position: right 0.85rem center;
  background-size: 14px 9px;
  color: var(--mws-select-text);
  font-family: var(--font-secondary, "Roboto", ui-sans-serif, system-ui, sans-serif);
  font-size: 0.85rem;
  font-weight: 500;
  line-height: 1.35;
  cursor: pointer;
}

/* Formulario de contacto: mismo look que .form-input / .form-textarea (main.css) */
.contact-form .form-select {
  border-radius: 8px;
  padding: 12px 2.75rem 12px 16px;
  min-height: auto;
  border-color: rgba(255, 255, 255, 0.1);
}

.contact-form .form-select:hover {
  border-color: rgba(255, 255, 255, 0.15);
}

.contact-form .form-select:focus,
.contact-form .form-select:focus-visible {
  border-color: var(--mws-green, #c9ff00);
  background: rgba(255, 255, 255, 0.07);
  box-shadow: 0 0 0 1px rgba(201, 255, 0, 0.12);
}
