/*
 * Sirius Cainita 1.6.2-rc.7.2 — superfícies canônicas de formulário.
 *
 * Esta camada é carregada por último para neutralizar estilos globais de temas,
 * construtores e plugins antigos. Os seletores específicos da Ordem dos Cainitas
 * usam somente para corrigir a regressão causada pelo próprio tema.
 */

:root {
  --sirius-field-dark-bg: rgba(8, 7, 7, .46);
  --sirius-field-dark-bg-hover: rgba(18, 15, 14, .72);
  --sirius-field-dark-border: rgba(216, 202, 183, .16);
  --sirius-field-dark-border-hover: rgba(210, 183, 123, .34);
  --sirius-field-dark-placeholder: rgba(216, 202, 183, .52);
  --sirius-field-light-bg: rgba(244, 239, 229, .98);
  --sirius-field-light-border: rgba(53, 45, 41, .20);
  --sirius-field-light-placeholder: rgba(53, 45, 41, .54);
}

/* Controles básicos: apenas geometria e tipografia; a superfície é contextual. */
.sirius-site :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="hidden"]),
  select,
  textarea,
  [contenteditable="true"]
) {
  max-width: 100%;
  font: inherit;
  caret-color: var(--sirius-gold-300);
}

/* Área autenticada: formulário escuro por padrão. */
body.sirius-private-surface .sirius-site-main :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="hidden"]),
  select,
  textarea,
  [contenteditable="true"]
):not(.sirius-field--light):not([data-sirius-surface="light"]) {
  border: 1px solid var(--sirius-field-dark-border);
  background: var(--sirius-field-dark-bg);
  color: var(--sirius-parchment-100);
  box-shadow: inset 0 1px 0 rgba(255, 250, 240, .025);
}

body.sirius-private-surface .sirius-site-main :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="hidden"]),
  select,
  textarea,
  [contenteditable="true"]
):not(.sirius-field--light):not([data-sirius-surface="light"]):hover {
  border-color: var(--sirius-field-dark-border-hover);
  background: var(--sirius-field-dark-bg-hover);
}

body.sirius-private-surface .sirius-site-main :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="hidden"]),
  select,
  textarea,
  [contenteditable="true"]
):not(.sirius-field--light):not([data-sirius-surface="light"]):focus {
  outline: 0;
  border-color: var(--sirius-gold-400);
  background: rgba(19, 16, 15, .88);
  box-shadow: 0 0 0 3px rgba(184, 151, 92, .16), inset 0 1px 0 rgba(255, 250, 240, .035);
}

body.sirius-private-surface .sirius-site-main :where(input, textarea)::placeholder,
body.sirius-private-surface .sirius-site-main [contenteditable="true"]:empty::before {
  color: var(--sirius-field-dark-placeholder);
  opacity: 1;
}

/* Superfícies deliberadamente claras continuam legíveis. */
:where(.sirius-surface--light, .sirius-form--light, [data-sirius-surface="light"]) :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="hidden"]),
  select,
  textarea,
  [contenteditable="true"]
),
.sirius-field--light {
  border-color: var(--sirius-field-light-border);
  background: var(--sirius-field-light-bg);
  color: var(--sirius-ink-900);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55);
}

:where(.sirius-surface--light, .sirius-form--light, [data-sirius-surface="light"]) :where(input, textarea)::placeholder,
.sirius-field--light::placeholder {
  color: var(--sirius-field-light-placeholder);
}

/*
 * Ordem dos Cainitas 0.23.x.
 * O plugin já possui uma composição própria; o tema somente restaura suas
 * superfícies após a regressão provocada pelo antigo seletor global.
 */
body.odc-native-social .odc-social-app .odc-composer__form textarea {
  min-height: 108px;
  max-height: 320px;
  padding: 20px 23px;
  border: 0;
  border-radius: 0;
  background:
    radial-gradient(circle at 92% 14%, rgba(154, 120, 63, .055), transparent 18rem),
    linear-gradient(180deg, rgba(10, 9, 9, .16), rgba(10, 9, 9, .32));
  color: var(--odc-parchment-50, var(--sirius-parchment-50));
  box-shadow: inset 0 1px 0 rgba(255, 250, 240, .018);
  resize: none;
}

body.odc-native-social .odc-social-app .odc-composer__form textarea:hover {
  background:
    radial-gradient(circle at 92% 14%, rgba(154, 120, 63, .075), transparent 18rem),
    linear-gradient(180deg, rgba(12, 10, 10, .24), rgba(10, 9, 9, .40));
}

body.odc-native-social .odc-social-app .odc-composer__form textarea:focus {
  border: 0;
  background:
    radial-gradient(circle at 92% 14%, rgba(184, 151, 92, .09), transparent 18rem),
    linear-gradient(180deg, rgba(15, 12, 12, .38), rgba(10, 9, 9, .52));
  box-shadow: inset 3px 0 0 rgba(210, 183, 123, .48), inset 0 1px 0 rgba(255, 250, 240, .025);
}

body.odc-native-social .odc-social-app :where(
  .odc-dialogue-form textarea,
  .odc-message-composer textarea,
  .odc-new-message-form textarea,
  .odc-new-message-form input,
  .odc-new-message-form select
) {
  border: 1px solid rgba(216, 202, 183, .13);
  background: rgba(7, 6, 6, .46);
  color: var(--odc-parchment-100, var(--sirius-parchment-100));
  box-shadow: inset 0 1px 0 rgba(255, 250, 240, .02);
}

body.odc-native-social .odc-social-app :where(
  .odc-dialogue-form textarea,
  .odc-message-composer textarea,
  .odc-new-message-form textarea,
  .odc-new-message-form input,
  .odc-new-message-form select
):hover {
  border-color: rgba(210, 183, 123, .28);
  background: rgba(14, 12, 11, .68);
}

body.odc-native-social .odc-social-app :where(
  .odc-dialogue-form textarea,
  .odc-message-composer textarea,
  .odc-new-message-form textarea,
  .odc-new-message-form input,
  .odc-new-message-form select
):focus {
  border-color: var(--odc-gold-400, var(--sirius-gold-400));
  background: rgba(18, 15, 14, .86);
  box-shadow: 0 0 0 3px rgba(184, 151, 92, .14);
}

body.odc-native-social .odc-social-app :where(
  .odc-composer__form textarea,
  .odc-dialogue-form textarea,
  .odc-message-composer textarea,
  .odc-new-message-form textarea,
  .odc-new-message-form input
)::placeholder {
  color: rgba(216, 202, 183, .54);
  opacity: 1;
}

/* Evita o aspecto de uma faixa clara única em formulários compactos. */
body.odc-native-social .odc-social-app .odc-dialogue-form textarea {
  min-height: 40px;
  border-radius: 12px;
}

body.odc-native-social .odc-social-app .odc-message-composer textarea {
  min-height: 44px;
  border-radius: 14px;
}

/* Selects escuros precisam de opções legíveis no menu nativo do navegador. */
body.sirius-private-surface .sirius-site-main select option {
  background: var(--sirius-ink-900);
  color: var(--sirius-parchment-100);
}

@media (max-width: 782px) {
  body.odc-native-social .odc-social-app .odc-composer__form textarea {
    min-height: 92px;
    padding: 17px 18px;
    font-size: 16px;
    line-height: 1.6;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.sirius-private-surface .sirius-site-main :where(input, select, textarea, [contenteditable="true"]) {
    transition: none;
  }
}
