/* WooNexo — Mi cuenta del cliente. Hereda tipografía y colores del tema; solo agrega estructura y estados. */
.wnx-mc { --wnx-borde: rgba(127, 127, 127, .25); --wnx-suave: rgba(127, 127, 127, .07); --wnx-ok: #0f766e; --wnx-alerta: #b45309; --wnx-mal: #b42318; display: flex; flex-direction: column; gap: 1.1em; }
.wnx-mc h2, .wnx-mc h3 { margin: 0; }
.wnx-mc-hola { display: flex; align-items: center; gap: .75em; flex-wrap: wrap; }
.wnx-mc-rol { padding: .2em .7em; border-radius: 99px; background: rgba(15, 118, 110, .12); color: var(--wnx-ok); font-size: .8em; font-weight: 600; }
.wnx-mc-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .75em; }
.wnx-mc-tile { display: flex; flex-direction: column; gap: .2em; padding: .9em 1em; border: 1px solid var(--wnx-borde); border-radius: 12px; }
.wnx-mc-tile span { font-size: .8em; opacity: .7; }
.wnx-mc-tile strong { font-size: 1.35em; font-variant-numeric: tabular-nums; }
.wnx-mc-tile small { opacity: .7; }
.wnx-mc-card { padding: 1em 1.1em; border: 1px solid var(--wnx-borde); border-radius: 12px; display: flex; flex-direction: column; gap: .6em; }
.wnx-mc-card > header { display: flex; align-items: center; justify-content: space-between; gap: .6em; flex-wrap: wrap; }
.wnx-mc-card p { margin: 0; }
.wnx-mc-lista { display: flex; flex-direction: column; gap: .75em; }
.wnx-mc-ayuda { font-size: .88em; opacity: .75; }
.wnx-mc-total { font-weight: 600; }
.wnx-mc-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.wnx-mc-estado { display: inline-flex; align-items: center; gap: .4em; padding: .2em .7em; border-radius: 99px; font-size: .82em; font-weight: 600; background: var(--wnx-suave); white-space: nowrap; }
.wnx-mc-estado::before { content: ""; width: .5em; height: .5em; border-radius: 50%; background: currentColor; opacity: .8; }
.wnx-mc-estado--success { color: var(--wnx-ok); background: rgba(15, 118, 110, .1); }
.wnx-mc-estado--warning { color: var(--wnx-alerta); background: rgba(180, 83, 9, .1); }
.wnx-mc-estado--danger { color: var(--wnx-mal); background: rgba(180, 35, 24, .1); }
.wnx-mc-estado--accent { color: #1d4ed8; background: rgba(29, 78, 216, .1); }
.wnx-mc-tiempo { list-style: none; margin: .3em 0; padding: 0; display: flex; gap: 0; }
.wnx-mc-tiempo li { flex: 1; position: relative; padding-top: 1.4em; font-size: .78em; text-align: center; opacity: .55; }
.wnx-mc-tiempo li span { position: absolute; top: 0; left: 50%; width: .9em; height: .9em; margin-left: -.45em; border-radius: 50%; border: 2px solid currentColor; background: transparent; z-index: 1; }
.wnx-mc-tiempo li::before { content: ""; position: absolute; top: .4em; left: -50%; right: 50%; height: 2px; background: currentColor; opacity: .3; }
.wnx-mc-tiempo li:first-child::before { display: none; }
.wnx-mc-tiempo li.is-hecho, .wnx-mc-tiempo li.is-actual { opacity: 1; color: var(--wnx-ok); }
.wnx-mc-tiempo li.is-hecho span, .wnx-mc-tiempo li.is-actual span { background: currentColor; }
.wnx-mc-tiempo li.is-hecho::before, .wnx-mc-tiempo li.is-actual::before { opacity: 1; }
.wnx-mc-tiempo li.is-actual { font-weight: 700; }
.wnx-mc-seg { padding: .6em .8em; border-radius: 10px; background: rgba(29, 78, 216, .06); display: flex; align-items: center; gap: .5em; flex-wrap: wrap; }
.wnx-mc-acciones { display: flex; flex-wrap: wrap; gap: .5em; }
.wnx-mc-acciones .button { margin: 0 !important; }
.wnx-mc-aviso { padding: .8em 1em; border-radius: 12px; background: rgba(180, 83, 9, .08); }
.wnx-mc-aviso p { margin: 0 0 .4em; display: flex; align-items: center; gap: .6em; flex-wrap: wrap; }
.wnx-mc-aviso p:last-child { margin: 0; }
.wnx-mc-atajos { display: flex; gap: 1em; flex-wrap: wrap; font-size: .92em; }
.wnx-mc-notas { margin: 0; padding-left: 1.1em; display: flex; flex-direction: column; gap: .4em; }
.wnx-mc-notas p { display: inline; }
.wnx-mc-simple { margin: 0; padding-left: 1.1em; }
.wnx-mc-paginas { display: flex; justify-content: space-between; gap: .5em; }
.wnx-mc-form { display: flex; flex-direction: column; gap: .8em; margin-top: .6em; }
.wnx-mc-form label { display: flex; flex-direction: column; gap: .25em; }
.wnx-mc-form label[hidden] { display: none; }
.wnx-mc-form .wnx-mc-radio { flex-direction: row; align-items: center; gap: .5em; }
.wnx-mc-form fieldset { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .3em; }
.wnx-mc-form legend { padding: 0; margin-bottom: .3em; }
.wnx-mc-tablawrap { overflow-x: auto; }
.wnx-mc-tabla { width: 100%; border-collapse: collapse; }
.wnx-mc-tabla th, .wnx-mc-tabla td { padding: .5em .4em; border-bottom: 1px solid var(--wnx-borde); text-align: left; }
.wnx-mc-tabla .num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.wnx-mc-tabla input[type=number] { width: 5em; text-align: right; }
.wnx-mc-buscar { display: flex; gap: .5em; }
.wnx-mc-buscar label { flex: 1; } .wnx-mc-buscar input { width: 100%; }
.wnx-mc-rapido { display: flex; flex-direction: column; gap: .8em; }
details > summary { cursor: pointer; font-weight: 600; }
@media (max-width: 600px) {
  .wnx-mc-tiempo li { font-size: .68em; }
  .wnx-mc-tabla thead { display: none; }
  .wnx-mc-tabla tr { display: grid; grid-template-columns: 1fr auto; gap: .2em .6em; padding: .5em 0; border-bottom: 1px solid var(--wnx-borde); }
  .wnx-mc-tabla td { border: 0; padding: 0; }
  .wnx-mc-tabla td:first-child { grid-column: 1 / -1; }
}
.wnx-mc .wnx-mc-sec, .wnx-mc-buscar .wnx-mc-sec { background: transparent !important; color: inherit !important; border: 1px solid currentColor !important; }
.wnx-mc .wnx-mc-primario { font-weight: 600; }
.wnx-mc-form input[type=text], .wnx-mc-form input[type=tel], .wnx-mc-form input[type=number], .wnx-mc-form select, .wnx-mc-form textarea, .wnx-mc-buscar input, .wnx-mc-tabla input[type=number] { font: inherit; padding: .5em .65em; border: 1px solid var(--wnx-borde); border-radius: 8px; background: transparent; color: inherit; box-sizing: border-box; }
.wnx-mc-form select, .wnx-mc-form textarea, .wnx-mc-form input[type=text], .wnx-mc-form input[type=tel] { width: 100%; }
.wnx-mc-form input[type=file] { font: inherit; font-size: .9em; }
.wnx-mc-form button[type=submit] { align-self: flex-start; }
