/* Tesorafarma · administración con el aspecto de tesorafarma.es
   (mismos tokens que web/index.html: papel, tinta, verdes y oro). */
:root, html[data-theme] {
  --tf-papel: #fbfaf7;
  --tf-tinta: #18231e;
  --tf-gris: #5c6b63;
  --tf-linea: #dfddd4;
  --tf-verde: #17805c;
  --tf-verde-hondo: #14432e;
  --tf-menta: #e8f4ed;
  --tf-oro: #b48327;
  --tf-oro-claro: #e9c877;
  --tf-oro-suave: #fbf1d9;
  --tf-serif: Georgia, "Times New Roman", serif;
  --tf-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* variables del administrador de Django */
  --primary: var(--tf-verde);
  --secondary: var(--tf-verde-hondo);
  --accent: var(--tf-oro-claro);
  --primary-fg: #fff;
  --body-fg: var(--tf-tinta);
  --body-bg: var(--tf-papel);
  --body-quiet-color: var(--tf-gris);
  --body-medium-color: #3d4a43;
  --body-loud-color: var(--tf-tinta);
  --header-color: var(--tf-menta);
  --header-branding-color: #fff;
  --header-bg: var(--tf-verde-hondo);
  --header-link-color: #fff;
  --breadcrumbs-fg: #cfe6da;
  --breadcrumbs-link-fg: #fff;
  --breadcrumbs-bg: var(--tf-verde);
  --link-fg: var(--tf-verde);
  --link-hover-color: var(--tf-verde-hondo);
  --link-selected-fg: var(--tf-verde-hondo);
  --hairline-color: var(--tf-linea);
  --border-color: var(--tf-linea);
  --error-fg: #b3261e;
  --message-success-bg: var(--tf-menta);
  --message-warning-bg: var(--tf-oro-suave);
  --message-error-bg: #fbe4e2;
  --darkened-bg: #f3f1ea;
  --selected-bg: var(--tf-menta);
  --selected-row: var(--tf-oro-suave);
  --button-fg: #fff;
  --button-bg: var(--tf-verde);
  --button-hover-bg: var(--tf-verde-hondo);
  --default-button-bg: var(--tf-verde-hondo);
  --default-button-hover-bg: #0e2f20;
  --close-button-bg: var(--tf-gris);
  --close-button-hover-bg: #3d4a43;
  --delete-button-bg: #b3261e;
  --delete-button-hover-bg: #8c1d17;
  --object-tools-fg: #fff;
  --object-tools-bg: var(--tf-gris);
  --object-tools-hover-bg: var(--tf-verde-hondo);
  --font-family-primary: var(--tf-sans);
  color-scheme: light;
}

body { background: var(--tf-papel); }

/* Marca */
#site-name a.tf-marca {
  align-items: center; color: #fff; display: inline-flex; gap: .6rem;
  font-family: var(--tf-serif); font-size: 1.3rem; font-weight: 600; text-decoration: none;
}
#site-name a.tf-marca svg { height: 2.1rem; width: 2.1rem; flex: none; }
#site-name a.tf-marca small {
  color: var(--tf-oro-claro); font-family: var(--tf-sans); font-size: .72rem;
  font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
}
#header { border-bottom: 3px solid var(--tf-oro-claro); }

/* Títulos con la serif de la web */
#content h1, #content h2.subhead, .login #site-name { font-family: var(--tf-serif); }
#content h1 { color: var(--tf-verde-hondo); letter-spacing: -.01em; }
.module h2, .module caption, .inline-group h2 { background: var(--tf-verde-hondo); }

/* Franja del modo de Stripe: siempre visible arriba.
   En PRUEBA, imposible de pasar por alto: rayas de obra, marco dorado
   alrededor de toda la página y chapa junto al logo. */
.tf-modo {
  position: sticky; top: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: center;
  min-height: 2.6rem; padding: .35rem 1rem;
  font-weight: 800; font-size: .9rem; letter-spacing: .08em; text-align: center; text-transform: uppercase;
}
.tf-modo span { border-radius: 999px; padding: .25rem .9rem; }
.tf-modo-prueba {
  background: repeating-linear-gradient(-45deg, #e9c877 0 16px, #1f1f1f 16px 32px);
  border-bottom: 3px solid #1f1f1f;
}
.tf-modo-prueba span { background: #1f1f1f; color: #ffd966; box-shadow: 0 0 0 3px #e9c877; }
.tf-modo-produccion { background: #b3261e; color: #fff; }
.tf-modo-desconocido { background: #3d4a43; color: #fff; }
body.tf-cuerpo-prueba::after {
  content: ""; position: fixed; inset: 0; z-index: 2000; pointer-events: none;
  border: 6px solid #e9c877; box-shadow: inset 0 0 0 2px #1f1f1f;
}
#site-name { align-items: center; display: flex; gap: 1rem; }
.tf-chapa {
  border-radius: 6px; font-family: var(--tf-sans); font-size: .78rem; font-weight: 800;
  letter-spacing: .1em; padding: .25rem .6rem;
}
.tf-chapa-prueba { background: #ffd966; color: #1f1f1f; box-shadow: 0 0 0 2px #1f1f1f; }
.tf-chapa-produccion { background: #b3261e; color: #fff; }

/* Selector de modo en la configuración de Stripe */
.tf-caja-modo {
  align-items: center; background: #fff; border: 2px solid var(--tf-linea); border-radius: 8px;
  display: flex; flex-wrap: wrap; gap: 1rem; margin: 0 0 1.2rem; padding: .9rem 1.1rem;
}
.tf-caja-modo label { font-weight: 700; }
.tf-caja-modo select { font-size: 1rem; font-weight: 700; padding: .35rem .6rem; }
.tf-caja-modo small { color: var(--tf-gris); flex-basis: 100%; }

/* Guardar sin recargar: un solo botón «Guardar», avisos flotantes */
.tf-js .submit-row input[name="_continue"],
.tf-js .submit-row input[name="_addanother"] { display: none; }
.tf-guardando .submit-row input[type=submit] { opacity: .6; pointer-events: none; }
#tf-avisos { position: fixed; right: 1.2rem; bottom: 1.2rem; z-index: 3000; display: grid; gap: .5rem; }
.tf-aviso {
  border-radius: 8px; box-shadow: 0 6px 20px rgba(0, 0, 0, .18); font-weight: 600;
  max-width: 26rem; padding: .75rem 1rem; transition: opacity .5s, transform .5s;
}
.tf-aviso-ok { background: var(--tf-verde-hondo); color: #fff; }
.tf-aviso-error { background: #b3261e; color: #fff; }
.tf-aviso-fuera { opacity: 0; transform: translateY(.5rem); }

/* Pestañas Prueba / Producción */
.tf-pestanas { border-bottom: 2px solid var(--tf-linea); display: flex; gap: .3rem; margin: 1rem 0 0; }
.tf-pestana-boton {
  background: #f3f1ea; border: 1px solid var(--tf-linea); border-bottom: 0; border-radius: 8px 8px 0 0;
  color: var(--tf-gris); cursor: pointer; font: inherit; font-weight: 700; margin-bottom: -2px; padding: .55rem 1.1rem;
}
.tf-pestana-boton[aria-selected="true"] { background: #fff; color: var(--tf-verde-hondo); border-color: var(--tf-linea); }
.tf-pestana-boton-prueba[aria-selected="true"] { box-shadow: inset 0 4px 0 #e9c877; }
.tf-pestana-boton-produccion[aria-selected="true"] { box-shadow: inset 0 4px 0 #b3261e; color: #b3261e; }
.tf-js fieldset.tf-pestana > h2 { display: none; }
.tf-js fieldset.tf-pestana { border-top: 0; margin-top: 0; }

/* Reenvío manual con revisión de la dirección */
.tf-reenvio {
  align-items: center; background: #fff; border: 1px solid var(--tf-linea); border-left: 4px solid var(--tf-verde);
  border-radius: 8px; display: flex; flex-wrap: wrap; gap: .5rem .8rem; margin: 0 0 1rem; padding: .8rem 1rem;
}
.tf-reenvio small { color: var(--tf-gris); flex-basis: 100%; order: 1; }
.tf-reenvio strong { order: 0; }
.tf-reenvio input[type=email] { min-width: 18rem; order: 2; padding: .4rem .6rem; }
.tf-reenvio-guardar { order: 3; font-size: .85rem; }
.tf-reenvio .button { order: 4; }
.tf-dialogo-destacado {
  background: var(--tf-menta); border-radius: 6px; color: var(--tf-verde-hondo); font-family: var(--tf-sans);
  font-size: 1.25rem; font-weight: 800; padding: .6rem .8rem; word-break: break-all;
}
.tf-pestanas-enlaces { margin: 0 0 .8rem; }
.tf-pestanas-enlaces a.tf-pestana-boton { display: inline-block; text-decoration: none; }
.tf-cuenta { background: var(--tf-linea); border-radius: 999px; font-size: .78rem; margin-left: .3rem; padding: 0 .45rem; }
.tf-pestana-boton[aria-selected="true"] .tf-cuenta { background: var(--tf-menta); }

/* Ventana de confirmación */
.tf-dialogo { border: 0; border-radius: 10px; box-shadow: 0 20px 50px rgba(0, 0, 0, .3); max-width: 30rem; padding: 1.4rem 1.6rem; }
.tf-dialogo::backdrop { background: rgba(20, 67, 46, .45); }
.tf-dialogo h2 { color: var(--tf-verde-hondo); font-family: var(--tf-serif); font-size: 1.35rem; margin: 0 0 .6rem; }
.tf-dialogo-peligro h2 { color: #b3261e; }
.tf-dialogo-botones { display: flex; gap: .6rem; justify-content: flex-end; margin-top: 1.2rem; }
.tf-dialogo-peligro .tf-aceptar { background: #b3261e; }

/* Botones de Stripe en la configuración */
.tf-acciones-stripe { display: flex; flex-wrap: wrap; gap: 1rem; margin: 0 0 1rem; }
.tf-accion-grupo {
  align-items: center; background: #fff; border: 1px solid var(--tf-linea); border-radius: 6px;
  display: flex; flex-wrap: wrap; gap: .5rem; padding: .6rem .8rem;
}
.tf-accion-grupo form { margin: 0; }

/* Sin selector de tema (no hay modo oscuro) */
.theme-toggle { display: none; }

/* Página de entrada */
.login #header { justify-content: center; }
.login #container { border-top: 4px solid var(--tf-oro-claro); border-radius: 8px; }