/* ============================================================
   CLASES DE UNA SOLA DECLARACIÓN
   Sistema de Administración de Condominios
   ============================================================
   Segunda capa del CSS, complementaria a utilidades.css:

     utilidades.css  → piezas completas con nombre propio
                       (.u-th, .u-vacio, .u-panel-blanco…)
     atomicas.css    → una declaración cada una, para componer
                       lo puntual sin inventar una clase por
                       elemento

   El nombre se lee solo: a-fs-11 es font-size:11px, a-mb-12 es
   margin-bottom:12px, a-jc-center es justify-content:center.

   POR QUÉ FALTABAN DISPLAY, COLOR Y FONDO, Y POR QUÉ YA ESTÁN
   -----------------------------------------------------------
   Esta hoja nació sin display, background, color, border, width,
   overflow ni top. La razón era buena: el JavaScript las escribía
   en tiempo de ejecución y en muchos sitios las devolvía a su
   estado con una cadena vacía (`el.style.display = ''`). Si el
   valor hubiera vivido en una clase, ese reset habría dejado de
   funcionar y el elemento se habría quedado como estaba.

   Ya no. De los 480 `style.display` no queda ninguno, y de los
   demás resets quedan veinte contados. Además, ahí la clase se
   porta mejor que el atributo: hoy, un campo cuyo fondo se
   resalta y luego se limpia con `= ''` pierde también su fondo de
   partida, porque estaba escrito en el mismo sitio. Con el valor
   en una clase, limpiar el atributo lo devuelve a su color.

   Lo que sigue fuera, y seguirá:

     - `display: none`. Ocultar es un estado y ya tiene dueño,
       `u-oculto` en utilidades.css. Dos formas de hacer lo mismo
       es justo lo que se está quitando.
     - Degradados, `rgba(...)` y sombras. Darían nombres como
       `a-bg-rgba25525525502`, que no dicen nada. Eso pide una
       clase con nombre propio.
     - Cualquier valor que salga de una variable del sistema
       (`var(--btn-form-guardar)`). Esos van en la clase del
       componente, que es quien sabe qué representa el color.

   Ver docs/PLAN_LIMPIEZA_CSS.md
   ============================================================ */

/* align-items */
.a-ai-center { align-items: center; }
.a-ai-flex-start { align-items: flex-start; }

/* border-bottom */
.a-bdb-2px-solid-e5e7eb { border-bottom: 2px solid #e5e7eb; }
.a-bdb-1px-solid-e5e7eb { border-bottom: 1px solid #e5e7eb; }
.a-bdb-1px-solid-f1f5f9 { border-bottom: 1px solid #f1f5f9; }
.a-bdb-1px-solid-e2e8f0 { border-bottom: 1px solid #e2e8f0; }
.a-bdb-1px-solid-e8ecf1 { border-bottom: 1px solid #e8ecf1; }

/* border-radius */
.a-br-4px { border-radius: 4px; }
.a-br-6px { border-radius: 6px; }
.a-br-8px { border-radius: 8px; }
.a-br-5px { border-radius: 5px; }
.a-br-3px { border-radius: 3px; }
.a-br-10px { border-radius: 10px; }
.a-br-12px { border-radius: 12px; }
.a-br-50 { border-radius: 50%; }
.a-br-2px { border-radius: 2px; }
.a-br-15px { border-radius: 15px; }

/* border-top */
.a-bdt-1px-solid-e5e7eb { border-top: 1px solid #e5e7eb; }
.a-bdt-1px-solid-e2e8f0 { border-top: 1px solid #e2e8f0; }

/* box-sizing */
.a-bs-border-box { box-sizing: border-box; }

/* flex */
.a-flex-1 { flex: 1; }

/* flex-direction */
.a-fd-column { flex-direction: column; }

/* flex-shrink */
.a-fsh-0 { flex-shrink: 0; }

/* flex-wrap */
.a-fwrap-wrap { flex-wrap: wrap; }

/* font-family */
.a-ff-monospace { font-family: monospace; }

/* font-size */
.a-fs-11px { font-size: 11px; }
.a-fs-10px { font-size: 10px; }
.a-fs-12px { font-size: 12px; }
.a-fs-13px { font-size: 13px; }
.a-fs-9px { font-size: 9px; }
.a-fs-14px { font-size: 14px; }
.a-fs-065rem { font-size: 0.65rem; }
.a-fs-07rem { font-size: 0.7rem; }
.a-fs-085rem { font-size: 0.85rem; }
.a-fs-055rem { font-size: 0.55rem; }
.a-fs-18px { font-size: 18px; }
.a-fs-8px { font-size: 8px; }
.a-fs-24px { font-size: 24px; }
.a-fs-075rem { font-size: 0.75rem; }
.a-fs-16px { font-size: 16px; }
.a-fs-06rem { font-size: 0.6rem; }
.a-fs-09rem { font-size: 0.9rem; }
.a-fs-08rem { font-size: 0.8rem; }
.a-fs-20px { font-size: 20px; }
.a-fs-28px { font-size: 28px; }
.a-fs-058rem { font-size: 0.58rem; }
.a-fs-22px { font-size: 22px; }
.a-fs-068rem { font-size: 0.68rem; }
.a-fs-15px { font-size: 15px; }

/* font-style */
.a-fst-italic { font-style: italic; }

/* font-weight */
.a-fw-700 { font-weight: 700; }
.a-fw-600 { font-weight: 600; }
.a-fw-500 { font-weight: 500; }
.a-fw-bold { font-weight: bold; }
.a-fw-800 { font-weight: 800; }
.a-fw-400 { font-weight: 400; }

/* gap */
.a-gap-10px { gap: 10px; }
.a-gap-8px { gap: 8px; }
.a-gap-6px { gap: 6px; }
.a-gap-4px { gap: 4px; }
.a-gap-12px { gap: 12px; }
.a-gap-5px { gap: 5px; }
.a-gap-3px { gap: 3px; }
.a-gap-16px { gap: 16px; }
.a-gap-15px { gap: 15px; }

/* grid-template-columns */
.a-gtc-1fr-1fr { grid-template-columns: 1fr 1fr; }
.a-gtc-1fr-1fr-1fr { grid-template-columns: 1fr 1fr 1fr; }

/* cursor */
.a-cursor-pointer { cursor: pointer; }

/* height */
.a-h-100 { height: 100%; }
.a-h-14px { height: 14px; }
.a-h-13px { height: 13px; }
.a-h-12px { height: 12px; }
.a-h-28px { height: 28px; }

/* width */
.a-w-13px { width: 13px; }
.a-w-12px { width: 12px; }

/* justify-content */
.a-jc-space-between { justify-content: space-between; }
.a-jc-center { justify-content: center; }
.a-jc-flex-end { justify-content: flex-end; }

/* left */
.a-left-0 { left: 0; }

/* letter-spacing */
.a-ls-05px { letter-spacing: 0.5px; }
.a-ls-1px { letter-spacing: 1px; }
.a-ls-03px { letter-spacing: 0.3px; }

/* line-height */
.a-lh-16 { line-height: 1.6; }
.a-lh-1 { line-height: 1; }

/* margin */
.a-m-0 { margin: 0; }
.a-m-0-0-8px-0 { margin: 0 0 8px 0; }
.a-m-0-0-12px-0 { margin: 0 0 12px 0; }
.a-m-0-0-10px-0 { margin: 0 0 10px 0; }
.a-m-4px-0-0-0 { margin: 4px 0 0 0; }
.a-m-0-0-6px-0 { margin: 0 0 6px 0; }

/* margin-bottom */
.a-mb-10px { margin-bottom: 10px; }
.a-mb-4px { margin-bottom: 4px; }
.a-mb-12px { margin-bottom: 12px; }
.a-mb-13px { margin-bottom: 13px; }
.a-mb-6px { margin-bottom: 6px; }
.a-mb-8px { margin-bottom: 8px; }
.a-mb-16px { margin-bottom: 16px; }
.a-mb-14px { margin-bottom: 14px; }
.a-mb-5px { margin-bottom: 5px; }
.a-mb-15px { margin-bottom: 15px; }
.a-mb-3px { margin-bottom: 3px; }
.a-mb-20px { margin-bottom: 20px; }
.a-mb-2px { margin-bottom: 2px; }
.a-mb-0 { margin-bottom: 0; }

/* margin-left */
.a-ml-4px { margin-left: 4px; }

/* margin-right */
.a-mr-4px { margin-right: 4px; }
.a-mr-10px { margin-right: 10px; }
.a-mr-3px { margin-right: 3px; }
.a-mr-6px { margin-right: 6px; }
.a-mr-8px { margin-right: 8px; }

/* margin-top */
.a-mt-2px { margin-top: 2px; }
.a-mt-4px { margin-top: 4px; }
.a-mt-6px { margin-top: 6px; }
.a-mt-8px { margin-top: 8px; }
.a-mt-3px { margin-top: 3px; }
.a-mt-10px { margin-top: 10px; }
.a-mt-5px { margin-top: 5px; }
.a-mt-12px { margin-top: 12px; }
.a-mt-14px { margin-top: 14px; }
.a-mt-16px { margin-top: 16px; }

/* max-width */
.a-maxw-95 { max-width: 95%; }
.a-maxw-90 { max-width: 90%; }

/* min-width */
.a-minw-0 { min-width: 0; }

/* overflow-x */
.a-ovx-auto { overflow-x: auto; }

/* padding */
.a-p-10px-12px { padding: 10px 12px; }
.a-p-6px-10px { padding: 6px 10px; }
.a-p-8px-10px { padding: 8px 10px; }
.a-p-8px { padding: 8px; }
.a-p-4px-8px { padding: 4px 8px; }
.a-p-12px { padding: 12px; }
.a-p-8px-12px { padding: 8px 12px; }
.a-p-10px { padding: 10px; }
.a-p-5px-8px { padding: 5px 8px; }
.a-p-6px-8px { padding: 6px 8px; }
.a-p-3px-8px { padding: 3px 8px; }
.a-p-20px { padding: 20px; }
.a-p-16px { padding: 16px; }
.a-p-5px-10px { padding: 5px 10px; }
.a-p-8px-16px { padding: 8px 16px; }
.a-p-6px-12px { padding: 6px 12px; }
.a-p-6px-14px { padding: 6px 14px; }
.a-p-18px { padding: 18px; }
.a-p-5px-12px { padding: 5px 12px; }
.a-p-5px-6px { padding: 5px 6px; }
.a-p-4px { padding: 4px; }
.a-p-3px-6px { padding: 3px 6px; }
.a-p-4px-7px { padding: 4px 7px; }
.a-p-0 { padding: 0; }
.a-p-2px-4px { padding: 2px 4px; }
.a-p-14px-16px { padding: 14px 16px; }
.a-p-14px { padding: 14px; }
.a-p-7px-10px { padding: 7px 10px; }
.a-p-10px-14px { padding: 10px 14px; }
.a-p-40px { padding: 40px; }
.a-p-2px-8px { padding: 2px 8px; }
.a-p-4px-10px { padding: 4px 10px; }
.a-p-2px-6px { padding: 2px 6px; }
.a-p-4px-0 { padding: 4px 0; }
.a-p-6px-16px { padding: 6px 16px; }
.a-p-1px-5px { padding: 1px 5px; }
.a-p-14px-18px { padding: 14px 18px; }
.a-p-10px-24px { padding: 10px 24px; }
.a-p-6px { padding: 6px; }
.a-p-8px-0 { padding: 8px 0; }
.a-p-7px-8px { padding: 7px 8px; }
.a-p-12px-16px { padding: 12px 16px; }
.a-p-30px { padding: 30px; }
.a-p-1px-4px { padding: 1px 4px; }
.a-p-16px-20px { padding: 16px 20px; }

/* padding-bottom */
.a-pb-10px { padding-bottom: 10px; }

/* padding-top */
.a-pt-16px { padding-top: 16px; }
.a-pt-12px { padding-top: 12px; }

/* position */
.a-pos-fixed { position: fixed; }
.a-pos-relative { position: relative; }
.a-pos-absolute { position: absolute; }
.a-pos-sticky { position: sticky; }

/* text-align */
.a-ta-center { text-align: center; }
.a-ta-right { text-align: right; }
.a-ta-left { text-align: left; }

/* text-decoration */
.a-td-none { text-decoration: none; }

/* text-transform */
.a-tt-uppercase { text-transform: uppercase; }

/* transition */
.a-tr-all-02s { transition: all 0.2s; }
.a-tr-all-02s-ease { transition: all 0.2s ease; }

/* vertical-align */
.a-va-middle { vertical-align: middle; }

/* white-space */
.a-ws-nowrap { white-space: nowrap; }

/* z-index */
.a-z-3000 { z-index: 3000; }

/* ── Añadidas al levantar la exclusión de arriba ───────────── */

/* background */
.a-bg-white { background: white; }
.a-bg-f9fafb { background: #f9fafb; }
.a-bg-f8fafc { background: #f8fafc; }
.a-bg-fef2f2 { background: #fef2f2; }
.a-bg-fef3c7 { background: #fef3c7; }
.a-bg-0a2463 { background: #0a2463; }
.a-bg-none { background: none; }
.a-bg-f8f9fa { background: #f8f9fa; }
.a-bg-f3f4f6 { background: #f3f4f6; }
.a-bg-f0fdf4 { background: #f0fdf4; }
.a-bg-fffbeb { background: #fffbeb; }
.a-bg-fee2e2 { background: #fee2e2; }
.a-bg-d1fae5 { background: #d1fae5; }
.a-bg-transparent { background: transparent; }
.a-bg-10b981 { background: #10b981; }
.a-bg-dc2626 { background: #dc2626; }
.a-bg-fff { background: #fff; }
.a-bg-3b82f6 { background: #3b82f6; }
.a-bg-dbeafe { background: #dbeafe; }
.a-bg-f0f9ff { background: #f0f9ff; }
.a-bg-eff6ff { background: #eff6ff; }
.a-bg-eef2ff { background: #eef2ff; }
.a-bg-f59e0b { background: #f59e0b; }
.a-bg-0d2e7a { background: #0d2e7a; }
.a-bg-25d366 { background: #25D366; }
.a-bg-e2e8f0 { background: #e2e8f0; }
.a-bg-ef4444 { background: #ef4444; }

/* border */
.a-bd-none { border: none; }
.a-bd-1px-solid-d1d5db { border: 1px solid #d1d5db; }
.a-bd-1px-solid-e5e7eb { border: 1px solid #e5e7eb; }
.a-bd-1px-solid-e2e8f0 { border: 1px solid #e2e8f0; }
.a-bd-1px-solid-fecaca { border: 1px solid #fecaca; }
.a-bd-2px-solid-e5e7eb { border: 2px solid #e5e7eb; }
.a-bd-1px-solid-000 { border: 1px solid #000; }
.a-bd-1px-solid-e0e6ed { border: 1px solid #e0e6ed; }
.a-bd-1px-solid-fca5a5 { border: 1px solid #fca5a5; }
.a-bd-1px-solid-0a2463 { border: 1px solid #0a2463; }
.a-bd-1px-solid-bbf7d0 { border: 1px solid #bbf7d0; }
.a-bd-1px-solid-f59e0b { border: 1px solid #f59e0b; }
.a-bd-1px-solid-e1e8ed { border: 1px solid #e1e8ed; }
.a-bd-1px-solid-fcd34d { border: 1px solid #fcd34d; }
.a-bd-1px-solid-bfdbfe { border: 1px solid #bfdbfe; }
.a-bd-1px-solid-fde68a { border: 1px solid #fde68a; }
.a-bd-1px-solid-93c5fd { border: 1px solid #93c5fd; }
.a-bd-2px-solid-d1d5db { border: 2px solid #d1d5db; }

/* border-bottom */
.a-bdb-1px-solid-fecaca { border-bottom: 1px solid #fecaca; }
.a-bdb-none { border-bottom: none; }
.a-bdb-1px-solid-f0f0f0 { border-bottom: 1px solid #f0f0f0; }
.a-bdb-1px-solid-fde68a { border-bottom: 1px solid #fde68a; }

/* border-top */
.a-bdt-2px-solid-e5e7eb { border-top: 2px solid #e5e7eb; }

/* color */
.a-c-white { color: white; }
.a-c-6b7280 { color: #6b7280; }
.a-c-0a2463 { color: #0a2463; }
.a-c-374151 { color: #374151; }
.a-c-2c3e50 { color: #2c3e50; }
.a-c-dc2626 { color: #dc2626; }
.a-c-92400e { color: #92400e; }
.a-c-94a3b8 { color: #94a3b8; }
.a-c-9ca3af { color: #9ca3af; }
.a-c-64748b { color: #64748b; }
.a-c-059669 { color: #059669; }
.a-c-1e293b { color: #1e293b; }
.a-c-ef4444 { color: #ef4444; }
.a-c-0d2e7a { color: #0d2e7a; }
.a-c-065f46 { color: #065f46; }
.a-c-1e40af { color: #1e40af; }
.a-c-d97706 { color: #d97706; }
.a-c-10b981 { color: #10b981; }
.a-c-f59e0b { color: #f59e0b; }
.a-c-495057 { color: #495057; }
.a-c-667eea { color: #667eea; }
.a-c-000000 { color: #000000; }
.a-c-e74c3c { color: #e74c3c; }
.a-c-16a34a { color: #16a34a; }
.a-c-1f2937 { color: #1f2937; }
.a-c-b91c1c { color: #b91c1c; }
.a-c-3b82f6 { color: #3b82f6; }
.a-c-166534 { color: #166534; }
.a-c-047857 { color: #047857; }
.a-c-cbd5e1 { color: #cbd5e1; }
.a-c-991b1b { color: #991b1b; }
.a-c-0369a1 { color: #0369a1; }
.a-c-95a5a6 { color: #95a5a6; }
.a-c-475569 { color: #475569; }
.a-c-b45309 { color: #b45309; }
.a-c-7c3aed { color: #7c3aed; }
.a-c-4b5563 { color: #4b5563; }
.a-c-fff { color: #fff; }
.a-c-2563eb { color: #2563eb; }
.a-c-111827 { color: #111827; }
.a-c-d1d5db { color: #d1d5db; }
.a-c-3498db { color: #3498db; }

/* display */
.a-d-flex { display: flex; }
.a-d-block { display: block; }
.a-d-grid { display: grid; }
.a-d-inline-flex { display: inline-flex; }
.a-d-inline-block { display: inline-block; }

/* height */
.a-h-60px { height: 60px; }
.a-h-30px { height: 30px; }
.a-h-16px { height: 16px; }

/* max-height */
.a-maxh-90vh { max-height: 90vh; }

/* min-height */
.a-minh-0-!important { min-height: 0 !important; }

/* opacity */
.a-op-09 { opacity: 0.9; }
.a-op-03 { opacity: 0.3; }
.a-op-05 { opacity: 0.5; }
.a-op-07 { opacity: 0.7; }
.a-op-08 { opacity: 0.8; }

/* overflow */
.a-ov-hidden { overflow: hidden; }

/* overflow-y */
.a-ovy-auto { overflow-y: auto; }

/* text-transform */
.a-tt-capitalize { text-transform: capitalize; }

/* top */
.a-top-0 { top: 0; }
.a-top-50 { top: 50%; }

/* white-space */
.a-ws-pre-wrap { white-space: pre-wrap; }

/* width */
.a-w-100 { width: 100%; }
.a-w-90 { width: 90%; }
.a-w-14px { width: 14px; }
.a-w-auto-!important { width: auto !important; }
.a-w-28px { width: 28px; }
.a-w-50px { width: 50px; }
.a-w-80px { width: 80px; }
.a-w-30px { width: 30px; }
.a-w-18px { width: 18px; }
.a-w-16px { width: 16px; }

/* ── Segunda tanda ─────────────────────────────────────────────
   Las variables de tabla van aquí solo en su forma SIN respaldo.
   Las que lo llevan escrito se quedan en el atributo a propósito:
   los documentos que se imprimen abren una ventana que no carga
   las hojas, y allí ni la variable ni la clase existirían. Ver
   docs/COLORES_DE_TABLAS.md */

/* background */
.a-bg-tabla-th-bg { background: var(--tabla-encabezado-bg); }

/* border-collapse */
.a-bc-collapse { border-collapse: collapse; }

/* color */
.a-c-tabla-th { color: var(--tabla-encabezado-texto); }

/* letter-spacing */
.a-ls-005em { letter-spacing: 0.05em; }

/* resize */
.a-resize-vertical { resize: vertical; }

/* transition */
.a-tr-all-03s { transition: all 0.3s; }

/* z-index */
.a-z-9999 { z-index: 9999; }
.a-z-1 { z-index: 1; }
.a-z-1000 { z-index: 1000; }
.a-z-2000 { z-index: 2000; }
.a-z-2100 { z-index: 2100; }
.a-z-10000 { z-index: 10000; }
.a-z-3500 { z-index: 3500; }
.a-z-4000 { z-index: 4000; }

/* ── Tercera tanda ─────────────────────────────────────────────
   Generadas a partir de lo que el marcado usa de verdad, con el
   umbral bajado a dos usos: una clase que sirve dos veces ya
   ahorra, y sobre todo saca ese valor del atributo, donde ninguna
   media query podía alcanzarlo.

   No se bajó a un solo uso a propósito. Ahí la clase deja de ser
   vocabulario y pasa a ser el mismo estilo con otro nombre, uno
   menos legible que el valor que representa. */

/* align-items */
.a-ai-start { align-items: start; }
.a-ai-flex-end { align-items: flex-end; }
.a-ai-end { align-items: end; }

/* align-self */
.a-as-center { align-self: center; }

/* background */
.a-bg-2c3e50 { background: #2c3e50; }
.a-bg-fff7ed { background: #fff7ed; }
.a-bg-16a34a { background: #16a34a; }
.a-bg-6b7280 { background: #6b7280; }
.a-bg-059669 { background: #059669; }
.a-bg-fef9c3 { background: #fef9c3; }
.a-bg-7c3aed { background: #7c3aed; }
.a-bg-8e44ad { background: #8e44ad; }
.a-bg-25d366 { background: #25d366; }
.a-bg-dcfce7 { background: #dcfce7; }
.a-bg-e5e7eb { background: #e5e7eb; }
.a-bg-2563eb { background: #2563eb; }
.a-bg-e8e4df { background: #e8e4df; }
.a-bg-0369a1 { background: #0369a1; }
.a-bg-f1f5f9 { background: #f1f5f9; }
.a-bg-ecfdf5 { background: #ecfdf5; }
.a-bg-e0f2fe { background: #e0f2fe; }
.a-bg-374151 { background: #374151; }
.a-bg-f0f4ff { background: #f0f4ff; }
.a-bg-ddd8d2 { background: #ddd8d2; }
.a-bg-8b5cf6 { background: #8b5cf6; }
.a-bg-fde68a { background: #fde68a; }
.a-bg-dc3545 { background: #dc3545; }
.a-bg-667eea { background: #667eea; }
.a-bg-28a745 { background: #28a745; }
.a-bg-ec7063 { background: #ec7063; }
.a-bg-6c757d { background: #6c757d; }
.a-bg-c0392b { background: #c0392b; }
.a-bg-27ae60 { background: #27ae60; }
.a-bg-fff3cd { background: #fff3cd; }
.a-bg-b45309 { background: #b45309; }
.a-bg-ede9fe { background: #ede9fe; }
.a-bg-e6eef8 { background: #e6eef8; }
.a-bg-f4f7fb { background: #f4f7fb; }
.a-bg-94a3b8 { background: #94a3b8; }
.a-bg-000 { background: #000; }
.a-bg-ffc107 { background: #ffc107; }

/* border */
.a-bd-1px-solid-fbbf24 { border: 1px solid #fbbf24; }
.a-bd-1px-solid-86efac { border: 1px solid #86efac; }
.a-bd-2px-solid-0a2463 { border: 2px solid #0a2463; }
.a-bd-1px-solid-fed7aa { border: 1px solid #fed7aa; }
.a-bd-2px-dashed-d1d5db { border: 2px dashed #d1d5db; }
.a-bd-1px-solid-bae6fd { border: 1px solid #bae6fd; }
.a-bd-1px-solid-dee2e6 { border: 1px solid #dee2e6; }
.a-bd-2px-solid-000 { border: 2px solid #000; }
.a-bd-1px-solid-059669 { border: 1px solid #059669; }
.a-bd-1px-solid-6ee7b7 { border: 1px solid #6ee7b7; }
.a-bd-15px-solid-000 { border: 1.5px solid #000; }
.a-bd-3px-solid-0a2463 { border: 3px solid #0a2463; }
.a-bd-2px-solid-f59e0b { border: 2px solid #f59e0b; }
.a-bd-2px-solid-2c3e50 { border: 2px solid #2c3e50; }
.a-bd-2px-solid-ec7063 { border: 2px solid #ec7063; }
.a-bd-1px-solid-10b981 { border: 1px solid #10b981; }
.a-bd-1px-solid-5a6268 { border: 1px solid #5a6268; }
.a-bd-1px-solid-e9ecef { border: 1px solid #e9ecef; }
.a-bd-1px-solid-3498db { border: 1px solid #3498db; }
.a-bd-1px-solid-9b59b6 { border: 1px solid #9b59b6; }
.a-bd-1px-solid-27ae60 { border: 1px solid #27ae60; }
.a-bd-1px-solid-4b5563 { border: 1px solid #4b5563; }
.a-bd-2px-solid-4b5563 { border: 2px solid #4b5563; }
.a-bd-3px-solid-000 { border: 3px solid #000; }
.a-bd-2px-solid-059669 { border: 2px solid #059669; }
.a-bd-1px-solid-c7d2fe { border: 1px solid #c7d2fe; }
.a-bd-15px-solid-d1d5db { border: 1.5px solid #d1d5db; }
.a-bd-1px-solid-c4b5fd { border: 1px solid #c4b5fd; }
.a-bd-1px-solid-334155 { border: 1px solid #334155; }

/* border-bottom */
.a-bdb-15px-solid-000 { border-bottom: 1.5px solid #000; }
.a-bdb-1px-solid-fca5a5 { border-bottom: 1px solid #fca5a5; }
.a-bdb-1px-solid-f3f4f6 { border-bottom: 1px solid #f3f4f6; }
.a-bdb-2px-solid-e0e6ed { border-bottom: 2px solid #e0e6ed; }
.a-bdb-1px-dashed-000 { border-bottom: 1px dashed #000; }
.a-bdb-1px-solid-d1d5db { border-bottom: 1px solid #d1d5db; }
.a-bdb-1px-solid-667eea { border-bottom: 1px solid #667eea; }
.a-bdb-2px-solid-bbf7d0 { border-bottom: 2px solid #bbf7d0; }
.a-bdb-1px-solid-c7d2fe { border-bottom: 1px solid #c7d2fe; }
.a-bdb-3px-solid-08184f { border-bottom: 3px solid #08184f; }

/* border-collapse */
.a-bc-separate { border-collapse: separate; }

/* border-left */
.a-bdl-4px-solid-f59e0b { border-left: 4px solid #f59e0b; }
.a-bdl-3px-solid-0a2463 { border-left: 3px solid #0a2463; }
.a-bdl-4px-solid-0369a1 { border-left: 4px solid #0369a1; }
.a-bdl-3px-solid-3498db { border-left: 3px solid #3498db; }
.a-bdl-4px-solid-10b981 { border-left: 4px solid #10b981; }
.a-bdl-3px-solid-f39c12 { border-left: 3px solid #f39c12; }
.a-bdl-4px-solid-6b7280 { border-left: 4px solid #6b7280; }
.a-bdl-3px-solid-fde68a { border-left: 3px solid #fde68a; }
.a-bdl-3px-solid-86efac { border-left: 3px solid #86efac; }
.a-bdl-3px-solid-6366f1 { border-left: 3px solid #6366f1; }
.a-bdl-4px-solid-3b82f6 { border-left: 4px solid #3b82f6; }
.a-bdl-4px-solid-dc2626 { border-left: 4px solid #dc2626; }
.a-bdl-4px-solid-16a34a { border-left: 4px solid #16a34a; }

/* border-radius */
.a-br-12px-12px-0-0 { border-radius: 12px 12px 0 0; }
.a-br-20px { border-radius: 20px; }
.a-br-16px { border-radius: 16px; }
.a-br-0-4px-4px-0 { border-radius: 0 4px 4px 0; }
.a-br-0 { border-radius: 0; }
.a-br-10px-10px-0-0 { border-radius: 10px 10px 0 0; }

/* border-right */
.a-bdr-2px-solid-000 { border-right: 2px solid #000; }
.a-bdr-none { border-right: none; }

/* border-top */
.a-bdt-1px-solid-e0e6ed { border-top: 1px solid #e0e6ed; }
.a-bdt-1px-dashed-000 { border-top: 1px dashed #000; }

/* bottom */
.a-bottom-0 { bottom: 0; }

/* color */
.a-c-f39c12 { color: #f39c12; }
.a-c-334155 { color: #334155; }
.a-c-1d4ed8 { color: #1d4ed8; }
.a-c-7f1d1d { color: #7f1d1d; }
.a-c-9b59b6 { color: #9b59b6; }
.a-c-27ae60 { color: #27ae60; }
.a-c-856404 { color: #856404; }
.a-c-555 { color: #555; }
.a-c-666 { color: #666; }
.a-c-15803d { color: #15803d; }
.a-c-8b5cf6 { color: #8b5cf6; }
.a-c-2d3748 { color: #2d3748; }
.a-c-5a6c7d { color: #5a6c7d; }
.a-c-25d366 { color: #25d366; }
.a-c-6d28d9 { color: #6d28d9; }
.a-c-e11d48 { color: #e11d48; }
.a-c-78350f { color: #78350f; }
.a-c-dc3545 { color: #dc3545; }
.a-c-5e72e4 { color: #5e72e4; }
.a-c-718096 { color: #718096; }
.a-c-7f8c8d { color: #7f8c8d; }
.a-c-86efac { color: #86efac; }
.a-c-0c4a6e { color: #0c4a6e; }
.a-c-1a1a1a { color: #1a1a1a; }
.a-c-3730a3 { color: #3730a3; }
.a-c-5b21b6 { color: #5b21b6; }
.a-c-e5e7eb { color: #e5e7eb; }
.a-c-28a745 { color: #28a745; }
.a-c-4338ca { color: #4338ca; }
.a-c-fbbf24 { color: #fbbf24; }
.a-c-a0aec0 { color: #a0aec0; }
.a-c-0c5460 { color: #0c5460; }
.a-c-0ea5e9 { color: #0ea5e9; }

/* flex */
.a-flex-0-0-auto { flex: 0 0 auto; }
.a-flex-2 { flex: 2; }
.a-flex-0-0-65px { flex: 0 0 65px; }

/* flex-direction */
.a-fd-row { flex-direction: row; }

/* flex-wrap */
.a-fwrap-nowrap { flex-wrap: nowrap; }

/* font-family */
.a-ff-inherit { font-family: inherit; }
.a-ff-'courier-new'-monospace { font-family: 'Courier New', monospace; }
.a-ff-arial-sans-serif { font-family: Arial, sans-serif; }

/* font-size */
.a-fs-062rem { font-size: 0.62rem; }
.a-fs-05rem { font-size: 0.5rem; }
.a-fs-32px { font-size: 32px; }
.a-fs-48px { font-size: 48px; }
.a-fs-7px { font-size: 7px; }
.a-fs-072rem { font-size: 0.72rem; }
.a-fs-063rem { font-size: 0.63rem; }
.a-fs-078rem { font-size: 0.78rem; }
.a-fs-076rem { font-size: 0.76rem; }
.a-fs-071rem { font-size: 0.71rem; }
.a-fs-088rem { font-size: 0.88rem; }
.a-fs-115rem { font-size: 1.15rem; }
.a-fs-12rem { font-size: 1.2rem; }
.a-fs-25rem { font-size: 2.5rem; }
.a-fs-11rem { font-size: 1.1rem; }
.a-fs-052rem { font-size: 0.52rem; }
.a-fs-045rem { font-size: 0.45rem; }
.a-fs-061rem { font-size: 0.61rem; }
.a-fs-066rem { font-size: 0.66rem; }
.a-fs-095rem { font-size: 0.95rem; }
.a-fs-1rem { font-size: 1rem; }
.a-fs-15rem { font-size: 1.5rem; }
.a-fs-18rem { font-size: 1.8rem; }
.a-fs-6px { font-size: 6px; }
.a-fs-inherit { font-size: inherit; }
.a-fs-4px { font-size: 4px; }
.a-fs-3rem { font-size: 3rem; }
.a-fs-073rem { font-size: 0.73rem; }

/* font-weight */
.a-fw-900 { font-weight: 900; }
.a-fw-300 { font-weight: 300; }
.a-fw-normal { font-weight: normal; }

/* gap */
.a-gap-0 { gap: 0; }
.a-gap-14px { gap: 14px; }
.a-gap-18px { gap: 18px; }
.a-gap-2px { gap: 2px; }
.a-gap-20px { gap: 20px; }
.a-gap-1px { gap: 1px; }
.a-gap-4px-12px { gap: 4px 12px; }

/* grid-template-columns */
.a-gtc-1fr-2fr { grid-template-columns: 1fr 2fr; }
.a-gtc-1fr { grid-template-columns: 1fr; }
.a-gtc-2fr-1fr { grid-template-columns: 2fr 1fr; }
.a-gtc-3fr-1fr-1fr { grid-template-columns: 3fr 1fr 1fr; }
.a-gtc-1fr-220px { grid-template-columns: 1fr 220px; }
.a-gtc-1fr-1fr-1fr-1fr { grid-template-columns: 1fr 1fr 1fr 1fr; }
.a-gtc-auto-1fr { grid-template-columns: auto 1fr; }
.a-gtc-1fr-auto { grid-template-columns: 1fr auto; }

/* height */
.a-h-20px { height: 20px; }
.a-h-64px { height: 64px; }
.a-h-36px { height: 36px; }
.a-h-18px { height: 18px; }
.a-h-15px { height: 15px; }
.a-h-50px { height: 50px; }
.a-h-10px { height: 10px; }
.a-h-24px { height: 24px; }
.a-h-32px { height: 32px; }
.a-h-70px { height: 70px; }
.a-h-250px { height: 250px; }
.a-h-8px { height: 8px; }

/* left */
.a-left-50 { left: 50%; }
.a-left-9px { left: 9px; }

/* letter-spacing */
.a-ls-2px { letter-spacing: 2px; }
.a-ls-01em { letter-spacing: 0.1em; }
.a-ls-02px { letter-spacing: 0.2px; }
.a-ls-004em { letter-spacing: 0.04em; }
.a-ls-5px { letter-spacing: .5px; }

/* line-height */
.a-lh-15 { line-height: 1.5; }
.a-lh-13 { line-height: 1.3; }
.a-lh-12 { line-height: 1.2; }
.a-lh-17 { line-height: 1.7; }
.a-lh-18 { line-height: 1.8; }
.a-lh-14px { line-height: 14px; }

/* list-style */
.a-ls-type-none { list-style: none; }

/* margin */
.a-m-0-0-10px { margin: 0 0 10px; }
.a-m-0-0-15px-0 { margin: 0 0 15px 0; }
.a-m-0-auto-16px { margin: 0 auto 16px; }
.a-m-0-0-4px-0 { margin: 0 0 4px 0; }
.a-m-0-0-16px-0 { margin: 0 0 16px 0; }
.a-m-8px-0-0-0 { margin: 8px 0 0 0; }
.a-m-6px-0-0-0 { margin: 6px 0 0 0; }
.a-m-0-0-16px { margin: 0 0 16px; }
.a-m-5px-0-0-0 { margin: 5px 0 0 0; }
.a-m-0-4px { margin: 0 4px; }
.a-m-0-auto { margin: 0 auto; }
.a-m-0-0-12px { margin: 0 0 12px; }
.a-m-0-0-20px-0 { margin: 0 0 20px 0; }
.a-m-0-0-5px-0 { margin: 0 0 5px 0; }
.a-m-2px-0-0 { margin: 2px 0 0; }
.a-m-5px-0 { margin: 5px 0; }
.a-m-6px-0-0 { margin: 6px 0 0; }
.a-m-0-0-14px-0 { margin: 0 0 14px 0; }
.a-m-2px-2px-0-0 { margin: 2px 2px 0 0; }
.a-m-0-0-8px { margin: 0 0 8px; }
.a-m-16px-0-12px-0 { margin: 16px 0 12px 0; }
.a-m-0-0-2px-0 { margin: 0 0 2px 0; }
.a-m-4px-0-0 { margin: 4px 0 0; }
.a-m-0-2px { margin: 0 2px; }
.a-m-0-0-6px { margin: 0 0 6px; }
.a-m-2px-0 { margin: 2px 0; }
.a-m-auto { margin: auto; }
.a-m-8px-0-0 { margin: 8px 0 0; }

/* margin-bottom */
.a-mb-18px { margin-bottom: 18px; }
.a-mb-1px { margin-bottom: 1px; }
.a-mb-24px { margin-bottom: 24px; }
.a-mb-40px { margin-bottom: 40px; }
.a-mb-30px { margin-bottom: 30px; }
.a-mb-01rem { margin-bottom: 0.1rem; }

/* margin-left */
.a-ml-6px { margin-left: 6px; }
.a-ml-auto { margin-left: auto; }
.a-ml-12px { margin-left: 12px; }
.a-ml-8px { margin-left: 8px; }
.a-ml-5px { margin-left: 5px; }
.a-ml-2px { margin-left: 2px; }

/* margin-right */
.a-mr-5px { margin-right: 5px; }
.a-mr-2px { margin-right: 2px; }
.a-mr-auto { margin-right: auto; }
.a-mr-15px { margin-right: 15px; }

/* margin-top */
.a-mt-20px { margin-top: 20px; }
.a-mt-1px { margin-top: 1px; }
.a-mt-18px { margin-top: 18px; }
.a-mt-15px { margin-top: 15px; }
.a-mt-0 { margin-top: 0; }
.a-mt-24px { margin-top: 24px; }
.a-mt-02rem { margin-top: 0.2rem; }

/* max-height */
.a-maxh-80vh { max-height: 80vh; }
.a-maxh-85vh { max-height: 85vh; }
.a-maxh-260px { max-height: 260px; }
.a-maxh-160px { max-height: 160px; }
.a-maxh-70vh { max-height: 70vh; }
.a-maxh-400px { max-height: 400px; }
.a-maxh-55vh { max-height: 55vh; }
.a-maxh-200px { max-height: 200px; }
.a-maxh-92vh { max-height: 92vh; }
.a-maxh-65vh { max-height: 65vh; }

/* max-width */
.a-maxw-100 { max-width: 100%; }
.a-maxw-500px { max-width: 500px; }
.a-maxw-600px { max-width: 600px; }
.a-maxw-550px { max-width: 550px; }
.a-maxw-900px { max-width: 900px; }
.a-maxw-400px { max-width: 400px; }
.a-maxw-700px { max-width: 700px; }
.a-maxw-820px { max-width: 820px; }
.a-maxw-480px { max-width: 480px; }
.a-maxw-560px { max-width: 560px; }
.a-maxw-220px { max-width: 220px; }
.a-maxw-420px { max-width: 420px; }
.a-maxw-80px { max-width: 80px; }
.a-maxw-200px { max-width: 200px; }

/* min-height */
.a-minh-16px { min-height: 16px; }
.a-minh-60px { min-height: 60px; }
.a-minh-28px { min-height: 28px; }
.a-minh-80px { min-height: 80px; }

/* min-width */
.a-minw-100px { min-width: 100px; }
.a-minw-200px { min-width: 200px; }
.a-minw-160px { min-width: 160px; }
.a-minw-140px { min-width: 140px; }
.a-minw-80px { min-width: 80px; }
.a-minw-30px { min-width: 30px; }
.a-minw-24px { min-width: 24px; }
.a-minw-70px { min-width: 70px; }
.a-minw-150px { min-width: 150px; }
.a-minw-180px { min-width: 180px; }
.a-minw-220px { min-width: 220px; }

/* opacity */
.a-op-085 { opacity: 0.85; }
.a-op-082 { opacity: 0.82; }

/* overflow */
.a-ov-auto { overflow: auto; }

/* padding */
.a-p-4px-6px { padding: 4px 6px; }
.a-p-4px-12px { padding: 4px 12px; }
.a-p-24px { padding: 24px; }
.a-p-6px-0 { padding: 6px 0; }
.a-p-12px-14px { padding: 12px 14px; }
.a-p-8px-20px { padding: 8px 20px; }
.a-p-8px-14px { padding: 8px 14px; }
.a-p-10px-20px { padding: 10px 20px; }
.a-p-10px-18px { padding: 10px 18px; }
.a-p-1px-7px { padding: 1px 7px; }
.a-p-3px-10px { padding: 3px 10px; }
.a-p-3px-12px { padding: 3px 12px; }
.a-p-7px-16px { padding: 7px 16px; }
.a-p-3px-5px { padding: 3px 5px; }
.a-p-60px-20px { padding: 60px 20px; }
.a-p-3px-7px { padding: 3px 7px; }
.a-p-2px-7px { padding: 2px 7px; }
.a-p-8px-24px { padding: 8px 24px; }
.a-p-10px-16px { padding: 10px 16px; }
.a-p-8px-18px { padding: 8px 18px; }
.a-p-2px { padding: 2px; }
.a-p-2px-0 { padding: 2px 0; }
.a-p-9px-20px { padding: 9px 20px; }
.a-p-12px-24px { padding: 12px 24px; }
.a-p-9px { padding: 9px; }
.a-p-15px { padding: 15px; }
.a-p-12px-20px { padding: 12px 20px; }
.a-p-5px-4px { padding: 5px 4px; }
.a-p-4px-5px { padding: 4px 5px; }
.a-p-1px-6px { padding: 1px 6px; }
.a-p-20px-24px { padding: 20px 24px; }
.a-p-30px-12px { padding: 30px 12px; }
.a-p-12px-18px { padding: 12px 18px; }
.a-p-7px-18px { padding: 7px 18px; }
.a-p-5px-7px { padding: 5px 7px; }
.a-p-40px-20px { padding: 40px 20px; }
.a-p-0-12px-10px { padding: 0 12px 10px; }
.a-p-4px-0-4px-12px { padding: 4px 0 4px 12px; }
.a-p-3px-0-3px-12px { padding: 3px 0 3px 12px; }
.a-p-16px-18px { padding: 16px 18px; }
.a-p-7px-14px { padding: 7px 14px; }
.a-p-6px-4px { padding: 6px 4px; }
.a-p-30px-20px { padding: 30px 20px; }
.a-p-0-0-8px { padding: 0 0 8px; }
.a-p-0-16px { padding: 0 16px; }
.a-p-60px { padding: 60px; }
.a-p-14px-20px { padding: 14px 20px; }
.a-p-8px-11px { padding: 8px 11px; }
.a-p-14px-24px { padding: 14px 24px; }
.a-p-50px { padding: 50px; }
.a-p-12px-25px { padding: 12px 25px; }
.a-p-14px-35px { padding: 14px 35px; }
.a-p-2rem { padding: 2rem; }
.a-p-2px-5px { padding: 2px 5px; }
.a-p-24px-30px { padding: 24px 30px; }
.a-p-3px-4px { padding: 3px 4px; }
.a-p-20px-18px { padding: 20px 18px; }
.a-p-8px-15px { padding: 8px 15px; }

/* padding-bottom */
.a-pb-8px { padding-bottom: 8px; }
.a-pb-12px { padding-bottom: 12px; }
.a-pb-4px { padding-bottom: 4px; }
.a-pb-6px { padding-bottom: 6px; }

/* padding-left */
.a-pl-10px { padding-left: 10px; }
.a-pl-18px { padding-left: 18px; }
.a-pl-16px { padding-left: 16px; }

/* padding-top */
.a-pt-15px { padding-top: 15px; }
.a-pt-10px { padding-top: 10px; }
.a-pt-8px { padding-top: 8px; }
.a-pt-6px { padding-top: 6px; }
.a-pt-14px { padding-top: 14px; }

/* resize */
.a-resize-none { resize: none; }

/* right */
.a-right-2px { right: 2px; }
.a-right-0 { right: 0; }
.a-right-1px { right: 1px; }

/* text-decoration */
.a-td-underline { text-decoration: underline; }
.a-td-line-through { text-decoration: line-through; }

/* text-transform */
.a-tt-none { text-transform: none; }

/* top */
.a-top-2px { top: 2px; }
.a-top-1px { top: 1px; }

/* transition */
.a-tr-border-color-02s { transition: border-color 0.2s; }
.a-tr-background-02s { transition: background 0.2s; }

/* vertical-align */
.a-va-top { vertical-align: top; }

/* white-space */
.a-ws-pre-line { white-space: pre-line; }

/* width */
.a-w-64px { width: 64px; }
.a-w-60px { width: 60px; }
.a-w-90px { width: 90px; }
.a-w-3333 { width: 33.33%; }
.a-w-95 { width: 95%; }
.a-w-36px { width: 36px; }
.a-w-15px { width: 15px; }
.a-w-110px { width: 110px; }
.a-w-200px { width: 200px; }
.a-w-100px { width: 100px; }
.a-w-50 { width: 50%; }
.a-w-20px { width: 20px; }
.a-w-700px { width: 700px; }
.a-w-45px { width: 45px; }
.a-w-10px { width: 10px; }
.a-w-400px { width: 400px; }
.a-w-35px { width: 35px; }
.a-w-620px { width: 620px; }
.a-w-520px { width: 520px; }
.a-w-34px { width: 34px; }
.a-w-380px { width: 380px; }
.a-w-116px { width: 116px; }
.a-w-500px { width: 500px; }
.a-w-460px { width: 460px; }
.a-w-20 { width: 20%; }
.a-w-46px { width: 46px; }
.a-w-250px { width: 250px; }
.a-w-360px { width: 360px; }
.a-w-85px { width: 85px; }
.a-w-120px { width: 120px; }
.a-w-30 { width: 30%; }
.a-w-8px { width: 8px; }

/* word-break */
.a-wb-break-word { word-break: break-word; }

/* z-index */
.a-z-3 { z-index: 3; }
.a-gc-full { grid-column: 1 / -1; }