/* =============================================================================
   iMicro Dash — Design System & Dark Theme
   PHP 8.x / Chart.js v4 compatible
   ============================================================================= */

/* ── 1. Design tokens ─────────────────────────────────────────────────────── */
:root {
    --imicro-bg-base:       #0c0e17;
    --imicro-bg-card:       #13162080;
    --imicro-bg-card-solid: #13162;
    --imicro-bg-card-hover: #1e2235;
    --imicro-border:        #252840;
    --imicro-border-light:  rgba(37,40,64,0.5);

    --imicro-accent:        #3b82f6;
    --imicro-accent-dark:   #1d4ed8;
    --imicro-accent-hover:  #2563eb;

    --imicro-text-primary:  #e2e8f0;
    --imicro-text-muted:    #7c87a3;
    --imicro-text-label:    #a0aabf;

    --imicro-success:       #22c55e;
    --imicro-info:          #3b82f6;
    --imicro-warning:       #f59e0b;
    --imicro-danger:        #ef4444;
    --imicro-default:       #8b5cf6;

    --imicro-radius:        10px;
    --imicro-radius-sm:     6px;
    --imicro-radius-lg:     14px;
    --imicro-shadow:        0 4px 24px rgba(0,0,0,0.5);
    --imicro-shadow-sm:     0 2px 8px rgba(0,0,0,0.3);
    --imicro-transition:    0.18s ease;
    --imicro-gap:           20px;
}

/* ── 2. Reset / base ──────────────────────────────────────────────────────── */
html { margin-top: 0 !important; }

*, *::before, *::after { box-sizing: border-box; }

body {
    background-color: var(--imicro-bg-base) !important;
    color: var(--imicro-text-primary) !important;
    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
    font-size: 14px;
    line-height: 1.6;
}

p, span, li, td, th, label, h1, h2, h3, h4, h5, h6, strong, small {
    color: inherit;
}

a { color: var(--imicro-accent); text-decoration: none; }
a:hover { color: var(--imicro-accent-hover); }

/* Bootstrap 4/5 utility aliases */
.text-start  { text-align: left !important; }
.text-end    { text-align: right !important; }
.text-center { text-align: center !important; }
.w-100       { width: 100% !important; }
.d-flex      { display: flex !important; }
.align-items-center { align-items: center !important; }
.ms-auto, .ml-auto  { margin-left: auto !important; }

/* Bootstrap 4 g-3 row gap fallback */
.row.g-3 {
    margin-left: -10px;
    margin-right: -10px;
}
.row.g-3 > [class*="col"] {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 20px;
}

/* ── 3. Navbar ────────────────────────────────────────────────────────────── */
.imicro-navbar {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: rgba(13,14,23,0.95);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--imicro-border);
    padding: 0 28px;
    display: flex;
    align-items: center;
    height: 60px;
    box-shadow: 0 1px 0 var(--imicro-border), var(--imicro-shadow-sm);
}

.imicro-navbar__brand {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--imicro-text-primary) !important;
    text-decoration: none;
    letter-spacing: 0.03em;
    white-space: nowrap;
}
.imicro-navbar__brand:hover { color: var(--imicro-accent) !important; }

.imicro-navbar__logo {
    max-height: 36px;
    max-width: 140px;
    object-fit: contain;
    flex-shrink: 0;
}

.imicro-navbar__nav {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-left: auto;
    flex-wrap: wrap;
}

.imicro-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 13px;
    border-radius: var(--imicro-radius-sm);
    color: var(--imicro-text-muted) !important;
    font-size: 0.82rem;
    font-weight: 500;
    transition: background var(--imicro-transition), color var(--imicro-transition);
    white-space: nowrap;
}
.imicro-nav-link:hover,
.imicro-nav-link.active {
    background: rgba(59,130,246,0.12);
    color: var(--imicro-accent) !important;
}

.imicro-navbar__user {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 13px;
    margin-left: 10px;
    border-radius: 20px;
    background: rgba(59,130,246,0.08);
    border: 1px solid rgba(59,130,246,0.2);
    font-size: 0.82rem;
    color: var(--imicro-text-primary) !important;
}
.imicro-navbar__user a {
    color: var(--imicro-text-muted) !important;
    font-size: 0.76rem;
    margin-left: 4px;
}
.imicro-navbar__user a:hover { color: var(--imicro-danger) !important; }

@media (max-width: 992px) {
    .imicro-navbar {
        flex-wrap: wrap;
        height: auto;
        padding: 10px 16px;
        gap: 6px;
    }
    .imicro-navbar__nav {
        width: 100%;
        margin-left: 0;
        justify-content: flex-start;
        gap: 2px;
    }
    .imicro-nav-link { padding: 6px 10px; font-size: 0.78rem; }
    .imicro-navbar__user { margin-left: 0; }
}

/* ── 4. Layout ────────────────────────────────────────────────────────────── */
.imicro-dash {
    padding: 28px 0 56px;
}

.imicro-container {
    max-width: 1440px;
    padding: 0 24px;
    margin: 0 auto;
}

@media (max-width: 768px) {
    .imicro-dash { padding: 16px 0 40px; }
    .imicro-container { padding: 0 14px; }
}

/* ── 5. Cards ─────────────────────────────────────────────────────────────── */
.imicro-card {
    background: var(--imicro-bg-card);
    background: linear-gradient(145deg, rgba(30,34,53,0.9), rgba(19,22,32,0.95));
    border: 1px solid var(--imicro-border);
    border-radius: var(--imicro-radius);
    padding: 22px 24px;
    transition: border-color var(--imicro-transition), box-shadow var(--imicro-transition);
    height: 100%;
}
.imicro-card:hover {
    border-color: rgba(59,130,246,0.25);
    box-shadow: 0 0 0 1px rgba(59,130,246,0.08), var(--imicro-shadow-sm);
}

.imicro-card__title {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--imicro-text-muted);
    margin-bottom: 14px;
}

/* retrocompat */
.bg_branco {
    background: var(--imicro-bg-card) !important;
    border: 1px solid var(--imicro-border) !important;
    border-radius: var(--imicro-radius) !important;
    box-shadow: none !important;
    color: var(--imicro-text-primary) !important;
}
.cor_1 { color: var(--imicro-text-primary) !important; }

/* ── 6. KPI Cards ─────────────────────────────────────────────────────────── */
.imicro-kpi {
    background: linear-gradient(135deg, rgba(30,34,53,0.95), rgba(19,22,32,0.98));
    border: 1px solid var(--imicro-border);
    border-radius: var(--imicro-radius);
    border-left: 3px solid var(--imicro-default);
    padding: 18px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
    height: 100%;
    transition: border-color var(--imicro-transition), transform var(--imicro-transition);
}
.imicro-kpi:hover {
    transform: translateY(-1px);
    box-shadow: var(--imicro-shadow-sm);
}

.imicro-kpi--success { border-left-color: var(--imicro-success); }
.imicro-kpi--info    { border-left-color: var(--imicro-info); }
.imicro-kpi--warning { border-left-color: var(--imicro-warning); }
.imicro-kpi--danger  { border-left-color: var(--imicro-danger); }

.imicro-kpi__icon {
    font-size: 1.3rem;
    opacity: 0.75;
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--imicro-radius-sm);
    background: rgba(255,255,255,0.04);
}

.imicro-kpi--success .imicro-kpi__icon { color: var(--imicro-success); background: rgba(34,197,94,0.08); }
.imicro-kpi--info    .imicro-kpi__icon { color: var(--imicro-info);    background: rgba(59,130,246,0.08); }
.imicro-kpi--warning .imicro-kpi__icon { color: var(--imicro-warning); background: rgba(245,158,11,0.08); }
.imicro-kpi--danger  .imicro-kpi__icon { color: var(--imicro-danger);  background: rgba(239,68,68,0.08); }
.imicro-kpi--default .imicro-kpi__icon { color: var(--imicro-default); background: rgba(139,92,246,0.08); }

.imicro-kpi__value {
    font-size: 1.7rem;
    font-weight: 700;
    color: var(--imicro-text-primary);
    line-height: 1.1;
    margin-bottom: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.imicro-kpi__label {
    font-size: 0.76rem;
    color: var(--imicro-text-muted);
    font-weight: 500;
    letter-spacing: 0.01em;
}

.imicro-kpi__sub {
    font-size: 0.73rem;
    color: var(--imicro-text-muted);
    margin-top: 2px;
    opacity: 0.85;
}

@media (max-width: 576px) {
    .imicro-kpi { padding: 14px 16px; gap: 10px; }
    .imicro-kpi__value { font-size: 1.4rem; }
    .imicro-kpi__icon { width: 30px; height: 30px; font-size: 1.1rem; }
}

/* ── 7. Period filter bar ─────────────────────────────────────────────────── */
.imicro-period-bar {
    background: linear-gradient(135deg, rgba(30,34,53,0.9), rgba(19,22,32,0.95));
    border: 1px solid var(--imicro-border);
    border-radius: var(--imicro-radius);
    padding: 14px 20px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.imicro-period-bar__title {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--imicro-text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
}

.imicro-period-badge {
    background: rgba(59,130,246,0.12);
    color: var(--imicro-accent);
    border: 1px solid rgba(59,130,246,0.25);
    border-radius: 20px;
    padding: 2px 10px;
    font-size: 0.74rem;
    font-weight: 600;
    white-space: nowrap;
}

.imicro-period-form {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-left: auto;
}

.imicro-period-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: var(--imicro-radius-sm);
    background: var(--imicro-bg-base);
    border: 1px solid var(--imicro-border);
    color: var(--imicro-text-muted) !important;
    font-size: 1rem;
    transition: all var(--imicro-transition);
    flex-shrink: 0;
}
.imicro-period-nav:hover {
    background: var(--imicro-accent);
    border-color: var(--imicro-accent);
    color: #fff !important;
}

@media (max-width: 576px) {
    .imicro-period-form { margin-left: 0; width: 100%; }
}

/* ── 8. Form controls ─────────────────────────────────────────────────────── */
.imicro-select,
.imicro-input {
    background: rgba(12,14,23,0.8);
    border: 1px solid var(--imicro-border);
    border-radius: var(--imicro-radius-sm);
    color: var(--imicro-text-primary);
    padding: 7px 11px;
    font-size: 0.84rem;
    outline: none;
    transition: border-color var(--imicro-transition), box-shadow var(--imicro-transition);
    font-family: inherit;
}
.imicro-select:focus,
.imicro-input:focus {
    border-color: var(--imicro-accent);
    box-shadow: 0 0 0 3px rgba(59,130,246,0.15);
}
.imicro-select option {
    background: #1e2235;
    color: var(--imicro-text-primary);
}

.imicro-label {
    display: block;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--imicro-text-muted);
    margin-bottom: 5px;
}

/* retrocompat */
.i-busca {
    background: rgba(12,14,23,0.8) !important;
    border: 1px solid var(--imicro-border) !important;
    border-radius: var(--imicro-radius-sm) !important;
    color: var(--imicro-text-primary) !important;
    padding: 6px 10px !important;
    font-size: 0.84rem !important;
    width: 80px;
}

/* ── 9. Buttons ───────────────────────────────────────────────────────────── */
.imicro-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 16px;
    border-radius: var(--imicro-radius-sm);
    font-size: 0.84rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all var(--imicro-transition);
    text-decoration: none !important;
    font-family: inherit;
    white-space: nowrap;
}

.imicro-btn--primary {
    background: var(--imicro-accent);
    color: #fff !important;
    border-color: var(--imicro-accent);
}
.imicro-btn--primary:hover {
    background: var(--imicro-accent-hover);
    border-color: var(--imicro-accent-hover);
    box-shadow: 0 0 12px rgba(59,130,246,0.3);
}

.imicro-btn--danger {
    background: rgba(239,68,68,0.1);
    color: var(--imicro-danger) !important;
    border-color: rgba(239,68,68,0.25);
}
.imicro-btn--danger:hover {
    background: var(--imicro-danger);
    color: #fff !important;
}

.imicro-btn--ghost {
    background: transparent;
    color: var(--imicro-text-muted) !important;
    border-color: var(--imicro-border);
}
.imicro-btn--ghost:hover {
    background: var(--imicro-bg-card-hover);
    color: var(--imicro-accent) !important;
    border-color: rgba(59,130,246,0.3);
}

/* retrocompat */
.bts, input[type="submit"].bts {
    background: var(--imicro-accent) !important;
    color: #fff !important;
    border: none !important;
    border-radius: var(--imicro-radius-sm) !important;
    padding: 8px 18px !important;
    font-size: 0.84rem !important;
    cursor: pointer;
    transition: background var(--imicro-transition);
    width: auto !important;
}
.bts:hover,
input[type="submit"].bts:hover { background: var(--imicro-accent-hover) !important; }

/* ── 10. Tables ───────────────────────────────────────────────────────────── */
.imicro-table-wrap {
    overflow-x: auto;
    border-radius: var(--imicro-radius);
    border: 1px solid var(--imicro-border);
    -webkit-overflow-scrolling: touch;
}

.imicro-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
    color: var(--imicro-text-primary);
    margin: 0;
}

.imicro-table thead th {
    background: rgba(37,40,64,0.5);
    color: var(--imicro-text-muted);
    font-weight: 600;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 10px 14px;
    border-bottom: 1px solid var(--imicro-border);
    white-space: nowrap;
}

.imicro-table tbody tr {
    border-bottom: 1px solid var(--imicro-border-light);
    transition: background var(--imicro-transition);
}
.imicro-table tbody tr:last-child { border-bottom: none; }
.imicro-table tbody tr:nth-child(even) {
    background: rgba(37,40,64,0.15);
}
.imicro-table tbody tr:hover {
    background: var(--imicro-bg-card-hover);
}

.imicro-table tbody td {
    padding: 9px 14px;
    vertical-align: middle;
    color: var(--imicro-text-primary);
}
.imicro-table tbody td.text-muted-imicro {
    color: var(--imicro-text-muted);
}

/* retrocompat */
.tabelas_grande, .tabelas_media { overflow-x: auto; }

table.table-bordered,
table.table-striped {
    color: var(--imicro-text-primary) !important;
    border-color: var(--imicro-border) !important;
}
table.table-bordered th,
table.table-bordered td,
table.table-striped th,
table.table-striped td {
    border-color: var(--imicro-border) !important;
    background-color: transparent !important;
    color: var(--imicro-text-primary) !important;
}
table.table-striped tbody tr:nth-child(odd) {
    background-color: rgba(37,40,64,0.2) !important;
}
table.table-striped tbody tr:hover {
    background-color: var(--imicro-bg-card-hover) !important;
}
.cabecalho2 th {
    background: rgba(37,40,64,0.6) !important;
    color: var(--imicro-text-muted) !important;
    font-size: 0.7rem !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--imicro-border) !important;
}

/* ── 11. Chart containers ─────────────────────────────────────────────────── */
.imicro-chart-card {
    background: linear-gradient(145deg, rgba(30,34,53,0.9), rgba(19,22,32,0.95));
    border: 1px solid var(--imicro-border);
    border-radius: var(--imicro-radius);
    padding: 20px 22px 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.imicro-chart-card__title {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--imicro-text-muted);
    margin-bottom: 14px;
    flex-shrink: 0;
}

.imicro-chart-card canvas {
    flex: 1;
    max-height: 320px;
    min-height: 180px;
}

/* gráfico de linha full-width tem mais altura */
.col-12 .imicro-chart-card canvas {
    max-height: 260px;
}

/* ── 12. Badges ───────────────────────────────────────────────────────────── */
.imicro-badge {
    display: inline-block;
    padding: 2px 9px;
    border-radius: 20px;
    font-size: 0.7rem;
    font-weight: 600;
    white-space: nowrap;
    letter-spacing: 0.02em;
}

.imicro-badge--assinatura { background: rgba(34,197,94,0.12);  color: var(--imicro-success); border: 1px solid rgba(34,197,94,0.2); }
.imicro-badge--upgrade    { background: rgba(59,130,246,0.12); color: var(--imicro-info);    border: 1px solid rgba(59,130,246,0.2); }
.imicro-badge--renovacao  { background: rgba(245,158,11,0.12); color: var(--imicro-warning); border: 1px solid rgba(245,158,11,0.2); }
.imicro-badge--cancelado  { background: rgba(239,68,68,0.12);  color: var(--imicro-danger);  border: 1px solid rgba(239,68,68,0.2);  }

/* ── 13. Login ────────────────────────────────────────────────────────────── */
.imicro-login-wrap {
    min-height: 100vh;
    background: var(--imicro-bg-base);
    background-image: radial-gradient(ellipse at 30% 40%, rgba(59,130,246,0.06) 0%, transparent 60%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.imicro-login-card {
    background: rgba(30,34,53,0.95);
    border: 1px solid var(--imicro-border);
    border-radius: var(--imicro-radius-lg);
    padding: 40px 36px;
    width: 100%;
    max-width: 400px;
    box-shadow: var(--imicro-shadow);
}

.imicro-login-card__logo {
    display: block;
    max-width: 140px;
    margin: 0 auto 8px;
}

.imicro-login-card__subtitle {
    text-align: center;
    color: var(--imicro-text-muted);
    font-size: 0.84rem;
    margin-bottom: 28px;
}

.imicro-login-card input[type="text"],
.imicro-login-card input[type="email"],
.imicro-login-card input[type="password"],
.imicro-login-card input[type="number"] {
    background: rgba(12,14,23,0.8) !important;
    border: 1px solid var(--imicro-border) !important;
    border-radius: var(--imicro-radius-sm) !important;
    color: var(--imicro-text-primary) !important;
    padding: 10px 12px !important;
    width: 100% !important;
}
.imicro-login-card input:focus {
    border-color: var(--imicro-accent) !important;
    box-shadow: 0 0 0 3px rgba(59,130,246,0.15) !important;
    outline: none !important;
}
.imicro-login-card label {
    color: var(--imicro-text-label) !important;
    font-size: 0.84rem !important;
}
.imicro-login-card .ur-submit-button,
.imicro-login-card button[type="submit"],
.imicro-login-card input[type="submit"] {
    background: var(--imicro-accent) !important;
    border-color: var(--imicro-accent) !important;
    color: #fff !important;
    width: 100% !important;
    border-radius: var(--imicro-radius-sm) !important;
    padding: 10px !important;
    font-weight: 600 !important;
}

/* ── 14. Formulário de interação ──────────────────────────────────────────── */
.imicro-form-section {
    padding: 4px 0 0;
}

.imicro-form-section__title {
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--imicro-text-primary);
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.imicro-form-section__title i {
    color: var(--imicro-accent);
}

.imicro-field-group {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-end;
}

.imicro-field-group > div {
    min-width: 0;
}

.imicro-field-group input,
.imicro-field-group select {
    background: rgba(12,14,23,0.8);
    border: 1px solid var(--imicro-border);
    border-radius: var(--imicro-radius-sm);
    color: var(--imicro-text-primary);
    padding: 7px 11px;
    font-size: 0.84rem;
    outline: none;
    transition: border-color var(--imicro-transition);
    font-family: inherit;
}
.imicro-field-group input:focus,
.imicro-field-group select:focus {
    border-color: var(--imicro-accent);
    box-shadow: 0 0 0 3px rgba(59,130,246,0.15);
}
.imicro-field-group select option {
    background: #1e2235;
    color: var(--imicro-text-primary);
}

/* ── 15. Utilitários ──────────────────────────────────────────────────────── */
.text-muted-imicro    { color: var(--imicro-text-muted) !important; }
.text-success-imicro  { color: var(--imicro-success) !important; }
.text-danger-imicro   { color: var(--imicro-danger)  !important; }
.text-warning-imicro  { color: var(--imicro-warning) !important; }

.imicro-divider {
    border: none;
    border-top: 1px solid var(--imicro-border);
    margin: 20px 0;
}

#page-content {
    background: var(--imicro-bg-base);
    background-image:
        radial-gradient(ellipse at 15% 0%, rgba(59,130,246,0.05) 0%, transparent 50%),
        radial-gradient(ellipse at 85% 80%, rgba(139,92,246,0.04) 0%, transparent 50%);
    min-height: 80vh;
}

footer, .footer-area, #footer {
    background: rgba(13,14,23,0.9) !important;
    border-top: 1px solid var(--imicro-border) !important;
    color: var(--imicro-text-muted) !important;
}

/* ── 16. DataTables dark theme ────────────────────────────────────────────── */
.dataTables_wrapper {
    color: var(--imicro-text-primary) !important;
}
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_info {
    font-size: 0.8rem;
    color: var(--imicro-text-muted) !important;
    padding: 10px 0;
}
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    color: var(--imicro-text-primary) !important;
    background: rgba(12,14,23,0.8) !important;
    border: 1px solid var(--imicro-border) !important;
    border-radius: var(--imicro-radius-sm) !important;
    padding: 5px 9px !important;
    margin-left: 6px;
}
.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus {
    border-color: var(--imicro-accent) !important;
    outline: none !important;
}
.dataTables_wrapper .dataTables_paginate {
    padding: 10px 0;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: var(--imicro-text-muted) !important;
    border-radius: var(--imicro-radius-sm) !important;
    border: 1px solid transparent !important;
    padding: 4px 10px !important;
    font-size: 0.8rem;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: rgba(59,130,246,0.15) !important;
    border-color: rgba(59,130,246,0.3) !important;
    color: var(--imicro-accent) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--imicro-accent) !important;
    border-color: var(--imicro-accent) !important;
    color: #fff !important;
    box-shadow: 0 0 8px rgba(59,130,246,0.3) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    opacity: 0.3 !important;
}

/* ── 17. Footer ───────────────────────────────────────────────────────────── */
.imicro-footer {
    text-align: center;
    padding: 16px 24px;
    font-size: 0.76rem;
    color: var(--imicro-text-muted);
    border-top: 1px solid var(--imicro-border);
    margin-top: 40px;
    letter-spacing: 0.02em;
}

/* ── 18. Scrollbar personalizada ──────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--imicro-bg-base); }
::-webkit-scrollbar-thumb {
    background: var(--imicro-border);
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover { background: var(--imicro-text-muted); }