/* FE Motors: el CRM con la misma cara que la página (negro, amarillo y rojo; Barlow y Barlow Condensed). Va después de base.css y crm.css. */
:root {
  --bg: #f5f4ef; --card: #ffffff; --card-press: #efede6; --sep: rgba(19, 19, 22, .12);
  --label: #131316; --label-2: #5d5d66; --label-3: #a5a39b; --fill: rgba(19, 19, 22, .07);
  --tint: #131316; --btn-txt: #0e0e10; --rojo: #d42318; --orange: #e0a800;
  --ink: #0e0e10; --amarillo: #f2c230; --amarillo-2: #ffd44d; --rojo-marca: #e3261c;
  --font: "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --head: "Barlow Condensed", "Barlow", Arial, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0e0e10; --card: #17171a; --card-press: #202024; --sep: rgba(255, 255, 255, .1);
    --label: #ffffff; --label-2: #a3a3ab; --label-3: #5f5f66; --fill: rgba(255, 255, 255, .08);
    --tint: #f2c230; --btn-txt: #0e0e10; --rojo: #ff5a4e; --orange: #f2c230;
  }
}
body { letter-spacing: 0; }

/* Marca */
.logo { display: inline-flex; align-items: baseline; gap: .18em; font-family: var(--head); font-style: italic; font-weight: 800; font-size: 26px; line-height: 1; text-transform: uppercase; }
.logo .fe { color: var(--rojo-marca); } .logo .mo { color: var(--amarillo); }
.logo .rayas { display: inline-flex; gap: 3px; margin-left: .15em; align-self: center; }
.logo .rayas i { width: 4px; height: .62em; background: #fff; transform: skewX(-20deg); }
.logo .rayas i:nth-child(2) { opacity: .6; } .logo .rayas i:nth-child(3) { opacity: .35; }

/* Barra de arriba negra, como el encabezado de la página */
.nav { background: var(--ink); border-bottom: 0; color: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
.nav strong { font-family: var(--head); font-weight: 800; font-size: 20px; text-transform: uppercase; letter-spacing: .02em; }
.nav .link { color: #c9c9cf; }
.nav .cancelar-nav { color: #ff6b5f !important; }
.nav .atras { color: var(--amarillo); }

/* Títulos */
.titulo-grande { font-family: var(--head); font-weight: 800; text-transform: uppercase; font-size: 46px; line-height: .95; letter-spacing: 0; margin: 22px 0 6px; }
.sub { font-size: 16px; }
.cab { font-family: var(--head); font-weight: 700; font-size: 15px; letter-spacing: .04em; color: var(--label-2); }
.card { border-radius: 12px; border: 1px solid var(--sep); }
@media (prefers-color-scheme: dark) { .card { border-color: transparent; } }

/* Botones y filtros */
.btn { background: var(--amarillo); color: var(--ink); border-radius: 10px; font-weight: 700; }
.btn:hover { background: var(--amarillo-2); }
.buscar { background: var(--card); border: 1px solid var(--sep); border-radius: 10px; padding: 11px 14px; }
.seg { background: var(--fill); border-radius: 10px; padding: 3px; }
.seg button { font-size: 14px; border-radius: 8px; padding: 7px 10px; }
.seg button.on { background: var(--ink); color: #fff; box-shadow: none; }
@media (prefers-color-scheme: dark) { .seg button.on { background: var(--amarillo); color: var(--ink); } }

/* Lista */
.reg .txt strong { font-weight: 600; }
.prio-alta { background: var(--rojo-marca); }
.prio-media { background: var(--amarillo); }
.prio-baja { background: var(--label-3); }
.quiere { border-radius: 4px; text-transform: uppercase; font-family: var(--head); font-weight: 700; font-size: 12px; letter-spacing: .04em; padding: 1px 6px; transform: skewX(-8deg); }

/* Detalle */
.detalle { background: var(--bg); }
.acciones a { background: var(--card); color: var(--label); border: 1px solid var(--sep); font-weight: 600; border-radius: 10px; }
.acciones a + a { background: var(--amarillo); color: var(--ink); border-color: var(--amarillo); }
.oferta-fila input { font-family: var(--head); font-size: 28px; font-weight: 800; }
.fila .ok { stroke: var(--label); }

/* Entrada: pantalla negra con la marca */
#entrada { padding-top: 14vh; }
body.en-entrada { background: var(--ink); color: #fff; }
body.en-entrada .demo { background: #000; }
#entrada .logo { font-size: 44px; margin-bottom: 18px; }
#entrada .sub { color: #a3a3ab; }
#entrada .card { background: #17171a; border-color: #2c2c31; }
#entrada input { color: #fff; }
#entrada input::placeholder { color: #6b6b73; }
body.en-entrada .credito, body.en-entrada .credito a { color: #8b8b94; }

/* Mi servicio */
.btn-cancelar { border-radius: 10px; }
.btn-volver { border-radius: 10px; }
.hoja h2 { font-family: var(--head); font-weight: 800; text-transform: uppercase; font-size: 30px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }