/**
 * Tello Motos — Portal de Sucursales v3
 * Diseño: oscuro "racing" con rojo Tello. Responsive (escritorio, tablet y celular).
 */

:root {
	--tm-red: #f50919;
	--tm-red-2: #d90012;
	--tm-red-soft: rgba(245, 9, 25, 0.14);
	--tm-bg: #08090b;
	--tm-side: #0b0d11;
	--tm-surface: #101318;
	--tm-surface-2: #161a22;
	--tm-surface-3: #1c212b;
	--tm-border: rgba(255, 255, 255, 0.08);
	--tm-border-2: rgba(255, 255, 255, 0.14);
	--tm-text: #f1f5f9;
	--tm-muted: #94a3b8;
	--tm-dim: #64748b;
	--tm-in: #38bdf8;
	--tm-out: #f59e0b;
	--tm-ok: #22c55e;
	--tm-warn: #f59e0b;
	--tm-bad: #ef4444;
	--tm-info: #818cf8;
	--tm-wa: #25d366;
	--tm-font: 'Barlow', 'Segoe UI', Arial, sans-serif;
	--tm-display: 'Barlow Condensed', 'Arial Narrow', Impact, sans-serif;
	--tm-r: 12px;
	--tm-r-sm: 8px;
	--tm-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
	--tm-side-w: 236px;
}

/* ------------------------------------------------------------------ Aislamiento del tema */
body.tello-portal-page,
body:has(.tm-root) {
	background: var(--tm-bg) !important;
	color: var(--tm-text);
	margin: 0;
}
body.tello-portal-page header.wp-block-template-part,
body.tello-portal-page footer.wp-block-template-part,
body.tello-portal-page .wp-block-post-title,
body:has(.tm-root) header.wp-block-template-part,
body:has(.tm-root) footer.wp-block-template-part,
body:has(.tm-root) .wp-block-post-title {
	display: none !important;
}
body.tello-portal-page main:not(.tm-content),
body.tello-portal-page .wp-block-group,
body.tello-portal-page .wp-block-post-content,
body.tello-portal-page .entry-content,
body:has(.tm-root) main:not(.tm-content),
body:has(.tm-root) .wp-site-blocks,
body:has(.tm-root) .wp-block-group,
body:has(.tm-root) .wp-block-post-content {
	padding: 0 !important;
	margin: 0 !important;
	max-width: none !important;
	background: transparent !important;
}
body:has(.tm-root) .wp-site-blocks > * + * { margin-block-start: 0 !important; }
body.tm-noscroll { overflow: hidden; }

.tm-root, .tm-root *, .tm-modal-back, .tm-modal-back *, .tm-toasts, .tm-toasts * { box-sizing: border-box; }
.tm-root [hidden], .tm-modal-back [hidden] { display: none !important; }
.tm-root, .tm-modal-back, .tm-toasts {
	font-family: var(--tm-font);
	font-size: 15px;
	line-height: 1.45;
	color: var(--tm-text);
	-webkit-font-smoothing: antialiased;
}
.tm-root { max-width: none !important; width: 100%; margin: 0 !important; }
.tm-root a, .tm-modal-back a { color: inherit; }
.tm-root h1, .tm-root h2, .tm-root h3, .tm-root h4, .tm-modal-back h3, .tm-modal-back h4 { margin: 0; font-family: var(--tm-display); letter-spacing: 0.01em; font-weight: 700; color: var(--tm-text); }
.tm-ico { flex-shrink: 0; vertical-align: middle; }
.tm-muted { color: var(--tm-muted); }
.tm-small { font-size: 12.5px; }
.tm-nowrap { white-space: nowrap; }
.tm-spacer { flex: 1; }
.tm-c-in { color: var(--tm-in) !important; }
.tm-c-out { color: var(--tm-out) !important; }
.tm-c-sale { color: #ff5a66 !important; }
.tm-c-bad { color: var(--tm-bad) !important; }
.tm-c-warn { color: var(--tm-warn) !important; }
.tm-link { color: #ff6b75 !important; text-decoration: none; font-weight: 600; font-size: 13.5px; display: inline-flex; align-items: center; gap: 4px; }
.tm-link:hover { text-decoration: underline; }
.tm-h4 { font-size: 18px; margin: 18px 0 8px !important; }
.tm-pad { padding: 0 18px; }

/* ------------------------------------------------------------------ Carga inicial */
.tm-boot, .tm-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; color: var(--tm-muted); }
.tm-boot { min-height: 100vh; }
.tm-loading { padding: 50px 20px; flex-direction: row; }
.tm-spinner { width: 28px; height: 28px; border-radius: 50%; border: 3px solid rgba(255, 255, 255, 0.12); border-top-color: var(--tm-red); animation: tm-spin 0.8s linear infinite; }
.tm-loading .tm-spinner { width: 20px; height: 20px; border-width: 2px; }
@keyframes tm-spin { to { transform: rotate(360deg); } }
.is-loading { opacity: 0.55; pointer-events: none; transition: opacity 0.15s; }

/* ------------------------------------------------------------------ Botones */
.tm-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 7px;
	padding: 10px 16px; border-radius: var(--tm-r-sm); border: 1px solid transparent;
	font: 600 14px/1.1 var(--tm-font); cursor: pointer; text-decoration: none !important;
	background: var(--tm-surface-3); color: var(--tm-text) !important; transition: background 0.15s, border-color 0.15s, transform 0.1s, opacity 0.15s;
	white-space: nowrap; user-select: none;
}
.tm-btn:hover { background: #262c38; }
.tm-btn:active { transform: translateY(1px); }
.tm-btn:disabled { opacity: 0.45; cursor: not-allowed; }
.tm-btn.is-busy { position: relative; color: transparent !important; }
.tm-btn.is-busy::after { content: ''; position: absolute; width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, 0.35); border-top-color: #fff; animation: tm-spin 0.7s linear infinite; }
.tm-btn-primary { background: var(--tm-red); color: #fff !important; box-shadow: 0 6px 18px rgba(245, 9, 25, 0.25); }
.tm-btn-primary:hover { background: var(--tm-red-2); }
.tm-btn-in { background: rgba(56, 189, 248, 0.14); border-color: rgba(56, 189, 248, 0.35); color: #7dd3fc !important; }
.tm-btn-in:hover { background: rgba(56, 189, 248, 0.24); }
.tm-btn-out { background: rgba(245, 158, 11, 0.12); border-color: rgba(245, 158, 11, 0.35); color: #fcd34d !important; }
.tm-btn-out:hover { background: rgba(245, 158, 11, 0.22); }
.tm-btn-danger { background: rgba(239, 68, 68, 0.15); border-color: rgba(239, 68, 68, 0.4); color: #fca5a5 !important; }
.tm-btn-danger:hover { background: rgba(239, 68, 68, 0.28); }
.tm-btn-ghost { background: transparent; border-color: var(--tm-border-2); color: var(--tm-text) !important; }
.tm-btn-ghost:hover { background: var(--tm-surface-2); border-color: rgba(255, 255, 255, 0.25); }
.tm-btn-wa { background: rgba(37, 211, 102, 0.14); border-color: rgba(37, 211, 102, 0.4); color: #6ee7a0 !important; }
.tm-btn-wa:hover { background: rgba(37, 211, 102, 0.25); }
.tm-btn-sm { padding: 7px 11px; font-size: 13px; }
.tm-btn-xs { padding: 4px 8px; font-size: 12px; border-radius: 6px; }
.tm-btn-block { width: 100%; }
.tm-btn-row { display: flex; flex-wrap: wrap; gap: 10px; }
.tm-btn-icon {
	display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px;
	border-radius: 8px; border: 1px solid transparent; background: transparent; color: var(--tm-muted); cursor: pointer; transition: all 0.15s; font-size: 15px;
}
.tm-btn-icon:hover:not(:disabled) { background: var(--tm-surface-3); color: var(--tm-text); border-color: var(--tm-border); }
.tm-btn-icon:disabled { opacity: 0.25; cursor: not-allowed; }
.tm-ic-in:hover:not(:disabled) { color: var(--tm-in); }
.tm-ic-out:hover:not(:disabled) { color: var(--tm-out); }
.tm-ic-sale:hover:not(:disabled) { color: #ff5a66; }

/* ------------------------------------------------------------------ Layout */
.tm-app { display: flex; min-height: 100vh; background: var(--tm-bg); }
.tm-side {
	width: var(--tm-side-w); flex-shrink: 0; background: var(--tm-side); border-right: 1px solid var(--tm-border);
	display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; z-index: 40;
}
.tm-side-logo { display: flex; align-items: center; justify-content: center; padding: 18px 16px 14px; border-bottom: 1px solid var(--tm-border); text-decoration: none; }
.tm-side-logo img { max-width: 100%; max-height: 74px; border-radius: 10px; object-fit: contain; }
.tm-logo-text { font-family: var(--tm-display); font-size: 26px; font-weight: 800; letter-spacing: 0.04em; color: #fff; }
.tm-logo-text b { color: var(--tm-red); }
.tm-nav { flex: 1; overflow-y: auto; padding: 12px 10px; display: flex; flex-direction: column; gap: 3px; }
.tm-nav-item {
	display: flex; align-items: center; gap: 12px; padding: 11px 13px; border-radius: 9px; text-decoration: none !important;
	color: var(--tm-muted) !important; font-weight: 600; font-size: 14.5px; transition: all 0.15s; position: relative;
}
.tm-nav-item:hover { background: var(--tm-surface-2); color: var(--tm-text) !important; }
.tm-nav-item.is-active { background: var(--tm-red-soft); color: #fff !important; }
.tm-nav-item.is-active::before { content: ''; position: absolute; left: -10px; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: var(--tm-red); }
.tm-nav-item.is-active .tm-ico { color: var(--tm-red); }
.tm-nav-small { font-size: 13px; padding: 9px 13px; }
.tm-side-foot { border-top: 1px solid var(--tm-border); padding: 10px; }
.tm-side-user { display: flex; align-items: center; gap: 10px; padding: 10px 6px 4px; }
.tm-side-user-txt { flex: 1; min-width: 0; }
.tm-side-user-txt strong { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm-side-user-txt small { display: block; color: var(--tm-muted); font-size: 12px; line-height: 1.25; }
.tm-side-overlay { display: none; }

.tm-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.tm-top {
	position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
	padding: 14px 26px; background: rgba(8, 9, 11, 0.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--tm-border);
}
.tm-burger { display: none; }
.tm-top-title { flex: 1; min-width: 180px; }
.tm-top-title h1 { font-size: 27px; line-height: 1.05; text-transform: uppercase; }
.tm-top-sub { color: var(--tm-muted); font-size: 13px; margin-top: 2px; }
.tm-top-ctrls { display: flex; gap: 10px; flex-wrap: wrap; }
.tm-actions { display: flex; gap: 8px; }
.tm-content { padding: 22px 26px 60px; display: flex; flex-direction: column; gap: 18px; max-width: 1680px; width: 100%; }

.tm-scope-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 13px; border-radius: 999px; background: var(--tm-red-soft); border: 1px solid rgba(245, 9, 25, 0.35); font-weight: 700; font-size: 13.5px; }
.tm-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--tm-ok); box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.2); display: inline-block; }
.tm-select-wrap { display: flex; flex-direction: column; gap: 2px; }
.tm-select-label { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--tm-dim); font-weight: 700; padding-left: 2px; }

/* ------------------------------------------------------------------ Formularios */
.tm-select, .tm-root input[type=text], .tm-root input[type=search], .tm-root input[type=number], .tm-root input[type=email], .tm-root input[type=tel], .tm-root input[type=password], .tm-root input[type=date],
.tm-modal-back input[type=text], .tm-modal-back input[type=search], .tm-modal-back input[type=number], .tm-modal-back input[type=email], .tm-modal-back input[type=tel], .tm-modal-back input[type=password], .tm-modal-back input[type=date], .tm-modal-back input[type=datetime-local], .tm-modal-back input[type=file],
.tm-modal-back select, .tm-modal-back textarea {
	width: 100%; background: var(--tm-surface-2); color: var(--tm-text); border: 1px solid var(--tm-border-2); border-radius: var(--tm-r-sm);
	padding: 10px 12px; font: 500 14.5px/1.3 var(--tm-font); outline: none; transition: border-color 0.15s, box-shadow 0.15s; min-height: 41px;
}
.tm-select { width: auto; min-width: 150px; padding-right: 32px; cursor: pointer; appearance: none; -webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 11px center; }
.tm-modal-back select { appearance: none; -webkit-appearance: none; padding-right: 32px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 11px center; }
.tm-select-sm { min-width: 0; padding: 7px 30px 7px 10px; min-height: 34px; font-size: 13px; }
.tm-select:focus, .tm-root input:focus, .tm-modal-back input:focus, .tm-modal-back select:focus, .tm-modal-back textarea:focus { border-color: rgba(245, 9, 25, 0.6); box-shadow: 0 0 0 3px rgba(245, 9, 25, 0.15); }
.tm-modal-back select:disabled, .tm-modal-back input:disabled { opacity: 0.5; cursor: not-allowed; }
.tm-modal-back textarea { resize: vertical; min-height: 60px; }
.tm-root select option, .tm-modal-back select option { background: #161a22; color: #f1f5f9; }
.tm-form { display: flex; flex-direction: column; gap: 14px; }
.tm-form-narrow { max-width: 680px; }
.tm-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0; }
.tm-field > span:first-child { font-size: 12.5px; font-weight: 700; color: #cbd5e1; text-transform: uppercase; letter-spacing: 0.04em; }
.tm-field input + input, .tm-field select + input { margin-top: 6px; }
.tm-req { color: var(--tm-red); font-style: normal; }
.tm-help { color: var(--tm-muted); font-size: 12.5px; margin: 0; line-height: 1.45; }
.tm-help a { color: #ff6b75; }
.tm-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.tm-row3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.tm-fixed { padding: 10px 12px; border-radius: var(--tm-r-sm); background: var(--tm-surface-3); border: 1px solid var(--tm-border); font-weight: 700; }
.tm-check { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; color: #cbd5e1; cursor: pointer; user-select: none; }
.tm-check input { width: 17px; height: 17px; accent-color: var(--tm-red); }
.tm-fieldset { border: 1px solid var(--tm-border-2); border-radius: var(--tm-r); padding: 14px; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.tm-fieldset legend { padding: 0 8px; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 0.05em; color: #cbd5e1; }
.tm-form-msg { padding: 11px 14px; border-radius: var(--tm-r-sm); font-size: 14px; font-weight: 600; }
.tm-form-msg-err { background: rgba(239, 68, 68, 0.12); border: 1px solid rgba(239, 68, 68, 0.4); color: #fecaca; }
.tm-form-msg a { color: #fff; }
.tm-inline-edit { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; }
.tm-inline-edit input { width: 80px !important; min-height: 34px !important; padding: 6px 8px !important; }
.tm-moto-pick { display: grid; grid-template-columns: 170px 1fr; gap: 8px; }
.tm-moto-pick .tm-moto-filter { margin: 0 !important; }

/* ------------------------------------------------------------------ Tarjetas y grillas */
.tm-card { background: var(--tm-surface); border: 1px solid var(--tm-border); border-radius: var(--tm-r); min-width: 0; }
.tm-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 18px; border-bottom: 1px solid var(--tm-border); flex-wrap: wrap; }
.tm-card-head h3 { font-size: 19px; display: flex; align-items: center; gap: 8px; text-transform: uppercase; }
.tm-card-head h3 .tm-ico { color: var(--tm-warn); }
.tm-card-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.tm-card-body { padding: 16px 18px; }
.tm-card > .tm-help { margin-top: 12px; }
.tm-scroll-y { max-height: 380px; overflow-y: auto; }
.tm-grid { display: grid; gap: 18px; }
.tm-g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tm-g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tm-g-2-1 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }

/* KPIs */
.tm-kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.tm-kpis-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tm-kpi { background: var(--tm-surface); border: 1px solid var(--tm-border); border-radius: var(--tm-r); padding: 15px 16px; display: flex; flex-direction: column; gap: 5px; position: relative; overflow: hidden; min-width: 0; }
.tm-kpi::after { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--tm-border-2); }
.tm-kpi-red::after { background: var(--tm-red); }
.tm-kpi-blue::after { background: var(--tm-in); }
.tm-kpi-warn::after { background: var(--tm-warn); }
.tm-kpi-label { font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.07em; color: var(--tm-muted); font-weight: 700; }
.tm-kpi-value { font-family: var(--tm-display); font-size: 31px; line-height: 1.05; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm-kpi-text { font-size: 24px; }
.tm-kpi-sub { font-size: 12.5px; color: var(--tm-muted); }
.tm-delta { font-size: 12px; font-weight: 700; color: var(--tm-muted); }
.tm-delta.up { color: var(--tm-ok); }
.tm-delta.down { color: #f87171; }

/* Gráficos */
.tm-chart-box { position: relative; height: 290px; width: 100%; }
.tm-chart-tall { height: 330px; }
.tm-chart-h { margin-bottom: 18px; }

/* Rankings */
.tm-rank-list, .tm-seller-mini, .tm-feed { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.tm-rank-list li, .tm-seller-mini li { display: flex; gap: 12px; align-items: center; }
.tm-rank-n { width: 26px; height: 26px; flex-shrink: 0; border-radius: 7px; background: var(--tm-surface-3); display: grid; place-items: center; font-weight: 800; font-size: 13px; color: var(--tm-muted); }
.tm-rank-list li:first-child .tm-rank-n { background: var(--tm-red); color: #fff; }
.tm-rank-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.tm-rank-top { display: flex; justify-content: space-between; gap: 10px; }
.tm-rank-top strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm-rank-top b { font-size: 14px; white-space: nowrap; }
.tm-meter { height: 6px; background: var(--tm-surface-3); border-radius: 99px; overflow: hidden; }
.tm-meter i { display: block; height: 100%; background: linear-gradient(90deg, var(--tm-red-2), #ff4d5a); border-radius: 99px; }
.tm-feed li { display: flex; gap: 12px; align-items: flex-start; padding: 8px; margin: -8px; border-radius: 8px; }
.tm-feed li:hover { background: var(--tm-surface-2); }
.tm-feed li > .tm-badge { margin-top: 2px; min-width: 64px; justify-content: center; }
.tm-feed strong { font-size: 14px; }

/* Avatares */
.tm-avatar { width: 38px; height: 38px; flex-shrink: 0; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: 14px; background: var(--tm-surface-3); border: 1px solid var(--tm-border-2); color: #e2e8f0; }
.tm-avatar-lg { width: 64px; height: 64px; font-size: 22px; }
.tm-av-rank1 { background: linear-gradient(135deg, #facc15, #b45309); color: #1a1205; border-color: transparent; }
.tm-av-rank2 { background: linear-gradient(135deg, #e5e7eb, #6b7280); color: #111; border-color: transparent; }
.tm-av-rank3 { background: linear-gradient(135deg, #fdba74, #9a3412); color: #1f0d05; border-color: transparent; }

/* Badges y chips */
.tm-badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; white-space: nowrap; border: 1px solid transparent; background: var(--tm-surface-3); color: #cbd5e1; }
.tm-b-in { background: rgba(56, 189, 248, 0.14); color: #7dd3fc; border-color: rgba(56, 189, 248, 0.3); }
.tm-b-out { background: rgba(245, 158, 11, 0.13); color: #fcd34d; border-color: rgba(245, 158, 11, 0.3); }
.tm-b-sale { background: rgba(245, 9, 25, 0.15); color: #ff8a92; border-color: rgba(245, 9, 25, 0.35); }
.tm-b-ok { background: rgba(34, 197, 94, 0.13); color: #86efac; border-color: rgba(34, 197, 94, 0.3); }
.tm-b-warn { background: rgba(245, 158, 11, 0.13); color: #fcd34d; border-color: rgba(245, 158, 11, 0.3); }
.tm-b-bad { background: rgba(239, 68, 68, 0.14); color: #fca5a5; border-color: rgba(239, 68, 68, 0.35); }
.tm-b-info { background: rgba(129, 140, 248, 0.14); color: #c7d2fe; border-color: rgba(129, 140, 248, 0.35); }
.tm-b-muted { background: rgba(148, 163, 184, 0.1); color: var(--tm-muted); border-color: var(--tm-border-2); }
.tm-chip { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px; background: var(--tm-red-soft); border: 1px solid rgba(245, 9, 25, 0.35); font-size: 12.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.tm-colors { display: flex; flex-wrap: wrap; gap: 5px; }
.tm-color { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border-radius: 6px; background: var(--tm-surface-3); font-size: 12px; color: #cbd5e1; white-space: nowrap; }
.tm-color b { color: #fff; }
.tm-cdot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.3); margin-right: 4px; vertical-align: -1px; }
.tm-color .tm-cdot { margin-right: 0; }
.tm-chip-model { display: inline-flex; gap: 4px; padding: 3px 9px; border-radius: 6px; background: var(--tm-surface-3); font-size: 12px; border: 1px solid var(--tm-border); }
.tm-chip-model b { color: #ff8a92; }

/* ------------------------------------------------------------------ Tablas */
.tm-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tm-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.tm-table th { text-align: left; font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--tm-muted); font-weight: 700; padding: 11px 14px; border-bottom: 1px solid var(--tm-border-2); background: var(--tm-surface); position: sticky; top: 0; white-space: nowrap; }
.tm-table th small { display: block; font-size: 10px; color: var(--tm-dim); text-transform: none; letter-spacing: 0; }
.tm-table td { padding: 11px 14px; border-bottom: 1px solid var(--tm-border); vertical-align: middle; }
.tm-table tbody tr:last-child td { border-bottom: 0; }
.tm-table-compact th, .tm-table-compact td { padding: 8px 10px; font-size: 13.5px; }
.tm-table .tm-num { text-align: right; }
.tm-table small { font-size: 12px; }
.tm-click { cursor: pointer; transition: background 0.12s; }
.tm-click:hover { background: rgba(255, 255, 255, 0.025); }
tr.is-void td { opacity: 0.5; }
tr.is-void td:not(:last-child) { text-decoration: line-through; text-decoration-color: rgba(255, 255, 255, 0.3); }
.tm-col-name { min-width: 170px; }
.tm-mov-det { display: flex; flex-direction: column; gap: 2px; min-width: 180px; }
.tm-mov-det .tm-ico { color: var(--tm-muted); vertical-align: -2px; }
.tm-mov-table td:first-child { color: var(--tm-muted); font-size: 13px; }

.tm-moto-cell { display: flex; align-items: center; gap: 11px; min-width: 210px; }
.tm-moto-cell img { width: 54px; height: 42px; object-fit: cover; border-radius: 6px; border: 1px solid var(--tm-border); background: #222; }
.tm-moto-cell strong { display: block; font-size: 14.5px; }
.tm-moto-cell small { display: block; color: var(--tm-muted); font-size: 12px; }
.tm-moto-ph { width: 54px; height: 42px; border-radius: 6px; border: 1px dashed var(--tm-border-2); display: grid; place-items: center; color: var(--tm-dim); flex-shrink: 0; }
.tm-moto-ph-lg { width: 120px; height: 90px; }
.tm-stock-table .tm-col-home { background: rgba(245, 9, 25, 0.06); border-left: 1px solid rgba(245, 9, 25, 0.25); border-right: 1px solid rgba(245, 9, 25, 0.25); min-width: 160px; }
.tm-stock-table th.tm-col-home { color: #ff8a92; }
.tm-stockcell { display: flex; flex-direction: column; gap: 6px; }
.tm-stockcell > b { font-family: var(--tm-display); font-size: 24px; line-height: 1; }
.tm-qty { display: inline-block; min-width: 34px; padding: 3px 8px; border-radius: 6px; text-align: center; font-weight: 700; color: var(--tm-dim); background: rgba(255, 255, 255, 0.03); }
.tm-qty.has { color: #fff; background: rgba(56, 189, 248, 0.12); }

/* Toolbar */
.tm-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 14px 18px; border-bottom: 1px solid var(--tm-border); }
.tm-toolbar-end { margin-left: auto; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tm-search { position: relative; flex: 1 1 260px; max-width: 420px; display: flex; align-items: center; }
.tm-search .tm-ico { position: absolute; left: 12px; color: var(--tm-dim); pointer-events: none; }
.tm-search input { padding-left: 36px !important; }
.tm-seg { display: inline-flex; background: var(--tm-surface-2); border: 1px solid var(--tm-border-2); border-radius: 9px; padding: 3px; gap: 2px; }
.tm-seg button { border: 0; background: transparent; color: var(--tm-muted); font: 600 13.5px var(--tm-font); padding: 7px 13px; border-radius: 7px; cursor: pointer; white-space: nowrap; }
.tm-seg button:hover { color: var(--tm-text); }
.tm-seg button.is-active { background: var(--tm-red); color: #fff; }
.tm-seg-wrap { flex-wrap: wrap; margin-bottom: 14px; }
.tm-totals { display: flex; flex-wrap: wrap; gap: 8px 22px; padding: 12px 18px; border-bottom: 1px solid var(--tm-border); color: var(--tm-muted); font-size: 13.5px; }
.tm-totals b { font-size: 16px; color: var(--tm-text); margin-right: 3px; }
.tm-modal-body .tm-totals { padding: 0 0 12px; margin-bottom: 4px; }

/* Paginador */
.tm-pager { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 18px; flex-wrap: wrap; }
.tm-pager:empty { display: none; }
.tm-pager-info { color: var(--tm-muted); font-size: 13px; }
.tm-pager-btns { display: flex; gap: 4px; align-items: center; }
.tm-pg { min-width: 34px; height: 34px; padding: 0 9px; border-radius: 8px; border: 1px solid var(--tm-border-2); background: transparent; color: var(--tm-text); font: 600 13px var(--tm-font); cursor: pointer; }
.tm-pg:hover:not(:disabled) { background: var(--tm-surface-2); }
.tm-pg.is-active { background: var(--tm-red); border-color: var(--tm-red); color: #fff; }
.tm-pg:disabled { opacity: 0.3; cursor: default; }
.tm-pg-gap { color: var(--tm-dim); padding: 0 3px; }

/* Resumen de stock */
.tm-stock-summary { display: flex; flex-wrap: wrap; gap: 12px; }
.tm-sum-item { background: var(--tm-surface); border: 1px solid var(--tm-border); border-radius: var(--tm-r); padding: 12px 16px; display: flex; flex-direction: column; gap: 2px; min-width: 150px; }
.tm-sum-item span { font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--tm-muted); font-weight: 700; }
.tm-sum-item b { font-family: var(--tm-display); font-size: 28px; line-height: 1.05; }
.tm-sum-home { border-color: rgba(245, 9, 25, 0.4); background: linear-gradient(135deg, rgba(245, 9, 25, 0.14), var(--tm-surface)); }
.tm-sum-mini b { font-size: 22px; }
.tm-sum-warn b { color: var(--tm-warn); }
.tm-sum-info b { color: #a5b4fc; }

/* Vacíos */
.tm-empty { text-align: center; padding: 34px 16px; color: var(--tm-muted); }
.tm-empty-ico { color: var(--tm-dim); margin-bottom: 8px; opacity: 0.7; }
.tm-empty p { margin: 0 0 4px; font-weight: 600; color: #cbd5e1; }
.tm-empty small { font-size: 13px; }

/* Alertas */
.tm-alert { padding: 11px 14px; border-radius: var(--tm-r-sm); font-size: 14px; border: 1px solid; display: block; }
.tm-alert .tm-colors { margin-top: 6px; }
.tm-alert-info { background: rgba(56, 189, 248, 0.08); border-color: rgba(56, 189, 248, 0.3); color: #dbeafe; }
.tm-alert-ok { background: rgba(34, 197, 94, 0.08); border-color: rgba(34, 197, 94, 0.3); color: #dcfce7; }
.tm-alert-warn { background: rgba(245, 158, 11, 0.09); border-color: rgba(245, 158, 11, 0.35); color: #fef3c7; }
.tm-red-list { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.tm-red-item { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 9px 11px; border-radius: 8px; background: rgba(0, 0, 0, 0.25); }
.tm-red-item .tm-colors { margin: 0; }
.tm-details { margin-top: 8px; }
.tm-details summary { cursor: pointer; color: var(--tm-muted); font-size: 13px; font-weight: 600; }
.tm-sale-total { text-align: right; font-size: 15px; color: var(--tm-muted); }
.tm-sale-total b { font-family: var(--tm-display); font-size: 26px; color: #fff; margin-left: 6px; }

/* Buscador de clientes */
.tm-combo { position: relative; }
.tm-combo-list { position: absolute; left: 0; right: 0; top: calc(100% + 4px); background: var(--tm-surface-3); border: 1px solid var(--tm-border-2); border-radius: var(--tm-r-sm); box-shadow: var(--tm-shadow); z-index: 10; max-height: 260px; overflow-y: auto; }
.tm-combo-list button { display: block; width: 100%; text-align: left; padding: 10px 12px; border: 0; background: transparent; color: var(--tm-text); font: 500 14px var(--tm-font); cursor: pointer; border-bottom: 1px solid var(--tm-border); }
.tm-combo-list button:hover { background: rgba(245, 9, 25, 0.12); }
.tm-combo-list small { display: block; color: var(--tm-muted); font-size: 12px; }
.tm-combo-empty { padding: 12px; color: var(--tm-muted); font-size: 13.5px; }
.tm-combo-empty a { color: #ff6b75; }
.tm-cli-sel { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 11px 13px; border-radius: var(--tm-r-sm); background: rgba(34, 197, 94, 0.08); border: 1px solid rgba(34, 197, 94, 0.3); }
.tm-cli-sel small { display: block; }
.tm-cli-new { display: flex; flex-direction: column; gap: 12px; }
.tm-fieldset > .tm-btn-ghost { align-self: flex-start; }

/* Tarjetas de vendedores */
.tm-seller-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.tm-seller-card { background: var(--tm-surface-2); border: 1px solid var(--tm-border); border-radius: var(--tm-r); padding: 15px; display: flex; flex-direction: column; gap: 12px; cursor: pointer; transition: border-color 0.15s, transform 0.15s; }
.tm-seller-card:hover { border-color: rgba(245, 9, 25, 0.45); transform: translateY(-2px); }
.tm-seller-card.is-zero { opacity: 0.6; }
.tm-seller-card header { display: flex; align-items: center; gap: 11px; }
.tm-rank-badge { width: 30px; height: 30px; flex-shrink: 0; border-radius: 8px; display: grid; place-items: center; font-family: var(--tm-display); font-size: 17px; font-weight: 800; color: var(--tm-muted); background: var(--tm-surface-3); }
.tm-rank-badge.r1 { background: linear-gradient(135deg, #facc15, #b45309); color: #1a1205; }
.tm-rank-badge.r2 { background: linear-gradient(135deg, #e5e7eb, #6b7280); color: #111; }
.tm-rank-badge.r3 { background: linear-gradient(135deg, #fdba74, #9a3412); color: #1f0d05; }
.tm-seller-name { min-width: 0; }
.tm-seller-name strong { display: block; font-size: 16px; }
.tm-seller-name small { color: var(--tm-muted); font-size: 12px; }
.tm-seller-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; text-align: center; }
.tm-seller-stats div { background: var(--tm-surface); border-radius: 8px; padding: 8px 4px; }
.tm-seller-stats b { display: block; font-family: var(--tm-display); font-size: 24px; line-height: 1; }
.tm-seller-stats span { font-size: 11px; color: var(--tm-muted); text-transform: uppercase; letter-spacing: 0.05em; }
.tm-seller-stats div:first-child b { color: #ff5a66; }
.tm-seller-money { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; font-size: 13px; color: var(--tm-muted); }
.tm-seller-money b { color: #fff; font-size: 16px; }
.tm-seller-money small { margin-left: auto; }
.tm-seller-models { display: flex; flex-wrap: wrap; gap: 5px; }
.tm-seller-card footer { font-size: 12px; }

/* Red de sucursales (detalle de stock) */
.tm-detail-head { display: flex; gap: 18px; align-items: flex-start; margin-bottom: 8px; }
.tm-detail-head > img { width: 150px; height: 110px; object-fit: cover; border-radius: 10px; border: 1px solid var(--tm-border); }
.tm-kv { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px 18px; flex: 1; }
.tm-kv > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tm-kv span { font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--tm-muted); font-weight: 700; }
.tm-kv b { font-weight: 600; font-size: 14.5px; word-break: break-word; }
.tm-kv-list { grid-template-columns: 1fr; gap: 0; }
.tm-kv-list > div { flex-direction: row; justify-content: space-between; gap: 18px; padding: 9px 0; border-bottom: 1px solid var(--tm-border); }
.tm-kv-list > div > b { text-align: right; }
.tm-net { display: flex; flex-direction: column; gap: 8px; }
.tm-net-row { display: grid; grid-template-columns: minmax(170px, 1.3fr) 70px minmax(150px, 1.5fr) auto; gap: 12px; align-items: center; padding: 12px 14px; border-radius: var(--tm-r-sm); background: var(--tm-surface-2); border: 1px solid var(--tm-border); }
.tm-net-row.is-home { border-color: rgba(245, 9, 25, 0.45); background: rgba(245, 9, 25, 0.07); }
.tm-net-row:not(.has) { opacity: 0.6; }
.tm-net-name small { display: block; color: var(--tm-muted); font-size: 12px; margin-top: 2px; }
.tm-net-qty { text-align: center; }
.tm-net-qty b { display: block; font-family: var(--tm-display); font-size: 28px; line-height: 1; }
.tm-net-qty small { color: var(--tm-muted); font-size: 11px; }
.tm-net-contact { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.tm-cli-head { display: flex; gap: 18px; align-items: flex-start; margin-bottom: 14px; flex-wrap: wrap; }
.tm-cli-actions { display: flex; flex-direction: column; gap: 8px; }

/* Tabs */
.tm-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--tm-border); overflow-x: auto; }
.tm-tabs button { border: 0; background: transparent; color: var(--tm-muted); font: 700 14px var(--tm-font); padding: 11px 16px; cursor: pointer; border-bottom: 2px solid transparent; white-space: nowrap; margin-bottom: -1px; }
.tm-tabs button:hover { color: var(--tm-text); }
.tm-tabs button.is-active { color: #fff; border-bottom-color: var(--tm-red); }
#ad-body { display: flex; flex-direction: column; gap: 18px; }

/* ------------------------------------------------------------------ Modales */
.tm-modal-back { position: fixed; inset: 0; z-index: 100000; background: rgba(2, 3, 5, 0.72); backdrop-filter: blur(3px); display: flex; align-items: flex-start; justify-content: center; padding: 0 16px; overflow-y: auto; opacity: 0; transition: opacity 0.18s; }
.tm-modal-back.is-open { opacity: 1; }
.tm-modal { width: 100%; background: var(--tm-surface); border: 1px solid var(--tm-border-2); border-radius: 14px; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6); transform: translateY(10px) scale(0.99); transition: transform 0.18s; display: flex; flex-direction: column; max-height: none; margin: 5vh 0; }
.tm-modal-back.is-open .tm-modal { transform: none; }
.tm-modal-sm { max-width: 440px; }
.tm-modal-md { max-width: 620px; }
.tm-modal-lg { max-width: 860px; }
.tm-modal-xl { max-width: 1180px; }
.tm-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--tm-border); }
.tm-modal-head h3 { font-size: 22px; text-transform: uppercase; }
.tm-mov-entrada .tm-modal-head { border-top: 3px solid var(--tm-in); border-radius: 14px 14px 0 0; }
.tm-mov-egreso .tm-modal-head { border-top: 3px solid var(--tm-out); border-radius: 14px 14px 0 0; }
.tm-mov-venta .tm-modal-head { border-top: 3px solid var(--tm-red); border-radius: 14px 14px 0 0; }
.tm-modal-close { width: 36px; height: 36px; border-radius: 9px; border: 1px solid var(--tm-border-2); background: transparent; color: var(--tm-muted); font-size: 22px; line-height: 1; cursor: pointer; }
.tm-modal-close:hover { color: #fff; background: var(--tm-surface-3); }
.tm-modal-body { padding: 18px 20px; }
.tm-modal-foot { display: flex; justify-content: flex-end; align-items: center; gap: 10px; padding: 14px 20px; border-top: 1px solid var(--tm-border); flex-wrap: wrap; position: sticky; bottom: 0; z-index: 3; background: var(--tm-surface); border-radius: 0 0 14px 14px; box-shadow: 0 -12px 18px -10px rgba(0, 0, 0, 0.55); }
.tm-confirm-msg { margin: 0 0 12px; font-size: 15px; line-height: 1.5; }

/* ------------------------------------------------------------------ Toasts */
.tm-toasts { position: fixed; right: 18px; bottom: 18px; z-index: 100100; display: flex; flex-direction: column; gap: 10px; max-width: min(440px, calc(100vw - 36px)); }
.tm-toast { display: flex; gap: 11px; align-items: flex-start; padding: 13px 15px; border-radius: 11px; background: #12161d; border: 1px solid var(--tm-border-2); box-shadow: var(--tm-shadow); font-size: 14px; font-weight: 500; cursor: pointer; transform: translateX(20px); opacity: 0; transition: all 0.22s; }
.tm-toast.is-in { transform: none; opacity: 1; }
.tm-toast-ico { width: 22px; height: 22px; flex-shrink: 0; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: 13px; }
.tm-toast-ok { border-color: rgba(34, 197, 94, 0.4); }
.tm-toast-ok .tm-toast-ico { background: var(--tm-ok); color: #052e12; }
.tm-toast-err { border-color: rgba(239, 68, 68, 0.5); }
.tm-toast-err .tm-toast-ico { background: var(--tm-bad); color: #fff; }
.tm-toast-info .tm-toast-ico { background: var(--tm-in); color: #062433; }

/* ------------------------------------------------------------------ Login */
.tm-login-screen { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px 16px; background: radial-gradient(circle at 20% 0%, rgba(245, 9, 25, 0.18), transparent 45%), radial-gradient(circle at 100% 100%, rgba(56, 189, 248, 0.08), transparent 40%), var(--tm-bg); }
.tm-login-card { width: 100%; max-width: 420px; background: rgba(16, 19, 24, 0.92); border: 1px solid var(--tm-border-2); border-radius: 18px; padding: 30px 28px; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55); text-align: center; }
.tm-login-logo { display: inline-block; margin-bottom: 14px; text-decoration: none !important; }
.tm-login-logo-img { max-width: 120px; max-height: 120px; border-radius: 16px; }
.tm-login-title { font-size: 30px !important; text-transform: uppercase; margin: 14px 0 4px !important; }
.tm-login-title span { color: var(--tm-red); }
.tm-login-card .tm-form { text-align: left; margin-top: 22px; }
.tm-login-card input[type=text], .tm-login-card input[type=password] { width: 100%; background: var(--tm-surface-2); color: var(--tm-text); border: 1px solid var(--tm-border-2); border-radius: var(--tm-r-sm); padding: 12px 14px; font: 500 15px var(--tm-font); min-height: 46px; outline: none; }
.tm-pass-wrap { position: relative; display: block; }
.tm-pass-wrap input { padding-right: 46px !important; }
.tm-pass-toggle { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); border: 0; background: transparent; cursor: pointer; color: var(--tm-muted); padding: 6px; display: flex; }
.tm-pass-toggle:hover { opacity: 1; }
.tm-login-card .tm-btn-primary { padding: 14px; font-size: 16px; margin-top: 4px; }
.tm-login-msg { padding: 11px 13px; border-radius: 9px; font-size: 14px; font-weight: 600; }
.tm-login-msg.is-err { background: rgba(239, 68, 68, 0.12); border: 1px solid rgba(239, 68, 68, 0.4); color: #fecaca; }
.tm-login-msg.is-ok { background: rgba(34, 197, 94, 0.1); border: 1px solid rgba(34, 197, 94, 0.4); color: #bbf7d0; }
.tm-login-foot { margin: 18px 0 0; color: var(--tm-dim); font-size: 12.5px; }

/* ------------------------------------------------------------------ Responsive */
@media (max-width: 1400px) {
	.tm-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1200px) {
	.tm-g3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tm-g-2-1 { grid-template-columns: 1fr; }
	.tm-actions .tm-btn span { display: none; }
	.tm-actions .tm-btn { padding: 10px 12px; }
}
@media (max-width: 980px) {
	.tm-side { position: fixed; left: 0; top: 0; bottom: 0; transform: translateX(-100%); transition: transform 0.22s; box-shadow: var(--tm-shadow); }
	body.tm-side-open .tm-side { transform: none; }
	body.tm-side-open .tm-side-overlay { display: block; position: fixed; inset: 0; background: rgba(0, 0, 0, 0.55); z-index: 35; }
	.tm-burger { display: inline-flex; }
	.tm-top { padding: 12px 16px; gap: 10px; backdrop-filter: none; background: var(--tm-bg); }
	.tm-content { padding: 16px 14px 90px; gap: 14px; }
	.tm-g2, .tm-g3 { grid-template-columns: 1fr; }
	.tm-kpis, .tm-kpis-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.tm-top-ctrls { order: 5; width: 100%; }
	.tm-top-ctrls .tm-select-wrap { flex: 1; }
	.tm-top-ctrls .tm-select { width: 100%; }
	/* Botones de acción fijos abajo en celular */
	.tm-actions { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(8, 9, 11, 0.96); border-top: 1px solid var(--tm-border); backdrop-filter: blur(8px); }
	.tm-actions .tm-btn { flex: 1; padding: 13px 8px; }
	.tm-actions .tm-btn span { display: inline; }
	.tm-net-row { grid-template-columns: 1fr auto; }
	.tm-net-colors, .tm-net-contact { grid-column: 1 / -1; justify-content: flex-start; }
	.tm-toasts { bottom: 84px; }
}
@media (max-width: 640px) {
	.tm-top-title h1 { font-size: 22px; }
	.tm-row, .tm-row3 { grid-template-columns: 1fr; }
	.tm-moto-pick { grid-template-columns: 1fr; }
	.tm-kpi-value { font-size: 25px; }
	.tm-toolbar { padding: 12px; }
	.tm-search { max-width: none; flex-basis: 100%; }
	.tm-toolbar .tm-select { flex: 1 1 45%; min-width: 0; }
	.tm-toolbar-end { margin-left: 0; width: 100%; }
	.tm-modal-back { padding: 0; align-items: flex-start; }
	.tm-modal { border-radius: 0; min-height: 100%; margin: 0; }
	.tm-modal-head { position: sticky; top: 0; background: var(--tm-surface); z-index: 2; }
	.tm-modal-foot { border-radius: 0; }
	.tm-modal-foot .tm-btn { flex: 1; }
	.tm-detail-head { flex-direction: column; }
	.tm-card-head, .tm-card-body { padding: 13px 14px; }
	.tm-seller-grid { grid-template-columns: 1fr; }
	.tm-sum-item { min-width: calc(50% - 6px); flex: 1; }
	.tm-pager { justify-content: center; }
	.tm-kv-list > div { flex-direction: column; gap: 2px; }
	.tm-kv-list > div > b { text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
	.tm-root *, .tm-modal-back, .tm-modal, .tm-toast { transition: none !important; animation: none !important; }
}

/* Editor de ficha técnica en el formulario de modelos */
.tm-ficha { gap: 8px; padding: 14px; border: 1px solid var(--tm-border-2); border-radius: var(--tm-r); background: rgba(255, 255, 255, 0.02); }
.tm-ficha-head, .tm-ficha-row { display: grid; grid-template-columns: 1.1fr 1.1fr 1.4fr 34px; gap: 8px; align-items: center; }
.tm-ficha-head span { font-size: 11.5px; font-weight: 700; color: var(--tm-muted); text-transform: uppercase; letter-spacing: 0.05em; }
.tm-ficha-rows { display: flex; flex-direction: column; gap: 8px; }
.tm-ficha .tm-ficha-row input { min-width: 0; margin: 0 !important; }
.tm-ficha-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; }
.tm-ficha-state { color: var(--tm-muted); }
@media (max-width: 700px) {
	.tm-ficha-head { display: none; }
	.tm-ficha-row { grid-template-columns: 1fr 34px; padding: 10px; border: 1px solid var(--tm-border); border-radius: var(--tm-r-sm); }
	.tm-ficha-row .f-s, .tm-ficha-row .f-l, .tm-ficha-row .f-v { grid-column: 1; }
	.tm-ficha-row [data-rm] { grid-column: 2; grid-row: 1; }
}

/* ------------------------------------------------------------------ Ingreso múltiple de motos */
.tm-ing { gap: 8px; padding: 14px; border: 1px solid var(--tm-border-2); border-radius: var(--tm-r); background: rgba(255, 255, 255, 0.02); }
.tm-ing-head, .tm-ing-row { display: grid; grid-template-columns: 1.7fr 1.2fr 84px 116px; gap: 8px; align-items: start; }
.tm-ing-head span { font-size: 11.5px; font-weight: 700; color: var(--tm-muted); text-transform: uppercase; letter-spacing: 0.05em; }
.tm-ing-rows { display: flex; flex-direction: column; gap: 8px; }
.tm-ing .tm-ing-row select, .tm-ing .tm-ing-row input { min-width: 0; margin: 0 !important; }
.tm-ing .i-colorbox { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.tm-ing .i-acts { display: flex; align-items: center; gap: 6px; min-height: 41px; }
.tm-ing-row.is-bad select, .tm-ing-row.is-bad input { border-color: rgba(239, 68, 68, 0.7); }
.tm-ing-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 2px; }
.tm-ing-total { color: #cbd5e1; font-weight: 700; font-size: 13.5px; }
@media (max-width: 680px) {
	.tm-ing-head { display: none; }
	.tm-ing-row { grid-template-columns: 1fr 84px; padding: 10px; border: 1px solid var(--tm-border); border-radius: var(--tm-r-sm); }
	.tm-ing-row .i-moto { grid-column: 1 / -1; }
	.tm-ing-row .i-colorbox { grid-column: 1; }
	.tm-ing-row .i-cant { grid-column: 2; }
	.tm-ing-row .i-acts { grid-column: 1 / -1; justify-content: flex-end; min-height: 0; }
}

/* ===== Costos y ganancia (solo Dueño / Super Admin) ===== */
.tm-c-gain { color: #4ade80 !important; }
.tm-kpi-green::after { background: #22c55e; }
.tm-pm-out { min-height: 42px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 0 2px; font-size: 15px; }
.tm-pm-out b { font-family: var(--tm-display); font-size: 20px; }
#mf-margen:empty { display: none; }
#mf-margen .tm-alert { font-size: 13.5px; }
#mf-margen .tm-alert b { font-family: var(--tm-display); font-size: 17px; }
.tm-control { margin: 0 0 16px; line-height: 1.5; }
.tm-control b { color: #fff; }
.tm-card .tm-table-wrap + .tm-table-wrap { margin-top: 14px; }
@media (max-width: 640px) {
	.tm-pm-out { min-height: 0; padding: 4px 0; }
}

/* ===== Foto de cada color (formulario de modelo) ===== */
.tm-fc { display: flex; flex-direction: column; gap: 10px; }
.tm-fc-empty { margin: 0; font-size: 13.5px; }
.tm-fc-list { display: flex; flex-direction: column; gap: 8px; }
.tm-fc-row { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px; background: var(--tm-surface); border: 1px solid var(--tm-border); border-radius: var(--tm-r-sm); }
.tm-fc-thumb { width: 72px; height: 54px; border-radius: 8px; overflow: hidden; background: rgba(0, 0, 0, 0.35); border: 1px dashed var(--tm-border-2); display: flex; align-items: center; justify-content: center; }
.tm-fc-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tm-fc-none { font-size: 11px; color: var(--tm-muted); text-align: center; line-height: 1.2; padding: 0 4px; }
.tm-fc-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tm-fc-main strong { font-size: 15px; }
.tm-fc-main small { font-size: 12.5px; line-height: 1.35; }
.tm-fc-acts { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.tm-fc-pick { cursor: pointer; }
@media (max-width: 640px) {
	.tm-fc-row { grid-template-columns: 64px minmax(0, 1fr); }
	.tm-fc-thumb { width: 64px; height: 48px; }
	.tm-fc-acts { grid-column: 1 / -1; justify-content: flex-start; }
}

/* Foto por color: enlace */
.tm-fc-url { grid-column: 1 / -1; width: 100%; box-sizing: border-box; font-size: 13px; }