/* Premium Dark Asset Management Design System */

/* Reset and Base */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    /* Dark Premium Base Colors */
    --background: 240 10% 3.9%;
    --foreground: 0 0% 98%;

    --card: 240 10% 6%;
    --card-foreground: 0 0% 98%;

    --popover: 240 10% 6%;
    --popover-foreground: 0 0% 98%;

    /* Premium Brand Colors */
    --primary: 258 90% 66%;
    --primary-foreground: 0 0% 98%;
    --primary-hover: 258 90% 70%;
    --primary-dark: 258 90% 62%;

    --secondary: 240 5% 12%;
    --secondary-foreground: 0 0% 95%;
    --secondary-hover: 240 5% 15%;

    --muted: 240 5% 10%;
    --muted-foreground: 240 5% 64%;

    --accent: 240 8% 15%;
    --accent-foreground: 0 0% 95%;

    /* Status Colors for Assets */
    --status-free: 142 76% 36%;
    --status-in-use: 221 83% 53%;
    --status-maintenance: 48 96% 53%;
    --status-assistance: 25 95% 53%;
    --status-archived: 240 5% 34%;

    --destructive: 0 84% 60%;
    --destructive-foreground: 0 0% 98%;

    --border: 240 8% 18%;
    --input: 240 8% 15%;
    --ring: 258 90% 66%;

    --radius: 0.75rem;

    /* Premium Gradients */
    --gradient-primary: linear-gradient(135deg, hsl(258 90% 66%) 0%, hsl(285 84% 56%) 100%);
    --gradient-card: linear-gradient(135deg, hsl(240 10% 6%) 0%, hsl(240 8% 8%) 100%);
    --gradient-surface: linear-gradient(135deg, hsl(240 5% 12%) 0%, hsl(240 8% 15%) 100%);
    
    /* Premium Shadows */
    --shadow-premium: 0 25px 50px -12px hsl(240 10% 1% / 0.25);
    --shadow-card: 0 10px 25px -5px hsl(240 10% 1% / 0.1), 0 8px 10px -6px hsl(240 10% 1% / 0.1);
    --shadow-elevation: 0 4px 6px -1px hsl(240 10% 1% / 0.1), 0 2px 4px -2px hsl(240 10% 1% / 0.1);
    
    /* Glass Effect */
    --glass-bg: hsl(240 10% 6% / 0.8);
    --glass-border: hsl(240 8% 18% / 0.5);

    /* Animations */
    --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-fast: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

body {
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    line-height: 1.5;
    min-height: 100vh;
}

/* Utility Classes */
.hidden { display: none !important; }
.text-gradient {
    background: var(--gradient-primary);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.animate-fade-in-up {
    animation: fadeInUp 0.6s ease-out;
}

/* Layout */
.main-content {
    margin-left: 16rem; 
    transition: var(--transition-smooth);
}


#sidebar.collapsed ~ .main-content { margin-left: 4rem; }


@media (max-width: 1024px) {
  .main-content { margin-left: 0; }
  #sidebar.open ~ .main-content { margin-left: 16rem; }
}

/* transições mais suaves na sidebar */
.sidebar { transition: width .25s ease, transform .25s ease; }




/* Sidebar */
.sidebar {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 16rem;
    background: var(--gradient-card);
    border-right: 1px solid hsl(var(--border));
    z-index: 50;
    transition: var(--transition-smooth);
}

.sidebar.collapsed {
    width: 4rem;
}

.sidebar.collapsed .sidebar-brand-text,
.sidebar.collapsed .nav-label,
.sidebar.collapsed .sidebar-footer {
    display: none;
}

.sidebar-header {
    padding: 1.5rem;
    border-bottom: 1px solid hsl(var(--border));
}

.sidebar-header-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.sidebar-logo {
    width: 2rem;
    height: 2rem;
    border-radius: 0.5rem;
}

.sidebar-brand-text h1 {
    font-size: 1.125rem;
    font-weight: 600;
}

.sidebar-subtitle {
    font-size: 0.75rem;
    color: hsl(var(--muted-foreground));
}

.sidebar-toggle {
    padding: 0.5rem;
    background: transparent;
    border: none;
    color: hsl(var(--foreground));
    cursor: pointer;
    border-radius: 0.5rem;
    transition: var(--transition-fast);
}

.sidebar-toggle:hover {
    background: hsl(var(--accent));
}

/* Navigation */
.sidebar-nav {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.nav-item {
    display: flex;
    align-items: center;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: hsl(var(--foreground));
    background: transparent;
    border: none;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: var(--transition-fast);
    text-align: left;
    width: 100%;
}

.nav-item:hover {
    background: hsl(var(--accent));
    color: hsl(var(--accent-foreground));
}

.nav-item.active {
    background: var(--gradient-primary);
    color: hsl(var(--primary-foreground));
}
/* ===== Badge do menu (Frequente / etc) — versão bonita ===== */
.nav-item{
  position: relative; /* pra ancorar o badge no canto */
}

.nav-badge{
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  gap: 6px;

  height: 20px;
  padding: 0 10px;
  border-radius: 999px;

  font-size: 11px;
  font-weight: 800;
  letter-spacing: .02em;

  /* contraste + vibe premium */
  color: #D8FFE6;
  background: rgba(34, 197, 94, .18);          /* verde suave */
  border: 1px solid rgba(34, 197, 94, .35);
  box-shadow:
    0 0 0 1px rgba(34, 197, 94, .08) inset,
    0 8px 18px rgba(0, 0, 0, .25);
  backdrop-filter: blur(8px);
}

/* bolinha “online” dentro do badge (opcional mas fica lindo) */
.nav-badge::before{
  content:"";
  width: 6px;
  height: 6px;
  border-radius: 99px;
  background: rgba(34,197,94,.95);
  box-shadow: 0 0 10px rgba(34,197,94,.55);
}

/* quando estiver ativo, dá um “tchan” */
.nav-item.active .nav-badge{
  background: rgba(34, 197, 94, .24);
  border-color: rgba(34, 197, 94, .50);
}

/* sidebar recolhida: some com o badge */
.sidebar.collapsed .nav-badge{
  display: none;
}
.nav-item{
  padding-right: 110px; /* reserva espaço pro badge */
}
.nav-icon {
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    flex-shrink: 0;
}

.collapsed .nav-item {
    padding: 0.75rem 0.5rem;
    justify-content: center;
}

.collapsed .nav-icon {
    margin-right: 0;
}

/* Sidebar Footer */
.sidebar-footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 1rem;
    border-top: 1px solid hsl(var(--border));
}

.sidebar-footer-content {
    text-align: center;
    font-size: 0.75rem;
    color: hsl(var(--muted-foreground));
}

.sidebar-version {
    opacity: 0.6;
}

/* Mobile Overlay */
.mobile-overlay {
    position: fixed;
    inset: 0;
    background: hsl(var(--background) / 0.8);
    backdrop-filter: blur(4px);
    z-index: 40;
}

@media (min-width: 1024px) {
    .mobile-overlay {
        display: none !important;
    }
}



.page-header {
    margin-bottom: 2rem;
}

.page-header-with-back {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title {
    font-size: 1.875rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.page-subtitle {
    color: hsl(var(--muted-foreground));
}

.back-button {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: transparent;
    border: 1px solid hsl(var(--border));
    color: hsl(var(--foreground));
    border-radius: 0.5rem;
    cursor: pointer;
    transition: var(--transition-fast);
}

.back-button:hover {
    background: hsl(var(--accent));
}

/* Cards */
.card-premium {
    background: var(--gradient-card);
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    box-shadow: var(--shadow-card);
    backdrop-filter: blur(8px);
}

.card-hover {
    transition: var(--transition-smooth);
}

.card-hover:hover {
    transform: scale(1.02);
    box-shadow: var(--shadow-elevation);
}

.card-press {
    transition: var(--transition-fast);
}

.card-press:active {
    transform: scale(0.98);
}


.kpi-card {
    background: var(--gradient-card);
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 1.5rem;
    cursor: pointer;
    overflow: hidden;
}

.kpi-content {
    margin-bottom: 1rem;
}

.kpi-header {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.kpi-icon {
    width: 3rem;
    height: 3rem;
    border-radius: 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.kpi-icon-primary { background: hsl(var(--primary) / 0.1); color: hsl(var(--primary)); }
.kpi-icon-success { background: hsl(var(--status-free) / 0.1); color: hsl(var(--status-free)); }
.kpi-icon-info { background: hsl(var(--status-in-use) / 0.1); color: hsl(var(--status-in-use)); }
.kpi-icon-warning { background: hsl(var(--status-assistance) / 0.1); color: hsl(var(--status-assistance)); }

.kpi-title {
    font-size: 0.875rem;
    font-weight: 500;
    color: hsl(var(--muted-foreground));
    margin-bottom: 0.25rem;
}

.kpi-value {
    font-size: 1.875rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.kpi-subtitle {
    font-size: 0.75rem;
    color: hsl(var(--muted-foreground));
}

.kpi-expanded {
    border-top: 1px solid hsl(var(--border));
    padding-top: 1rem;
    animation: expandDown 0.3s ease-out;
}

.kpi-details-title {
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 0.75rem;
}

.category-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.category-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.category-count {
    font-weight: 600;
    font-size: 0.875rem;
}

/* Status Badges */
.status-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.status-free {
    background: hsl(var(--status-free) / 0.1);
    color: hsl(var(--status-free));
    border: 1px solid hsl(var(--status-free) / 0.2);
}

.status-in-use {
    background: hsl(var(--status-in-use) / 0.1);
    color: hsl(var(--status-in-use));
    border: 1px solid hsl(var(--status-in-use) / 0.2);
}

.status-maintenance {
    background: hsl(var(--status-maintenance) / 0.1);
    color: hsl(var(--status-maintenance));
    border: 1px solid hsl(var(--status-maintenance) / 0.2);
}

.status-assistance {
    background: hsl(var(--status-assistance) / 0.1);
    color: hsl(var(--status-assistance));
    border: 1px solid hsl(var(--status-assistance) / 0.2);
}

.status-archived {
    background: hsl(var(--status-archived) / 0.1);
    color: hsl(var(--status-archived));
    border: 1px solid hsl(var(--status-archived) / 0.2);
}

/* Sections */
.section-header {
    margin-bottom: 1.5rem;
}

.section-title {
    font-size: 1.25rem;
    font-weight: 600;
}

/* Quick Actions */
.quick-actions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

.quick-action-card {
    background: var(--gradient-card);
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 1.5rem;
    text-align: center;
    cursor: pointer;
    transition: var(--transition-smooth);
}

.quick-action-icon {
    width: 3rem;
    height: 3rem;
    margin: 0 auto 1rem;
    background: hsl(var(--primary) / 0.1);
    color: hsl(var(--primary));
    border-radius: 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.quick-action-title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.quick-action-desc {
    font-size: 0.875rem;
    color: hsl(var(--muted-foreground));
}

/* Activity Feed */
.activity-feed {
    background: var(--gradient-card);
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 1.5rem;
}

.activity-item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid hsl(var(--border));
}

.activity-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.activity-indicator {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 0.25rem;
}

.activity-success { background: hsl(var(--status-free)); }
.activity-warning { background: hsl(var(--status-assistance)); }
.activity-info { background: hsl(var(--status-in-use)); }

.activity-text {
    font-size: 0.875rem;
    margin-bottom: 0.25rem;
}

.activity-meta {
    font-size: 0.75rem;
    color: hsl(var(--muted-foreground));
}

/* Filters */
.filters-section {
    margin-bottom: 2rem;
}

.filters-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
}

.search-container {
    position: relative;
    flex: 1;
    min-width: 250px;
}

.search-input {
    width: 100%;
    padding: 0.75rem 1rem 0.75rem 2.5rem;
    background: hsl(var(--input));
    border: 1px solid hsl(var(--border));
    border-radius: 0.5rem;
    color: hsl(var(--foreground));
    font-size: 0.875rem;
}

.search-input:focus {
    outline: none;
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 2px hsl(var(--ring) / 0.2);
}

.search-icon {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1rem;
    height: 1rem;
    color: hsl(var(--muted-foreground));
}

.filter-controls {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.filter-select {
    padding: 0.5rem 0.75rem;
    background: hsl(var(--input));
    border: 1px solid hsl(var(--border));
    border-radius: 0.5rem;
    color: hsl(var(--foreground));
    font-size: 0.875rem;
    cursor: pointer;
}

.filter-button {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: hsl(var(--secondary));
    border: 1px solid hsl(var(--border));
    color: hsl(var(--secondary-foreground));
    border-radius: 0.5rem;
    cursor: pointer;
    font-size: 0.875rem;
    transition: var(--transition-fast);
}

.filter-button:hover {
    background: hsl(var(--secondary-hover));
}

/* Assets Grid */
.assets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.asset-card {
    background: var(--gradient-card);
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 1.5rem;
    transition: var(--transition-smooth);
    cursor: pointer;
}

.asset-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-elevation);
}


.asset-image{
  width: 100%;
  height: 160px;        /* ajusta aqui se quiser maior/menor */
  object-fit: cover;    /* preenche cortando o excesso */
  display: block;
  border-radius: .75rem;
  margin-bottom: 1rem;
  background: hsl(var(--muted));
}



.asset-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.75rem;
}

.asset-title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.asset-category {
    font-size: 0.75rem;
    color: hsl(var(--muted-foreground));
}

.asset-details {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.asset-detail {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.875rem;
}

.asset-label {
    color: hsl(var(--muted-foreground));
}

.asset-actions {
    display: flex;
    gap: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid hsl(var(--border));
}

.asset-btn {
    flex: 1;
    padding: 0.5rem;
    background: transparent;
    border: 1px solid hsl(var(--border));
    color: hsl(var(--foreground));
    border-radius: 0.375rem;
    cursor: pointer;
    font-size: 0.75rem;
    transition: var(--transition-fast);
}

.asset-btn:hover {
    background: hsl(var(--accent));
}

/* No Results */
.no-results {
    text-align: center;
    padding: 3rem 1rem;
    color: hsl(var(--muted-foreground));
}

.no-results-icon {
    width: 3rem;
    height: 3rem;
    margin: 0 auto 1rem;
    opacity: 0.5;
}

.no-results h3 {
    font-size: 1.125rem;
    margin-bottom: 0.5rem;
    color: hsl(var(--foreground));
}

.asset-form {
    max-width: 1200px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}


.form-section {
    background: var(--gradient-card);
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.form-section-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: hsl(var(--foreground));
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.form-group {
    display: flex;
    flex-direction: column;
}

.form-label {
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: hsl(var(--foreground));
}

.form-input,
.form-select,
.form-textarea {
    padding: 0.75rem;
    background: hsl(var(--input));
    border: 1px solid hsl(var(--border));
    border-radius: 0.5rem;
    color: hsl(var(--foreground));
    font-size: 0.875rem;
    transition: var(--transition-fast);
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
    outline: none;
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 2px hsl(var(--ring) / 0.2);
}

.form-textarea {
    resize: vertical;
    min-height: 100px;
}

/* Image Upload */
.image-upload-container {
    position: relative;
}

.file-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.image-upload-area {
    border: 2px dashed hsl(var(--border));
    border-radius: var(--radius);
    padding: 2rem;
    text-align: center;
    cursor: pointer;
    transition: var(--transition-fast);
}

.image-upload-area:hover {
    border-color: hsl(var(--primary));
    background: hsl(var(--primary) / 0.05);
}

.upload-icon {
    width: 2rem;
    height: 2rem;
    margin: 0 auto 0.5rem;
    color: hsl(var(--muted-foreground));
}

.upload-text {
    font-weight: 500;
    margin-bottom: 0.25rem;
}

.upload-hint {
    font-size: 0.875rem;
    color: hsl(var(--muted-foreground));
}

.image-preview {
    position: relative;
    display: inline-block;
    margin-top: 1rem;
}

.preview-image {
    max-width: 200px;
    max-height: 200px;
    border-radius: 0.5rem;
}

.remove-image-btn {
    position: absolute;
    top: -0.5rem;
    right: -0.5rem;
    width: 2rem;
    height: 2rem;
    background: hsl(var(--destructive));
    color: hsl(var(--destructive-foreground));
    border: none;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition-fast);
}

.remove-image-btn:hover {
    transform: scale(1.1);
}

/* Form Actions */
.form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    margin-top: 2rem;
}

.btn-secondary {
    padding: 0.75rem 1.5rem;
    background: hsl(var(--secondary));
    border: 1px solid hsl(var(--border));
    color: hsl(var(--secondary-foreground));
    border-radius: 0.5rem;
    cursor: pointer;
    font-size: 0.875rem;
    transition: var(--transition-fast);
}

.btn-secondary:hover {
    background: hsl(var(--secondary-hover));
}

.btn-premium {
    padding: 0.75rem 1.5rem;
    background: var(--gradient-primary);
    border: none;
    color: hsl(var(--primary-foreground));
    border-radius: 0.5rem;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    transition: var(--transition-smooth);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-premium:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-elevation);
}

.btn-premium:disabled {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
}

.submit-loader {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.spinner {
    width: 1rem;
    height: 1rem;
    animation: spin 1s linear infinite;
}

/* Toast */
.toast-container {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 100;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.toast {
    background: var(--gradient-card);
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 1rem 1.5rem;
    box-shadow: var(--shadow-card);
    animation: slideInRight 0.3s ease-out;
    max-width: 350px;
}

.toast.success {
    border-left: 4px solid hsl(var(--status-free));
}

.toast.error {
    border-left: 4px solid hsl(var(--destructive));
}

.toast-title {
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.toast-description {
    font-size: 0.875rem;
    color: hsl(var(--muted-foreground));
}

/* Icons */
.icon {
    width: 1rem;
    height: 1rem;
    stroke-width: 2;
}

/* Responsive */
@media (max-width: 1024px) {
    .main-content {
        margin-left: 0;
    }
    
    .sidebar {
        transform: translateX(-100%);
    }
    
    .sidebar.open {
        transform: translateX(0);
    }
    
    .form-grid {
        grid-template-columns: 1fr;
    }
    
    .filters-row {
        flex-direction: column;
        align-items: stretch;
    }
    
    .filter-controls {
        flex-wrap: wrap;
    }
}

@media (max-width: 640px) {
    .main-wrapper {
        padding: 1rem;
    }
    
    .kpi-grid {
        grid-template-columns: 1fr;
    }
    
    .quick-actions-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .assets-grid {
        grid-template-columns: 1fr;
    }
    
    .form-actions {
        flex-direction: column;
    }
}

/* Animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(50px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes expandDown {
    from {
        opacity: 0;
        max-height: 0;
    }
    to {
        opacity: 1;
        max-height: 500px;
    }
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: hsl(var(--muted));
    border-radius: 3px;
}

::-webkit-scrollbar-thumb {
    background: hsl(var(--border));
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: hsl(var(--accent));
}

/* tooltip com o texto do item quando recolhido */
.sidebar.collapsed .nav-item { position: relative; }
.sidebar.collapsed .nav-item::after {
  content: attr(data-label);
  position: absolute;
  left: 3rem; top: 50%; transform: translateY(-50%);
  background: hsl(var(--popover));
  color: hsl(var(--popover-foreground));
  border: 1px solid hsl(var(--border));
  padding: .375rem .5rem;
  border-radius: .5rem;
  font-size: .75rem;
  white-space: nowrap;
  opacity: 0; pointer-events: none;
  box-shadow: var(--shadow-card);
  transition: opacity .15s ease, transform .15s ease;
}
.sidebar.collapsed .nav-item:hover::after {
  opacity: 1;
  transform: translate(4px, -50%);
}


/* micro-interações */
.form-input, .form-select, .form-textarea {
  transition: box-shadow .2s ease, transform .06s ease;
}
.form-input:focus, .form-select:focus, .form-textarea:focus {
  transform: translateY(-1px);
}
.asset-card, .kpi-card, .quick-action-card {
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.asset-card:hover, .kpi-card:hover, .quick-action-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-elevation);
}
.asset-card:active, .kpi-card:active, .quick-action-card:active {
  transform: scale(0.99);
}





/* GRID do cadastro: conteúdo à esquerda, aside à direita */
@media (min-width: 1024px) {
  #page-cadastro .asset-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 420px;
    gap: 1.25rem;
    align-items: start;
    grid-auto-flow: dense;            /* <- puxa o aside pra cima */
  }

  /* por padrão, tudo na coluna 1 */
  #page-cadastro .asset-form > .form-section {
    grid-column: 1;
  }

  /* caixas da direita (Imagem e Status) */
  #page-cadastro .asset-form > .form-section.form-aside {
    grid-column: 2;
    align-self: start;
    position: sticky;
    top: 1rem;
  }

  /* botões ocupam a largura toda no fim */
  #page-cadastro .asset-form > .form-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 1024px) {
  #page-cadastro .asset-form { display: block; }
}


.kpi-card,
.quick-action-card {
  padding: 1.75rem;
  min-height: 168px;
  border-radius: calc(var(--radius) + 2px);
  position: relative;
  overflow: visible;              /* deixa o glow “vazar” pra fora */
  isolation: isolate;             /* evita que o glow brigue com o resto */
  box-shadow: 0 10px 25px -12px hsl(240 10% 1% / .35);
}

/* KPI – um pouco mais “presente” */
.kpi-value { font-size: 2.25rem; }

/* 2) Contraste em Ações Rápidas */
.quick-action-title {
  color: hsl(var(--foreground));
  font-weight: 700;
}
.quick-action-desc {
  color: hsl(var(--muted-foreground));
  opacity: .95;
}

/* 3) Glow suave atrás dos cards (e reage no hover) */
.kpi-card::before,
.quick-action-card::before {
  content: "";
  position: absolute;
  inset: -22%;
  border-radius: inherit;
  filter: blur(28px);
  /* dois focos de luz com as cores do tema */
  background:
    radial-gradient(60% 60% at 20% 20%, hsl(var(--primary)/.38), transparent 60%),
    radial-gradient(50% 50% at 80% 80%, hsl(var(--status-in-use)/.25), transparent 60%);
  opacity: .30;
  z-index: -1;
  transition: opacity .25s ease, transform .25s ease;
}

.kpi-card:hover::before,
.quick-action-card:hover::before {
  opacity: .55;
  transform: scale(1.02);
}

/* 4) Realce no hover (mantendo suas animações) */
.kpi-card:hover,
.quick-action-card:hover {
  border-color: hsl(var(--primary)/.35);
  box-shadow:
    0 0 0 1px hsl(var(--primary)/.25),
    0 20px 60px -12px hsl(var(--primary)/.28),
    var(--shadow-elevation);
}

/* 5) Ícones um tiquinho maiores e com fundo sutil */
.kpi-icon,
.quick-action-icon {
  width: 3.25rem;
  height: 3.25rem;
  background: hsl(var(--primary) / 0.08);
  border-radius: .75rem;
}

/* espaço melhor na sessão "Ações Rápidas" */
.section-header + .quick-actions-grid { margin-top: .5rem; }

/* =========================
   Glow + polish nos cards do Catálogo
   ========================= */

.assets-grid {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.25rem;
}

.asset-card {
  position: relative;
  overflow: visible;                  /* deixa o glow “vazar” */
  padding: 1.25rem;
  min-height: 240px;
  border-radius: calc(var(--radius) + 2px);
  box-shadow: 0 10px 25px -12px hsl(240 10% 1% / .32);
}

/* brilho suave atrás do card */
.asset-card::before {
  content: "";
  position: absolute;
  inset: -22%;
  border-radius: inherit;
  filter: blur(28px);
  background:
    radial-gradient(60% 60% at 20% 20%, hsl(var(--primary)/.35), transparent 60%),
    radial-gradient(50% 50% at 80% 80%, hsl(var(--status-in-use)/.22), transparent 60%);
  opacity: .30;
  z-index: -1;
  transition: opacity .25s ease, transform .25s ease;
}

.asset-card:hover::before {
  opacity: .55;
  transform: scale(1.02);
}

/* realce no hover (mantém suas animações) */
.asset-card:hover {
  border-color: hsl(var(--primary)/.35);
  box-shadow:
    0 0 0 1px hsl(var(--primary)/.22),
    0 20px 60px -12px hsl(var(--primary)/.26),
    var(--shadow-elevation);
}

/* imagem um pouco maior e integrada ao card */
.asset-image {
  height: 160px;                      /* era ~128 px; ajusta como curtir */
  border-radius: .75rem;
  margin-bottom: 1rem;
}

/* títulos e detalhes mais legíveis */
.asset-title { color: hsl(var(--foreground)); font-weight: 700; }
.asset-category { color: hsl(var(--muted-foreground)); }

.asset-actions {
  border-top: 1px solid hsl(var(--border));
  padding-top: 1rem;
}

/* ===== Upload de Imagem (layout estável) ===== */
#sec-imagem-ativo .image-preview{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:12px;
  max-width:100%;
}
#sec-imagem-ativo .preview-image{
  max-width:260px;     /* não deixa invadir a grid */
  max-height:180px;
  width:auto;
  height:auto;
  object-fit:contain;
  border-radius:12px;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
}
#sec-imagem-ativo .remove-image-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px; height:28px;
  border:none; border-radius:999px;
  cursor:pointer;
}

#sec-imagem-ativo .image-upload-container{
  display:flex;
  flex-direction:column;
  gap:12px;
}

#sec-imagem-ativo .image-upload-area{
  min-height:220px;             
  display:grid;
  place-items:center;
  border:1px dashed var(--border);
  border-radius:12px;
}

#sec-imagem-ativo .image-preview{
  display:inline-block;
  position:relative;
  max-width:320px;               /* limita o tamanho da imagem */
}

#sec-imagem-ativo .preview-image{
  display:block;
  width:100%;
  height:auto;
  border-radius:10px;
}

#sec-imagem-ativo .remove-image-btn{
  position:absolute;
  top:-10px; right:-10px;
  width:28px; height:28px;
  border-radius:50%;
}

/* A grade do formulário não deve esticar verticalmente as colunas */
.asset-form{ align-items:start; }



/* Upload estável */
#sec-imagem-ativo .image-upload-container{ display:flex; flex-direction:column; gap:12px; }
#sec-imagem-ativo .image-upload-area{ min-height:220px; display:grid; place-items:center; border:1px dashed var(--border); border-radius:12px; }
#sec-imagem-ativo .image-preview{ display:inline-block; position:relative; max-width:320px; }
#sec-imagem-ativo .preview-image{ display:block; width:100%; height:auto; border-radius:10px; }
#sec-imagem-ativo .remove-image-btn{ position:absolute; top:-10px; right:-10px; width:28px; height:28px; border-radius:50%; }

/* Grid do cadastro: conteúdo à esquerda, aside à direita, sem “quebrar” */
@media (min-width: 1024px) {
  #page-cadastro .asset-form {
    display:grid; grid-template-columns:minmax(0,1fr) 420px; gap:1.25rem; align-items:start; grid-auto-flow:dense;
  }
  #page-cadastro .asset-form > .form-section { grid-column:1; }
  #page-cadastro .asset-form > .form-section.form-aside { grid-column:2; position:sticky; top:1rem; }
  #page-cadastro .asset-form > .form-actions { grid-column:1 / -1; }
}

/* Cards do catálogo menos “esticados” e com imagem maior */
.assets-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap:1.25rem; }
.asset-card { position:relative; overflow:visible; padding:1.25rem; min-height:240px; border-radius: calc(var(--radius) + 2px); }
.asset-image { height:160px; border-radius:.75rem; margin-bottom:1rem; object-fit:cover; }

/* === Upload de imagem no cadastro (layout estável) === */
#sec-imagem-ativo .image-upload-container{ display:flex; flex-direction:column; gap:12px; }
#sec-imagem-ativo .image-upload-area{
  min-height: 220px;
  display: grid; place-items: center;
  border: 1px dashed var(--border); border-radius: 12px;
}
#sec-imagem-ativo .image-preview{
  display: inline-block; position: relative; max-width: 320px; margin-top: 12px;
}
#sec-imagem-ativo .preview-image{
  display:block; width:100%; height:auto; border-radius:10px; object-fit:contain;
  box-shadow: 0 4px 14px rgba(0,0,0,.25);
}
#sec-imagem-ativo .remove-image-btn{
  position:absolute; top:-10px; right:-10px;
  width:28px; height:28px; border-radius:50%;
}

/* =========================
   Administração (look premium)
   ========================= */
.admin-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:1.25rem;
}

@media (min-width: 1100px){
  .admin-grid{
    grid-template-columns: 1fr 1fr;
  }
}

.admin-card{
  padding:1.25rem;
}

.admin-card-header{
  margin-bottom:1rem;
}

.admin-card-sub{
  font-size:.875rem;
  color:hsl(var(--muted-foreground));
}

.admin-row{
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom:1rem;
}

.admin-grow{ flex:1 1 220px; }

.admin-list{
  list-style:none;
  margin-top:.5rem;
  display:flex;
  flex-direction:column;
  gap:.5rem;
  max-height:420px;
  overflow:auto;
  padding-right:.25rem;
}

.admin-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  background: var(--gradient-surface);
  border:1px solid hsl(var(--border));
  border-radius:.65rem;
  padding:.75rem .9rem;
}

.admin-item .admin-id{
  font-size:.75rem;
  color:hsl(var(--muted-foreground));
}

.admin-item .admin-name{
  font-weight:600;
}

.admin-pills{
  display:flex;
  gap:.375rem;
  align-items:center;
  flex-wrap:wrap;
}

.pill{
  font-size:.75rem;
  padding:.2rem .5rem;
  border-radius:999px;
  border:1px solid hsl(var(--border));
  color:hsl(var(--muted-foreground));
  background:hsl(var(--muted)/.35);
}

.admin-actions{
  display:flex;
  gap:.5rem;
}

.btn-ghost{
  padding:.45rem .7rem;
  background:transparent;
  border:1px solid hsl(var(--border));
  color:hsl(var(--foreground));
  border-radius:.5rem;
  cursor:pointer;
  font-size:.8rem;
  transition: var(--transition-fast);
}
.btn-ghost:hover{
  background:hsl(var(--accent));
}

/* deixa inputs e botões alinhados e com micro-interação */
.admin-row .form-input{
  min-width:220px;
}
.admin-row .btn-premium{
  white-space:nowrap;
}

/* melhora a rolagem das listas na tela escura */
.admin-list::-webkit-scrollbar{ width:6px; }
.admin-list::-webkit-scrollbar-thumb{
  background:hsl(var(--border));
  border-radius:3px;
}


.admin-grid{display:grid;grid-template-columns:1fr;gap:1rem}
@media(min-width:1024px){.admin-grid{grid-template-columns:1fr 1fr}}
.admin-list{display:flex;flex-direction:column;gap:.5rem}
.admin-row{display:grid;grid-template-columns:1fr auto;gap:.5rem;align-items:center;padding:.5rem .75rem;border-radius:.75rem;background:rgba(255,255,255,.03)}
.admin-row .row-main{display:grid;grid-template-columns:1fr 220px 180px;gap:.5rem}
.admin-row .row-actions{display:flex;gap:.5rem}
.icon-btn{padding:.4rem .6rem;border-radius:.6rem;background:rgba(255,255,255,.06);transition:.15s}
.icon-btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.12)}
.badge-id{opacity:.6;font-size:.8rem}

/* ===== Sidebar submenu ===== */
.nav-group .has-children{
  display:flex; align-items:center; justify-content:space-between;
}
.nav-group .chev{ width:16px; height:16px; opacity:.7; transition:transform .2s ease; }
.nav-group.open .chev{ transform:rotate(90deg); }
.nav-sub{ display:none; padding-left:.5rem; }
.nav-group.open .nav-sub{ display:block; }
.nav-item-sub{
  padding:.5rem .75rem .5rem 2.25rem;
  position:relative; font-size:.85rem;
}
.nav-item-sub .dot{
  position:absolute; left:1rem; top:50%; transform:translateY(-50%);
  width:6px; height:6px; border-radius:50%; background:hsl(var(--border));
}
.nav-item-sub.active .dot{ background:hsl(var(--primary)); }

/* ===== Administração – polimento ===== */
.admin-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:1rem;
}
@media(max-width:1100px){ .admin-grid{ grid-template-columns:1fr; } }

.admin-card{ padding:1.25rem; }
.admin-card-header{ margin-bottom:.75rem; }
.admin-card-sub{ color:hsl(var(--muted-foreground)); font-size:.9rem; }

.admin-row{ display:grid; grid-template-columns:1fr auto; gap:.5rem; align-items:center; margin-bottom:.75rem; }
.admin-row .row-main{ display:grid; grid-template-columns:1fr 240px 180px; gap:.5rem; }
.admin-row .row-actions{ display:flex; justify-content:flex-end; }
@media(max-width:980px){ .admin-row .row-main{ grid-template-columns:1fr; } }

.admin-list{ display:grid; gap:.5rem; max-height:420px; overflow:auto; }
.admin-item{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
  background:hsl(var(--secondary)/.55);
  border:1px solid hsl(var(--border));
  border-radius:.65rem; padding:.75rem .9rem;
}
.admin-name{ font-weight:600; }
.admin-id{ font-size:.75rem; color:hsl(var(--muted-foreground)); }

.admin-actions{ display:flex; gap:.5rem; }
.btn-ghost{
  padding:.42rem .7rem; font-size:.8rem;
  background:transparent; border:1px solid hsl(var(--border)); color:hsl(var(--foreground));
  border-radius:.5rem; cursor:pointer; transition:var(--transition-fast);
}
.btn-ghost:hover{ background:hsl(var(--accent)); }

.btn-premium{ font-weight:600; }

/* === PATCH: Administração (corrige corte/overflow e evita larguras fixas) === */
.admin-grid{
  display:grid;
  grid-template-columns: 1fr;     /* começa 1 coluna */
  gap:1.25rem;
}
@media (min-width: 1200px){
  .admin-grid{ grid-template-columns: 1fr 1fr; }  /* vira 2 colunas onde couber */
}

.admin-card{ padding:1.25rem; }

/* Lista com scroll sem empurrar layout */
.admin-list{
  list-style:none;
  display:flex; flex-direction:column; gap:.5rem;
  max-height:420px; overflow:auto; padding-right:.25rem;
}

/* Cada linha com área de inputs que encolhe de forma fluida */
.admin-row{
  display:grid;
  grid-template-columns: minmax(0,1fr) auto;  /* conteúdo cresce/encolhe + ações */
  gap:.5rem; align-items:center;
}

/* Subgrid com colunas fluidas (sem pixels fixos) */
.admin-row .row-main{
  display:grid;
  grid-template-columns: minmax(0,1fr) minmax(180px, 1fr) minmax(160px, 1fr);
  gap:.5rem;
}
/* Em telas menores, vira uma coluna só */
@media (max-width: 1100px){
  .admin-row .row-main{ grid-template-columns: 1fr; }
}

/* Inputs e botões não forçam largura mínima que estoura */
.admin-row .form-input,
.admin-row input,
.admin-row .js-emp-name,
.admin-row .js-emp-email,
.admin-row .js-emp-dept,
.admin-row .js-cat-name{
  width:100%;
  min-width:0;     /* ESSENCIAL pro grid permitir encolher */
}

.row-actions{
  display:flex; gap:.5rem; flex-wrap:wrap; justify-content:flex-end;
}
.icon-btn{
  padding:.42rem .7rem; border-radius:.6rem;
  background:rgba(255,255,255,.06); border:1px solid hsl(var(--border));
  color:hsl(var(--foreground)); transition:.15s;
}
.icon-btn:hover{ transform:translateY(-1px); background:rgba(255,255,255,.12); }

/* Opcional: segurança extra contra barra horizontal por algum conteúdo invadir */
html, body { overflow-x: hidden; }

/* FIX: ocupar a largura toda e encostar no conteúdo (sem centralizar) */
.main-wrapper{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;                 /* nada de auto */
  padding-inline: clamp(16px, 2vw, 32px);
}

/* === PATCH: evita conflitos — uma única definição de .page (transição elegante) === */
.page{ display:none; opacity:0; transform:translateY(12px); transition:opacity .22s ease, transform .22s ease; }
.page.active{ display:block; opacity:1; transform:none; }
.page.leaving{ opacity:0; transform:translateY(12px); }

/* FIX: glow não deve interceptar cliques */
.asset-card::before,
.kpi-card::before,
.quick-action-card::before{
  pointer-events: none !important;
}

/* Opcional: se ainda tiver disputa de camadas, garante a barra por cima */
.filters-section,
.search-container{ position: relative; z-index: 1; }

/* (Opcional) Se quiser reduzir a área do glow pra evitar vazar muito: */
/* .asset-card::before,
.kpi-card::before,
.quick-action-card::before{ inset: -10%; } */
/* === PERF: isola pintura de cada card (menos repaints na rolagem) === */
.asset-card,
.kpi-card,
.quick-action-card{
  contain: paint;                 /* ou 'content' se preferir isolar tudo */
  transform: translateZ(0);       /* força camada própria (GPU) */
}

/* === PERF: glow só no hover (zera custo enquanto rola) === */
.asset-card::before,
.kpi-card::before,
.quick-action-card::before{
  opacity: 0;                     /* era ~0.30 sempre ligado */
  filter: blur(18px);             /* blur menor já ajuda muito */
  pointer-events: none !important;/* já tínhamos pro hitbox */
  transition: opacity .2s ease, transform .2s ease;
}
.asset-card:hover::before,
.kpi-card:hover::before,
.quick-action-card:hover::before{
  opacity: .55;
}

/* === PERF: sombras leves no estado normal, fortes só no hover === */
.asset-card{ box-shadow: none; }  /* estava com sombra pesada sempre */
.asset-card:hover{ box-shadow: var(--shadow-elevation); }

/* === PERF: desliga backdrop-filter nos cards (caro pra rolagem) === */
.card-premium{ backdrop-filter: none; }

/* === PERF: 'content-visibility' pula render do que está fora da tela === */
/* (Chromium/Edge/Opera OK; Firefox ignora sem quebrar) */
.assets-grid .asset-card{
  content-visibility: auto;
  contain-intrinsic-size: 320px 360px; /* chute aproximado da altura do card */
}

/* Opcional: durante scroll, ignore hover (economiza ainda mais) */
@media (hover:hover){
  html.is-scrolling .asset-card:hover,
  html.is-scrolling .kpi-card:hover,
  html.is-scrolling .quick-action-card:hover{
    box-shadow: none;
  }
}

/* KPI - botão estilo MeuMeu (detalhes com caret) */
.kpi-more{
  margin-left:auto;
  display:inline-flex; align-items:center; gap:.375rem;
  padding:.35rem .6rem;
  background:hsl(var(--secondary));
  border:1px solid hsl(var(--border));
  color:hsl(var(--secondary-foreground));
  border-radius:.5rem;
  font-size:.8rem; cursor:pointer;
  transition: var(--transition-fast);
}
.kpi-more:hover{ background:hsl(var(--secondary-hover)); }
.kpi-more .caret{ transition:transform .2s ease; }
.kpi-expanded.show + .kpi-more .caret,
.kpi-more[aria-expanded="true"] .caret{ transform: rotate(180deg); }

/* lista por categoria no dropdown */
#kpi-by-category .category-item{
  padding:.35rem .5rem;
  border:1px solid hsl(var(--border));
  border-radius:.5rem;
  background:hsl(var(--muted)/.35);
}


/* header do catálogo com ação à direita */
.header-actions{
  display:flex; align-items:center; gap:.5rem;
}
.header-actions .btn-top{
  padding:.6rem 1rem; border-radius:.75rem;
  background: var(--gradient-primary);
  color:hsl(var(--primary-foreground)); border:none;
  font-weight:600; cursor:pointer; transition: transform .15s ease, box-shadow .2s ease;
}
.header-actions .btn-top:hover{ transform: translateY(-1px); box-shadow: var(--shadow-elevation); }
.header-actions .btn-top:active{ transform: translateY(0); }

.kpi-card .kpi-more .caret{transition:transform .18s}
.kpi-card.open .kpi-more .caret{transform:rotate(180deg)}

/* KPI: botão de seta minimalista no canto direito */
.kpi-card .kpi-header { position: relative; }
.kpi-card .kpi-more{
  position: absolute; top: 12px; right: 12px;
  width: 34px; height: 34px;
  display: grid; place-items: center;
  border-radius: 10px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.kpi-card .kpi-more:hover{
  background: rgba(255,255,255,0.07);
  border-color: rgba(255,255,255,0.16);
}
.kpi-card .kpi-more .caret{
  transition: transform .18s ease;
}

/* quando o card está aberto, rotaciona a seta */
.kpi-card.open .kpi-more .caret{
  transform: rotate(180deg);
}

/* dropdown suave */
.kpi-expanded{
  margin-top: 8px;
  border-top: 1px dashed rgba(255,255,255,0.08);
  padding-top: 12px;
}

/* linhas do “por categoria / por status” */
.category-list { display: grid; gap: 8px; }
.kpi-row, .category-item{
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 10px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
}


/* === KPI dropdown CONTROLADO pela classe .open no card === */
.kpi-card { position: relative; }

/* seta minimalista no canto */
.kpi-card .kpi-header { position: relative; }
.kpi-card .kpi-more{
  position: absolute; top: 12px; right: 12px;
  width: 34px; height: 34px;
  display: grid; place-items: center;
  border-radius: 10px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.kpi-card .kpi-more:hover{
  background: rgba(255,255,255,0.07);
  border-color: rgba(255,255,255,0.16);
}
.kpi-card .kpi-more .caret{ transition: transform .18s ease; }

/* dropdown fechado por padrão */
.kpi-expanded{
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  border-top: 1px dashed rgba(255,255,255,0.08);
  padding-top: 0;              /* zera quando fechado */
  transition: max-height .28s ease, opacity .28s ease, padding-top .28s ease;
}

/* quando o CARD fica .open, o conteúdo surge */
.kpi-card.open .kpi-expanded{
  max-height: 520px;
  opacity: 1;
  padding-top: 12px;
}

/* gira a seta quando aberto */
.kpi-card.open .kpi-more .caret{
  transform: rotate(180deg);
}

/* linhas internas do dropdown */
.category-list { display: grid; gap: 8px; }
.kpi-row, .category-item{
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 10px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
}

/* os KPI cards não são “botão” inteiro (evita confusão de clique) */
.kpi-card { cursor: default; }

/* === KPI DROPDOWN — controle só por .open no .kpi-card === */
.kpi-card[data-expandable] .kpi-expanded{
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height .28s ease, opacity .28s ease;
  pointer-events: none;
  margin-top: 8px;
  border-top: 1px dashed rgba(255,255,255,.08);
  padding-top: 12px;
}
.kpi-card.open .kpi-expanded{
  max-height: 520px;   /* suficiente p/ lista */
  opacity: 1;
  pointer-events: auto;
}

/* seta minimalista no canto direito (já existe mas garantimos aqui) */
.kpi-card .kpi-header{ position: relative; padding-right: 44px; }
.kpi-card .kpi-more{
  position: absolute; top: 10px; right: 10px;
  width: 34px; height: 34px; display: grid; place-items:center;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  transition: transform .18s ease, background .2s, border-color .2s;
}
.kpi-card .kpi-more:hover{ background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.16); }
.kpi-card .kpi-more .caret{ transition: transform .18s ease; }
.kpi-card.open .kpi-more .caret{ transform: rotate(180deg); }

/* badge de tendência no topo direito (+12%, +8%...) */
.kpi-trend{
  position: absolute; top: 10px; right: 54px; /* fica antes da seta */
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .8rem; font-weight: 600;
  color: #22c55e; /* verde */
  opacity: .9;
}
.kpi-trend-icon{ width: 16px; height: 16px; }

/* lista interna do dropdown (igual à print, com “pílulas” coloridas à direita) */
.category-list{ display: grid; gap: 8px; }
.kpi-row{
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 10px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 10px;
}
.kpi-row .pill-count{
  display: inline-flex; align-items: center; gap: 8px;
  padding: 4px 8px; border-radius: 999px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  font-weight: 600; font-size: .8rem;
}
.kpi-dot{
  width: 8px; height: 8px; border-radius: 999px; display: inline-block;
}
.kpi-dot.green { background: hsl(var(--status-free)); }
.kpi-dot.blue  { background: hsl(var(--status-in-use)); }
.kpi-dot.yellow{ background: hsl(var(--status-maintenance)); }
.kpi-dot.orange{ background: hsl(var(--status-assistance)); }

/* === KPI: layout horizontal como na segunda print === */
.kpi-header { display:flex; align-items:center; gap:1rem; position:relative; }
.kpi-info { display:flex; flex-direction:column; gap:2px; }
.kpi-value { font-size: 2rem; line-height: 1.1; }

/* Botão seta no topo direito */
.kpi-more{
  position:absolute; top:10px; right:10px;
  width:34px; height:34px; display:grid; place-items:center;
  background: rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:10px; cursor:pointer;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.kpi-card.open .kpi-more .caret{ transform: rotate(180deg); }
.kpi-more:hover{ background: rgba(255,255,255,0.07); border-color: rgba(255,255,255,0.16); }

/* Dropdown abre/fecha via classe .open no card (sem flicker) */
.kpi-expanded{ display:none; margin-top:10px; border-top:1px dashed rgba(255,255,255,.08); padding-top:12px; }
.kpi-card.open .kpi-expanded{ display:block; }

/* Lista “por categoria” com badge de contagem e dot colorido */
.category-list{ display:grid; gap:8px; }
.cat-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:8px 10px; border:1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.03); border-radius:10px;
}
.cat-left{ display:flex; align-items:center; gap:.5rem; }
.cat-dot{
  width:10px; height:10px; border-radius:999px; flex:0 0 10px;
  box-shadow: 0 0 0 2px rgba(255,255,255,.06) inset;
}
.cat-badge{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.15rem .55rem; border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  font-size:.8rem; font-weight:600; opacity:.95;
}

/* Cores dos pontinhos (mesma vibe da print) */
.cat-dot--green  { background: hsl(var(--status-free)); }
.cat-dot--blue   { background: hsl(var(--status-in-use)); }
.cat-dot--yellow { background: hsl(var(--status-maintenance)); }
.cat-dot--orange { background: hsl(var(--status-assistance)); }
.cat-dot--muted  { background: hsl(var(--border)); }


.kpi-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
}
@media (max-width: 1200px){
  .kpi-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px){
  .kpi-grid{ grid-template-columns: 1fr; }
}
#page-vincular .vincular-header{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
}

#page-vincular .header-right{
  display:flex; align-items:center; gap:.5rem;
}

#page-vincular #link-asset-category.compact{
  min-width: 220px;
  height: 40px;
  padding: .55rem .75rem;
}


@media (max-width: 840px){
  #page-vincular .vincular-header{
    flex-direction: column;
    align-items: stretch;
    gap: .75rem;
  }
  #page-vincular .header-right{ justify-content:flex-start; }
  #page-vincular #link-asset-category.compact{ width:100%; min-width:0; }
}

/* acessibilidade – label invisível visualmente */
.sr-only{
  position:absolute !important;
  width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.admin-list li.is-active { outline: 1px solid hsl(var(--ring)); border-radius: 8px; }

/* ===== Assistência: topo ===== */
.assist-top{
  display:grid; gap:1rem; margin-bottom:1rem;
}
.assist-stats{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:1rem;
}
.assist-stat{
  display:flex; align-items:center; gap:.75rem;
  padding:1rem 1.25rem; border-radius: var(--radius);
}
.assist-stat__icon{
  width:36px; height:36px; border-radius:10px; opacity:.9;
}
.assist-stat__label{ font-size:.9rem; color:hsl(var(--muted-foreground)); }
.assist-stat__value{ font-size:1.5rem; font-weight:800; line-height:1; }
.bg-blue{ background: hsl(var(--status-in-use)/.35); }
.bg-yellow{ background: hsl(var(--status-maintenance)/.35); }
.bg-green{ background: hsl(var(--status-free)/.35); }
.bg-red{ background: hsl(var(--destructive)/.35); }

.assist-actions{
  display:flex; gap:.5rem; align-items:center; flex-wrap:wrap;
}

/* ===== Assistência: cards ===== */
.assist-list{
  display:flex; flex-direction:column; gap:1rem;
}
.assist-card{
  background: var(--gradient-card);
  border:1px solid hsl(var(--border));
  border-radius: .85rem;
  padding:1rem 1.25rem;
  box-shadow: var(--shadow-card);
}
.assist-card__top{
  display:flex; align-items:center; justify-content:space-between; gap:.5rem;
}
.assist-id{ font-weight:800; font-size:1rem; letter-spacing:.02em; }
.assist-badges{ display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; }
.badge{
  font-size:.75rem; padding:.2rem .55rem; border-radius:999px;
  border:1px solid hsl(var(--border)); background:hsl(var(--muted)/.35);
}
.badge.status-aberto{ background:hsl(var(--status-in-use)/.17); color:hsl(var(--status-in-use)); border-color:hsl(var(--status-in-use)/.25); }
.badge.status-andamento{ background:hsl(var(--status-assistance)/.17); color:hsl(var(--status-assistance)); border-color:hsl(var(--status-assistance)/.25); }
.badge.status-fechada{ background:hsl(var(--status-free)/.17); color:hsl(var(--status-free)); border-color:hsl(var(--status-free)/.25); }
.badge.status-critico{ background:hsl(var(--destructive)/.18); color:hsl(var(--destructive)); border-color:hsl(var(--destructive)/.28); }

.badge.prio-alta{ background:rgba(234,88,12,.15); border-color:rgba(234,88,12,.3); color:#fb923c; }
.badge.prio-media{ background:rgba(234,179,8,.12); border-color:rgba(234,179,8,.28); color:#facc15; }
.badge.prio-baixa{ background:rgba(34,197,94,.12); border-color:rgba(34,197,94,.28); color:#34d399; }

.assist-card__body{
  margin-top:.5rem; display:grid; gap:.5rem;
}
.assist-asset{
  display:flex; align-items:center; gap:.5rem; font-weight:700;
}
.assist-desc{ color:hsl(var(--muted-foreground)); }
.assist-meta{
  display:flex; gap:1rem; flex-wrap:wrap; font-size:.9rem; color:hsl(var(--muted-foreground));
}
.assist-meta .meta{ display:flex; align-items:center; gap:.35rem; }

.assist-card__actions{
  margin-top:.75rem; display:flex; gap:.5rem; flex-wrap:wrap;
}
.btn-ghost.danger{ border-color:hsl(var(--destructive)/.4); color:hsl(var(--destructive)); }
.btn-ghost.primary{ border-color:hsl(var(--ring)/.35); }
@media (max-width: 1024px){
  .assist-stats{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px){
  .assist-stats{ grid-template-columns: 1fr; }
}


/* === Assistência: dropdown de busca do ativo === */
#ast-asset-sug {
  background: hsl(240 10% 10%);
  border: 1px solid hsl(var(--border));
  border-radius: 10px;
  margin-top: 6px;
  overflow: auto;
}
#ast-asset-sug li {
  padding: 10px 12px;
  border-bottom: 1px solid hsl(var(--border));
  cursor: pointer;
}
#ast-asset-sug li:hover { background: hsl(240 8% 14%); }


#ast-asset-picked { background:hsl(var(--muted)); border:1px solid hsl(var(--border)); }


#ast-image-preview { position:relative; display:inline-block; }
#ast-image-preview .remove-image-btn{
  position:absolute; top:6px; right:6px; width:28px; height:28px;
  border-radius:50%; background:#0008; color:#fff;
}


.assist-header{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
}
.btn-top-right{
  padding:.6rem 1rem; border-radius:.75rem;
  font-weight:600;
}
/* ===== GM Modal ===== */
.gm-modal.hidden { display:none !important; }
.gm-modal{
  position:fixed; inset:0; z-index:1000;
  display:grid; place-items:center;
}
.gm-modal__backdrop{
  position:absolute; inset:0;
  background: rgba(0,0,0,.6);
  backdrop-filter: blur(2px);
}
.gm-modal__dialog{
  position:relative;
  width:min(980px, 92vw);
  background: var(--gradient-card);
  border:1px solid hsl(var(--border));
  border-radius: 14px;
  box-shadow: var(--shadow-premium);
  animation: fadeInUp .24s ease-out;
  padding: 1rem;
}
.gm-modal__close{
  position:absolute; top:.5rem; right:.5rem;
  width:36px; height:36px; border-radius:999px;
  border:1px solid hsl(var(--border)); background: transparent;
  color: hsl(var(--foreground)); cursor:pointer;
}
.gm-modal__header{
  display:flex; align-items:flex-end; justify-content:space-between; gap:1rem;
  border-bottom:1px solid hsl(var(--border)); padding:.5rem .25rem 1rem;
}
.gm-modal__title{ display:flex; align-items:baseline; gap:.75rem; }
.gm-modal__title h3{ font-size:1.25rem; font-weight:700; }
.gm-modal__title .mononum{ font-feature-settings: "tnum"; opacity:.85; }
.gm-modal__badges{ display:flex; gap:.4rem; flex-wrap:wrap; }
.gm-modal__body{ padding: 1rem .25rem; }
.gm-modal__row{ display:grid; gap:1rem; grid-template-columns: 1fr 1fr; }
.gm-modal__col h4{ font-size:.95rem; margin-bottom:.5rem; }
.gm-modal__col .muted{ color:hsl(var(--muted-foreground)); }
.gm-modal__meta{ display:grid; gap:.35rem; margin-top:1rem; font-size:.9rem; color:hsl(var(--muted-foreground)); }
.gm-modal__images{
  display:grid; grid-template-columns: repeat(auto-fill, minmax(120px,1fr));
  gap:.5rem;
}
.gm-modal__images img{
  width:100%; height:100px; object-fit:cover; border-radius:10px;
  border:1px solid hsl(var(--border));
}
.gm-modal__footer{
  display:flex; justify-content:flex-end; gap:.5rem;
  border-top:1px solid hsl(var(--border)); padding-top:.75rem;
}

@media (max-width: 900px){
  .gm-modal__row{ grid-template-columns: 1fr; }
}

/* === Image Viewer (lightbox) === */
.imgv.hidden { display: none; }
.imgv {
  position: fixed; inset: 0; z-index: 9999;
  display: grid; place-items: center;
}
.imgv__backdrop {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.6);
  backdrop-filter: blur(2px);
}
.imgv__dialog {
  position: relative;
  max-width: min(92vw, 1200px);
  max-height: 92vh;
  background: var(--card-bg, #121212);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  box-shadow: 0 20px 60px rgba(0,0,0,.5);
  padding: 14px;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 8px;
}
.imgv__img {
  display: block;
  max-width: 100%;
  max-height: 75vh;
  border-radius: 10px;
  object-fit: contain;
}
.imgv__close {
  position: absolute; top: 6px; right: 8px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: #fff; width: 36px; height: 36px; border-radius: 10px;
  cursor: pointer; font-size: 22px; line-height: 1;
}
.imgv__close:hover { background: rgba(255,255,255,.12); }
.imgv__caption {
  font-size: .9rem; opacity: .8; padding: 2px 4px 0;
  text-align: center;
}

/* --- Assistência: layout mais caprichado --- */
.assist-card{
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 16px;
  padding: 18px;
  box-shadow: 0 6px 18px rgba(0,0,0,.25);
}

.assist-card__top{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom: 10px;
}
.assist-badges-left{ display:flex; gap:8px; align-items:center; }
.assist-id{ font-weight:700; opacity:.7; }

.assist-asset{
  display:flex; align-items:center; gap:10px;
  font-weight:700; font-size:1.05rem;
}
.assist-asset .icon{
  width:22px; height:22px; opacity:.85;
  filter: drop-shadow(0 0 6px rgba(140,92,255,.35));
}

.assist-desc{
  margin:10px 0 8px;
  color:var(--muted-foreground, #c9c9c9);
}

.assist-meta{ display:flex; flex-wrap:wrap; gap:14px; opacity:.9; }
.assist-meta .meta{ display:flex; align-items:center; gap:6px; }
.assist-meta .icon{ width:18px; height:18px; opacity:.8; }

/* Badges já existentes ganham leve brilho */
.badge{
  border-radius:999px; padding:4px 10px; font-weight:600;
  box-shadow: 0 0 0 transparent, inset 0 0 0 1px rgba(255,255,255,.06);
}
.status-critico{ box-shadow: 0 0 12px rgba(255,77,77,.22), inset 0 0 0 1px rgba(255,77,77,.25); }
.prio-alta   { box-shadow: 0 0 12px rgba(255,118,20,.22), inset 0 0 0 1px rgba(255,118,20,.25); }
.prio-media  { box-shadow: 0 0 12px rgba(255,201,60,.18), inset 0 0 0 1px rgba(255,201,60,.22); }
.prio-baixa  { box-shadow: 0 0 12px rgba(46,204,113,.18), inset 0 0 0 1px rgba(46,204,113,.22); }

/* Botões de verdade */
.btn-ui{
  --ring: rgba(140, 92, 255, .45);
  border: 0; border-radius: 12px; padding: 10px 14px;
  font-weight: 700; cursor: pointer;
  background: rgba(255,255,255,.04);
  color: #fff;
  transition: transform .08s ease, box-shadow .2s ease, background .2s ease;
}
.btn-ui:hover{ transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,.25), 0 0 0 3px var(--ring); }
.btn-ui.primary{
  background: linear-gradient(135deg, #8c5cff, #6a8cff);
}
.btn-ui.danger{
  background: linear-gradient(135deg, #ff4d4d, #ff6a6a);
}
.btn-ui:active{ transform: translateY(0); }

/* Deixa a UL rolável com scrollbar neon (só WebKit/Chromium) */
#ast-list{
  max-height: 60vh; overflow: auto; padding-right: 4px;
}
#ast-list::-webkit-scrollbar{ width: 10px; height: 10px; }
#ast-list::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, #8c5cff, #6a8cff);
  border-radius: 999px;
  box-shadow: 0 0 10px rgba(140,92,255,.6);
}
#ast-list::-webkit-scrollbar-track{
  background: rgba(255,255,255,.05);
  border-radius: 999px;
}

/* === GLOBAL: scrollbar mais visível (WebKit/Chromium) === */
*::-webkit-scrollbar{ width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, #8c5cff, #6a8cff);
  border-radius: 999px;
  box-shadow: 0 0 10px rgba(140,92,255,.55);
}
*::-webkit-scrollbar-track{
  background: rgba(255,255,255,.05);
  border-radius: 999px;
}

/* exceção: mantém a do menu lateral clean */
.sidebar *::-webkit-scrollbar-thumb{
  background: hsl(var(--border));
  box-shadow: none;
}
/* === GLOBAL: contraste nos KPI cards === */
.kpi-title{
  color: hsl(var(--foreground));
  text-shadow: 0 1px 0 rgba(0,0,0,.55), 0 0 8px rgba(138,92,255,.25);
  font-weight: 700;
}
.kpi-value{
  font-weight: 800;
  text-shadow: 0 2px 0 rgba(0,0,0,.55), 0 0 12px rgba(106,140,255,.35);
}

/* === Botões "UI" (usados na Assistência e agora no Catálogo) === */
.btn-ui{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5rem; padding:.55rem .8rem; border-radius:.55rem;
  font-size:.85rem; font-weight:600; letter-spacing:.02em;
  border:1px solid hsl(var(--border)); background:hsl(var(--secondary));
  color:hsl(var(--secondary-foreground)); cursor:pointer;
  transition:var(--transition-fast);
}
.btn-ui:hover{ background:hsl(var(--secondary-hover)); transform:translateY(-1px); }
.btn-ui.primary{ background:var(--gradient-primary); border:none; color:hsl(var(--primary-foreground)); }
.btn-ui.primary:hover{ box-shadow:var(--shadow-elevation); }
.btn-ui.danger{ background:hsl(var(--destructive)); color:hsl(var(--destructive-foreground)); border:none; }
.btn-ui.danger:hover{ filter:brightness(1.05); }

/* === Badges de status mais "botão" === */
.status-badge{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.28rem .6rem; border-radius:999px; font-size:.72rem; font-weight:700;
  letter-spacing:.04em; text-transform:uppercase; box-shadow:0 1px 0 hsl(0 0% 0% / .18) inset;
}
.status-free{        background:hsl(var(--status-free) / .16);        color:hsl(var(--status-free));        border:1px solid hsl(var(--status-free)/.28); }
.status-in-use{      background:hsl(var(--status-in-use) / .16);      color:hsl(var(--status-in-use));      border:1px solid hsl(var(--status-in-use)/.28); }
.status-assistance{  background:hsl(var(--status-assistance) / .16);  color:hsl(var(--status-assistance));  border:1px solid hsl(var(--status-assistance)/.28); }
.status-maintenance{ background:hsl(var(--status-maintenance) / .16); color:hsl(var(--status-maintenance)); border:1px solid hsl(var(--status-maintenance)/.28); }
.status-archived{    background:hsl(var(--status-archived) / .16);    color:hsl(var(--status-archived));    border:1px solid hsl(var(--status-archived)/.28); }

/* Cursor de zoom nas imagens do catálogo */
.asset-image{ cursor:zoom-in; }

/* Modal reaproveita as classes gm-modal já existentes */
.gm-modal__subtitle{ color:hsl(var(--muted-foreground)); font-size:.9rem; margin-top:.25rem; }
/* --- Força estilo de BOTÃO no footer do modal --- */
.gm-modal__footer .btn-ghost,
.gm-modal__footer .btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .625rem 1rem;
  border-radius: var(--radius);
  border: 1px solid hsl(var(--border));
  background: hsl(var(--secondary));
  color: hsl(var(--secondary-foreground));
  font-weight: 600;
  cursor: pointer;
  transition: var(--transition-fast);
  box-shadow: var(--shadow-elevation);
}

.gm-modal__footer .btn-ghost:hover,
.gm-modal__footer .btn-secondary:hover {
  background: hsl(var(--secondary-hover));
}

/* “Finalizar” (danger) com cor sólida como os outros */
.gm-modal__footer .btn-ghost.danger {
  background: hsl(var(--destructive));
  border-color: hsl(var(--destructive));
  color: hsl(var(--destructive-foreground));
}
.gm-modal__footer .btn-ghost.danger:hover {
  filter: brightness(1.05);
}

/* ===== PATCH: Administração → Funcionários (2 colunas, sem “caixa dentro da outra”) ===== */

/* 1) Some com o campo de e-mail em qualquer lugar */
#admin-new-emp-email,
#admin-emp-list .js-emp-email { display:none !important; }

/* 2) LINHAS DA LISTA (já cadastrados) — 2 colunas: Nome (largo) + Setor (menor) */
#admin-emp-list .admin-row {
  background: transparent !important;    /* tira a “caixa” dentro da card */
  padding: 8px 0 !important;
  border-radius: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}
#admin-emp-list .row-main {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 320px) !important; /* Nome | Setor */
  gap: 8px !important;
}
#admin-emp-list .row-actions {
  display: flex !important;
  gap: 8px !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

/* inputs nas linhas */
#admin-emp-list .js-emp-name,
#admin-emp-list .js-emp-dept {
  width: 100% !important;
  min-width: 0 !important;
  height: 44px !important;
  padding: 0 12px !important;
  font-size: 15px !important;
  border-radius: 10px !important;
}

/* 3) FORMULÁRIO DE CADASTRO (topo do card) — Nome bem largo + Setor menor */
#admin-new-emp-name {
  width: 62% !important;         /* Nome grandão */
  min-width: 320px !important;
  height: 44px !important;
  padding: 0 12px !important;
  font-size: 15px !important;
  border-radius: 10px !important;
  margin-right: 10px !important;
}
#admin-new-emp-dept {
  width: 28% !important;         /* Setor */
  min-width: 200px !important;
  height: 44px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  border-radius: 10px !important;
  margin-right: 10px !important;
}
#admin-add-emp {
  height: 44px !important;
  line-height: 44px !important;
  padding: 0 16px !important;
  border-radius: 10px !important;
}


@media (max-width: 900px) {
  #admin-new-emp-name,
  #admin-new-emp-dept,
  #admin-add-emp {
    width: 100% !important;
    min-width: 0 !important;
    margin: 6px 0 0 !important;
  }
  #admin-emp-list .row-main {
    grid-template-columns: 1fr !important;
  }
}


/* ===== Admin: layout 2 colunas para a página de categorias ===== */
.admin-two-col{
  display:grid;
  grid-template-columns: 1.15fr 1fr; /* esquerda levemente maior */
  gap: 1.25rem;
}
@media (max-width: 1024px){
  .admin-two-col{ grid-template-columns: 1fr; }
}

/* Direita empilha os cartões Setores e Funcionários */
.admin-col-right{
  display:flex;
  flex-direction:column;
  gap: 1.25rem;
}

/* Filas dentro dos cartões, com respiro e borda suave */
.admin-row{
  display:flex;
  gap:.75rem;
  align-items:center;
  justify-content:space-between;
  padding:.6rem;
  border:1px solid var(--border, rgba(255,255,255,.08));
  background:var(--panel-2, rgba(255,255,255,.03));
  border-radius:.8rem;
}

/* Lista padrão dentro dos cartões */
.admin-list{
  display:flex;
  flex-direction:column;
  gap:.5rem;
  margin-top:.5rem;
}

/* A área de ações sempre com largura mínima p/ botões alinharem */
.row-actions{ display:flex; gap:.4rem; flex:0 0 auto; }
.row-actions .btn-ui,
.row-actions .btn-premium,
.row-actions .btn-secondary{ min-width:88px; justify-content:center; }

/* Pequenos refinamentos visuais */
.admin-card + .admin-card{ margin-top:0; } 

/* Ícone / dot à esquerda das linhas do dropdown */
.cat-row .cat-left { display:flex; align-items:center; gap:8px; }
.cat-row .cat-left i { opacity:.9; font-size:14px; }
.cat-badge {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:28px; padding:2px 8px; border-radius:999px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1);
  font-weight:600;
}

.category-item { display:flex; align-items:center; gap:.6rem; justify-content:space-between; }
.category-item .dot { width:.6rem; height:.6rem; border-radius:999px; display:inline-block; }
.category-item .dot { background: hsl(calc(var(--seed, 0) * 47deg), 90%, 60%); }
.pill-count { background: #2a2a2a; padding: 0 .5rem; border-radius: 999px; font-variant-numeric: tabular-nums; }


/* ===== Atividades Recentes (só CSS, look do sistema) ===== */
#activity-list{
  display: grid;
  gap: .75rem;
}

/* cada item (independe de tag: div, li, etc) */
#activity-list > *{
  display: grid;
  grid-template-columns: 1fr auto;   /* texto | data */
  align-items: start;
  gap: .75rem;
  padding: .9rem 1rem;
  background: var(--gradient-card);
  border: 1px solid hsl(var(--border));
  border-radius: .85rem;
  position: relative;
  overflow: hidden;
  box-shadow: 0 8px 22px -14px hsl(240 10% 1% / .45);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

/* glow + borda bonita */
#activity-list > *::after{
  content:"";
  position:absolute; inset:0;
  border-radius: inherit;
  pointer-events:none;
  background:
    radial-gradient(60% 80% at 10% 0%, hsl(var(--primary)/.12), transparent 60%),
    radial-gradient(50% 60% at 100% 100%, hsl(var(--status-in-use)/.10), transparent 60%);
  mix-blend-mode: screen;
  opacity:.6;
}

/* filete colorido à esquerda (status) */
#activity-list > *::before{
  content:"";
  position:absolute; left:0; top:0; bottom:0;
  width: 4px; border-radius: 4px 0 0 4px;
  background: hsl(var(--ring));                 /* default */
  opacity:.9;
}
/* opcional: mude a cor pelo data-attr se quiser */
#activity-list > [data-type="success"]::before{ background: hsl(var(--status-free)); }
#activity-list > [data-type="info"]::before   { background: hsl(var(--status-in-use)); }
#activity-list > [data-type="warn"]::before   { background: hsl(var(--status-assistance)); }

/* TEXTO (primeiro filho) — sem quebrar uma palavra por linha */
#activity-list > * > :first-child{
  font-size: .95rem;
  line-height: 1.35;
  color: hsl(var(--card-foreground, 0 0% 98%));
  white-space: normal;           /* <<< NÃO vira “uma palavra por linha” */
  word-break: normal;
  overflow-wrap: break-word;     /* quebra só quando precisa */
}
/* negritos ficam mais presentes se existirem */
#activity-list strong,
#activity-list b{
  font-weight: 700;
  opacity: .95;
}

/* DATA (último filho) */
#activity-list > * > :last-child{
  color: hsl(var(--muted-foreground));
  font-size: .82rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  align-self: start;
  margin-left: 1rem;
}

/* hover sutil no padrão */
#activity-list > *:hover{
  transform: translateY(-1px);
  border-color: hsl(var(--ring) / .35);
  box-shadow:
    0 0 0 1px hsl(var(--ring) / .18),
    0 18px 44px -18px hsl(240 10% 1% / .55);
}

/* mobile: empilha a data embaixo */
@media (max-width: 720px){
  #activity-list > *{
    grid-template-columns: 1fr;
    gap: .5rem;
    padding: .85rem .9rem;
  }
  #activity-list > * > :last-child{
    margin-left: 0;
  }
}




/* === Tabs simples (detalhe do ativo) === */
.detail-tabs{ display:flex; gap:.5rem; margin:.25rem .25rem 1rem; flex-wrap:wrap; }
.tab-btn{
  padding:.5rem .8rem; border-radius:.6rem; cursor:pointer;
  background:hsl(var(--secondary)); color:hsl(var(--secondary-foreground));
  border:1px solid hsl(var(--border)); transition:var(--transition-fast);
  font-weight:600; font-size:.9rem;
}
.tab-btn:hover{ background:hsl(var(--secondary-hover)); }
.tab-btn.active{
  background:var(--gradient-primary); color:hsl(var(--primary-foreground)); border:none;
  box-shadow: var(--shadow-elevation);
}
.tab-panel{ display:none; }
.tab-panel.active{ display:block; }

/* === Timeline do histórico geral === */
.timeline{ list-style:none; display:grid; gap:.75rem; }
.timeline li{
  position:relative; padding:.75rem 1rem .75rem 1.75rem;
  background: var(--gradient-card); border:1px solid hsl(var(--border));
  border-radius:.75rem;
}
.timeline li::before{
  content:""; position:absolute; left:.6rem; top:1.05rem;
  width:8px; height:8px; border-radius:50%;
  background:hsl(var(--ring));
  box-shadow:0 0 0 3px rgba(140,92,255,.18);
}
.timeline .meta{ color:hsl(var(--muted-foreground)); font-size:.85rem; margin-top:.25rem; }



/* Oculta os botões do detalhe do ativo */
#atv-btn-editar,
#atv-btn-vincular {
  display: none !important;
}


/* Badges suaves (datas, ID, local, setor etc.) */
.pill-soft{
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.28rem .6rem; border-radius:999px;
  font-size:.75rem; line-height:1;
  background:rgba(148,163,184,.12);           /* slate-400/12 */
  color:#cbd5e1;                               /* slate-300   */
  border:1px solid rgba(148,163,184,.22);
  white-space:nowrap;
}
.pill-soft .dot{ width:6px; height:6px; border-radius:50%; background:#64748b; }
.pill-soft .icon{ width:14px; height:14px; opacity:.85; }

/* opcional: deixe as .admin-pills alinhadas e com wrap bonito */
.admin-pills{
  display:flex; flex-wrap:wrap; gap:.4rem;
}


/* ===== Badges de metadado (igual estilo da badge de status) ===== */
.meta-badge{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.28rem .6rem; border-radius:9999px;
  font-size:.72rem; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase;
  background: hsl(var(--muted) / .35);
  color: hsl(var(--secondary-foreground));
  border: 1px solid hsl(var(--border));
  line-height: 1; white-space: nowrap;
}
.meta-badge .dot{ width:6px; height:6px; border-radius:50%; background:hsl(var(--border)); }
.meta-badge .icon{ width:14px; height:14px; opacity:.9; }

/* organiza o grupo das badges à direita da linha */
.admin-pills{ display:flex; flex-wrap:wrap; gap:.45rem; }

/* ====== PÍLULAS (data/hora, ID, Local, Setor) no estilo da status-badge ====== */
.pill-soft{
  display:inline-flex !important;
  align-items:center !important;
  gap:.40rem !important;
  padding:.28rem .60rem !important;
  border-radius:9999px !important;
  font-size:.72rem !important;
  font-weight:700 !important;
  letter-spacing:.04em !important;
  text-transform:uppercase !important;
  line-height:1 !important;
  white-space:nowrap !important;

  /* fundo/borda iguais às status-* (cinza discreto) */
  background: hsl(var(--muted) / .16) !important;
  color: hsl(var(--secondary-foreground)) !important;
  border: 1px solid hsl(var(--border) / .28) !important;

  /* leve relevo como as status-badge */
  box-shadow: 0 1px 0 hsl(0 0% 0% / .18) inset !important;
}

/* ícone/bolinha dentro das pílulas */
.pill-soft .icon{ width:14px; height:14px; opacity:.9; }
.pill-soft .dot{ width:6px; height:6px; border-radius:50%; background:hsl(var(--border)); }

/* container das pílulas (direita das linhas) */
.admin-pills{ display:flex; flex-wrap:wrap; gap:.45rem; }

/* Pílulas no MESMO estilo visual da status-badge (caps, borda, relevo) */
.pill-soft{
  display:inline-flex !important;
  align-items:center !important;
  gap:.42rem !important;

  padding:.32rem .72rem !important;
  border-radius:9999px !important;

  font-size:.72rem !important;
  font-weight:700 !important;
  letter-spacing:.045em !important;
  text-transform:uppercase !important;
  line-height:1 !important;
  white-space:nowrap !important;
  font-variant-numeric: tabular-nums !important;

  /* fundo e borda com contraste (mesma “pegada” da LIVRE) */
  background: hsl(var(--secondary) / .42) !important;
  border: 1px solid hsl(var(--border) / .55) !important;
  color: hsl(var(--secondary-foreground)) !important;

  /* leve relevo como a status-badge */
  box-shadow:
    0 1px 0 hsl(0 0% 0% / .35) inset,
    0 0 0 1px hsl(var(--secondary) / .18) inset !important;
}

.pill-soft .icon{ width:14px; height:14px; opacity:.9; }
.pill-soft .dot{ width:6px; height:6px; border-radius:50%; background:hsl(var(--status-in-use) / .85); }

/* espaço entre as pílulas quando aparecem em grupo */
.admin-pills{ display:flex; flex-wrap:wrap; gap:.5rem; }


/* --- checkbox bonito (seu snippet, só colei) --- */
.checkbox-wrapper-5 .check {
  --size: 40px;
  position: relative;
  background: linear-gradient(90deg, #f19af3, #f099b5);
  line-height: 0;
  perspective: 400px;
  font-size: var(--size);
}
.checkbox-wrapper-5 .check input[type="checkbox"],
.checkbox-wrapper-5 .check label,
.checkbox-wrapper-5 .check label::before,
.checkbox-wrapper-5 .check label::after,
.checkbox-wrapper-5 .check {
  appearance: none;
  display: inline-block;
  border-radius: var(--size);
  border: 0;
  transition: .35s ease-in-out;
  box-sizing: border-box;
  cursor: pointer;
}
.checkbox-wrapper-5 .check label {
  width: calc(2.2 * var(--size));
  height: var(--size);
  background: #d7d7d7;
  overflow: hidden;
}
.checkbox-wrapper-5 .check input[type="checkbox"] {
  position: absolute;
  z-index: 1;
  width: calc(.8 * var(--size));
  height: calc(.8 * var(--size));
  top: calc(.1 * var(--size));
  left: calc(.1 * var(--size));
  background: linear-gradient(45deg, #dedede, #ffffff);
  box-shadow: 0 6px 7px rgba(0,0,0,0.3);
  outline: none;
  margin: 0;
}
.checkbox-wrapper-5 .check input[type="checkbox"]:checked { left: calc(1.3 * var(--size)); }
.checkbox-wrapper-5 .check input[type="checkbox"]:checked + label { background: transparent; }
.checkbox-wrapper-5 .check label::before,
.checkbox-wrapper-5 .check label::after {
  content: "· ·";
  position: absolute;
  overflow: hidden;
  left: calc(.15 * var(--size));
  top: calc(.5 * var(--size));
  height: var(--size);
  letter-spacing: calc(-0.04 * var(--size));
  color: #9b9b9b;
  font-family: "Times New Roman", serif;
  z-index: 2;
  font-size: calc(.6 * var(--size));
  border-radius: 0;
  transform-origin: 0 0 calc(-0.5 * var(--size));
  backface-visibility: hidden;
}
.checkbox-wrapper-5 .check label::after {
  content: "●";
  top: calc(.65 * var(--size));
  left: calc(.2 * var(--size));
  height: calc(.1 * var(--size));
  width: calc(.35 * var(--size));
  font-size: calc(.2 * var(--size));
  transform-origin: 0 0 calc(-0.4 * var(--size));
}
.checkbox-wrapper-5 .check input[type="checkbox"]:checked + label::before,
.checkbox-wrapper-5 .check input[type="checkbox"]:checked + label::after {
  left: calc(1.55 * var(--size));
  top: calc(.4 * var(--size));
  line-height: calc(.1 * var(--size));
  transform: rotateY(360deg);
}
.checkbox-wrapper-5 .check input[type="checkbox"]:checked + label::after {
  height: calc(.16 * var(--size));
  top: calc(.55 * var(--size));
  left: calc(1.6 * var(--size));
  font-size: calc(.6 * var(--size));
  line-height: 0;
}

/* integra com o seu card */
.form-section-title.with-action{ display:flex; align-items:center; gap:.75rem; }
.form-section-title.with-action > .checkbox-wrapper-5{ margin-left:auto; }
.card-collapsible.card-collapsed .form-section-body{ display:none; }

/* dark mode: deixa o track neutro */
.dark .checkbox-wrapper-5 .check label{ background:#3a3a3a; }
/* deixa o toggle na coluna ESQUERDA, alinhado à direita, sem card */
#sec-local-trigger { grid-column: 1; justify-self: end; margin: 6px 0 -6px; padding: 0; }
#sec-local-trigger * { box-shadow: none; }



/* Linha do toggle sem “fundo invisível” */
.inline-toggle-row{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  margin:.5rem 0 .25rem;
}
.inline-toggle-row .toggle-text{
  font-size:.875rem;
  color:#9aa0a6;
}

/* Toggle compacto */
.gm-switch{
  position:relative;
  width:44px; height:24px;
  border-radius:9999px;
  background:#5a5a5a;
  display:inline-flex; align-items:center;
  padding:2px; border:none; cursor:pointer;
  transition:background-color .18s ease;
}
.gm-switch .knob{
  width:20px; height:20px; border-radius:9999px;
  background:#fff; transform:translateX(0);
  transition:transform .18s ease;
}
.gm-switch.on{ background:#ec5dc1; }
.gm-switch.on .knob{ transform:translateX(20px); }

/* Colapso: fechado = 0px de altura (não empurra nada) */
.collapse-grid{
  display:grid;
  grid-template-rows:0fr;               /* fechado */
  transition:grid-template-rows .2s ease-out;
}
.collapse-grid.open{ grid-template-rows:1fr; } /* aberto */
.collapse-inner{ overflow:hidden; }              /* esconde durante a animação */

/* === Toggle abaixo do card "Informações Básicas", colado à esquerda === */
#loc-toggle-row {
  /* coloca na coluna 1 do grid do formulário */
  grid-column: 1;

  /* alinha à esquerda sem ocupar largura toda */
  justify-self: start;

  /* aparência compacta inline, sem caixa nenhuma */
  display: inline-flex;
  align-items: center;
  gap: 8px;

  /* margem só pra respirar um pouco do card acima */
  margin: 8px 0 0 0;

  /* MUITO IMPORTANTE: nada de posição absoluta */
  position: static;
}

/* Texto do rótulo do toggle (opcional) */
#loc-toggle-row .toggle-text {
  font-size: 0.95rem;
  color: var(--muted-foreground, #aaa);
}

/* Linha do toggle: compacta, sem altura extra */
.inline-toggle-row{
  display:flex;
  align-items:center;
  gap:.5rem;
  margin: 8px 0 6px;  /* só um respiro */
  grid-column: 1 / 2; /* força ficar na coluna ESQUERDA do form */
}

/* Container do colapso: fechado = 0px (sem “buraco”) */
.collapse-grid{
  grid-column: 1 / 2;           /* esquerda */
  overflow: hidden;
  max-height: 0;                /* não ocupa espaço */
  opacity: 0;
  transform: translateY(-4px);
  transition: max-height .35s ease, opacity .2s ease, transform .35s ease;
}

/* Aberto: anima descendo e revela o card */
.collapse-grid.open{
  max-height: 999px;            /* alto o suficiente pro conteúdo */
  opacity: 1;
  transform: translateY(0);
}
/* Enxuga o espaço em volta do toggle */
#loc-toggle-row{
  margin: 0;                  /* sem margem extra */
  padding: 0;
}

/* Cancela o gap do grid SÓ entre o toggle e o colapso */
#loc-toggle-row + #loc-collapse{
  margin-top: -1.25rem;       /* mesmo valor do gap do grid */
}

/* Quando o colapso abrir, volta a ficar coladinho (pode ajustar p/ 6~8px) */
#loc-collapse.open{
  margin-top: .0rem;         /* espaçamento mínimo quando aberto */
}


/* Enxuga o espaço em volta do toggle */
#loc-toggle-row{
  margin: 0;                  /* sem margem extra */
  padding: 0;
}

/* Cancela o gap do grid SÓ entre o toggle e o colapso */
#loc-toggle-row + #loc-collapse{
  margin-top: -1.25rem;       /* mesmo valor do gap do grid */
}


#loc-collapse.open{
  margin-top: .25rem;         
}

#page-cadastro .asset-form #loc-toggle-row{
  grid-column: 1 / -1;
  margin: 0;
  padding: 0.25rem 0;
}


#page-cadastro .asset-form #loc-toggle-row + #loc-collapse{
  margin-top: -1.25rem; /* mesmo valor do gap do grid da asset-form */
}

/* Quando o colapso estiver aberto, deixa só um filetinho de respiro (opcional) */
#page-cadastro .asset-form #loc-collapse.open{
  margin-top: .25rem;   /* troque para 0 se quiser colado */
}

/* pill buttons (tipo) */
.pill-group { display:flex; gap:.5rem; flex-wrap:wrap; }
.pill-btn {
  border:1px solid var(--border);
  background: var(--card);
  color: var(--foreground);
  border-radius: 999px;
  padding: .4rem .8rem;
  font-weight: 600;
  transition: .18s ease;
}
.pill-btn:hover { transform: translateY(-1px); }
.pill-btn.is-active {
  background: linear-gradient(135deg, #6d28d9, #9333ea);
  color:#fff; border-color: transparent;
}

/* badges de tipo/prioridade/status */
.badge { display:inline-flex; align-items:center; gap:.35rem; padding:.2rem .6rem; border-radius:999px; font-weight:700; font-size:.75rem; letter-spacing:.02em; }
.badge .dot { width:.45rem; height:.45rem; border-radius:50%; background: currentColor; opacity:.9; }

/* tipos */
.badge-tipo-corretiva  { background:#2a2a2f; color:#f59e0b; }
.badge-tipo-preventiva { background:#1f2a24; color:#10b981; }
.badge-tipo-instalacao { background:#1f2430; color:#60a5fa; }
.badge-tipo-upgrade    { background:#2a1f2a; color:#e879f9; }

/* prioridades */
.badge.prio-baixa  { background:#1f2a24; color:#10b981; }
.badge.prio-media  { background:#2a2a2f; color:#f59e0b; }
.badge.prio-alta   { background:#2a1f1f; color:#ef4444; }

/* estados */
.badge.status-andamento { background:#1f2430; color:#60a5fa; }
.badge.status-aberto    { background:#2a2a2f; color:#d4d4d8; }
.badge.status-critico   { background:#2a1f1f; color:#ef4444; }
.badge.status-fechada   { background:#1f2a24; color:#10b981; }

/* cartão da assistência + fita "Resolvido" */
.assist-card { position:relative; overflow:hidden; border:1px solid var(--border); border-radius:14px; background:var(--card); }
.assist-card.is-closed { opacity:.9; }
.assist-card.is-closed::after{
  content:'RESOLVIDO';
  position:absolute; top:14px; right:-42px;
  transform: rotate(35deg);
  background: linear-gradient(135deg,#16a34a,#22c55e);
  color:#0a0f0a; font-weight:900; letter-spacing:.08em;
  padding:.35rem 2.5rem; box-shadow:0 8px 20px rgba(34,197,94,.25);
}
.assist-card__top { display:flex; align-items:center; justify-content:space-between; padding:10px 12px; border-bottom:1px solid var(--border); }
.assist-badges-left { display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; }
.assist-asset { display:flex; align-items:center; gap:.4rem; font-weight:700; }
.assist-desc  { margin-top:6px; opacity:.9; }
.assist-meta  { display:flex; gap:1rem; flex-wrap:wrap; margin-top:.5rem; opacity:.8; font-size:.9rem; }
.locked-input{ position:relative }
.locked-input .form-input[disabled]{ 
  opacity:.85; cursor:not-allowed; color:#cbd5e1; background:#0f172a; 
}
.locked-input .lock-ico{
  position:absolute; right:.65rem; top:50%; translate:0 -50%; font-size:.9rem; opacity:.75;
}


.file-drop{
  display:flex; gap:.75rem; align-items:center; justify-content:center;
  padding:1.1rem; border:1.5px dashed #475569; border-radius:.75rem;
  background:#0b1220; color:#cbd5e1; cursor:pointer; transition:.15s;
}
.file-drop:hover{ border-color:#7c3aed; background:#0e1628 }
.file-drop:focus{ outline:2px solid #7c3aed; outline-offset:2px }
.file-drop__icon{ font-size:1.25rem }
.file-drop .hint{ font-size:.85rem; opacity:.7 }
.image-preview{ margin-top:.6rem; display:inline-flex; gap:.6rem; align-items:center }
.image-preview .preview-image{
  max-width:160px; max-height:120px; border-radius:.5rem; object-fit:cover; border:1px solid #1f2937;
}
.btn-ghost.sm{ padding:.35rem .6rem; font-size:.85rem }


/* ===== Campo "Responsável" travado ===== */
.locked-input{
  position: relative;
}
.locked-input .form-input[disabled],
.locked-input .form-input[readonly]{
  background: #0f172a;      
  color: #cbd5e1;
  border-color: #1e293b;
  cursor: not-allowed;
  opacity: 1;                 
  padding-right: 2.25rem;     
}
.lock-ico{
  position: absolute;
  right: .6rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: .95rem;
  opacity: .75;
  pointer-events: none;
}
.locked-hint{
  margin-top: .35rem;
  font-size: .85rem;
  color: #94a3b8;
}


/* ===== Modal grid melhorado ===== */
.gm-modal__grid{
  display:grid;
  grid-template-columns: 1.2fr .9fr .8fr;
  gap:16px;
}
.gm-modal__aside .aside-block{ 
  background: rgba(148,163,184,.06);
  border: 1px solid rgba(148,163,184,.12);
  border-radius: 10px;
  padding: 12px;
  margin-bottom: 12px;
}
.kv{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin:.35rem 0; }
.kv-k{ color:#94a3b8; font-size:.9rem; }
.kv-v{ font-weight:600; }

/* responsivo */
@media (max-width: 980px){
  .gm-modal__grid{ grid-template-columns: 1fr; }
}

/* ===== Chips (tipo, prio, status) ===== */
.chip{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.85rem; font-weight:600; padding:.25rem .55rem;
  border-radius:999px; border:1px solid rgba(148,163,184,.18);
  background: rgba(148,163,184,.08); color:#e2e8f0;
}
.chip .dot{ width:.5rem; height:.5rem; border-radius:999px; display:inline-block; }

/* tipo */
.chip--type .dot{ background:#60a5fa; }

/* prioridade */
.chip--prio-baixa .dot { background:#22c55e; }
.chip--prio-media .dot { background:#f59e0b; }
.chip--prio-alta  .dot { background:#ef4444; }

/* status (aproveita seu esquema, aqui só cor de ponto) */
.chip--st-aberto .dot     { background:#60a5fa; }
.chip--st-andamento .dot  { background:#f59e0b; }
.chip--st-fechada .dot    { background:#22c55e; }
.chip--st-critico .dot    { background:#ef4444; }

/* ===== Vínculo anterior ===== */
.prevlink-card{
  padding:.6rem .7rem;
  border-radius:10px;
  background: rgba(148,163,184,.06);
  border:1px dashed rgba(148,163,184,.22);
  font-size:.95rem;
  line-height:1.35rem;
}
.prevlink-card .who{ font-weight:700; }
.prevlink-card .meta{ color:#94a3b8; font-size:.85rem; margin-top:.25rem; }


/* visibilidade previsível das ações do card */
.assist-card__actions{
  display:flex;
  gap:.5rem;
  margin-top:12px;
  align-items:center;
  justify-content:flex-start;
}


/* mostra a barra de ações dos cards de assistência */
.assist-card__actions{
  display:flex;
  gap:.5rem;
  margin-top:.75rem;
  align-items:center;
}
.assist-card__actions .btn-ui{ display:inline-flex; }






/* força a barra de ações aparecer */
.assist-card__actions{
  display: flex !important;
  gap: .5rem;
  margin-top: .75rem;
  align-items: center;
  justify-content: flex-start;
  visibility: visible !important;
  opacity: 1 !important;
}

/* força os botões a serem “botões” */
.assist-card__actions [data-ast-view],
.assist-card__actions [data-ast-close]{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: .55rem .8rem;
  border-radius: .55rem;
  font-weight: 600;
  border: 1px solid hsl(var(--border));
  background: hsl(var(--secondary));
  color: hsl(var(--secondary-foreground));
}

/* a fita não deve bloquear clique em nada */
.assist-card.is-closed::after{ pointer-events: none; }


.assist-card__actions{display:flex;gap:.5rem;margin-top:.75rem}
.assist-card__actions .btn-ui{display:inline-flex}
/* ações sempre visíveis */
.assist-card__actions{display:flex;gap:.5rem;margin-top:.75rem}
.assist-card:hover .assist-card__actions{display:flex}


.assist-card{overflow:visible}


.assist-card__actions[hidden],
.assist-card__actions.is-hidden{display:flex !important; visibility:visible !important; opacity:1 !important}


.assist-tags { display:flex; gap:.5rem; margin-top:.5rem; flex-wrap:wrap; }
.badge { padding:.25rem .5rem; border-radius:999px; font-size:.75rem; }
.badge-tipo-corretiva { background:#eef6ff; color:#0b63ce; }
.badge-tipo-preventiva { background:#effaf3; color:#1d7a37; }
.badge-tipo-instalacao { background:#fff6e5; color:#b26a00; }
.badge-tipo-upgrade { background:#f5eaff; color:#6b2bbf; }
.prio-alta { background:#ffe9e9; color:#b40a0a; }
.prio-media { background:#fff5d6; color:#9a6b00; }
.prio-baixa { background:#edf7ff; color:#0a5aa6; }
.status-aberto { background:#e9f5ff; color:#0a66c2; }
.status-andamento { background:#fff2d6; color:#9a6b00; }
.status-fechada { background:#eaf7ee; color:#1d7a37; }
.status-critico { background:#ffeaea; color:#b40a0a; }


.assist-asset { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.assist-asset-cat { opacity:.8; font-size:.9rem; }


/* === Assistência – CARD FINAL (override) === */
.assist-card{
  position: relative;
  border-radius: 14px;
  padding: 16px 18px;

  /* borda em degradê sem mask */
  border: 1px solid transparent;
  background:
    linear-gradient(180deg, hsl(var(--card)), hsl(240 8% 8%)) padding-box,
    linear-gradient(130deg, hsl(var(--ring) / .30), transparent 60%) border-box;

  box-shadow: 0 10px 25px -10px hsl(240 10% 1% / .45);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
  overflow: visible; /* deixa qualquer glow “vazar” se quiser */
}

.assist-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 44px -18px hsl(240 10% 1% / .6);
}

/* topo mais firme */
.assist-card__top{
  display:flex; align-items:center; justify-content:space-between; gap:.5rem;
  margin-bottom: 8px;
}

/* ID com peso visual */
.assist-id{
  font-weight: 800;
  font-size: 1rem;
  letter-spacing: .02em;
  opacity: .9;
}

/* “Ativo · Categoria” com ícone */
.assist-asset{
  display:flex; align-items:center; gap:.55rem;
  font-weight:700; font-size:1.02rem;
}
.assist-asset .icon{
  width: 20px; height: 20px; opacity:.9;
  filter: drop-shadow(0 0 6px rgba(140,92,255,.28));
}

/* descrição e metadados */
.assist-desc{ margin:8px 0 6px; color:hsl(var(--muted-foreground)); }
.assist-meta{ display:flex; gap:14px; flex-wrap:wrap; font-size:.9rem; opacity:.9; }
.assist-meta .meta{ display:flex; align-items:center; gap:.35rem; }
.assist-meta .icon{ width:18px; height:18px; opacity:.8; }

/* badges com leve brilho (reaproveita suas classes) */
.badge{
  border-radius:999px; padding:.25rem .6rem; font-weight:700; font-size:.74rem;
  border:1px solid hsl(var(--border));
  background:hsl(var(--muted)/.35);
  box-shadow: 0 1px 0 hsl(0 0% 0% / .18) inset;
}

/* barra de ações: sempre visível, botão “de verdade” */
.assist-card__actions{
  display:flex; gap:.5rem; margin-top:.75rem; align-items:center;
}
.assist-card__actions .btn-ui{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.45rem; padding:.5rem .8rem; border-radius:.55rem;
  font-size:.85rem; font-weight:600; letter-spacing:.02em;
  border:1px solid hsl(var(--border));
  background:hsl(var(--secondary));
  color:hsl(var(--secondary-foreground));
  transition: var(--transition-fast);
}
.assist-card__actions .btn-ui:hover{
  background:hsl(var(--secondary-hover));
  transform: translateY(-1px);
}
.assist-card__actions .btn-ui.primary{
  background: var(--gradient-primary); border:none; color:hsl(var(--primary-foreground));
}
.assist-card__actions .btn-ui.danger{
  background: hsl(var(--destructive)); border:none; color:hsl(var(--destructive-foreground));
}


.assist-card.is-closed{ opacity:.95; }
.assist-card.is-closed::after{
  content:'RESOLVIDO';
  position:absolute; top:14px; right:-42px;
  transform: rotate(35deg);
  background: linear-gradient(135deg,#16a34a,#22c55e);
  color:#0a0f0a; font-weight:900; letter-spacing:.08em;
  padding:.35rem 2.5rem; box-shadow:0 8px 20px rgba(34,197,94,.25);
  pointer-events: none;
}


#cad-mode { display: none; }
#page-cadastro #cad-mode { display: flex; }


#page-cadastro[data-cad-mode="maq"] .only-maq { display: block; }
#page-cadastro[data-cad-mode="geral"] .only-maq { display: none; }


#sec-local-datas {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  padding: 1.2rem 1.5rem;
  transition: border-color .25s ease, background .25s ease;
}
#sec-local-datas:hover {
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.05);
}
#sec-local-datas.card-premium {
  padding-top: 1rem;
  padding-bottom: 1rem;
}


#mnt-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
}
#page-manutencao-detalhe .tab-panel { display:none; }
#page-manutencao-detalhe .tab-panel.active { display:block; margin-top:1rem; }
.detail-tabs { display:flex; gap:.5rem; margin-top:1rem; }
.detail-tabs .tab-btn.active { background:var(--primary); color:white; }


.assist-card__actions {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  height: auto !important;
  position: relative !important;
}

.quick-modal {
  position: fixed;
  inset: 0;
  backdrop-filter: blur(3px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9000;
}

.qm-bg {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.55);
}

.qm-box {
  position: relative;
  background: #1b1b1b;
  color: #fff;
  padding: 20px;
  border-radius: 12px;
  width: 360px;
  max-width: 90%;
  z-index: 9999;
}

.qm-close {
  background: #7644ff;
  border: none;
  padding: 10px 18px;
  color: white;
  margin-top: 15px;
  border-radius: 8px;
  cursor: pointer;
}


/* === MODAL DE MANUTENÇÃO - PREMIUM === */

#modal-manut {
    position: fixed !important;
    inset: 0 !important;
    z-index: 999999 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(0,0,0,0.55) !important;
    backdrop-filter: blur(6px) !important;
}

/* quando abre */
#modal-manut:not(.hidden) {
    display: flex !important;
}

/* caixa do modal */
#modal-manut .modal-box {
    background: linear-gradient(180deg, #161616, #0f0f0f);
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 14px;
    padding: 28px;
    width: min(480px, 90%);
    box-shadow: 
        0 18px 60px rgba(0,0,0,.65),
        0 0 0 1px rgba(255,255,255,.06);
    animation: fadeInUp .25s ease-out;
    color: #fff;
}

/* título */
#modal-manut .modal-title {
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: .02em;
}

/* botão fechar */
#modal-manut .modal-close {
    font-size: 1.3rem;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.15);
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: .2s;
}
#modal-manut .modal-close:hover {
    background: rgba(255,255,255,.15);
}

/* linhas */
#modal-manut .modal-row {
    display: flex;
    justify-content: space-between;
    margin-top: 12px;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
#modal-manut .modal-row span:first-child {
    color: #b3b3b3;
}
#modal-manut .modal-row span:last-child {
    color: #fff;
    font-weight: 600;
}

/* animação */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}




#modal-manut.gm-modal {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: none;
}

#modal-manut:not(.hidden) {
    display: flex;
}

#modal-manut .gm-modal__dialog {
    background: var(--card-bg, #111);
    border-radius: 14px;
    padding: 0;
    width: min(480px, 90%);
    animation: fadeInUp .25s ease-out;
}

#modal-manut .gm-modal__header {
    padding: 1.25rem 1.5rem 0.75rem;
    border-bottom: 1px solid rgba(255,255,255,.06);
}

#modal-manut .gm-modal__title h3 {
    font-size: 1.25rem;
    font-weight: 700;
}

#modal-manut .gm-modal__body {
    padding: 1rem 1.5rem;
}

#modal-manut .gm-modal__footer {
    padding: 1rem 1.5rem;
    border-top: 1px solid rgba(255,255,255,.06);
    display: flex;
    justify-content: flex-end;
}


#modal-manut .kv {
    display: flex;
    justify-content: space-between;
    padding: .35rem 0;
    border-bottom: 1px solid rgba(255,255,255,.06);
}
#modal-manut .kv-k {
    color: #aaa;
}
#modal-manut .kv-v {
    font-weight: 600;
}

/* Fechar botão */
#modal-manut .gm-modal__close {
    top: 14px;
    right: 16px;
}


/* estado inicial */
.hide-modal {
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px) scale(0.98);
  transition: opacity .22s ease-out, transform .22s ease-out;
}

/* quando abrir */
.show-modal {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0px) scale(1);
}



.modal-anim {
  transition: opacity .22s ease-out, transform .22s ease-out;
}

.hide-modal {
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px) scale(.97);
}

.show-modal {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

/* Backdrop mais suave e menos pesado */
#modal-manut .gm-modal__backdrop {
  backdrop-filter: blur(3px);
  background: rgba(0,0,0,0.45);
  transition: opacity .25s ease-out;
}

/* botao de devolusaum bonitao */
.btn-grad {
  background: linear-gradient(135deg, #8b5cf6, #c084fc);
  border: none;
  padding: 6px 14px;
  border-radius: 10px;
  font-weight: 600;
  cursor: pointer;
  transition: .2s;
  color: #fff;
  font-size: 0.85rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.btn-grad:hover {
  opacity: .85;
  transform: translateY(-1px);
}

/* ===============================
   MODAL DESVINCULAR ATIVO
   =============================== */

#unlink-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.65);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

#unlink-modal.hidden {
  display: none !important;
}

.unlink-box {
  background: #111;
  padding: 24px;
  width: 480px;
  border-radius: 12px;
  box-shadow: 0 0 30px rgba(0,0,0,0.4);
  animation: fadeIn 0.18s ease-out;
}

#unlink-search {
  width: 100%;
  margin-bottom: 12px;
}

.unlink-item {
  cursor: pointer;
  padding: 10px;
  border-radius: 8px;
}

.unlink-item:hover {
  background: #222;
}

.unlink-item.active {
  background: #4c1d95;
}


.nav-item.nav-hub {
  margin-top: 6px;
}

.nav-item.nav-hub .nav-icon {
  font-size: 16px;
}

.hub-badge {
  margin-left: 6px;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(99,102,241,.25);
  color: #c7d2fe;
}

.hub-hint {
  font-size: 10px;
  color: rgba(255,255,255,.5);
  text-align: center;
  margin-top: 4px;
}




  .rel-grid{
    display:grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap:12px;
  }
  @media (max-width: 980px){
    .rel-grid{ grid-template-columns: 1fr; }
  }
  .rel-card{
    width:100%;
    text-align:left;
    border:1px solid rgba(255,255,255,.08);
    background: rgba(255,255,255,.04);
    border-radius:14px;
    padding:14px;
    cursor:pointer;
    transition: transform .12s ease, background .12s ease, border-color .12s ease;
  }
  .rel-card:hover{
    transform: translateY(-2px);
    background: rgba(255,255,255,.06);
    border-color: rgba(168,85,247,.35);
  }
  .rel-card.is-disabled{
    opacity:.55;
    cursor:not-allowed;
  }
  .rel-card-title{ font-weight:700; font-size:16px; }
  .rel-card-desc{ margin-top:6px; opacity:.8; font-size:13px; line-height:1.25rem; }
  .rel-card-pill{
    margin-top:10px;
    display:inline-block;
    font-size:12px;
    padding:4px 10px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.12);
    background: rgba(0,0,0,.18);
  }

  .rel-toggles{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    align-items:center;
  }
  .toggle{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 12px;
    border-radius:14px;
    border:1px solid rgba(255,255,255,.08);
    background: rgba(255,255,255,.03);
    user-select:none;
  }
  .toggle input{ display:none; }
  .toggle-ui{
    width:44px;
    height:24px;
    border-radius:999px;
    background: rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.10);
    position:relative;
    transition: background .15s ease, border-color .15s ease;
    flex: 0 0 auto;
  }
  .toggle-ui::after{
    content:"";
    width:18px;
    height:18px;
    border-radius:999px;
    background: rgba(255,255,255,.85);
    position:absolute;
    top:50%;
    left:3px;
    transform: translateY(-50%);
    transition: left .15s ease;
  }
  .toggle input:checked + .toggle-ui{
    background: rgba(168,85,247,.35);
    border-color: rgba(168,85,247,.55);
  }
  .toggle input:checked + .toggle-ui::after{
    left:22px;
  }
  .toggle-text{ font-size:13px; opacity:.9; }
/* =========================================================
   RELATÓRIOS — VISUAL POLISH (colar no FINAL do style.css)
   Objetivo: contraste, legibilidade, cards bonitos, layout limpo
========================================================= */

:root{
  --rel-bg0: rgba(0,0,0,.55);
  --rel-bg1: rgba(255,255,255,.06);
  --rel-bg2: rgba(255,255,255,.09);
  --rel-bd: rgba(255,255,255,.12);
  --rel-bd2: rgba(255,255,255,.18);
  --rel-txt: rgba(255,255,255,.92);
  --rel-sub: rgba(255,255,255,.68);
  --rel-mut: rgba(255,255,255,.52);
  --rel-accent: #a855f7;      /* roxo */
  --rel-accent2:#7c3aed;      /* roxo escuro */
  --rel-ok: #22c55e;
  --rel-warn:#f59e0b;
  --rel-danger:#ef4444;
  --rel-radius: 18px;
  --rel-shadow: 0 18px 60px rgba(0,0,0,.55);
  --rel-shadow2: 0 10px 32px rgba(0,0,0,.42);
}

/* base tipografia nessa área (sem ferrar o resto do app) */
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios, #rel-home, #rel-panel){
  color: var(--rel-txt);
  letter-spacing: .2px;
}
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) h1,
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) h2{
  color: var(--rel-txt);
  text-shadow: 0 2px 18px rgba(0,0,0,.55);
}
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) p,
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) small,
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) label{
  color: var(--rel-sub);
}

/* container do bloco de relatórios (aquele card grandão) */
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) :where(.panel, .card, .rel-wrap, .rel-container, .rel-box){
  background:
    radial-gradient(1200px 400px at 20% -20%, rgba(168,85,247,.16), transparent 60%),
    radial-gradient(900px 380px at 90% 0%, rgba(124,58,237,.10), transparent 55%),
    linear-gradient(180deg, var(--rel-bg1), rgba(255,255,255,.03));
  border: 1px solid var(--rel-bd);
  border-radius: var(--rel-radius);
  box-shadow: var(--rel-shadow);
  backdrop-filter: blur(10px);
}

/* ===== LISTA DE CARDS (escolha do relatório) ===== */
:where(#rel-home, .rel-home, #relatorios-home, .relatorios-home){
  display: block;
}

:where(.rel-cards, .reports-grid, .cards-grid, #rel-cards){
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 14px;
  margin-top: 14px;
}

@media (max-width: 1100px){
  :where(.rel-cards, .reports-grid, .cards-grid, #rel-cards){
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }
}
@media (max-width: 720px){
  :where(.rel-cards, .reports-grid, .cards-grid, #rel-cards){
    grid-template-columns: 1fr;
  }
}

/* card individual */
:where(.rel-card, .report-card, .card-report, [data-rel-card]){
  position: relative;
  padding: 16px 16px 14px;
  border-radius: 16px;
  border: 1px solid var(--rel-bd);
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  box-shadow: var(--rel-shadow2);
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
  overflow: hidden;
}

/* brilho suave no topo */
:where(.rel-card, .report-card, .card-report, [data-rel-card])::before{
  content:"";
  position:absolute;
  inset:-1px;
  background:
    radial-gradient(600px 180px at 20% 0%, rgba(168,85,247,.22), transparent 55%),
    radial-gradient(520px 160px at 80% 0%, rgba(124,58,237,.16), transparent 60%);
  opacity: .7;
  pointer-events:none;
}

/* faixa de destaque lateral */
:where(.rel-card, .report-card, .card-report, [data-rel-card])::after{
  content:"";
  position:absolute;
  left:0;
  top:12px;
  bottom:12px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--rel-accent), var(--rel-accent2));
  opacity: .85;
}

:where(.rel-card, .report-card, .card-report, [data-rel-card]):hover{
  transform: translateY(-2px);
  border-color: var(--rel-bd2);
  box-shadow: 0 22px 70px rgba(0,0,0,.62);
}

/* títulos e descrições dentro do card */
:where(.rel-card, .report-card, .card-report, [data-rel-card]) :where(h3, .title){
  position: relative;
  z-index: 1;
  font-size: 15.5px;
  font-weight: 800;
  color: var(--rel-txt);
  margin: 0 0 6px;
}
:where(.rel-card, .report-card, .card-report, [data-rel-card]) :where(p, .desc){
  position: relative;
  z-index: 1;
  margin: 0;
  color: var(--rel-sub);
  font-size: 13px;
  line-height: 1.35;
}

/* chip "PDF" ou tags pequenas */
:where(.rel-chip, .chip, .badge, .tag){
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.25);
  color: var(--rel-sub);
  font-size: 12px;
  font-weight: 700;
}

/* ===== PAINEL DE CONFIGURAÇÃO (quando abre um relatório) ===== */
:where(.rel-panel, #rel-panel, .report-panel, [data-rel-panel]){
  margin-top: 10px;
  border-radius: var(--rel-radius);
  border: 1px solid var(--rel-bd);
  background:
    radial-gradient(1200px 420px at 10% -40%, rgba(168,85,247,.18), transparent 65%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: var(--rel-shadow);
  padding: 16px;
}

/* layout dos filtros (status/setor/categoria/datas) */
:where(.rel-filters, .filters-grid, #rel-filters){
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 12px;
}
@media (max-width: 980px){
  :where(.rel-filters, .filters-grid, #rel-filters){
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }
}
@media (max-width: 680px){
  :where(.rel-filters, .filters-grid, #rel-filters){
    grid-template-columns: 1fr;
  }
}

/* inputs/select/date */
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios)
:where(input[type="text"], input[type="date"], select, textarea){
  width: 100%;
  padding: 11px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.28);
  color: var(--rel-txt);
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios)
:where(input[type="text"], input[type="date"], select, textarea)::placeholder{
  color: rgba(255,255,255,.38);
}

:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios)
:where(input[type="text"], input[type="date"], select, textarea):focus{
  border-color: rgba(247, 246, 249, 0.55);
  box-shadow: 0 0 0 4px rgba(168,85,247,.18);
  background: rgba(0,0,0,.34);
}

/* labels */
:where(.rel-field label, .field label, label){
  font-size: 12px;
  font-weight: 800;
  color: rgba(255,255,255,.72);
  display:block;
  margin-bottom: 6px;
}

/* toggles (se você usa switch) */
:where(.rel-toggle, .toggle, .switch){
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.22);
  border-radius: 999px;
}

/* botões */
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) :where(button, .btn){
  border-radius: 14px;
}
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) .btn-primary,
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) button.primary,
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) #rel-generate,
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) #btn-gerar-pdf{
  background: linear-gradient(135deg, var(--rel-accent), var(--rel-accent2));
  color: #fff;
  border: 1px solid rgba(255,255,255,.12);
  padding: 11px 16px;
  font-weight: 900;
  box-shadow: 0 16px 40px rgba(168,85,247,.22);
  transition: transform .15s ease, filter .15s ease;
}
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) .btn-primary:hover,
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) button.primary:hover,
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) #rel-generate:hover,
:where(#page-relatorios, .page-relatorios, .relatorios, #relatorios) #btn-gerar-pdf:hover{
  transform: translateY(-1px);
  filter: brightness(1.06);
}

/* botão voltar */
:where(#rel-back, .rel-back, #btn-rel-voltar, .btn-rel-voltar){
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.86);
  padding: 10px 14px;
  font-weight: 900;
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
:where(#rel-back, .rel-back, #btn-rel-voltar, .btn-rel-voltar):hover{
  transform: translateY(-1px);
  background: rgba(0,0,0,.36);
  border-color: rgba(255,255,255,.18);
}

/* dica/rodapé */
:where(.rel-hint, .hint, .helptext){
  margin-top: 10px;
  color: rgba(255,255,255,.62);
  font-size: 12px;
}


@media print{
  body{
    background: #fff !important;
    color: #111 !important;
  }
  .no-print{ display:none !important; }
  .print-wrap, .pdf-wrap, .pdf-page{
    box-shadow: none !important;
    border: 0 !important;
    background: #fff !important;
  }
}



.rel-card,
.report-card,
.card-report,
[data-rel-card] {
  color: #ffffff !important;
}

/* títulos */
.rel-card h3,
.rel-card h4,
.rel-card .title,
.report-card h3,
.report-card h4,
.report-card .title,
[data-rel-card] h3,
[data-rel-card] h4,
[data-rel-card] .title {
  color: #ffffff !important;
  font-weight: 800;
}

/* descrições / subtítulos */
.rel-card p,
.rel-card .desc,
.rel-card span,
.report-card p,
.report-card .desc,
.report-card span,
[data-rel-card] p,
[data-rel-card] .desc,
[data-rel-card] span {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* badge / chip tipo "PDF" */
.rel-card .badge,
.rel-card .chip,
.report-card .badge,
.report-card .chip,
[data-rel-card] .badge,
[data-rel-card] .chip {
  color: #ffffff !important;
}


/* ================================
   RELATÓRIOS — UI POLISH (dark/premium)
   Cola no style.css
================================== */

/* Escopo amplo (pra pegar a página de relatórios sem depender 100% de um id específico) */
#page-relatorios, .page-relatorios, [data-page="relatorios"], .relatorios, .reports-page {
  --bg0: #0b0b10;
  --bg1: #10101a;
  --card: rgba(255,255,255,.06);
  --card2: rgba(255,255,255,.08);
  --stroke: rgba(255,255,255,.12);
  --stroke2: rgba(255,255,255,.18);
  --txt: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.68);
  --muted2: rgba(255,255,255,.55);
  --accent: #a855f7; /* roxinho */
  --accent2: #7c3aed;
  --shadow: 0 18px 50px rgba(0,0,0,.55);
}

/* Tipografia geral dentro do bloco de relatórios */
#page-relatorios, .page-relatorios, [data-page="relatorios"], .relatorios, .reports-page {
  color: var(--txt);
}

#page-relatorios h1, #page-relatorios h2, #page-relatorios h3,
.page-relatorios h1, .page-relatorios h2, .page-relatorios h3,
[data-page="relatorios"] h1, [data-page="relatorios"] h2, [data-page="relatorios"] h3,
.relatorios h1, .relatorios h2, .relatorios h3,
.reports-page h1, .reports-page h2, .reports-page h3 {
  color: var(--txt);
  letter-spacing: .2px;
}

#page-relatorios p, .page-relatorios p, [data-page="relatorios"] p, .relatorios p, .reports-page p {
  color: var(--muted);
}

/* ================================
   CARDS (escolha do relatório)
================================== */
.report-card, .relatorio-card, .reports-card, .card-relatorio,
#page-relatorios .card, .page-relatorios .card, .relatorios .card, .reports-page .card {
  background: linear-gradient(180deg, var(--card2), var(--card));
  border: 1px solid var(--stroke);
  border-radius: 18px;
  box-shadow: var(--shadow);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.report-card:hover, .relatorio-card:hover, .reports-card:hover, .card-relatorio:hover,
#page-relatorios .card:hover, .page-relatorios .card:hover, .relatorios .card:hover, .reports-page .card:hover {
  transform: translateY(-2px);
  border-color: rgba(168,85,247,.45);
  background: linear-gradient(180deg, rgba(168,85,247,.14), rgba(255,255,255,.06));
}

/* Texto DENTRO do card: forçar branco/legível */
.report-card *, .relatorio-card *, .reports-card *, .card-relatorio *,
#page-relatorios .card *, .page-relatorios .card *, .relatorios .card *, .reports-page .card * {
  color: var(--txt) !important;
}

.report-card .muted, .relatorio-card .muted, .reports-card .muted, .card-relatorio .muted,
#page-relatorios .card .muted, .page-relatorios .card .muted, .relatorios .card .muted, .reports-page .card .muted {
  color: var(--muted) !important;
}

/* ================================
   SELECT (Status/Setor/Categoria)
   - Corrige dropdown branco + melhora visual
================================== */

/* Caixa do select */
#page-relatorios select,
.page-relatorios select,
[data-page="relatorios"] select,
.relatorios select,
.reports-page select {
  background: rgba(255,255,255,.06);
  color: var(--txt);
  border: 1px solid var(--stroke);
  border-radius: 12px;
  padding: 12px 44px 12px 14px;
  outline: none;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.2);
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

/* Foco roxinho bonito */
#page-relatorios select:focus,
.page-relatorios select:focus,
[data-page="relatorios"] select:focus,
.relatorios select:focus,
.reports-page select:focus {
  border-color: rgba(168,85,247,.55);
  box-shadow: 0 0 0 4px rgba(168,85,247,.18);
  background: rgba(255,255,255,.07);
}

/* Opções do dropdown (em muitos browsers isso já resolve o “fundo branco”) */
#page-relatorios option,
.page-relatorios option,
[data-page="relatorios"] option,
.relatorios option,
.reports-page option {
  background: #0f1020;
  color: #fff;
}

/* Se tiver datalist/inputs */
#page-relatorios input, #page-relatorios textarea,
.page-relatorios input, .page-relatorios textarea,
[data-page="relatorios"] input, [data-page="relatorios"] textarea,
.relatorios input, .relatorios textarea,
.reports-page input, .reports-page textarea {
  background: rgba(255,255,255,.06);
  color: var(--txt);
  border: 1px solid var(--stroke);
  border-radius: 12px;
}

/* Setinha custom do select (sem mexer no HTML) */
#page-relatorios .select-wrap,
.page-relatorios .select-wrap,
[data-page="relatorios"] .select-wrap,
.relatorios .select-wrap,
.reports-page .select-wrap {
  position: relative;
}

#page-relatorios .select-wrap::after,
.page-relatorios .select-wrap::after,
[data-page="relatorios"] .select-wrap::after,
.relatorios .select-wrap::after,
.reports-page .select-wrap::after {
  content: "▾";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(255,255,255,.65);
  pointer-events: none;
  font-size: 14px;
}

/* Se você NÃO tem .select-wrap, pelo menos garante padding-right */
#page-relatorios select,
.page-relatorios select,
[data-page="relatorios"] select,
.relatorios select,
.reports-page select {
  background-image: linear-gradient(transparent, transparent);
}

/* ================================
   “Checkbox opcionais” -> switches premium
================================== */

/* Container das opções (se existir algum wrapper) */
.report-options, .relatorio-opcoes, .opts-row, .filters-extra, .report-extras {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 12px;
}

/* Cardzinho de cada opção (label) */
.report-options label,
.relatorio-opcoes label,
.opts-row label,
.filters-extra label,
.report-extras label,
#page-relatorios .toggle,
.page-relatorios .toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid var(--stroke);
  background: rgba(255,255,255,.05);
  color: var(--txt);
  user-select: none;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}

.report-options label:hover,
.relatorio-opcoes label:hover,
.opts-row label:hover,
.filters-extra label:hover,
.report-extras label:hover,
#page-relatorios .toggle:hover,
.page-relatorios .toggle:hover {
  border-color: rgba(168,85,247,.35);
  background: rgba(168,85,247,.10);
  transform: translateY(-1px);
}

/* Se teus checkboxes forem “crus” (input checkbox normal), transforma em switch */
#page-relatorios input[type="checkbox"],
.page-relatorios input[type="checkbox"],
[data-page="relatorios"] input[type="checkbox"],
.relatorios input[type="checkbox"],
.reports-page input[type="checkbox"] {
  width: 42px;
  height: 24px;
  border-radius: 999px;
  border: 1px solid var(--stroke2);
  background: rgba(255,255,255,.10);
  position: relative;
  outline: none;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease;
  flex: 0 0 auto;
}

/* “bolinha” do switch */
#page-relatorios input[type="checkbox"]::after,
.page-relatorios input[type="checkbox"]::after,
[data-page="relatorios"] input[type="checkbox"]::after,
.relatorios input[type="checkbox"]::after,
.reports-page input[type="checkbox"]::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  transform: translateY(-50%);
  background: rgba(255,255,255,.82);
  box-shadow: 0 6px 16px rgba(0,0,0,.45);
  transition: left .18s ease, background .18s ease;
}

/* ligado */
#page-relatorios input[type="checkbox"]:checked,
.page-relatorios input[type="checkbox"]:checked,
[data-page="relatorios"] input[type="checkbox"]:checked,
.relatorios input[type="checkbox"]:checked,
.reports-page input[type="checkbox"]:checked {
  background: rgba(168,85,247,.40);
  border-color: rgba(168,85,247,.65);
  box-shadow: 0 0 0 4px rgba(168,85,247,.14);
}

#page-relatorios input[type="checkbox"]:checked::after,
.page-relatorios input[type="checkbox"]:checked::after,
[data-page="relatorios"] input[type="checkbox"]:checked::after,
.relatorios input[type="checkbox"]:checked::after,
.reports-page input[type="checkbox"]:checked::after {
  left: 21px;
  background: #fff;
}

/* Texto da opção (forçar branco) */
#page-relatorios label,
.page-relatorios label,
[data-page="relatorios"] label,
.relatorios label,
.reports-page label {
  color: var(--txt);
}
#page-relatorios label small,
.page-relatorios label small,
[data-page="relatorios"] label small,
.relatorios label small,
.reports-page label small {
  color: var(--muted);
}

/* ================================
   Botão (Gerar PDF / Voltar)
================================== */
#page-relatorios button, .page-relatorios button, [data-page="relatorios"] button, .relatorios button, .reports-page button {
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
}

#page-relatorios .btn-primary, .page-relatorios .btn-primary,
#page-relatorios button.primary, .page-relatorios button.primary,
#page-relatorios button[type="submit"], .page-relatorios button[type="submit"],
.relatorios button[type="submit"], .reports-page button[type="submit"] {
  background: linear-gradient(180deg, rgba(168,85,247,.95), rgba(124,58,237,.92));
  color: #fff;
  box-shadow: 0 14px 35px rgba(168,85,247,.22);
  border-color: rgba(168,85,247,.35);
}

#page-relatorios .btn-primary:hover, .page-relatorios .btn-primary:hover,
#page-relatorios button.primary:hover, .page-relatorios button.primary:hover,
#page-relatorios button[type="submit"]:hover, .page-relatorios button[type="submit"]:hover {
  filter: brightness(1.06);
}

#page-relatorios .btn-ghost, .page-relatorios .btn-ghost,
#page-relatorios .btn-back, .page-relatorios .btn-back,
#page-relatorios button.back, .page-relatorios button.back {
  background: rgba(255,255,255,.06);
  color: #fff;
}

/* Dica/legenda */
#page-relatorios .hint, .page-relatorios .hint, [data-page="relatorios"] .hint, .relatorios .hint, .reports-page .hint {
  color: var(--muted2);
}

/* =====================================================
   PATCH: aplica o mesmo resumo premium na Manutenção Lvl.2
   ===================================================== */

#page-maquina #tab-maq-resumo .form-grid {
  grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr);
  gap: 1.25rem;
  align-items: start;
}

#page-maquina #tab-maq-resumo .form-section {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  background:
    radial-gradient(circle at 12% 0%, hsl(var(--primary) / .12), transparent 34%),
    linear-gradient(135deg, hsl(240 10% 6%), hsl(240 8% 8%));
  border: 1px solid hsl(var(--border));
  box-shadow:
    0 18px 45px -28px rgba(0,0,0,.75),
    inset 0 1px 0 rgba(255,255,255,.04);
}

#page-maquina #tab-maq-resumo .form-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(255,255,255,.045), transparent 36%),
    radial-gradient(circle at 100% 0%, rgba(168,85,247,.10), transparent 28%);
  opacity: .9;
}

#page-maquina #tab-maq-resumo .form-section-title {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: .55rem;
  font-size: 1.05rem;
  letter-spacing: .01em;
  margin-bottom: 1rem;
}

#page-maquina #tab-maq-resumo .form-section-title::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: hsl(var(--primary));
  box-shadow: 0 0 16px hsl(var(--primary) / .65);
}

#maq-cadastro.atv-info-grid,
#maq-status.atv-info-grid {
  position: relative;
  z-index: 1;
  display: grid !important;
  gap: .75rem !important;
  max-height: none !important;
  overflow: visible !important;
  padding-right: 0 !important;
}

#maq-cadastro.atv-info-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#maq-status.atv-info-grid {
  grid-template-columns: 1fr;
}

@media (max-width: 1100px) {
  #page-maquina #tab-maq-resumo .form-grid {
    grid-template-columns: 1fr;
  }

  #maq-cadastro.atv-info-grid,
  #maq-status.atv-info-grid {
    grid-template-columns: 1fr;
  }
}


#page-ativo #tab-resumo .form-grid {
  grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr);
  gap: 1.25rem;
  align-items: start;
}

#page-ativo #tab-resumo .form-section {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  background:
    radial-gradient(circle at 12% 0%, hsl(var(--primary) / .12), transparent 34%),
    linear-gradient(135deg, hsl(240 10% 6%), hsl(240 8% 8%));
  border: 1px solid hsl(var(--border));
  box-shadow:
    0 18px 45px -28px rgba(0,0,0,.75),
    inset 0 1px 0 rgba(255,255,255,.04);
}

#page-ativo #tab-resumo .form-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(255,255,255,.045), transparent 36%),
    radial-gradient(circle at 100% 0%, rgba(168,85,247,.10), transparent 28%);
  opacity: .9;
}

#page-ativo #tab-resumo .form-section-title {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: .55rem;
  font-size: 1.05rem;
  letter-spacing: .01em;
  margin-bottom: 1rem;
}

#page-ativo #tab-resumo .form-section-title::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: hsl(var(--primary));
  box-shadow: 0 0 16px hsl(var(--primary) / .65);
}

.atv-info-grid {
  position: relative;
  z-index: 1;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem !important;
  max-height: none !important;
  overflow: visible !important;
  padding-right: 0 !important;
}

#atv-status.atv-info-grid {
  grid-template-columns: 1fr;
}

.atv-info-item {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-height: 72px;
  padding: .85rem .95rem;
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.022));
  border: 1px solid rgba(255,255,255,.075);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 10px 28px -22px rgba(0,0,0,.8);
  transition:
    transform .16s ease,
    border-color .16s ease,
    background .16s ease,
    box-shadow .16s ease;
}

.atv-info-item:hover {
  transform: translateY(-1px);
  border-color: hsl(var(--primary) / .36);
  background:
    linear-gradient(180deg, rgba(168,85,247,.09), rgba(255,255,255,.028));
  box-shadow:
    0 0 0 1px hsl(var(--primary) / .12),
    0 16px 36px -24px hsl(var(--primary) / .45);
}

.atv-info-icon {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: hsl(var(--primary));
  background: hsl(var(--primary) / .10);
  border: 1px solid hsl(var(--primary) / .18);
  font-size: .95rem;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

.atv-info-body {
  min-width: 0;
}

.atv-info-label {
  color: hsl(var(--muted-foreground));
  font-size: .73rem;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
  margin-bottom: .18rem;
}

.atv-info-value {
  color: hsl(var(--foreground));
  font-size: .95rem;
  font-weight: 700;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.atv-info-value .status-badge {
  font-size: .76rem;
  font-weight: 800;
}

.atv-info-separator {
  grid-column: 1 / -1;
  list-style: none;
  display: flex;
  align-items: center;
  gap: .75rem;
  margin: .35rem 0 .15rem;
  color: hsl(var(--primary));
  font-size: .8rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.atv-info-separator::before,
.atv-info-separator::after {
  content: "";
  height: 1px;
  flex: 1;
  background: linear-gradient(90deg, transparent, hsl(var(--primary) / .35), transparent);
}

.atv-info-separator::before {
  flex: .35;
}

@media (max-width: 1100px) {
  #page-ativo #tab-resumo .form-grid {
    grid-template-columns: 1fr;
  }

  .atv-info-grid {
    grid-template-columns: 1fr;
  }
}


/* =====================================================
   CADASTRO V2 — LIMPO, FUNCIONAL E PROFISSIONAL
   Override total da tela de cadastro antiga
   ===================================================== */

#page-cadastro.cad-v2 {
  --cad-bg: rgba(255,255,255,.035);
  --cad-bg-2: rgba(255,255,255,.055);
  --cad-border: rgba(255,255,255,.085);
  --cad-border-strong: rgba(168,85,247,.38);
  --cad-text-soft: hsl(var(--muted-foreground));
}

#page-cadastro.cad-v2 .cad-shell {
  width: min(1180px, calc(100vw - 72px));
  margin: 0 auto;
  padding: 1.5rem 0 2.5rem;
}

#page-cadastro.cad-v2 .cad-topbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 1.25rem;
  margin-bottom: 1rem;
}

#page-cadastro.cad-v2 .cad-title-wrap {
  min-width: 0;
}

#page-cadastro.cad-v2 .cad-eyebrow {
  display: inline-flex;
  margin-bottom: .35rem;
  color: hsl(var(--primary));
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

#page-cadastro.cad-v2 .page-title {
  font-size: clamp(1.75rem, 2.4vw, 2.45rem);
  line-height: 1;
  margin-bottom: .45rem;
}

#page-cadastro.cad-v2 .page-subtitle {
  max-width: 740px;
  color: var(--cad-text-soft);
  font-size: .94rem;
}

/* mata efeitos antigos exagerados */
#page-cadastro.cad-v2 .page-header,
#page-cadastro.cad-v2 .page-header::after,
#page-cadastro.cad-v2 .form-section::after,
#page-cadastro.cad-v2 .asset-form::before,
#page-cadastro.cad-v2 .form-section-title::before,
#page-cadastro.cad-v2 #sec-info-basicas .form-section-title::before,
#page-cadastro.cad-v2 #sec-local-datas .form-section-title::before,
#page-cadastro.cad-v2 #sec-info-adicionais .form-section-title::before,
#page-cadastro.cad-v2 #extra-maquinas .form-section-title::before,
#page-cadastro.cad-v2 #sec-imagem-ativo .form-section-title::before,
#page-cadastro.cad-v2 #sec-status-inicial .form-section-title::before {
  content: none !important;
  display: none !important;
}

/* seletor de tipo */
#page-cadastro.cad-v2 #cad-mode.cad-mode-clean {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem !important;
  margin: 0 0 1rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#page-cadastro.cad-v2 .cad-choice {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: .8rem;

  min-height: 76px;
  padding: .95rem 1rem;
  border-radius: 16px;

  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.020));
  border: 1px solid var(--cad-border);
  color: hsl(var(--foreground));
  text-align: left;
  cursor: pointer;

  transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

#page-cadastro.cad-v2 .cad-choice:hover {
  transform: translateY(-1px);
  border-color: rgba(168,85,247,.28);
  background: linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.025));
}

#page-cadastro.cad-v2 .cad-choice.primary,
#page-cadastro.cad-v2 .cad-choice.is-active {
  border-color: var(--cad-border-strong);
  background:
    linear-gradient(180deg, rgba(168,85,247,.135), rgba(255,255,255,.030));
  box-shadow:
    0 0 0 1px rgba(168,85,247,.13),
    0 18px 40px -34px rgba(168,85,247,.65);
}

#page-cadastro.cad-v2 .cad-choice-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: rgba(168,85,247,.12);
  border: 1px solid rgba(168,85,247,.18);
}

#page-cadastro.cad-v2 .cad-choice strong {
  display: block;
  color: hsl(var(--foreground));
  font-size: .92rem;
  font-weight: 850;
  margin-bottom: .1rem;
}

#page-cadastro.cad-v2 .cad-choice small {
  display: block;
  color: var(--cad-text-soft);
  font-size: .76rem;
  line-height: 1.35;
}

/* layout do form */
#page-cadastro.cad-v2 .cad-form-v2 {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}

@media (min-width: 1080px) {
  #page-cadastro.cad-v2 .cad-form-v2 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 1rem;
    align-items: start;
  }

  #page-cadastro.cad-v2 .cad-main-column {
    grid-column: 1;
    display: grid;
    gap: 1rem;
  }

  #page-cadastro.cad-v2 .cad-side-column {
    grid-column: 2;
    display: grid;
    gap: 1rem;
    position: sticky;
    top: 1rem;
  }

  #page-cadastro.cad-v2 .cad-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 1079px) {
  #page-cadastro.cad-v2 .cad-form-v2,
  #page-cadastro.cad-v2 .cad-main-column,
  #page-cadastro.cad-v2 .cad-side-column {
    display: grid !important;
    gap: 1rem;
  }
}

/* seções */
#page-cadastro.cad-v2 .cad-section,
#page-cadastro.cad-v2 #extra-maquinas {
  position: relative;
  overflow: hidden;
  margin: 0 !important;
  padding: 1.15rem !important;
  border-radius: 18px !important;
  border: 1px solid var(--cad-border) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(168,85,247,.075), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.018)) !important;
  box-shadow:
    0 18px 42px -36px rgba(0,0,0,.88),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
}

#page-cadastro.cad-v2 #extra-maquinas.hidden {
  display: none !important;
}

#page-cadastro.cad-v2 #extra-maquinas {
  grid-column: 1;
  border-color: rgba(168,85,247,.22) !important;
}

#page-cadastro.cad-v2 .cad-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .95rem;
}

#page-cadastro.cad-v2 .form-section-title {
  margin: 0 0 .15rem !important;
  color: hsl(var(--foreground));
  font-size: 1rem !important;
  font-weight: 850 !important;
  letter-spacing: -.01em;
}

#page-cadastro.cad-v2 .cad-section-head p {
  color: var(--cad-text-soft);
  font-size: .8rem;
  line-height: 1.4;
}

#page-cadastro.cad-v2 .cad-required {
  flex: 0 0 auto;
  padding: .25rem .55rem;
  border-radius: 999px;
  background: rgba(168,85,247,.12);
  border: 1px solid rgba(168,85,247,.20);
  color: hsl(var(--primary));
  font-size: .68rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .055em;
}

/* grids */
#page-cadastro.cad-v2 .form-grid {
  display: grid !important;
  gap: .85rem !important;
}

#page-cadastro.cad-v2 .cad-grid-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#page-cadastro.cad-v2 .cad-grid-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

#page-cadastro.cad-v2 .cad-span-2 {
  grid-column: span 2;
}

@media (max-width: 900px) {
  #page-cadastro.cad-v2 .cad-grid-3,
  #page-cadastro.cad-v2 .cad-grid-4 {
    grid-template-columns: 1fr;
  }

  #page-cadastro.cad-v2 .cad-span-2 {
    grid-column: auto;
  }

  #page-cadastro.cad-v2 #cad-mode.cad-mode-clean {
    grid-template-columns: 1fr;
  }
}

/* campos */
#page-cadastro.cad-v2 .form-label {
  margin-bottom: .38rem !important;
  color: rgba(255,255,255,.78) !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
  letter-spacing: .045em;
  text-transform: uppercase;
}

#page-cadastro.cad-v2 .form-input,
#page-cadastro.cad-v2 .form-select,
#page-cadastro.cad-v2 .form-textarea {
  min-height: 42px;
  border-radius: 12px !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  color: hsl(var(--foreground)) !important;
  box-shadow: none !important;
}

#page-cadastro.cad-v2 .form-textarea {
  min-height: 92px;
}

#page-cadastro.cad-v2 .form-input:focus,
#page-cadastro.cad-v2 .form-select:focus,
#page-cadastro.cad-v2 .form-textarea:focus {
  transform: none !important;
  border-color: rgba(168,85,247,.55) !important;
  box-shadow: 0 0 0 3px rgba(168,85,247,.12) !important;
}

#page-cadastro.cad-v2 .form-input::placeholder,
#page-cadastro.cad-v2 .form-textarea::placeholder {
  color: rgba(255,255,255,.28);
}

/* upload */
#page-cadastro.cad-v2 #sec-imagem-ativo .image-upload-area {
  min-height: 190px !important;
  border-radius: 16px !important;
  border: 1px dashed rgba(168,85,247,.32) !important;
  background: rgba(255,255,255,.025) !important;
}

#page-cadastro.cad-v2 #sec-imagem-ativo .image-upload-area:hover {
  border-color: rgba(168,85,247,.58) !important;
  background: rgba(168,85,247,.055) !important;
}

#page-cadastro.cad-v2 .upload-text {
  color: hsl(var(--foreground));
  font-weight: 800;
}

#page-cadastro.cad-v2 .upload-hint {
  font-size: .76rem;
}

/* card de ajuda */
#page-cadastro.cad-v2 .cad-help-card {
  padding: 1rem;
  border-radius: 16px;
  background: rgba(255,255,255,.028);
  border: 1px solid rgba(255,255,255,.070);
}

#page-cadastro.cad-v2 .cad-help-card strong {
  display: block;
  margin-bottom: .35rem;
  font-size: .88rem;
}

#page-cadastro.cad-v2 .cad-help-card p {
  color: var(--cad-text-soft);
  font-size: .78rem;
  line-height: 1.45;
}

/* checkbox imobilizado */
#page-cadastro.cad-v2 .cad-check-row {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .85rem;
  border-radius: 14px;
  background: rgba(255,255,255,.030);
  border: 1px solid rgba(255,255,255,.075);
  cursor: pointer;
}

#page-cadastro.cad-v2 .cad-check-row input {
  width: 18px;
  height: 18px;
  accent-color: hsl(var(--primary));
}

#page-cadastro.cad-v2 .cad-check-row strong {
  display: block;
  font-size: .86rem;
}

#page-cadastro.cad-v2 .cad-check-row small {
  display: block;
  color: var(--cad-text-soft);
  font-size: .76rem;
}

/* ações */
#page-cadastro.cad-v2 .cad-actions {
  display: flex !important;
  justify-content: flex-end !important;
  gap: .75rem !important;
  margin-top: 0 !important;
  padding: 1rem 0 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  position: static !important;
  backdrop-filter: none !important;
}

#page-cadastro.cad-v2 .cad-actions .btn-secondary,
#page-cadastro.cad-v2 .cad-actions .btn-premium {
  min-height: 42px;
  border-radius: 12px;
  font-weight: 850;
}

@media (max-width: 700px) {
  #page-cadastro.cad-v2 .cad-shell {
    width: min(100%, calc(100vw - 28px));
    padding-top: 1rem;
  }

  #page-cadastro.cad-v2 .cad-topbar {
    grid-template-columns: 1fr;
  }

  #page-cadastro.cad-v2 .cad-actions {
    flex-direction: column;
  }
}


/* =====================================================
   GM ATIVOS — REBRAND PROFISSIONAL
   Grafite / azul técnico / ciano discreto
   ===================================================== */

:root {
  --background: 222 35% 5%;
  --foreground: 210 40% 98%;

  --card: 222 30% 8%;
  --card-foreground: 210 40% 98%;

  --popover: 222 30% 8%;
  --popover-foreground: 210 40% 98%;

  --primary: 213 94% 62%;
  --primary-foreground: 210 40% 98%;
  --primary-hover: 199 95% 64%;
  --primary-dark: 217 91% 48%;

  --secondary: 222 22% 12%;
  --secondary-foreground: 210 40% 96%;
  --secondary-hover: 222 22% 16%;

  --muted: 222 18% 13%;
  --muted-foreground: 215 18% 68%;

  --accent: 217 24% 15%;
  --accent-foreground: 210 40% 96%;

  --border: 217 20% 18%;
  --input: 222 24% 11%;
  --ring: 199 95% 64%;

  --gradient-primary: linear-gradient(135deg, #2563eb 0%, #0891b2 100%);
  --gradient-card: linear-gradient(145deg, #0b1220 0%, #0f172a 48%, #111827 100%);
  --gradient-surface: linear-gradient(145deg, rgba(15,23,42,.92), rgba(17,24,39,.92));

  --shadow-card: 0 16px 40px -28px rgba(0,0,0,.9);
  --shadow-elevation: 0 22px 55px -30px rgba(8,145,178,.45);
  --shadow-premium: 0 30px 80px -45px rgba(37,99,235,.55);
}

body {
  background:
    radial-gradient(circle at 18% -10%, rgba(37,99,235,.16), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(8,145,178,.12), transparent 32%),
    linear-gradient(180deg, #070b12 0%, #0b0f17 100%) !important;
}

.text-gradient {
  background: linear-gradient(135deg, #e5f3ff 0%, #60a5fa 45%, #22d3ee 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* sidebar mais empresa, menos roxo */
.sidebar {
  background:
    linear-gradient(180deg, rgba(10,15,25,.98), rgba(7,11,18,.98)) !important;
  border-right: 1px solid rgba(148,163,184,.12) !important;
}

.nav-item.active {
  background: linear-gradient(135deg, rgba(37,99,235,.95), rgba(8,145,178,.90)) !important;
  box-shadow:
    0 10px 26px -18px rgba(34,211,238,.55),
    inset 0 1px 0 rgba(255,255,255,.12);
}

.nav-hub {
  background: rgba(37,99,235,.10) !important;
  border: 1px solid rgba(96,165,250,.22) !important;
}

/* botões globais mais técnicos */
.btn-premium,
.btn-ui.primary {
  background: linear-gradient(135deg, #2563eb, #0891b2) !important;
  box-shadow:
    0 14px 30px -20px rgba(34,211,238,.75),
    inset 0 1px 0 rgba(255,255,255,.14);
}

.btn-premium:hover,
.btn-ui.primary:hover {
  box-shadow:
    0 18px 38px -18px rgba(34,211,238,.70),
    0 0 0 1px rgba(34,211,238,.18);
}


/* =====================================================
   CADASTRO — SELETOR DE TIPO COM LIGHT BUTTON
   Adaptado do Uiverse para Ativo Geral / Máquina
   ===================================================== */

#page-cadastro #cad-mode.asset-type-stage {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
  gap: 1rem !important;
  margin: 1rem 0 1.25rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#page-cadastro .asset-type-light {
  --type-accent: #38bdf8;
  --type-accent-2: #2563eb;

  position: relative;
  min-height: 170px;

  display: flex;
  align-items: flex-end;
  justify-content: center;

  background: transparent;
  border: 0;
  outline: none;
  cursor: pointer;
  isolation: isolate;
}

#page-cadastro .asset-type-light:nth-child(2) {
  --type-accent: #22d3ee;
  --type-accent-2: #0f766e;
}

#page-cadastro .asset-type-beam {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  pointer-events: none;
  z-index: 1;
}

#page-cadastro .asset-type-dot {
  position: absolute;
  top: 0;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #0f172a;
  border: 1px solid rgba(148,163,184,.18);
  box-shadow:
    0 0 0 4px rgba(15,23,42,.70),
    0 0 22px rgba(34,211,238,0);
  transition: .28s ease;
  z-index: 2;
}

#page-cadastro .asset-type-lightcone {
  position: absolute;
  top: 6px;
  width: 190px;
  height: 150px;
  clip-path: polygon(50% 0%, 18% 100%, 82% 100%);
  background: linear-gradient(
    180deg,
    rgba(56,189,248,0) 0%,
    rgba(56,189,248,0) 100%
  );
  opacity: 0;
  filter: blur(.2px);
  transition: opacity .28s ease, background .28s ease;
}

#page-cadastro .asset-type-card {
  position: relative;
  z-index: 3;

  width: 100%;
  min-height: 106px;

  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  gap: .95rem;

  padding: 1rem 1.05rem;
  border-radius: 18px;

  background:
    linear-gradient(180deg, rgba(15,23,42,.92), rgba(2,6,23,.88));
  border: 1px solid rgba(148,163,184,.14);
  color: #94a3b8;

  box-shadow:
    0 18px 42px -34px rgba(0,0,0,.95),
    inset 0 1px 0 rgba(255,255,255,.045);

  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease,
    color .22s ease,
    background .22s ease;
}

#page-cadastro .asset-type-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;

  border-radius: 16px;
  color: #64748b;
  background: rgba(15,23,42,.85);
  border: 1px solid rgba(148,163,184,.12);

  transition:
    color .22s ease,
    border-color .22s ease,
    background .22s ease,
    box-shadow .22s ease,
    transform .22s ease;
}

#page-cadastro .asset-type-icon svg {
  width: 30px;
  height: 30px;
}

#page-cadastro .asset-type-info {
  display: grid;
  gap: .22rem;
  text-align: left;
  min-width: 0;
}

#page-cadastro .asset-type-info strong {
  color: #e5e7eb;
  font-size: .98rem;
  font-weight: 850;
  letter-spacing: -.01em;
}

#page-cadastro .asset-type-info small {
  color: #94a3b8;
  font-size: .78rem;
  line-height: 1.35;
}

/* hover */
#page-cadastro .asset-type-light:hover .asset-type-dot {
  background: var(--type-accent);
  box-shadow:
    0 0 0 4px rgba(15,23,42,.72),
    0 0 28px color-mix(in srgb, var(--type-accent) 70%, transparent);
}

#page-cadastro .asset-type-light:hover .asset-type-lightcone {
  opacity: .72;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--type-accent) 82%, transparent) 0%,
    rgba(255,255,255,.10) 44%,
    rgba(255,255,255,0) 100%
  );
}

#page-cadastro .asset-type-light:hover .asset-type-card {
  transform: translateY(-3px);
  color: var(--type-accent);
  border-color: color-mix(in srgb, var(--type-accent) 55%, transparent);
  box-shadow:
    0 24px 50px -30px color-mix(in srgb, var(--type-accent) 65%, transparent),
    0 0 0 1px color-mix(in srgb, var(--type-accent) 16%, transparent),
    inset 0 1px 0 rgba(255,255,255,.08);
}

#page-cadastro .asset-type-light:hover .asset-type-icon {
  color: var(--type-accent);
  border-color: color-mix(in srgb, var(--type-accent) 38%, transparent);
  background: color-mix(in srgb, var(--type-accent) 12%, #0f172a);
  box-shadow: 0 0 24px -10px color-mix(in srgb, var(--type-accent) 70%, transparent);
  transform: scale(1.04);
}

/* ativo selecionado */
#page-cadastro .asset-type-light.primary .asset-type-dot,
#page-cadastro .asset-type-light.is-active .asset-type-dot {
  background: var(--type-accent);
  box-shadow:
    0 0 0 4px rgba(15,23,42,.72),
    0 0 30px color-mix(in srgb, var(--type-accent) 72%, transparent);
}

#page-cadastro .asset-type-light.primary .asset-type-lightcone,
#page-cadastro .asset-type-light.is-active .asset-type-lightcone {
  opacity: .58;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--type-accent) 68%, transparent) 0%,
    rgba(255,255,255,.075) 45%,
    rgba(255,255,255,0) 100%
  );
}

#page-cadastro .asset-type-light.primary .asset-type-card,
#page-cadastro .asset-type-light.is-active .asset-type-card {
  color: var(--type-accent);
  border-color: color-mix(in srgb, var(--type-accent) 58%, transparent);
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--type-accent) 16%, transparent), transparent 38%),
    linear-gradient(180deg, rgba(15,23,42,.96), rgba(2,6,23,.92));
  box-shadow:
    0 26px 55px -34px color-mix(in srgb, var(--type-accent) 70%, transparent),
    0 0 0 1px color-mix(in srgb, var(--type-accent) 18%, transparent),
    inset 0 1px 0 rgba(255,255,255,.09);
}

#page-cadastro .asset-type-light.primary .asset-type-icon,
#page-cadastro .asset-type-light.is-active .asset-type-icon {
  color: var(--type-accent);
  background: color-mix(in srgb, var(--type-accent) 13%, #0f172a);
  border-color: color-mix(in srgb, var(--type-accent) 34%, transparent);
}


#page-cadastro .cad-choice,
#page-cadastro .cad-choice.primary,
#page-cadastro .cad-choice.is-active {
  all: unset;
}

/* responsivo */
@media (max-width: 860px) { 
  #page-cadastro #cad-mode.asset-type-stage {
    grid-template-columns: 1fr !important;
  }

  #page-cadastro .asset-type-light {
    min-height: 145px;
  }

  #page-cadastro .asset-type-lightcone {
    height: 125px;
  }
}


/* =====================================================
   CADASTRO — REFINO DOS BOTÕES DE TIPO
   versão mais clean / menor / dark-luxury / senior
   cola NO FINAL do styles.css
   ===================================================== */

#page-cadastro #cad-mode.asset-type-stage {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(280px, 360px)) !important;
  justify-content: start !important;
  align-items: end !important;
  gap: 1rem !important;

  max-width: 760px !important;
  margin: 1rem 0 1.4rem !important;
  padding: 0 !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#page-cadastro .asset-type-light {
  --type-accent: #38bdf8;
  --type-accent-2: #2563eb;

  position: relative;
  min-height: 128px !important;

  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;

  background: transparent !important;
  border: 0 !important;
  outline: none !important;
  cursor: pointer !important;
  isolation: isolate;
  padding: 0 !important;
}

#page-cadastro .asset-type-light:nth-child(2) {
  --type-accent: #22d3ee;
  --type-accent-2: #0ea5a4;
}

#page-cadastro .asset-type-beam {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  pointer-events: none;
  z-index: 1;
}

#page-cadastro .asset-type-dot {
  position: absolute;
  top: 0;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #1e293b;
  border: 1px solid rgba(148, 163, 184, 0.18);
  box-shadow:
    0 0 0 4px rgba(2, 6, 23, 0.75),
    0 0 18px rgba(34, 211, 238, 0.08);
  transition: .22s ease;
  z-index: 2;
}

#page-cadastro .asset-type-lightcone {
  position: absolute;
  top: 8px;
  width: 128px;
  height: 96px;
  clip-path: polygon(50% 0%, 26% 100%, 74% 100%);
  background: linear-gradient(
    180deg,
    rgba(56, 189, 248, 0.18) 0%,
    rgba(56, 189, 248, 0.08) 40%,
    rgba(255, 255, 255, 0) 100%
  );
  opacity: .16;
  filter: blur(.4px);
  transition: opacity .22s ease, background .22s ease, transform .22s ease;
}

#page-cadastro .asset-type-card {
  position: relative;
  z-index: 3;

  width: 100%;
  max-width: 360px;
  min-height: 82px;

  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: .85rem;

  padding: .9rem 1rem;
  border-radius: 16px;

  background:
    linear-gradient(180deg, rgba(7, 12, 22, 0.96), rgba(3, 8, 18, 0.96));
  border: 1px solid rgba(92, 111, 138, 0.16);
  color: #8292a8;

  box-shadow:
    0 18px 36px -32px rgba(0,0,0,.96),
    inset 0 1px 0 rgba(255,255,255,.03);

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease,
    color .18s ease;
}

#page-cadastro .asset-type-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;

  border-radius: 14px;
  color: #6f849e;
  background: linear-gradient(180deg, rgba(15, 23, 42, .88), rgba(15, 23, 42, .72));
  border: 1px solid rgba(148, 163, 184, 0.12);

  transition:
    color .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

#page-cadastro .asset-type-icon svg {
  width: 24px;
  height: 24px;
}

#page-cadastro .asset-type-info {
  display: grid;
  gap: .16rem;
  text-align: left;
  min-width: 0;
}

#page-cadastro .asset-type-info strong {
  color: #e8eef7;
  font-size: .94rem;
  font-weight: 800;
  letter-spacing: -.01em;
}

#page-cadastro .asset-type-info small {
  color: #8090a6;
  font-size: .75rem;
  line-height: 1.35;
}

/* ---------------------------------
   ESTADO NÃO SELECIONADO
   escuro, elegante, mas com "luz"
---------------------------------- */
#page-cadastro .asset-type-light:not(.primary):not(.is-active) .asset-type-card {
  background:
    linear-gradient(180deg, rgba(4, 9, 18, 0.98), rgba(2, 6, 14, 0.98));
  border-color: rgba(78, 94, 117, 0.14);
  box-shadow:
    0 14px 28px -26px rgba(0,0,0,.95),
    inset 0 1px 0 rgba(255,255,255,.025);
}

#page-cadastro .asset-type-light:not(.primary):not(.is-active) .asset-type-icon {
  color: #71839a;
  background: linear-gradient(180deg, rgba(10,16,28,.95), rgba(6,10,18,.95));
  border-color: rgba(107, 122, 144, 0.14);
}

#page-cadastro .asset-type-light:not(.primary):not(.is-active) .asset-type-lightcone {
  opacity: .11;
  background: linear-gradient(
    180deg,
    rgba(96, 165, 250, 0.22) 0%,
    rgba(56, 189, 248, 0.08) 45%,
    rgba(255, 255, 255, 0) 100%
  );
}

/* ---------------------------------
   HOVER
---------------------------------- */
#page-cadastro .asset-type-light:hover .asset-type-dot {
  background: var(--type-accent);
  box-shadow:
    0 0 0 4px rgba(2,6,23,.78),
    0 0 24px rgba(56, 189, 248, 0.28);
}

#page-cadastro .asset-type-light:hover .asset-type-lightcone {
  opacity: .28;
  transform: translateY(1px);
  background: linear-gradient(
    180deg,
    rgba(56, 189, 248, 0.46) 0%,
    rgba(56, 189, 248, 0.15) 44%,
    rgba(255,255,255,0) 100%
  );
}

#page-cadastro .asset-type-light:hover .asset-type-card {
  transform: translateY(-2px);
  border-color: rgba(56, 189, 248, 0.34);
  box-shadow:
    0 20px 42px -30px rgba(14, 165, 233, 0.28),
    0 0 0 1px rgba(56, 189, 248, 0.08),
    inset 0 1px 0 rgba(255,255,255,.045);
}

#page-cadastro .asset-type-light:hover .asset-type-icon {
  color: var(--type-accent);
  border-color: rgba(56, 189, 248, 0.28);
  background: linear-gradient(180deg, rgba(15, 33, 56, .95), rgba(8, 18, 34, .95));
  box-shadow: 0 8px 20px -14px rgba(34,211,238,.28);
}

/* ---------------------------------
   SELECIONADO
---------------------------------- */
#page-cadastro .asset-type-light.primary .asset-type-dot,
#page-cadastro .asset-type-light.is-active .asset-type-dot {
  background: var(--type-accent);
  box-shadow:
    0 0 0 4px rgba(2,6,23,.78),
    0 0 26px rgba(56, 189, 248, 0.34);
}

#page-cadastro .asset-type-light.primary .asset-type-lightcone,
#page-cadastro .asset-type-light.is-active .asset-type-lightcone {
  opacity: .42;
  background: linear-gradient(
    180deg,
    rgba(56, 189, 248, 0.58) 0%,
    rgba(56, 189, 248, 0.18) 42%,
    rgba(255,255,255,0) 100%
  );
}

#page-cadastro .asset-type-light.primary .asset-type-card,
#page-cadastro .asset-type-light.is-active .asset-type-card {
  border-color: rgba(56, 189, 248, 0.46);
  background:
    radial-gradient(circle at 50% 0%, rgba(56, 189, 248, 0.08), transparent 48%),
    linear-gradient(180deg, rgba(7, 15, 28, 0.98), rgba(3, 9, 20, 0.98));
  box-shadow:
    0 22px 44px -30px rgba(8, 145, 178, 0.28),
    0 0 0 1px rgba(56, 189, 248, 0.10),
    inset 0 1px 0 rgba(255,255,255,.05);
}

#page-cadastro .asset-type-light.primary .asset-type-icon,
#page-cadastro .asset-type-light.is-active .asset-type-icon {
  color: var(--type-accent);
  border-color: rgba(56, 189, 248, 0.26);
  background: linear-gradient(180deg, rgba(15, 33, 56, .98), rgba(8, 18, 34, .98));
  box-shadow: 0 10px 24px -16px rgba(34,211,238,.26);
}

/* responsivo */
@media (max-width: 900px) {
  #page-cadastro #cad-mode.asset-type-stage {
    grid-template-columns: 1fr !important;
    max-width: 420px !important;
  }
}

/* =====================================================
   CADASTRO V2 — INPUTS / SELECTS TECH PREMIUM
   Adaptado do Uiverse, sem trocar HTML nem quebrar JS
   ===================================================== */

#page-cadastro.cad-v2 .form-group {
  position: relative;
}

/* Base dos campos */
#page-cadastro.cad-v2 .form-input,
#page-cadastro.cad-v2 .form-select,
#page-cadastro.cad-v2 .form-textarea {
  width: 100%;
  min-height: 44px;

  padding: .82rem .95rem;
  border-radius: 14px;

  color: #e8eef7 !important;
  background:
    linear-gradient(173deg, #111827 0%, #060b13 100%) !important;

  border: 1px solid rgba(148, 163, 184, .13) !important;

  box-shadow:
    inset 4px 4px 10px rgba(0, 0, 0, .34),
    inset -4px -4px 10px rgba(75, 89, 112, .10),
    0 10px 26px -22px rgba(0, 0, 0, .95);

  outline: none !important;

  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease,
    transform .12s ease;
}

/* Placeholder */
#page-cadastro.cad-v2 .form-input::placeholder,
#page-cadastro.cad-v2 .form-textarea::placeholder {
  color: rgba(203, 213, 225, .38) !important;
}

/* Focus estilo Uiverse, mas azul/ciano corporativo */
#page-cadastro.cad-v2 .form-input:focus,
#page-cadastro.cad-v2 .form-select:focus,
#page-cadastro.cad-v2 .form-textarea:focus {
  transform: translateY(-1px);

  border-color: rgba(56, 189, 248, .62) !important;

  background:
    linear-gradient(173deg, #111d2e 0%, #07111f 100%) !important;

  box-shadow:
    inset 0 0 10px rgba(37, 99, 235, .22),
    inset 0 0 12px rgba(34, 211, 238, .16),
    0 0 0 3px rgba(56, 189, 248, .12),
    0 18px 38px -28px rgba(34, 211, 238, .36);
}

/* Hover discreto */
#page-cadastro.cad-v2 .form-input:hover,
#page-cadastro.cad-v2 .form-select:hover,
#page-cadastro.cad-v2 .form-textarea:hover {
  border-color: rgba(96, 165, 250, .28) !important;
}

/* Textarea */
#page-cadastro.cad-v2 .form-textarea {
  min-height: 96px;
  resize: vertical;
}

/* Label mais clean */
#page-cadastro.cad-v2 .form-label {
  margin-bottom: .42rem !important;

  color: rgba(226, 232, 240, .76) !important;
  font-size: .70rem !important;
  font-weight: 850 !important;
  letter-spacing: .065em;
  text-transform: uppercase;
}

/* Select com seta custom */
#page-cadastro.cad-v2 .form-select {
  cursor: pointer;

  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  padding-right: 2.65rem;

  background-image:
    linear-gradient(45deg, transparent 50%, rgba(148, 163, 184, .85) 50%),
    linear-gradient(135deg, rgba(148, 163, 184, .85) 50%, transparent 50%),
    linear-gradient(173deg, #111827 0%, #060b13 100%) !important;

  background-position:
    calc(100% - 18px) 52%,
    calc(100% - 12px) 52%,
    0 0 !important;

  background-size:
    6px 6px,
    6px 6px,
    100% 100% !important;

  background-repeat: no-repeat !important;
}

/* Select focado */
#page-cadastro.cad-v2 .form-select:focus {
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(56, 189, 248, .95) 50%),
    linear-gradient(135deg, rgba(56, 189, 248, .95) 50%, transparent 50%),
    linear-gradient(173deg, #111d2e 0%, #07111f 100%) !important;
}

/* CORRIGE O DROPDOWN BRANCO DOS SELECTS */
#page-cadastro.cad-v2 select,
#page-cadastro.cad-v2 select option,
#page-cadastro.cad-v2 select optgroup {
  background-color: #0b1220 !important;
  color: #e8eef7 !important;
}

/* Option selecionada/hover em alguns navegadores */
#page-cadastro.cad-v2 select option:checked {
  background: #1d4ed8 !important;
  color: #ffffff !important;
}

/* Campo de data: melhora o ícone do calendário */
#page-cadastro.cad-v2 input[type="date"] {
  color-scheme: dark;
}

#page-cadastro.cad-v2 input[type="date"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: .75;
  filter: invert(1);
}

/* Upload mantendo a mesma identidade dos inputs */
#page-cadastro.cad-v2 #sec-imagem-ativo .image-upload-area {
  background:
    linear-gradient(173deg, #111827 0%, #060b13 100%) !important;

  border: 1px dashed rgba(56, 189, 248, .28) !important;

  box-shadow:
    inset 4px 4px 12px rgba(0, 0, 0, .26),
    inset -4px -4px 12px rgba(75, 89, 112, .08),
    0 14px 30px -28px rgba(34, 211, 238, .30);
}

#page-cadastro.cad-v2 #sec-imagem-ativo .image-upload-area:hover {
  border-color: rgba(56, 189, 248, .55) !important;

  background:
    linear-gradient(173deg, #111d2e 0%, #07111f 100%) !important;

  box-shadow:
    inset 0 0 10px rgba(37, 99, 235, .16),
    inset 0 0 12px rgba(34, 211, 238, .12),
    0 18px 38px -28px rgba(34, 211, 238, .34);
}


/* =====================================================
   CADASTRO V2 — UPLOAD DE IMAGEM UIVERSE ADAPTADO
   Mantém #asset-image e preview existentes
   ===================================================== */

#page-cadastro.cad-v2 .image-upload-uiverse {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .9rem;
  width: 100%;
}

#page-cadastro.cad-v2 .image-upload-uiverse .file-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* Card principal do upload */
#page-cadastro.cad-v2 .image-upload-card-pro {
  --upload-transition: 350ms;

  position: relative;
  width: min(100%, 280px);
  height: 172px;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;

  padding: 1rem;
  border-radius: 18px;

  cursor: pointer;
  overflow: visible;

  background:
    radial-gradient(circle at 50% 0%, rgba(56, 189, 248, .18), transparent 42%),
    linear-gradient(135deg, rgba(15, 23, 42, .98), rgba(2, 6, 23, .98)) !important;

  border: 1px solid rgba(56, 189, 248, .24) !important;

  box-shadow:
    0 22px 44px -34px rgba(34, 211, 238, .42),
    inset 0 1px 0 rgba(255,255,255,.055),
    inset 5px 5px 12px rgba(0,0,0,.28),
    inset -5px -5px 14px rgba(75,89,112,.08);

  transition:
    transform var(--upload-transition) ease,
    border-color var(--upload-transition) ease,
    box-shadow var(--upload-transition) ease,
    background var(--upload-transition) ease;
}

/* Ícone flutuante */
#page-cadastro.cad-v2 .image-float-icon {
  position: absolute;
  top: -24px;
  left: 50%;
  transform: translateX(-50%);

  width: 104px;
  height: 82px;

  display: grid;
  place-items: center;

  animation: imageUploadFloat 2.7s infinite ease-in-out;
  transition: transform var(--upload-transition) ease;
}

#page-cadastro.cad-v2 .image-icon-frame {
  position: relative;

  width: 104px;
  height: 76px;

  display: grid;
  place-items: center;

  border-radius: 18px;

  color: #dff7ff;

  background:
    linear-gradient(135deg, #2563eb 0%, #0891b2 100%);

  box-shadow:
    0 18px 34px -20px rgba(34,211,238,.65),
    inset 0 1px 0 rgba(255,255,255,.18);
}

/* “Aba” superior, inspirada na pasta do Uiverse, mas como cartão/imagem */
#page-cadastro.cad-v2 .image-icon-frame::before {
  content: "";
  position: absolute;
  top: -12px;
  left: 14px;

  width: 56px;
  height: 18px;

  border-radius: 12px 12px 4px 4px;

  background:
    linear-gradient(135deg, #38bdf8 0%, #2563eb 100%);

  box-shadow:
    0 8px 18px -12px rgba(34,211,238,.65),
    inset 0 1px 0 rgba(255,255,255,.16);
}

#page-cadastro.cad-v2 .image-icon-frame svg {
  width: 42px;
  height: 42px;
  filter: drop-shadow(0 8px 14px rgba(0,0,0,.25));
}

/* Botão/texto dentro do card */
#page-cadastro.cad-v2 .image-upload-cta {
  width: 100%;
  min-height: 58px;

  display: grid;
  place-items: center;
  gap: .12rem;

  padding: .7rem .9rem;
  border-radius: 14px;

  text-align: center;

  background:
    linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.045));

  border: 1px solid rgba(255,255,255,.075);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 12px 24px -22px rgba(0,0,0,.8);

  transition:
    background var(--upload-transition) ease,
    border-color var(--upload-transition) ease;
}

#page-cadastro.cad-v2 .image-upload-cta span {
  color: #f8fbff;
  font-size: .95rem;
  font-weight: 900;
  letter-spacing: .01em;
}

#page-cadastro.cad-v2 .image-upload-cta small {
  color: rgba(203, 213, 225, .72);
  font-size: .72rem;
  font-weight: 700;
}

/* Hover */
#page-cadastro.cad-v2 .image-upload-card-pro:hover {
  transform: translateY(-2px);

  border-color: rgba(56, 189, 248, .48) !important;

  background:
    radial-gradient(circle at 50% 0%, rgba(56, 189, 248, .24), transparent 46%),
    linear-gradient(135deg, rgba(15, 33, 56, .98), rgba(3, 10, 24, .98)) !important;

  box-shadow:
    0 26px 54px -32px rgba(34, 211, 238, .52),
    0 0 0 1px rgba(56, 189, 248, .10),
    inset 0 1px 0 rgba(255,255,255,.07);
}

#page-cadastro.cad-v2 .image-upload-card-pro:hover .image-float-icon {
  transform: translateX(-50%) scale(1.05);
}

#page-cadastro.cad-v2 .image-upload-card-pro:hover .image-icon-frame {
  box-shadow:
    0 22px 42px -20px rgba(34,211,238,.80),
    0 0 34px -16px rgba(56,189,248,.85),
    inset 0 1px 0 rgba(255,255,255,.22);
}

#page-cadastro.cad-v2 .image-upload-card-pro:hover .image-upload-cta {
  background:
    linear-gradient(180deg, rgba(56,189,248,.16), rgba(255,255,255,.055));

  border-color: rgba(56,189,248,.20);
}

/* Drag/drop ativo — teu JS já adiciona .ring */
#page-cadastro.cad-v2 .image-upload-card-pro.ring {
  border-color: rgba(34, 211, 238, .72) !important;
  box-shadow:
    0 0 0 3px rgba(56,189,248,.13),
    0 28px 60px -34px rgba(34,211,238,.62);
}

/* Preview depois que selecionar imagem */
#page-cadastro.cad-v2 #sec-imagem-ativo .image-preview {
  width: min(100%, 280px);
  margin-top: .25rem;
}

#page-cadastro.cad-v2 #sec-imagem-ativo .preview-image {
  width: 100%;
  max-height: 210px;
  object-fit: cover;

  border-radius: 16px;
  border: 1px solid rgba(56,189,248,.20);

  box-shadow:
    0 18px 34px -26px rgba(0,0,0,.88),
    0 0 0 1px rgba(56,189,248,.08);
}

#page-cadastro.cad-v2 #sec-imagem-ativo .remove-image-btn {
  top: -10px;
  right: -10px;

  background: linear-gradient(135deg, #ef4444, #f97316);
  color: #fff;

  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 10px 22px -14px rgba(239,68,68,.8);
}

@keyframes imageUploadFloat {
  0% {
    transform: translateX(-50%) translateY(0);
  }

  50% {
    transform: translateX(-50%) translateY(-13px);
  }

  100% {
    transform: translateX(-50%) translateY(0);
  }
}

@media (max-width: 700px) {
  #page-cadastro.cad-v2 .image-upload-card-pro {
    width: 100%;
  }

  #page-cadastro.cad-v2 .image-float-icon {
    top: -18px;
  }
}


#page-cadastro.cad-v2 .image-upload-card-pro {
  height: 190px !important;
  padding-top: 3.25rem !important;
  justify-content: flex-end !important;
  overflow: hidden !important;
}

#page-cadastro.cad-v2 .image-float-icon {
  top: 18px !important;
  width: 86px !important;
  height: 66px !important;
  animation: imageUploadFloatSoft 2.7s infinite ease-in-out !important;
}

#page-cadastro.cad-v2 .image-icon-frame {
  width: 86px !important;
  height: 62px !important;
  border-radius: 16px !important;
}

#page-cadastro.cad-v2 .image-icon-frame::before {
  top: -9px !important;
  left: 13px !important;
  width: 48px !important;
  height: 15px !important;
}

#page-cadastro.cad-v2 .image-icon-frame svg {
  width: 34px !important;
  height: 34px !important;
}

#page-cadastro.cad-v2 .image-upload-cta {
  min-height: 56px !important;
  margin-top: auto !important;
}

@keyframes imageUploadFloatSoft {
  0% {
    transform: translateX(-50%) translateY(0);
  }

  50% {
    transform: translateX(-50%) translateY(-7px);
  }

  100% {
    transform: translateX(-50%) translateY(0);
  }
}


/* =====================================================
   ATIVOS V2 — CENTRAL PROFISSIONAL DE GESTÃO
   Filtros amplos + cards refinados
   ===================================================== */

#page-catalogo.page-ativos-v2 {
  --ativos-bg: rgba(15, 23, 42, .72);
  --ativos-bg-strong: rgba(15, 23, 42, .92);
  --ativos-border: rgba(148, 163, 184, .13);
  --ativos-border-blue: rgba(56, 189, 248, .30);
  --ativos-text-soft: #94a3b8;
}

/* Header */
#page-catalogo.page-ativos-v2 .ativos-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;

  padding: 1.25rem 1.35rem;
  border-radius: 22px;

  background:
    radial-gradient(circle at 8% 0%, rgba(56, 189, 248, .16), transparent 34%),
    linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(2, 6, 23, .92));

  border: 1px solid rgba(148, 163, 184, .12);

  box-shadow:
    0 22px 52px -40px rgba(34, 211, 238, .36),
    inset 0 1px 0 rgba(255,255,255,.045);
}

#page-catalogo.page-ativos-v2 .ativos-eyebrow {
  display: inline-flex;
  margin-bottom: .35rem;

  color: #38bdf8;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

#page-catalogo.page-ativos-v2 .page-title {
  font-size: clamp(1.9rem, 2.6vw, 2.7rem);
  margin-bottom: .35rem;
}

#page-catalogo.page-ativos-v2 .page-subtitle {
  max-width: 820px;
  color: #a7b4c7;
}

.ativos-hero-meta {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 38px;

  padding: .45rem .8rem;
  border-radius: 999px;

  color: #dff7ff;
  font-size: .82rem;
  font-weight: 850;

  background: rgba(56, 189, 248, .10);
  border: 1px solid rgba(56, 189, 248, .22);
}

/* Painel de filtros */
#page-catalogo.page-ativos-v2 .ativos-filter-panel {
  display: grid;
  gap: .9rem;

  margin-bottom: 1.25rem;
  padding: 1rem;

  border-radius: 22px;
  border: 1px solid var(--ativos-border);

  background:
    radial-gradient(circle at 0% 0%, rgba(56, 189, 248, .08), transparent 34%),
    linear-gradient(180deg, rgba(15, 23, 42, .70), rgba(2, 6, 23, .70));

  box-shadow:
    0 18px 42px -36px rgba(0,0,0,.92),
    inset 0 1px 0 rgba(255,255,255,.035);
}

.ativos-filter-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .75rem;
  align-items: center;
}

#page-catalogo.page-ativos-v2 .ativos-search {
  min-width: 0;
}

#page-catalogo.page-ativos-v2 .search-input,
#page-catalogo.page-ativos-v2 .filter-select {
  min-height: 44px;
  border-radius: 14px;

  color: #e8eef7;
  background:
    linear-gradient(173deg, #111827 0%, #060b13 100%);

  border: 1px solid rgba(148, 163, 184, .13);

  box-shadow:
    inset 4px 4px 10px rgba(0, 0, 0, .28),
    inset -4px -4px 10px rgba(75, 89, 112, .08);

  outline: none;
}

#page-catalogo.page-ativos-v2 .search-input:focus,
#page-catalogo.page-ativos-v2 .filter-select:focus {
  border-color: rgba(56, 189, 248, .58);
  box-shadow:
    inset 0 0 10px rgba(37, 99, 235, .18),
    inset 0 0 12px rgba(34, 211, 238, .12),
    0 0 0 3px rgba(56, 189, 248, .10);
}

#page-catalogo.page-ativos-v2 select,
#page-catalogo.page-ativos-v2 select option {
  background-color: #0b1220;
  color: #e8eef7;
}

#page-catalogo.page-ativos-v2 .ativos-filter-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: .75rem;
}

.ativos-quick-filters {
  display: flex;
  gap: .55rem;
  flex-wrap: wrap;
}

.ativos-chip {
  min-height: 34px;
  padding: .45rem .75rem;

  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, .14);

  color: #9caec4;
  background: rgba(15, 23, 42, .70);

  font-size: .78rem;
  font-weight: 850;
  cursor: pointer;

  transition:
    transform .14s ease,
    border-color .14s ease,
    background .14s ease,
    color .14s ease,
    box-shadow .14s ease;
}

.ativos-chip:hover {
  transform: translateY(-1px);
  color: #dff7ff;
  border-color: rgba(56, 189, 248, .30);
  background: rgba(15, 33, 56, .82);
}

.ativos-chip.is-active {
  color: #e8fbff;
  border-color: rgba(56, 189, 248, .48);
  background:
    linear-gradient(135deg, rgba(37, 99, 235, .36), rgba(8, 145, 178, .24));

  box-shadow:
    0 12px 24px -20px rgba(34, 211, 238, .55),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.ativos-clear-filter {
  min-height: 44px;
  border-radius: 14px;
  white-space: nowrap;
}

/* Grid */
#page-catalogo.page-ativos-v2 .assets-grid {
  grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
  gap: 1rem;
}

#page-catalogo.page-ativos-v2 .ativos-pagination {
  margin-top: 1.25rem;
  padding: 1rem 1.1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border: 1px solid rgba(148, 163, 184, .13);
  border-radius: 18px;
  background: rgba(15, 23, 42, .58);
  backdrop-filter: blur(18px);
}

#page-catalogo.page-ativos-v2 .ativos-pagination.hidden {
  display: none;
}

#page-catalogo.page-ativos-v2 .ativos-pagination-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  color: #cbd5e1;
  font-size: .92rem;
}

#page-catalogo.page-ativos-v2 .ativos-pagination-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .75rem;
}

#page-catalogo.page-ativos-v2 .ativos-page-size-label {
  color: #94a3b8;
  font-size: .85rem;
}

#page-catalogo.page-ativos-v2 .ativos-page-size {
  min-width: 88px;
}

#page-catalogo.page-ativos-v2 .ativos-page-btn {
  min-width: 104px;
}

#page-catalogo.page-ativos-v2 .ativos-page-btn[disabled] {
  opacity: .5;
  cursor: not-allowed;
}

/* Card de ativo */
#page-catalogo.page-ativos-v2 .ativo-card-v2 {
  position: relative;
  overflow: hidden;

  display: flex;
  flex-direction: column;

  min-height: 420px;
  padding: 0;

  border-radius: 22px;

  background:
    radial-gradient(circle at 0% 0%, rgba(56, 189, 248, .08), transparent 34%),
    linear-gradient(180deg, rgba(15, 23, 42, .92), rgba(2, 6, 23, .94));

  border: 1px solid rgba(148, 163, 184, .12);

  box-shadow:
    0 20px 44px -38px rgba(0,0,0,.95),
    inset 0 1px 0 rgba(255,255,255,.035);

  transition:
    transform .16s ease,
    border-color .16s ease,
    box-shadow .16s ease;
}

#page-catalogo.page-ativos-v2 .ativo-card-v2:hover {
  transform: translateY(-3px);
  border-color: rgba(56, 189, 248, .30);

  box-shadow:
    0 24px 54px -34px rgba(34,211,238,.30),
    0 0 0 1px rgba(56, 189, 248, .08),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.ativo-card-image-wrap {
  position: relative;
  height: 170px;
  overflow: hidden;
  background: rgba(15,23,42,.65);
}

#page-catalogo.page-ativos-v2 .ativo-card-image {
  width: 100%;
  height: 100%;
  margin: 0;
  border-radius: 0;
  object-fit: cover;
  opacity: .92;
  transition: transform .25s ease, opacity .25s ease;
}

#page-catalogo.page-ativos-v2 .ativo-card-v2:hover .ativo-card-image {
  transform: scale(1.035);
  opacity: 1;
}

.ativo-card-floating {
  position: absolute;
  top: .75rem;
  right: .75rem;
}

.ativo-card-body {
  flex: 1;
  display: grid;
  gap: .85rem;
  padding: 1rem;
}

.ativo-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .75rem;
  align-items: start;
}

.ativo-card-title {
  color: #f8fbff;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.2;
}

.ativo-card-subtitle {
  display: flex;
  align-items: center;
  gap: .35rem;
  margin-top: .25rem;

  color: #8fa2bb;
  font-size: .78rem;
}

.ativo-type-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 28px;
  padding: .25rem .55rem;
  border-radius: 999px;

  font-size: .72rem;
  font-weight: 900;
  white-space: nowrap;
}

.ativo-type-pill.is-general {
  color: #bfdbfe;
  background: rgba(37,99,235,.12);
  border: 1px solid rgba(96,165,250,.20);
}

.ativo-type-pill.is-machine {
  color: #a5f3fc;
  background: rgba(8,145,178,.14);
  border: 1px solid rgba(34,211,238,.22);
}

.ativo-card-details {
  gap: .55rem;
  margin: 0;
}

#page-catalogo.page-ativos-v2 .asset-detail {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: .6rem;

  padding: .58rem .65rem;
  border-radius: 12px;

  background: rgba(255,255,255,.030);
  border: 1px solid rgba(255,255,255,.055);

  font-size: .8rem;
}

#page-catalogo.page-ativos-v2 .asset-label {
  color: #7f91a8;
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .055em;
  text-transform: uppercase;
}

#page-catalogo.page-ativos-v2 .asset-detail span:last-child {
  color: #dbeafe;
  font-weight: 750;
  overflow-wrap: anywhere;
}

.ativo-linked-user {
  border-color: rgba(34,197,94,.18) !important;
  background: rgba(34,197,94,.055) !important;
}

.ativo-card-actions {
  margin-top: auto;
  padding: .9rem 1rem 1rem;

  border-top: 1px solid rgba(148,163,184,.10);

  display: flex;
  gap: .55rem;
}

.ativo-card-actions .btn-ui {
  min-height: 38px;
  border-radius: 12px;
}

.ativo-card-actions .btn-ui.primary {
  flex: 1;
}

/* Responsivo */
@media (max-width: 1050px) {
  #page-catalogo.page-ativos-v2 .ativos-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ativos-filter-top {
    grid-template-columns: 1fr;
  }

  .ativos-clear-filter {
    width: fit-content;
  }
}

@media (max-width: 700px) {
  #page-catalogo.page-ativos-v2 .ativos-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  #page-catalogo.page-ativos-v2 .ativos-filter-grid {
    grid-template-columns: 1fr;
  }

  #page-catalogo.page-ativos-v2 .assets-grid {
    grid-template-columns: 1fr;
  }
}



#page-catalogo.page-ativos-v2 .ativos-hero {
  padding: .95rem 1.1rem !important;
  border-radius: 18px !important;
  margin-bottom: 1rem !important;
}

#page-catalogo.page-ativos-v2 .ativos-eyebrow {
  font-size: .64rem !important;
  margin-bottom: .22rem !important;
  letter-spacing: .09em !important;
}

#page-catalogo.page-ativos-v2 .page-title {
  font-size: clamp(1.45rem, 2vw, 2rem) !important;
  margin-bottom: .18rem !important;
}

#page-catalogo.page-ativos-v2 .page-subtitle {
  font-size: .82rem !important;
  max-width: 680px !important;
  line-height: 1.35 !important;
}

#page-catalogo.page-ativos-v2 .ativos-hero-meta {
  min-height: 32px !important;
  padding: .35rem .68rem !important;
  font-size: .75rem !important;
}

/* =====================================================
   DETALHE DO ATIVO V2 — ABAS / VÍNCULOS / ASSISTÊNCIAS
   Mantém o resumo atual, melhora o resto
   ===================================================== */

#page-ativo .page-header {
  margin-bottom: 1rem !important;
}

#page-ativo .page-header-with-back {
  align-items: flex-start;
}

#page-ativo .page-title {
  font-size: clamp(1.55rem, 2.2vw, 2.25rem);
  margin-bottom: .25rem;
}

#page-ativo .page-subtitle {
  font-size: .88rem;
}

#page-ativo .section-header {
  margin-bottom: .85rem;
}

#page-ativo > .main-wrapper > .card-premium {
  padding: 1rem !important;
  border-radius: 22px;
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.08), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.86), rgba(2,6,23,.92));
  border: 1px solid rgba(148,163,184,.12);
  box-shadow:
    0 22px 52px -42px rgba(34,211,238,.30),
    inset 0 1px 0 rgba(255,255,255,.045);
}

/* Tabs mais profissionais */
#page-ativo .detail-tabs {
  display: inline-flex;
  gap: .35rem;
  padding: .35rem;
  margin: 0 0 1rem !important;

  border-radius: 16px;
  background: rgba(2,6,23,.48);
  border: 1px solid rgba(148,163,184,.10);
}

#page-ativo .tab-btn {
  min-height: 38px;
  padding: .48rem .78rem;
  border-radius: 12px;

  color: #94a3b8;
  background: transparent;
  border: 1px solid transparent;

  font-size: .82rem;
  font-weight: 850;

  transition:
    background .16s ease,
    color .16s ease,
    border-color .16s ease,
    box-shadow .16s ease,
    transform .12s ease;
}

#page-ativo .tab-btn:hover {
  color: #dff7ff;
  background: rgba(15,33,56,.72);
  border-color: rgba(56,189,248,.16);
}

#page-ativo .tab-btn.active {
  color: #e8fbff;
  background:
    linear-gradient(135deg, rgba(37,99,235,.42), rgba(8,145,178,.30));
  border: 1px solid rgba(56,189,248,.32);
  box-shadow:
    0 12px 24px -20px rgba(34,211,238,.55),
    inset 0 1px 0 rgba(255,255,255,.08);
}

#page-ativo .tab-panel {
  animation: atvPanelIn .18s ease both;
}

@keyframes atvPanelIn {
  from {
    opacity: 0;
    transform: translateY(5px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* Seções internas */
#page-ativo #tab-vinculos .form-section,
#page-ativo #tab-assistencias .form-section,
#page-ativo #tab-historico .form-section {
  border-radius: 18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.055), transparent 32%),
    linear-gradient(180deg, rgba(15,23,42,.72), rgba(2,6,23,.72));
  border: 1px solid rgba(148,163,184,.11);
  box-shadow:
    0 18px 42px -36px rgba(0,0,0,.90),
    inset 0 1px 0 rgba(255,255,255,.035);
}

#page-ativo #tab-vinculos .form-section-title,
#page-ativo #tab-assistencias .form-section-title,
#page-ativo #tab-historico .form-section-title {
  margin-bottom: .9rem;
  color: #f8fbff;
  font-size: 1rem;
  font-weight: 900;
}

/* Lista de vínculos */
.atv-vinculos-list,
.atv-assist-list {
  list-style: none;
  display: grid;
  gap: .85rem;
  max-height: none !important;
  overflow: visible !important;
  padding-right: 0 !important;
}

.atv-vinculo-card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: .85rem;

  padding: .9rem;
  border-radius: 16px;

  background:
    linear-gradient(180deg, rgba(255,255,255,.042), rgba(255,255,255,.018));
  border: 1px solid rgba(148,163,184,.105);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 14px 30px -26px rgba(0,0,0,.85);
}

.atv-vinculo-card.is-current {
  border-color: rgba(34,197,94,.28);
  background:
    radial-gradient(circle at 0% 0%, rgba(34,197,94,.10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.018));
}

.atv-vinculo-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;

  border-radius: 14px;
  color: #67e8f9;
  background: rgba(56,189,248,.10);
  border: 1px solid rgba(56,189,248,.18);
}

.atv-vinculo-main {
  min-width: 0;
}

.atv-vinculo-top {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  align-items: flex-start;
}

.atv-vinculo-name {
  color: #f8fbff;
  font-size: .96rem;
  font-weight: 900;
}

.atv-vinculo-sub {
  margin-top: .12rem;
  color: #94a3b8;
  font-size: .78rem;
}

.atv-vinculo-status {
  flex: 0 0 auto;
  padding: .28rem .6rem;
  border-radius: 999px;

  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.atv-vinculo-status.current {
  color: #86efac;
  background: rgba(34,197,94,.12);
  border: 1px solid rgba(34,197,94,.26);
}

.atv-vinculo-status.ended {
  color: #cbd5e1;
  background: rgba(148,163,184,.10);
  border: 1px solid rgba(148,163,184,.18);
}

.atv-vinculo-meta,
.atv-assist-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: .75rem;
}

.atv-vinculo-meta span,
.atv-assist-meta span {
  display: grid;
  gap: .08rem;

  min-width: 130px;
  padding: .5rem .6rem;
  border-radius: 12px;

  background: rgba(255,255,255,.030);
  border: 1px solid rgba(255,255,255,.055);

  color: #dbeafe;
  font-size: .78rem;
}

.atv-vinculo-meta strong,
.atv-assist-meta strong {
  color: #7f91a8;
  font-size: .66rem;
  text-transform: uppercase;
  letter-spacing: .055em;
}

/* Cards de assistência dentro do detalhe */
.atv-assist-card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: .85rem;

  padding: .95rem;
  border-radius: 18px;

  cursor: pointer;

  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.070), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.042), rgba(255,255,255,.018));
  border: 1px solid rgba(148,163,184,.11);

  transition:
    transform .14s ease,
    border-color .14s ease,
    box-shadow .14s ease,
    background .14s ease;
}

.atv-assist-card:hover {
  transform: translateY(-2px);
  border-color: rgba(56,189,248,.30);
  box-shadow:
    0 18px 38px -30px rgba(34,211,238,.36),
    0 0 0 1px rgba(56,189,248,.08),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.atv-assist-marker {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;

  border-radius: 14px;
  color: #67e8f9;
  background: rgba(56,189,248,.10);
  border: 1px solid rgba(56,189,248,.18);
}

.atv-assist-marker span {
  font-weight: 950;
}

.atv-assist-main {
  min-width: 0;
}

.atv-assist-top {
  display: flex;
  justify-content: space-between;
  gap: .85rem;
  align-items: flex-start;
}

.atv-assist-title {
  color: #f8fbff;
  font-size: .96rem;
  font-weight: 900;
}

.atv-assist-sub {
  margin-top: .12rem;
  color: #94a3b8;
  font-size: .78rem;
}

.atv-assist-desc {
  margin-top: .7rem;
  color: #cbd5e1;
  font-size: .86rem;
  line-height: 1.45;
}

.atv-assist-badges {
  display: flex;
  justify-content: flex-end;
  gap: .35rem;
  flex-wrap: wrap;
}

.atv-mini-badge {
  display: inline-flex;
  align-items: center;

  padding: .25rem .55rem;
  border-radius: 999px;

  font-size: .68rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .045em;

  background: rgba(148,163,184,.10);
  border: 1px solid rgba(148,163,184,.18);
  color: #cbd5e1;
}

.atv-mini-badge.status-aberto {
  color: #93c5fd;
  background: rgba(37,99,235,.13);
  border-color: rgba(96,165,250,.24);
}

.atv-mini-badge.status-andamento {
  color: #fbbf24;
  background: rgba(245,158,11,.12);
  border-color: rgba(245,158,11,.24);
}

.atv-mini-badge.status-critico {
  color: #fca5a5;
  background: rgba(239,68,68,.12);
  border-color: rgba(239,68,68,.24);
}

.atv-mini-badge.status-fechada {
  color: #86efac;
  background: rgba(34,197,94,.12);
  border-color: rgba(34,197,94,.24);
}

.atv-mini-badge.prio-alta {
  color: #fca5a5;
  border-color: rgba(239,68,68,.24);
  background: rgba(239,68,68,.10);
}

.atv-mini-badge.prio-media {
  color: #fde68a;
  border-color: rgba(245,158,11,.24);
  background: rgba(245,158,11,.10);
}

.atv-mini-badge.prio-baixa {
  color: #86efac;
  border-color: rgba(34,197,94,.22);
  background: rgba(34,197,94,.09);
}

.atv-assist-action {
  display: flex;
  align-items: center;
}

.atv-assist-action .btn-ui {
  white-space: nowrap;
  min-height: 38px;
  border-radius: 12px;
}

/* Empty states */
#page-ativo #atv-vinculos-empty,
#page-ativo #atv-assist-empty,
#page-ativo #atv-timeline-empty {
  padding: 1rem;
  border-radius: 14px;
  background: rgba(255,255,255,.030);
  border: 1px dashed rgba(148,163,184,.16);
  color: #94a3b8;
}

@media (max-width: 820px) {
  .atv-assist-card {
    grid-template-columns: 44px minmax(0, 1fr);
  }

  .atv-assist-action {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }

  .atv-assist-top,
  .atv-vinculo-top {
    flex-direction: column;
  }

  #page-ativo .detail-tabs {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}

/* =====================================================
   ATIVOS V2 — HERO MAIS DISCRETO + SEARCH UIVERSE
   cola no FINAL do styles.css
   ===================================================== */

/* Topo ainda menor */
#page-catalogo.page-ativos-v2 .ativos-hero {
  padding: .72rem .95rem !important;
  border-radius: 16px !important;
  margin-bottom: .75rem !important;
  min-height: auto !important;
}

#page-catalogo.page-ativos-v2 .ativos-eyebrow {
  font-size: .58rem !important;
  margin-bottom: .14rem !important;
  letter-spacing: .10em !important;
  opacity: .82 !important;
}

#page-catalogo.page-ativos-v2 .page-title {
  font-size: clamp(1.22rem, 1.55vw, 1.65rem) !important;
  margin-bottom: .08rem !important;
  line-height: 1.05 !important;
}

#page-catalogo.page-ativos-v2 .page-subtitle {
  font-size: .74rem !important;
  max-width: 620px !important;
  line-height: 1.28 !important;
  opacity: .82 !important;
}

#page-catalogo.page-ativos-v2 .ativos-hero-meta {
  min-height: 28px !important;
  padding: .26rem .58rem !important;
  font-size: .68rem !important;
}

/* Painel dos filtros mais compacto */
#page-catalogo.page-ativos-v2 .ativos-filter-panel {
  padding: .82rem !important;
  border-radius: 18px !important;
  gap: .75rem !important;
  margin-bottom: 1rem !important;
}

#page-catalogo.page-ativos-v2 .ativos-filter-top {
  grid-template-columns: minmax(320px, 520px) auto !important;
  justify-content: space-between !important;
}

/* =====================================================
   Barra Search Uiverse adaptada para Ativos
   Mantém #search-input para o JS atual
   ===================================================== */

#page-catalogo.page-ativos-v2 .ativos-search-uiverse {
  position: relative;
  width: min(100%, 520px);
  height: 54px;

  display: flex;
  align-items: center;
  justify-content: center;

  isolation: isolate;
  z-index: 2;
}

/* remove herança da search-container antiga */
#page-catalogo.page-ativos-v2 .ativos-search-uiverse.search-container,
#page-catalogo.page-ativos-v2 .ativos-search-uiverse .search-container {
  min-width: 0 !important;
  flex: initial !important;
}

/* camadas de brilho */
#page-catalogo.page-ativos-v2 .ativos-search-white,
#page-catalogo.page-ativos-v2 .ativos-search-border,
#page-catalogo.page-ativos-v2 .ativos-search-dark-border,
#page-catalogo.page-ativos-v2 .ativos-search-glow {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 14px;
  z-index: -1;
}

#page-catalogo.page-ativos-v2 .ativos-search-white {
  inset: 3px;
  filter: blur(2px);
}

#page-catalogo.page-ativos-v2 .ativos-search-border {
  inset: 4px;
  filter: blur(.5px);
}

#page-catalogo.page-ativos-v2 .ativos-search-dark-border {
  inset: 1px;
  filter: blur(3px);
}

#page-catalogo.page-ativos-v2 .ativos-search-glow {
  inset: -24px;
  filter: blur(24px);
  opacity: .32;
}

/* conic gradients adaptados do rosa/roxo para azul/ciano */
#page-catalogo.page-ativos-v2 .ativos-search-white::before,
#page-catalogo.page-ativos-v2 .ativos-search-border::before,
#page-catalogo.page-ativos-v2 .ativos-search-dark-border::before,
#page-catalogo.page-ativos-v2 .ativos-search-glow::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;

  width: 720px;
  height: 720px;

  transform: translate(-50%, -50%) rotate(78deg);
  transition: transform 2s ease;

  background-repeat: no-repeat;
  background-position: 0 0;
}

#page-catalogo.page-ativos-v2 .ativos-search-white::before {
  filter: brightness(1.45);
  background-image: conic-gradient(
    rgba(0,0,0,0) 0%,
    rgba(147,197,253,.70),
    rgba(0,0,0,0) 9%,
    rgba(0,0,0,0) 50%,
    rgba(34,211,238,.72),
    rgba(0,0,0,0) 58%
  );
}

#page-catalogo.page-ativos-v2 .ativos-search-border::before {
  filter: brightness(1.35);
  background-image: conic-gradient(
    #050816,
    #2563eb 5%,
    #050816 15%,
    #050816 50%,
    #22d3ee 60%,
    #050816 66%
  );
}

#page-catalogo.page-ativos-v2 .ativos-search-dark-border::before {
  background-image: conic-gradient(
    rgba(0,0,0,0),
    rgba(37,99,235,.65),
    rgba(0,0,0,0) 11%,
    rgba(0,0,0,0) 50%,
    rgba(8,145,178,.65),
    rgba(0,0,0,0) 61%
  );
}

#page-catalogo.page-ativos-v2 .ativos-search-glow::before {
  width: 999px;
  height: 999px;
  background-image: conic-gradient(
    #000,
    rgba(37,99,235,.95) 5%,
    #000 38%,
    #000 50%,
    rgba(34,211,238,.95) 60%,
    #000 87%
  );
}

/* interação igual Uiverse */
#page-catalogo.page-ativos-v2 .ativos-search-uiverse:hover .ativos-search-dark-border::before {
  transform: translate(-50%, -50%) rotate(-98deg);
}

#page-catalogo.page-ativos-v2 .ativos-search-uiverse:hover .ativos-search-glow::before {
  transform: translate(-50%, -50%) rotate(-120deg);
}

#page-catalogo.page-ativos-v2 .ativos-search-uiverse:hover .ativos-search-white::before {
  transform: translate(-50%, -50%) rotate(-97deg);
}

#page-catalogo.page-ativos-v2 .ativos-search-uiverse:hover .ativos-search-border::before {
  transform: translate(-50%, -50%) rotate(-110deg);
}

#page-catalogo.page-ativos-v2 .ativos-search-uiverse:focus-within .ativos-search-dark-border::before {
  transform: translate(-50%, -50%) rotate(442deg);
  transition: transform 4s ease;
}

#page-catalogo.page-ativos-v2 .ativos-search-uiverse:focus-within .ativos-search-glow::before {
  transform: translate(-50%, -50%) rotate(420deg);
  transition: transform 4s ease;
}

#page-catalogo.page-ativos-v2 .ativos-search-uiverse:focus-within .ativos-search-white::before {
  transform: translate(-50%, -50%) rotate(443deg);
  transition: transform 4s ease;
}

#page-catalogo.page-ativos-v2 .ativos-search-uiverse:focus-within .ativos-search-border::before {
  transform: translate(-50%, -50%) rotate(430deg);
  transition: transform 4s ease;
}

/* miolo */
#page-catalogo.page-ativos-v2 .ativos-search-main {
  position: relative;
  width: 100%;
  height: 54px;
  border-radius: 13px;
}

#page-catalogo.page-ativos-v2 .ativos-search-input {
  width: 100% !important;
  height: 54px !important;

  padding: 0 58px 0 54px !important;
  border-radius: 13px !important;

  color: #e8f7ff !important;
  font-size: .92rem !important;
  font-weight: 650 !important;

  background: linear-gradient(180deg, #030712 0%, #01040b 100%) !important;
  border: none !important;
  outline: none !important;

  box-shadow:
    inset 5px 5px 12px rgba(0,0,0,.46),
    inset -4px -4px 10px rgba(75,89,112,.08),
    0 14px 32px -30px rgba(0,0,0,.95) !important;
}

#page-catalogo.page-ativos-v2 .ativos-search-input::placeholder {
  color: rgba(203,213,225,.60) !important;
}

#page-catalogo.page-ativos-v2 .ativos-search-input:focus {
  box-shadow:
    inset 0 0 12px rgba(37,99,235,.20),
    inset 0 0 12px rgba(34,211,238,.16),
    0 0 0 1px rgba(56,189,248,.15),
    0 18px 38px -28px rgba(34,211,238,.38) !important;
}

/* máscara lateral */
#page-catalogo.page-ativos-v2 .ativos-input-mask {
  pointer-events: none;
  position: absolute;
  top: 17px;
  left: 64px;
  width: 96px;
  height: 20px;
  background: linear-gradient(90deg, transparent, #01040b);
}

#page-catalogo.page-ativos-v2 .ativos-search-main:focus-within > .ativos-input-mask {
  display: none;
}

/* glow pequeno interno */
#page-catalogo.page-ativos-v2 .ativos-blue-mask {
  pointer-events: none;
  position: absolute;
  top: 11px;
  left: 7px;
  width: 32px;
  height: 22px;
  background: #38bdf8;
  filter: blur(20px);
  opacity: .42;
  transition: opacity .8s ease;
}

#page-catalogo.page-ativos-v2 .ativos-search-main:hover > .ativos-blue-mask {
  opacity: .12;
}

/* ícone filtro */
#page-catalogo.page-ativos-v2 .ativos-filter-border {
  position: absolute;
  top: 7px;
  right: 7px;

  width: 40px;
  height: 40px;
  overflow: hidden;
  border-radius: 11px;
}

#page-catalogo.page-ativos-v2 .ativos-filter-border::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;

  width: 600px;
  height: 600px;

  transform: translate(-50%, -50%) rotate(90deg);

  filter: brightness(1.35);
  background-image: conic-gradient(
    rgba(0,0,0,0),
    rgba(56,189,248,.38),
    rgba(0,0,0,0) 50%,
    rgba(0,0,0,0) 50%,
    rgba(37,99,235,.45),
    rgba(0,0,0,0) 100%
  );

  animation: ativosSearchRotate 4s linear infinite;
}

#page-catalogo.page-ativos-v2 .ativos-filter-icon {
  position: absolute;
  top: 8px;
  right: 8px;

  width: 38px;
  height: 38px;

  display: flex;
  align-items: center;
  justify-content: center;

  z-index: 2;
  isolation: isolate;
  overflow: hidden;

  border-radius: 10px;

  background:
    linear-gradient(180deg, #0f2138, #020617, #0b2742);

  border: 1px solid rgba(56,189,248,.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

#page-catalogo.page-ativos-v2 .ativos-search-icon {
  position: absolute;
  left: 19px;
  top: 16px;
  width: 22px;
  height: 22px;
  pointer-events: none;
}

@keyframes ativosSearchRotate {
  100% {
    transform: translate(-50%, -50%) rotate(450deg);
  }
}

/* Responsivo */
@media (max-width: 1050px) {
  #page-catalogo.page-ativos-v2 .ativos-filter-top {
    grid-template-columns: 1fr !important;
  }

  #page-catalogo.page-ativos-v2 .ativos-search-uiverse {
    width: 100%;
    max-width: 520px;
  }
}

@media (max-width: 700px) {
  #page-catalogo.page-ativos-v2 .ativos-hero {
    padding: .75rem !important;
  }

  #page-catalogo.page-ativos-v2 .ativos-search-uiverse {
    height: 50px;
  }

  #page-catalogo.page-ativos-v2 .ativos-search-main,
  #page-catalogo.page-ativos-v2 .ativos-search-input {
    height: 50px !important;
  }
}
/* =====================================================
   AJUSTE FINO — SEARCH DE ATIVOS
   1) ocupar largura toda
   2) animação das luzes em loop contínuo
   ===================================================== */

/* ocupa toda a largura disponível da linha */
#page-catalogo.page-ativos-v2 .ativos-filter-top {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 1rem !important;
}

#page-catalogo.page-ativos-v2 .ativos-search-uiverse {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

#page-catalogo.page-ativos-v2 .ativos-search-main {
  width: 100% !important;
}

#page-catalogo.page-ativos-v2 .ativos-search-input {
  width: 100% !important;
}

/* deixa o botão de limpar filtros no tamanho dele, sem esmagar a barra */
#page-catalogo.page-ativos-v2 .ativos-clear-filter {
  flex: 0 0 auto !important;
}

/* =====================================================
   LOOP CONTÍNUO DAS LUZES
   ===================================================== */

#page-catalogo.page-ativos-v2 .ativos-search-dark-border::before,
#page-catalogo.page-ativos-v2 .ativos-search-white::before,
#page-catalogo.page-ativos-v2 .ativos-search-border::before,
#page-catalogo.page-ativos-v2 .ativos-search-glow::before {
  animation-iteration-count: infinite !important;
  animation-timing-function: linear !important;
  animation-play-state: running !important;
  transition: none !important;
}

/* cada camada gira em velocidade um pouco diferente */
#page-catalogo.page-ativos-v2 .ativos-search-dark-border::before {
  animation: ativosLoopDark 7.5s linear infinite !important;
}

#page-catalogo.page-ativos-v2 .ativos-search-white::before {
  animation: ativosLoopWhite 9s linear infinite !important;
}

#page-catalogo.page-ativos-v2 .ativos-search-border::before {
  animation: ativosLoopBorder 6.5s linear infinite !important;
}

#page-catalogo.page-ativos-v2 .ativos-search-glow::before {
  animation: ativosLoopGlow 10s linear infinite !important;
}

/* mantém o loop mesmo com hover/focus */
#page-catalogo.page-ativos-v2 .ativos-search-uiverse:hover .ativos-search-dark-border::before,
#page-catalogo.page-ativos-v2 .ativos-search-uiverse:hover .ativos-search-white::before,
#page-catalogo.page-ativos-v2 .ativos-search-uiverse:hover .ativos-search-border::before,
#page-catalogo.page-ativos-v2 .ativos-search-uiverse:hover .ativos-search-glow::before,
#page-catalogo.page-ativos-v2 .ativos-search-uiverse:focus-within .ativos-search-dark-border::before,
#page-catalogo.page-ativos-v2 .ativos-search-uiverse:focus-within .ativos-search-white::before,
#page-catalogo.page-ativos-v2 .ativos-search-uiverse:focus-within .ativos-search-border::before,
#page-catalogo.page-ativos-v2 .ativos-search-uiverse:focus-within .ativos-search-glow::before {
  transition: none !important;
}

/* keyframes do loop */
@keyframes ativosLoopDark {
  from {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

@keyframes ativosLoopWhite {
  from {
    transform: translate(-50%, -50%) rotate(35deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(395deg);
  }
}

@keyframes ativosLoopBorder {
  from {
    transform: translate(-50%, -50%) rotate(70deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(430deg);
  }
}

@keyframes ativosLoopGlow {
  from {
    transform: translate(-50%, -50%) rotate(110deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(470deg);
  }
}

/* responsivo */
@media (max-width: 1050px) {
  #page-catalogo.page-ativos-v2 .ativos-filter-top {
    grid-template-columns: 1fr !important;
  }

  #page-catalogo.page-ativos-v2 .ativos-search-uiverse {
    width: 100% !important;
    max-width: none !important;
  }
}

/* =====================================================
   DETALHE DO ATIVO — ABA MANUTENÇÕES
   Para substituir dependência da Manutenção Lvl.2
   ===================================================== */

#page-ativo #tab-manutencoes .form-section {
  border-radius: 18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.055), transparent 32%),
    linear-gradient(180deg, rgba(15,23,42,.72), rgba(2,6,23,.72));
  border: 1px solid rgba(148,163,184,.11);
  box-shadow:
    0 18px 42px -36px rgba(0,0,0,.90),
    inset 0 1px 0 rgba(255,255,255,.035);
}

#page-ativo #tab-manutencoes .form-section-title {
  margin-bottom: .9rem;
  color: #f8fbff;
  font-size: 1rem;
  font-weight: 900;
}

.atv-maint-list {
  list-style: none;
  display: grid;
  gap: .85rem;
  max-height: none !important;
  overflow: visible !important;
  padding-right: 0 !important;
}

.atv-maint-card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: .85rem;

  padding: .95rem;
  border-radius: 18px;

  cursor: pointer;

  background:
    radial-gradient(circle at 0% 0%, rgba(34,211,238,.07), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.042), rgba(255,255,255,.018));

  border: 1px solid rgba(148,163,184,.11);

  transition:
    transform .14s ease,
    border-color .14s ease,
    box-shadow .14s ease,
    background .14s ease;
}

.atv-maint-card:hover {
  transform: translateY(-2px);
  border-color: rgba(34,211,238,.32);
  box-shadow:
    0 18px 38px -30px rgba(34,211,238,.36),
    0 0 0 1px rgba(56,189,248,.08),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.atv-maint-marker {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;

  border-radius: 14px;
  background: rgba(34,211,238,.10);
  border: 1px solid rgba(34,211,238,.18);
}

.atv-maint-marker span {
  font-size: 1.1rem;
}

.atv-maint-main {
  min-width: 0;
}

.atv-maint-top {
  display: flex;
  justify-content: space-between;
  gap: .85rem;
  align-items: flex-start;
}

.atv-maint-title {
  color: #f8fbff;
  font-size: .96rem;
  font-weight: 900;
}

.atv-maint-sub {
  margin-top: .12rem;
  color: #94a3b8;
  font-size: .78rem;
}

.atv-maint-desc {
  margin-top: .7rem;
  color: #cbd5e1;
  font-size: .86rem;
  line-height: 1.45;
}

.atv-maint-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: .75rem;
}

.atv-maint-meta span {
  display: grid;
  gap: .08rem;

  min-width: 130px;
  padding: .5rem .6rem;
  border-radius: 12px;

  background: rgba(255,255,255,.030);
  border: 1px solid rgba(255,255,255,.055);

  color: #dbeafe;
  font-size: .78rem;
}

.atv-maint-meta strong {
  color: #7f91a8;
  font-size: .66rem;
  text-transform: uppercase;
  letter-spacing: .055em;
}

.atv-maint-action {
  display: flex;
  align-items: center;
}

.atv-maint-action .btn-ui {
  white-space: nowrap;
  min-height: 38px;
  border-radius: 12px;
}

/* Modal de detalhe da manutenção */
.mnt-detail-dialog {
  max-width: 720px;
}

.mnt-modal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}

.mnt-modal-info {
  padding: .9rem;
  border-radius: 14px;

  background: rgba(255,255,255,.035);
  border: 1px solid rgba(148,163,184,.10);
}

.mnt-modal-info.span-2 {
  grid-column: 1 / -1;
}

.mnt-modal-info strong {
  display: block;
  margin-bottom: .35rem;

  color: #7f91a8;
  font-size: .68rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .065em;
}

.mnt-modal-info p {
  color: #e8f7ff;
  font-size: .9rem;
  line-height: 1.45;
}

@media (max-width: 820px) {
  .atv-maint-card {
    grid-template-columns: 44px minmax(0, 1fr);
  }

  .atv-maint-action {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }

  .atv-maint-top {
    flex-direction: column;
  }

  .mnt-modal-grid {
    grid-template-columns: 1fr;
  }
}

/* =====================================================
   ATIVOS V2 — STATUS BADGES MAIS LEGÍVEIS
   LIVRE / EM USO / ASSISTÊNCIA / MANUTENÇÃO / BAIXADO
   cola no FINAL do styles.css
   ===================================================== */

#page-catalogo.page-ativos-v2 .ativo-card-floating {
  top: .72rem !important;
  right: .72rem !important;
  z-index: 5;
}

/* base premium das tags */
#page-catalogo.page-ativos-v2 .status-badge {
  position: relative;

  display: inline-flex;
  align-items: center;
  gap: .4rem;

  min-height: 30px;
  padding: .34rem .72rem;

  border-radius: 999px;

  font-size: .70rem;
  font-weight: 950;
  line-height: 1;
  letter-spacing: .075em;
  text-transform: uppercase;

  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);

  box-shadow:
    0 12px 26px -16px rgba(0,0,0,.95),
    inset 0 1px 0 rgba(255,255,255,.18);

  text-shadow: 0 1px 2px rgba(0,0,0,.65);
}

/* bolinha antes do texto */
#page-catalogo.page-ativos-v2 .status-badge::before {
  content: "";
  width: .46rem;
  height: .46rem;
  border-radius: 999px;
  flex: 0 0 auto;

  background: currentColor;
  box-shadow: 0 0 12px currentColor;
}

/* LIVRE */
#page-catalogo.page-ativos-v2 .status-free {
  color: #dcfce7 !important;
  background:
    linear-gradient(135deg, rgba(22,101,52,.92), rgba(21,128,61,.76)) !important;
  border: 1px solid rgba(134,239,172,.48) !important;
}

/* EM USO */
#page-catalogo.page-ativos-v2 .status-in-use {
  color: #dbeafe !important;
  background:
    linear-gradient(135deg, rgba(30,64,175,.92), rgba(37,99,235,.76)) !important;
  border: 1px solid rgba(147,197,253,.52) !important;
}

/* ASSISTÊNCIA */
#page-catalogo.page-ativos-v2 .status-assistance {
  color: #fff7ed !important;
  background:
    linear-gradient(135deg, rgba(194,65,12,.94), rgba(249,115,22,.78)) !important;
  border: 1px solid rgba(253,186,116,.58) !important;
}

/* MANUTENÇÃO */
#page-catalogo.page-ativos-v2 .status-maintenance {
  color: #fefce8 !important;
  background:
    linear-gradient(135deg, rgba(161,98,7,.94), rgba(234,179,8,.78)) !important;
  border: 1px solid rgba(253,224,71,.58) !important;
}

/* BAIXADO */
#page-catalogo.page-ativos-v2 .status-archived {
  color: #f1f5f9 !important;
  background:
    linear-gradient(135deg, rgba(51,65,85,.94), rgba(71,85,105,.78)) !important;
  border: 1px solid rgba(203,213,225,.34) !important;
}


#page-catalogo.page-ativos-v2 .ativo-card-v2:hover .status-badge {
  transform: translateY(-1px);
  box-shadow:
    0 16px 30px -16px rgba(0,0,0,.98),
    0 0 0 1px rgba(255,255,255,.08),
    inset 0 1px 0 rgba(255,255,255,.22);
}

#page-catalogo.page-ativos-v2 .ativo-card-image-wrap::after {
  content: "";
  position: absolute;
  inset: 0;

  pointer-events: none;

  background:
    linear-gradient(180deg, rgba(2,6,23,.10), transparent 32%),
    linear-gradient(90deg, transparent 55%, rgba(2,6,23,.18));

  z-index: 1;
}

#page-catalogo.page-ativos-v2 .ativo-card-floating {
  z-index: 2;
}

/* =====================================================
   IMAGE VIEWER — AMAZON STYLE ZOOM
   substitui visual antigo de + / - / reset
   ===================================================== */

.imgv {
  backdrop-filter: blur(4px);
}

.imgv__backdrop {
  background: rgba(2, 6, 23, .74) !important;
}

.imgv__dialog {
  width: min(94vw, 1180px) !important;
  max-width: 1180px !important;
  max-height: 88vh !important;

  display: grid !important;
  grid-template-columns: minmax(360px, 1fr) minmax(340px, 430px) !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  gap: 1rem !important;

  padding: 1rem !important;
  border-radius: 22px !important;

  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.09), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.96), rgba(2,6,23,.97)) !important;

  border: 1px solid rgba(148,163,184,.16) !important;

  box-shadow:
    0 34px 90px -42px rgba(0,0,0,.96),
    0 0 0 1px rgba(56,189,248,.08),
    inset 0 1px 0 rgba(255,255,255,.055) !important;

  overflow: hidden !important;
}

/* remove toolbar velha se sobrou no DOM */
.imgv__toolbar {
  display: none !important;
}

/* área esquerda da imagem */
.imgv__stage {
  position: relative;

  min-height: 500px;
  max-height: 68vh;

  display: grid;
  place-items: center;

  overflow: hidden;

  border-radius: 18px;

  background:
    linear-gradient(135deg, rgba(15,23,42,.82), rgba(2,6,23,.86));

  border: 1px solid rgba(148,163,184,.12);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 18px 38px -34px rgba(0,0,0,.92);
}

.imgv__img {
  max-width: 100% !important;
  max-height: 66vh !important;

  width: auto !important;
  height: auto !important;

  object-fit: contain !important;

  border-radius: 14px !important;
  cursor: crosshair !important;

  box-shadow:
    0 18px 38px -26px rgba(0,0,0,.85),
    0 0 0 1px rgba(255,255,255,.07);

  transition:
    opacity .18s ease,
    transform .18s ease,
    filter .18s ease;

  opacity: 0;
}

.imgv__img.is-loaded {
  opacity: 1;
}

.imgv__stage:hover .imgv__img {
  filter: brightness(1.04) contrast(1.03);
}

/* clique na imagem alterna entre contain e ocupar largura */
.imgv__stage.is-fit-full .imgv__img {
  width: 100% !important;
  max-height: none !important;
}

/* lente sobre a imagem */
.imgv__lens {
  position: absolute;

  width: 155px;
  height: 115px;

  display: none;

  border-radius: 12px;

  pointer-events: none;

  background:
    linear-gradient(135deg, rgba(56,189,248,.22), rgba(37,99,235,.12));

  border: 1px solid rgba(125,211,252,.55);

  box-shadow:
    0 16px 32px -20px rgba(34,211,238,.48),
    inset 0 1px 0 rgba(255,255,255,.18);

  backdrop-filter: blur(1px);
}

.imgv__stage.is-zooming .imgv__lens {
  display: block;
}

/* painel direito ampliado */
.imgv__zoom-pane {
  position: relative;

  min-height: 500px;
  max-height: 68vh;

  border-radius: 18px;

  background:
    radial-gradient(circle at 50% 0%, rgba(56,189,248,.08), transparent 38%),
    linear-gradient(135deg, rgba(15,23,42,.86), rgba(2,6,23,.92));

  background-repeat: no-repeat;

  border: 1px solid rgba(148,163,184,.12);

  overflow: hidden;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 18px 38px -34px rgba(0,0,0,.92);
}

.imgv__zoom-pane.is-active {
  border-color: rgba(56,189,248,.28);
  box-shadow:
    0 22px 48px -34px rgba(34,211,238,.36),
    inset 0 1px 0 rgba(255,255,255,.055);
}

.imgv__zoom-empty {
  position: absolute;
  inset: 0;

  display: grid;
  place-items: center;

  padding: 1rem;
  text-align: center;

  color: #7f91a8;
  font-size: .82rem;
  font-weight: 800;
}

.imgv__zoom-pane.is-active .imgv__zoom-empty {
  display: none;
}

/* info embaixo */
.imgv__info {
  grid-column: 1 / -1;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;

  padding: .85rem 1rem;

  border-radius: 16px;

  background: rgba(2,6,23,.58);
  border: 1px solid rgba(148,163,184,.10);
}

.imgv__title {
  color: #e8f7ff;
  font-size: .95rem;
  font-weight: 900;
}

.imgv__hint {
  color: #7f91a8;
  font-size: .76rem;
  font-weight: 750;
}

/* legenda antiga some pra não sobrepor */
.imgv__caption {
  display: none !important;
}

/* botão fechar */
.imgv__close {
  top: 1rem !important;
  right: 1rem !important;

  width: 42px !important;
  height: 42px !important;

  display: grid !important;
  place-items: center !important;

  z-index: 20;

  border-radius: 14px !important;

  color: #e8f7ff !important;
  background:
    linear-gradient(180deg, rgba(15,23,42,.94), rgba(2,6,23,.94)) !important;

  border: 1px solid rgba(148,163,184,.16) !important;

  box-shadow:
    0 14px 30px -20px rgba(0,0,0,.92),
    inset 0 1px 0 rgba(255,255,255,.06);

  transition:
    transform .14s ease,
    border-color .14s ease,
    background .14s ease;
}

.imgv__close:hover {
  transform: translateY(-1px);
  border-color: rgba(56,189,248,.36) !important;
  background:
    linear-gradient(135deg, rgba(37,99,235,.42), rgba(8,145,178,.24)) !important;
}

/* remove instrução antiga se você tiver colado aquele ::after */
.imgv__dialog::after {
  content: none !important;
  display: none !important;
}

/* Mobile: sem painel lateral, imagem grande */
@media (max-width: 900px) {
  .imgv__dialog {
    grid-template-columns: 1fr !important;
    width: 94vw !important;
    max-height: 88vh !important;
  }

  .imgv__stage {
    min-height: 58vh;
  }

  .imgv__zoom-pane {
    display: none !important;
  }

  .imgv__lens {
    display: none !important;
  }

  .imgv__info {
    flex-direction: column;
    align-items: flex-start;
  }

  .imgv__hint {
    font-size: .72rem;
  }
}



.imgv__backdrop {
  background:
    radial-gradient(circle at 20% 0%, rgba(56, 189, 248, .10), transparent 35%),
    radial-gradient(circle at 80% 20%, rgba(37, 99, 235, .10), transparent 32%),
    rgba(2, 6, 23, .82) !important;
  backdrop-filter: blur(7px) saturate(120%) !important;
}

.imgv__dialog {
  background:
    radial-gradient(circle at 0% 0%, rgba(56, 189, 248, .10), transparent 30%),
    radial-gradient(circle at 100% 0%, rgba(37, 99, 235, .08), transparent 34%),
    linear-gradient(180deg, rgba(8, 13, 24, .98), rgba(3, 7, 15, .98)) !important;

  border: 1px solid rgba(125, 211, 252, .16) !important;

  box-shadow:
    0 38px 110px -48px rgba(0, 0, 0, .98),
    0 0 0 1px rgba(56, 189, 248, .07),
    inset 0 1px 0 rgba(255, 255, 255, .055) !important;
}


.imgv__stage {
  background:
    linear-gradient(180deg, rgba(8, 13, 24, .94), rgba(2, 6, 23, .94)) !important;

  border: 1px solid rgba(148, 163, 184, .11) !important;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .035),
    0 18px 42px -36px rgba(0, 0, 0, .95) !important;
}


.imgv__zoom-pane {
  background-color: #050a13 !important;
  background-repeat: no-repeat !important;

  border: 1px solid rgba(125, 211, 252, .14) !important;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .035),
    0 18px 42px -36px rgba(0, 0, 0, .95) !important;
}

.imgv__zoom-pane.is-active {
  border-color: rgba(56, 189, 248, .34) !important;

  box-shadow:
    0 24px 52px -36px rgba(34, 211, 238, .38),
    0 0 0 1px rgba(56, 189, 248, .08),
    inset 0 1px 0 rgba(255, 255, 255, .055) !important;
}


.imgv__lens {
  width: 170px !important;
  height: 120px !important;

  border-radius: 10px !important;

  background:
    linear-gradient(135deg, rgba(56, 189, 248, .18), rgba(14, 165, 233, .08)) !important;

  border: 1px solid rgba(125, 211, 252, .62) !important;

  box-shadow:
    0 16px 34px -22px rgba(34, 211, 238, .55),
    inset 0 1px 0 rgba(255, 255, 255, .18),
    inset 0 0 0 1px rgba(255, 255, 255, .035) !important;

  backdrop-filter: blur(1.2px) saturate(120%) !important;
}


.imgv__img {
  box-shadow:
    0 18px 38px -30px rgba(0, 0, 0, .92),
    0 0 0 1px rgba(255, 255, 255, .06) !important;
}


.imgv__info {
  background:
    linear-gradient(180deg, rgba(8, 13, 24, .80), rgba(2, 6, 23, .76)) !important;

  border: 1px solid rgba(148, 163, 184, .10) !important;
}

.imgv__title {
  color: #f8fbff !important;
}

.imgv__hint {
  color: #8fa2bb !important;
}


.imgv__zoom-empty {
  color: #8fa2bb !important;
  font-size: .8rem !important;
  font-weight: 800 !important;
}


.imgv__close {
  background:
    linear-gradient(180deg, rgba(8, 13, 24, .96), rgba(2, 6, 23, .96)) !important;

  border: 1px solid rgba(125, 211, 252, .16) !important;
}

.imgv__close:hover {
  border-color: rgba(56, 189, 248, .42) !important;
  background:
    linear-gradient(135deg, rgba(37, 99, 235, .36), rgba(8, 145, 178, .22)) !important;
}


.imgv__stage {
  padding: 1.25rem !important;
}

.imgv__img {
  max-width: min(100%, 720px) !important;
  max-height: 64vh !important;
}

.ativo-link-btn.is-linked {
  color: #fff7ed !important;
  background:
    linear-gradient(135deg, rgba(194, 65, 12, .94), rgba(249, 115, 22, .78)) !important;
  border: 1px solid rgba(253, 186, 116, .48) !important;
  box-shadow:
    0 14px 28px -20px rgba(249, 115, 22, .55),
    inset 0 1px 0 rgba(255,255,255,.14) !important;
}

.ativo-link-btn.is-linked:hover {
  box-shadow:
    0 18px 36px -18px rgba(249, 115, 22, .62),
    0 0 0 1px rgba(253, 186, 116, .16),
    inset 0 1px 0 rgba(255,255,255,.18) !important;
}

.asset-link-dialog {
  max-width: 760px !important;
}

.asset-link-warning {
  margin-bottom: 1rem;
  padding: .9rem 1rem;
  border-radius: 16px;

  color: #ffedd5;
  background:
    radial-gradient(circle at 0% 0%, rgba(249, 115, 22, .16), transparent 36%),
    linear-gradient(180deg, rgba(67, 20, 7, .62), rgba(2, 6, 23, .62));

  border: 1px solid rgba(253, 186, 116, .24);
}

.asset-link-warning strong {
  color: #fff7ed;
}

.asset-link-summary {
  display: grid;
  grid-template-columns: 1fr 180px;
  gap: .75rem;
  margin-bottom: 1rem;
}

.asset-link-summary > div {
  padding: .85rem;
  border-radius: 14px;

  background: rgba(255,255,255,.035);
  border: 1px solid rgba(148,163,184,.10);
}

.asset-link-summary span,
.asset-link-picked span {
  display: block;
  margin-bottom: .2rem;

  color: #7f91a8;
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .065em;
  text-transform: uppercase;
}

.asset-link-summary strong,
.asset-link-picked strong {
  color: #e8f7ff;
  font-size: .92rem;
}

.asset-link-picker {
  display: grid;
  gap: .65rem;
}

.asset-link-results {
  list-style: none;
  display: grid;
  gap: .55rem;

  max-height: 290px;
  overflow: auto;

  padding-right: .25rem;
}

.asset-link-employee {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .75rem;
  align-items: center;

  padding: .78rem;
  border-radius: 14px;

  cursor: pointer;

  background:
    linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.018));

  border: 1px solid rgba(148,163,184,.10);

  transition:
    transform .14s ease,
    border-color .14s ease,
    background .14s ease,
    box-shadow .14s ease;
}

.asset-link-employee:hover {
  transform: translateY(-1px);
  border-color: rgba(56,189,248,.30);
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.09), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.046), rgba(255,255,255,.020));

  box-shadow:
    0 14px 28px -22px rgba(34,211,238,.32),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.asset-link-employee strong {
  display: block;
  color: #f8fbff;
  font-size: .9rem;
}

.asset-link-employee span {
  display: block;
  margin-top: .12rem;
  color: #94a3b8;
  font-size: .78rem;
}

.asset-link-empty {
  padding: .9rem;
  border-radius: 14px;

  color: #94a3b8;
  background: rgba(255,255,255,.030);
  border: 1px dashed rgba(148,163,184,.16);
}

.asset-link-picked {
  padding: .8rem .9rem;
  border-radius: 14px;

  background:
    radial-gradient(circle at 0% 0%, rgba(34,197,94,.10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.018));

  border: 1px solid rgba(34,197,94,.24);
}

.asset-link-picked small {
  display: block;
  margin-top: .1rem;
  color: #94a3b8;
}

.asset-link-footer {
  align-items: center;
}

@media (max-width: 720px) {
  .asset-link-summary {
    grid-template-columns: 1fr;
  }

  .asset-link-employee {
    grid-template-columns: 1fr;
  }

  .asset-link-employee .btn-ui {
    width: fit-content;
  }

  .asset-link-footer {
    flex-wrap: wrap;
  }
}

/* Toggle de imobilizado no cadastro */
#page-cadastro .cad-imob-row {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 1.1rem;

  padding: 1rem;
  border-radius: 18px;

  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));

  border: 1px solid rgba(148, 163, 184, .10);
}

#page-cadastro .cad-imob-text {
  display: grid;
  gap: .18rem;
}

#page-cadastro .cad-imob-text strong {
  color: #f8fbff;
  font-size: .92rem;
  font-weight: 900;
}

#page-cadastro .cad-imob-text small {
  color: #94a3b8;
  font-size: .78rem;
  line-height: 1.35;
}

#page-cadastro .viking-toggle {
  flex: 0 0 auto;
  transform: scale(.72);
  transform-origin: left center;
  margin-right: -2.4rem;
}

@media (max-width: 720px) {
  #page-cadastro .cad-imob-row {
    align-items: flex-start;
    flex-direction: column;
    gap: .35rem;
  }

  #page-cadastro .viking-toggle {
    transform: scale(.68);
    margin-right: 0;
  }
}

#page-cadastro .cad-imob-row {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
  border: 1px solid rgba(148, 163, 184, .10);
  overflow: visible;
}

#page-cadastro .cad-imob-text {
  display: grid;
  gap: .18rem;
  min-width: 0;
}

#page-cadastro .cad-imob-text strong {
  color: #f8fbff;
  font-size: .92rem;
  font-weight: 900;
}

#page-cadastro .cad-imob-text small {
  color: #94a3b8;
  font-size: .78rem;
  line-height: 1.35;
}

#page-cadastro .viking-toggle,
#page-cadastro .viking-toggle * {
  box-sizing: border-box;
}

#page-cadastro .viking-toggle {
  --vt-wood-dark: #1a1208;
  --vt-wood-medium: #2d2116;
  --vt-wood-light: #3d2e1f;
  --vt-metal-dark: #2a1f15;
  --vt-metal-medium: #4a3a2a;
  --vt-bronze: #8b7355;
  --vt-gold: #c9a227;
  --vt-gold-bright: #f0d060;
  --vt-fire: #ff6a00;
  --vt-fire-glow: rgba(255, 120, 40, 0.6);

  position: relative !important;
  display: block !important;
  width: 180px !important;
  height: 78px !important;
  flex: 0 0 180px !important;
  cursor: pointer !important;
  filter: drop-shadow(0 10px 30px rgba(0, 0, 0, 0.5)) !important;
  transform: scale(.72);
  transform-origin: left center;
  margin-right: -2.5rem;
}

#page-cadastro .viking-toggle__checkbox {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}

#page-cadastro .viking-toggle__track {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  overflow: hidden !important;
  border-radius: 44px !important;
  background:
    repeating-linear-gradient(
      90deg,
      transparent 0px,
      transparent 8px,
      rgba(0, 0, 0, 0.15) 8px,
      rgba(0, 0, 0, 0.15) 9px
    ),
    linear-gradient(
      180deg,
      var(--vt-wood-dark) 0%,
      var(--vt-wood-medium) 15%,
      var(--vt-wood-light) 50%,
      var(--vt-wood-medium) 85%,
      var(--vt-wood-dark) 100%
    ) !important;
  box-shadow:
    inset 0 6px 20px rgba(0, 0, 0, 0.9),
    inset 0 -3px 15px rgba(139, 115, 85, 0.08),
    inset 2px 0 10px rgba(0, 0, 0, 0.4),
    inset -2px 0 10px rgba(0, 0, 0, 0.4),
    0 12px 40px rgba(0, 0, 0, 0.7),
    0 4px 15px rgba(0, 0, 0, 0.9) !important;
  transition: all .6s cubic-bezier(.34, 1.56, .64, 1) !important;
}

#page-cadastro .viking-toggle__track::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 44px;
  padding: 4px;
  background: linear-gradient(
    170deg,
    rgba(180, 160, 120, .6) 0%,
    var(--vt-bronze) 15%,
    var(--vt-metal-medium) 30%,
    var(--vt-metal-dark) 50%,
    var(--vt-metal-medium) 70%,
    var(--vt-bronze) 85%,
    rgba(180, 160, 120, .6) 100%
  );
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}

#page-cadastro .viking-toggle__inner {
  position: absolute !important;
  inset: 8px !important;
  border-radius: 36px !important;
  overflow: hidden !important;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, .5) 0%,
    transparent 25%,
    transparent 75%,
    rgba(139, 115, 85, .08) 100%
  ) !important;
}

#page-cadastro .viking-toggle__runes {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  font-size: 16px !important;
  letter-spacing: 6px !important;
  color: rgba(139, 90, 43, .12) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .5) !important;
  pointer-events: none !important;
  transition: all .6s ease !important;
}

#page-cadastro .viking-toggle__glow {
  position: absolute !important;
  inset: 0 !important;
  border-radius: 36px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(
      ellipse at 85% 50%,
      rgba(255, 100, 30, .4) 0%,
      rgba(255, 80, 20, .2) 30%,
      transparent 60%
    ),
    radial-gradient(
      ellipse at 75% 30%,
      rgba(255, 150, 50, .2) 0%,
      transparent 40%
    ) !important;
  transition: opacity .6s ease !important;
}

#page-cadastro .viking-toggle__knob {
  position: absolute !important;
  left: 10px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 58px !important;
  height: 58px !important;
  border-radius: 50% !important;
  z-index: 10 !important;
  background: radial-gradient(
    circle at 35% 35%,
    #a89a80 0%,
    #7a6a5a 25%,
    #5a4a3a 50%,
    #3a2a1a 80%,
    #2a1a0a 100%
  ) !important;
  box-shadow:
    0 6px 25px rgba(0, 0, 0, .7),
    0 3px 10px rgba(0, 0, 0, .5),
    inset 0 3px 6px rgba(255, 255, 255, .12),
    inset 0 -4px 8px rgba(0, 0, 0, .4),
    inset 3px 0 6px rgba(255, 255, 255, .05),
    inset -3px 0 6px rgba(0, 0, 0, .2) !important;
  transition: all .6s cubic-bezier(.34, 1.56, .64, 1) !important;
}

#page-cadastro .viking-toggle__knob::before {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 50%;
  border: 3px solid transparent;
  background-image:
    linear-gradient(var(--vt-wood-medium), var(--vt-wood-medium)),
    linear-gradient(
      135deg,
      rgba(180, 160, 120, .8) 0%,
      var(--vt-bronze) 25%,
      var(--vt-metal-dark) 50%,
      var(--vt-bronze) 75%,
      rgba(180, 160, 120, .8) 100%
    );
  background-origin: border-box;
  background-clip: padding-box, border-box;
  box-shadow:
    inset 0 0 12px rgba(0, 0, 0, .6),
    0 0 8px rgba(139, 115, 85, .2);
}

#page-cadastro .viking-toggle__knob::after {
  content: "ᛟ";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 22px;
  color: var(--vt-bronze);
  text-shadow: 0 1px 2px rgba(0, 0, 0, .8);
}

#page-cadastro .viking-toggle__shield {
  position: absolute !important;
  inset: 6px !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  background: conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(0, 0, 0, .08) 30deg,
    transparent 60deg,
    rgba(0, 0, 0, .08) 90deg,
    transparent 120deg,
    rgba(0, 0, 0, .08) 150deg,
    transparent 180deg,
    rgba(0, 0, 0, .08) 210deg,
    transparent 240deg,
    rgba(0, 0, 0, .08) 270deg,
    transparent 300deg,
    rgba(0, 0, 0, .08) 330deg,
    transparent 360deg
  ) !important;
}

#page-cadastro .viking-toggle__icon {
  position: absolute !important;
  top: 50% !important;
  width: 20px !important;
  height: 20px !important;
  z-index: 5 !important;
  pointer-events: none !important;
  transform: translateY(-50%) !important;
  transition: all .6s ease !important;
}

#page-cadastro .viking-toggle__icon--left {
  left: 20px !important;
  fill: rgba(139, 115, 85, .5) !important;
}

#page-cadastro .viking-toggle__icon--right {
  right: 20px !important;
  fill: rgba(139, 115, 85, .35) !important;
}

#page-cadastro .viking-toggle__chain {
  position: absolute !important;
  top: 50% !important;
  width: 8px !important;
  height: 50px !important;
  border-radius: 4px !important;
  transform: translateY(-50%) !important;
  background: linear-gradient(
    90deg,
    #2a2018 0%,
    #5a4a3a 15%,
    var(--vt-bronze) 40%,
    var(--vt-bronze) 60%,
    #5a4a3a 85%,
    #2a2018 100%
  ) !important;
  box-shadow:
    inset 0 0 4px rgba(0, 0, 0, .6),
    0 3px 8px rgba(0, 0, 0, .5) !important;
}

#page-cadastro .viking-toggle__chain--left {
  left: -4px !important;
}

#page-cadastro .viking-toggle__chain--right {
  right: -4px !important;
}

#page-cadastro .viking-toggle__chain::before,
#page-cadastro .viking-toggle__chain::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 14px;
  height: 14px;
  border: 3px solid var(--vt-bronze);
  border-radius: 50%;
  background: var(--vt-wood-dark);
  transform: translateX(-50%);
}

#page-cadastro .viking-toggle__chain::before {
  top: -10px;
}

#page-cadastro .viking-toggle__chain::after {
  bottom: -10px;
}

#page-cadastro .viking-toggle__embers {
  position: absolute !important;
  inset: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  border-radius: 44px !important;
  transition: opacity .6s ease !important;
}

#page-cadastro .viking-toggle__ember {
  position: absolute !important;
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
  background: radial-gradient(
    circle,
    var(--vt-gold-bright) 0%,
    var(--vt-fire) 40%,
    transparent 70%
  ) !important;
  animation: vikingEmberFloat 2.5s ease-out infinite !important;
}

#page-cadastro .viking-toggle__ember:nth-child(1) {
  right: 22%;
  bottom: 35%;
}

#page-cadastro .viking-toggle__ember:nth-child(2) {
  right: 28%;
  bottom: 45%;
  animation-delay: .4s !important;
}

#page-cadastro .viking-toggle__ember:nth-child(3) {
  right: 18%;
  bottom: 50%;
  animation-delay: .8s !important;
}

#page-cadastro .viking-toggle__ember:nth-child(4) {
  right: 32%;
  bottom: 40%;
  animation-delay: 1.2s !important;
}

#page-cadastro .viking-toggle__checkbox:checked ~ .viking-toggle__track .viking-toggle__knob {
  left: calc(100% - 68px) !important;
  background: radial-gradient(
    circle at 35% 35%,
    var(--vt-gold-bright) 0%,
    var(--vt-gold) 25%,
    #a07820 50%,
    #705010 80%,
    #503800 100%
  ) !important;
  box-shadow:
    0 6px 35px var(--vt-fire-glow),
    0 3px 15px rgba(255, 100, 30, .5),
    0 0 60px rgba(255, 120, 40, .3),
    inset 0 3px 6px rgba(255, 255, 255, .25),
    inset 0 -4px 8px rgba(0, 0, 0, .3) !important;
}

#page-cadastro .viking-toggle__checkbox:checked ~ .viking-toggle__track .viking-toggle__knob::after {
  color: var(--vt-gold-bright) !important;
  text-shadow:
    0 0 15px var(--vt-fire-glow),
    0 0 30px rgba(255, 150, 50, .5),
    0 1px 2px rgba(0, 0, 0, .5) !important;
}

#page-cadastro .viking-toggle__checkbox:checked ~ .viking-toggle__track .viking-toggle__runes {
  color: rgba(255, 150, 50, .5) !important;
  text-shadow:
    0 0 20px var(--vt-fire-glow),
    0 0 40px rgba(255, 100, 30, .3) !important;
}

#page-cadastro .viking-toggle__checkbox:checked ~ .viking-toggle__track .viking-toggle__glow,
#page-cadastro .viking-toggle__checkbox:checked ~ .viking-toggle__track .viking-toggle__embers {
  opacity: 1 !important;
}

#page-cadastro .viking-toggle__checkbox:checked ~ .viking-toggle__track .viking-toggle__icon--right {
  fill: var(--vt-gold) !important;
  filter:
    drop-shadow(0 0 8px var(--vt-fire-glow))
    drop-shadow(0 0 15px rgba(255, 100, 30, .4)) !important;
}

#page-cadastro .viking-toggle:hover .viking-toggle__track {
  transform: translateY(-2px) !important;
}

#page-cadastro .viking-toggle:active .viking-toggle__knob {
  transform: translateY(-50%) scale(.95) !important;
}

@keyframes vikingEmberFloat {
  0% {
    opacity: 0;
    transform: translateY(0) scale(1) rotate(0deg);
  }

  15% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: translateY(-40px) scale(0) rotate(180deg);
  }
}

@media (max-width: 720px) {
  #page-cadastro .cad-imob-row {
    flex-direction: column;
    align-items: flex-start;
  }

  #page-cadastro .viking-toggle {
    transform: scale(.68);
    margin-right: 0;
  }
}

.nav-item[data-page="vincular"],
.nav-item[data-page="manutencao"],
.nav-item-sub[data-page="vincular"],
.nav-item-sub[data-page="manutencao"],
[data-navigate="vincular"],
[data-navigate="manutencao"] {
  display: none !important;
}

#page-ativo .atv-maint-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

#page-ativo .atv-maint-head .form-section-title {
  margin-bottom: .25rem;
}

.atv-maint-dialog {
  max-width: 820px !important;
}

.atv-maint-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem;
}

.atv-maint-span-2 {
  grid-column: 1 / -1;
}

.atv-maint-form-grid .form-input,
.atv-maint-form-grid .form-textarea {
  background:
    linear-gradient(180deg, rgba(15,23,42,.92), rgba(2,6,23,.94));
  border: 1px solid rgba(148,163,184,.14);
}

.atv-maint-form-grid .form-input:focus,
.atv-maint-form-grid .form-textarea:focus {
  border-color: rgba(56,189,248,.45);
  box-shadow:
    0 0 0 1px rgba(56,189,248,.12),
    0 16px 32px -28px rgba(34,211,238,.38);
}

.atv-maint-form-footer {
  margin-top: 1rem;
}

@media (max-width: 760px) {
  #page-ativo .atv-maint-head {
    flex-direction: column;
  }

  #atv-open-maint-modal {
    width: 100%;
    justify-content: center;
  }

  .atv-maint-form-grid {
    grid-template-columns: 1fr;
  }

  .atv-maint-span-2 {
    grid-column: auto;
  }
}

.gm-admin-edit-dialog {
  width: min(1120px, 94vw) !important;
  max-width: 1120px !important;
  max-height: 90vh !important;
  overflow: auto !important;
}

.gm-admin-edit-form {
  padding-bottom: 0 !important;
}

.gm-admin-edit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem;
}

.gm-admin-image-editor {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}

.gm-admin-image-preview {
  width: 150px;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, .22);
  background: rgba(15, 23, 42, .65);
}

.gm-admin-image-preview img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.gm-admin-image-actions {
  display: grid;
  gap: .65rem;
}

.gm-admin-image-actions small {
  color: #94a3b8;
  font-size: .82rem;
}

.gm-admin-span-2 {
  grid-column: 1 / -1;
}

.gm-admin-machine-box {
  margin-top: 1rem;
  padding: 1rem;
  border-radius: 18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.08), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
  border: 1px solid rgba(148,163,184,.12);
}

.gm-admin-machine-head {
  display: grid;
  gap: .2rem;
  margin-bottom: .9rem;
}

.gm-admin-machine-head strong {
  color: #f8fbff;
  font-weight: 900;
}

.gm-admin-machine-head span {
  color: #94a3b8;
  font-size: .82rem;
}

.gm-admin-check {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .85rem;
  border-radius: 14px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(148,163,184,.10);
}

.gm-admin-check input {
  width: 18px;
  height: 18px;
}

.gm-admin-check span {
  display: grid;
  gap: .1rem;
}

.gm-admin-check strong {
  color: #f8fbff;
  font-size: .9rem;
}

.gm-admin-check small {
  color: #94a3b8;
  font-size: .76rem;
}

.gm-admin-edit-footer {
  margin-top: 1rem;
}

.gm-asset-admin-row {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto auto;
  gap: .85rem;
  align-items: center;

  padding: .75rem;
  border-radius: 16px;

  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.018));

  border: 1px solid rgba(148,163,184,.10);

  transition:
    transform .14s ease,
    border-color .14s ease,
    background .14s ease,
    box-shadow .14s ease;
}

.gm-asset-admin-row:hover {
  transform: translateY(-1px);
  border-color: rgba(56,189,248,.26);
  box-shadow:
    0 16px 32px -26px rgba(34,211,238,.28),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.gm-asset-admin-thumb {
  width: 58px;
  height: 58px;
  border-radius: 14px;
  overflow: hidden;
  background: rgba(15,23,42,.9);
  border: 1px solid rgba(148,163,184,.12);
}

.gm-asset-admin-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gm-asset-admin-main {
  min-width: 0;
}

.gm-asset-admin-title {
  display: flex;
  align-items: center;
  gap: .5rem;
  min-width: 0;
}

.gm-asset-admin-title strong {
  color: #f8fbff;
  font-size: .94rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gm-asset-admin-title span {
  color: #7f91a8;
  font-size: .74rem;
  font-weight: 800;
}

.gm-asset-admin-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin-top: .32rem;
}

.gm-asset-admin-meta span {
  color: #94a3b8;
  font-size: .74rem;
  padding: .16rem .45rem;
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.055);
}

.gm-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: .32rem .7rem;
  border-radius: 999px;
  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  white-space: nowrap;
}

.gm-status-pill.st-livre {
  color: #dcfce7;
  background: rgba(22,101,52,.78);
  border: 1px solid rgba(134,239,172,.34);
}

.gm-status-pill.st-em_uso {
  color: #dbeafe;
  background: rgba(30,64,175,.78);
  border: 1px solid rgba(147,197,253,.36);
}

.gm-status-pill.st-assistencia {
  color: #fff7ed;
  background: rgba(194,65,12,.82);
  border: 1px solid rgba(253,186,116,.40);
}

.gm-status-pill.st-manutencao {
  color: #fefce8;
  background: rgba(161,98,7,.82);
  border: 1px solid rgba(253,224,71,.40);
}

.gm-status-pill.st-baixado {
  color: #f1f5f9;
  background: rgba(51,65,85,.82);
  border: 1px solid rgba(203,213,225,.26);
}

.btn-ghost.danger {
  color: #fecaca;
  border-color: rgba(248,113,113,.28);
}

.btn-ghost.danger:hover {
  background: rgba(127,29,29,.24);
  border-color: rgba(248,113,113,.42);
}

@media (max-width: 900px) {
  .gm-admin-edit-grid {
    grid-template-columns: 1fr;
  }

  .gm-admin-span-2 {
    grid-column: auto;
  }

  .gm-admin-image-editor {
    grid-template-columns: 1fr;
  }

  .gm-admin-image-preview {
    width: min(180px, 100%);
  }

  .gm-asset-admin-row {
    grid-template-columns: 52px minmax(0, 1fr);
  }

  .gm-asset-admin-status,
  .gm-asset-admin-row .admin-actions {
    grid-column: 1 / -1;
  }

  .gm-asset-admin-row .admin-actions {
    justify-content: flex-end;
  }
}

.gm-admin-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.15rem;
  border-radius: 22px;
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.10), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.78), rgba(2,6,23,.78));
  border: 1px solid rgba(148,163,184,.12);
}

.gm-admin-eyebrow {
  display: inline-flex;
  margin-bottom: .35rem;
  color: #38bdf8;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.gm-admin-hero-actions {
  display: flex;
  gap: .65rem;
  flex-wrap: wrap;
}

#card-categorias,
#card-setores,
#card-func,
#card-catalogo {
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.055), transparent 32%),
    linear-gradient(180deg, rgba(15,23,42,.82), rgba(2,6,23,.82));
  border: 1px solid rgba(148,163,184,.12);
  border-radius: 22px;
  overflow: hidden;
}

#card-categorias .admin-card-header,
#card-setores .admin-card-header,
#card-func .admin-card-header,
#card-catalogo .admin-card-header {
  padding-bottom: .85rem;
  margin-bottom: .85rem;
  border-bottom: 1px solid rgba(148,163,184,.10);
}

#card-categorias .admin-row,
#card-setores .admin-row,
#card-func .admin-row,
#card-catalogo .admin-row {
  padding: .85rem;
  margin-bottom: .85rem;
  border-radius: 16px;
  background: rgba(255,255,255,.025);
  border: 1px solid rgba(148,163,184,.08);
}

.gm-admin-base-row,
.gm-admin-employee-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .85rem;
  align-items: center;
  padding: .75rem;
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.038), rgba(255,255,255,.016));
  border: 1px solid rgba(148,163,184,.10);
  transition:
    transform .14s ease,
    border-color .14s ease,
    background .14s ease,
    box-shadow .14s ease;
}

.gm-admin-base-row:hover,
.gm-admin-employee-row:hover {
  transform: translateY(-1px);
  border-color: rgba(56,189,248,.25);
  box-shadow:
    0 16px 32px -28px rgba(34,211,238,.30),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.gm-admin-base-main,
.gm-admin-employee-main {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-width: 0;
}

.gm-admin-base-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 13px;
  background: rgba(56,189,248,.10);
  border: 1px solid rgba(56,189,248,.16);
}

.gm-admin-base-view,
.gm-admin-employee-view {
  display: grid;
  gap: .1rem;
  min-width: 0;
}

.gm-admin-base-view strong,
.gm-admin-employee-view strong {
  color: #f8fbff;
  font-size: .92rem;
  font-weight: 900;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gm-admin-base-view small,
.gm-admin-employee-view small {
  color: #8fa2bb;
  font-size: .74rem;
}

.gm-admin-base-edit {
  width: min(360px, 100%);
}

.gm-admin-employee-edit {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: .5rem;
  width: 100%;
}

.gm-admin-base-edit .form-input,
.gm-admin-employee-edit .form-input {
  min-height: 38px;
  padding: .55rem .7rem;
}

.admin-actions {
  display: flex;
  gap: .4rem;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.btn-ghost {
  min-height: 34px;
  padding: .42rem .7rem;
  border-radius: 10px;
  font-size: .76rem;
  font-weight: 850;
  background:
    linear-gradient(180deg, rgba(15,23,42,.88), rgba(2,6,23,.88));
  border: 1px solid rgba(148,163,184,.13);
  color: #dbeafe;
}

.btn-ghost:hover {
  background:
    linear-gradient(135deg, rgba(37,99,235,.30), rgba(8,145,178,.18));
  border-color: rgba(56,189,248,.28);
}

.btn-ghost.danger {
  color: #fecaca;
  border-color: rgba(248,113,113,.28);
}

.btn-ghost.danger:hover {
  background: rgba(127,29,29,.24);
  border-color: rgba(248,113,113,.42);
}

@media (max-width: 920px) {
  .gm-admin-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  .gm-admin-base-row,
  .gm-admin-employee-row {
    grid-template-columns: 1fr;
  }

  .gm-admin-employee-edit {
    grid-template-columns: 1fr;
  }

  .admin-actions {
    justify-content: flex-start;
  }
}

.gm-admin-layout {
  display: grid;
  grid-template-columns: minmax(360px, 520px) minmax(0, 1fr);
  gap: 1.25rem;
  align-items: start;
}

.gm-admin-side,
.gm-admin-catalog {
  border-radius: 24px;
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.075), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.86), rgba(2,6,23,.88));
  border: 1px solid rgba(148,163,184,.12);
  box-shadow:
    0 28px 70px -52px rgba(0,0,0,.95),
    inset 0 1px 0 rgba(255,255,255,.045);
  overflow: hidden;
}

.gm-admin-side {
  position: sticky;
  top: 1rem;
  min-height: calc(100vh - 2rem);
  padding: 1rem;
}

.gm-admin-catalog {
  padding: 1rem;
  min-height: calc(100vh - 2rem);
}

.gm-admin-section-head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .25rem .25rem 1rem;
  border-bottom: 1px solid rgba(148,163,184,.10);
  margin-bottom: 1rem;
}

.gm-admin-section-head h2 {
  color: #f8fbff;
  font-size: 1.15rem;
  font-weight: 950;
  margin: .18rem 0;
}

.gm-admin-section-head p {
  color: #8fa2bb;
  font-size: .82rem;
  line-height: 1.4;
}

.gm-admin-kicker {
  color: #38bdf8;
  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.gm-admin-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .45rem;
  padding: .4rem;
  margin-bottom: 1rem;
  border-radius: 16px;
  background: rgba(2,6,23,.62);
  border: 1px solid rgba(148,163,184,.10);
}

.gm-admin-tab {
  min-height: 42px;
  border: 0;
  border-radius: 12px;
  cursor: pointer;
  color: #8fa2bb;
  background: transparent;
  font-size: .78rem;
  font-weight: 900;
  transition:
    background .14s ease,
    color .14s ease,
    box-shadow .14s ease,
    transform .14s ease;
}

.gm-admin-tab:hover {
  color: #dff7ff;
  background: rgba(255,255,255,.045);
}

.gm-admin-tab.active {
  color: #e8f7ff;
  background:
    linear-gradient(135deg, rgba(37,99,235,.72), rgba(8,145,178,.55));
  box-shadow:
    0 14px 28px -20px rgba(34,211,238,.45),
    inset 0 1px 0 rgba(255,255,255,.12);
}

.gm-admin-tab-panel {
  display: none;
}

.gm-admin-tab-panel.active {
  display: block;
  animation: fadeInUp .22s ease-out;
}

.gm-admin-panel-title {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .85rem;
}

.gm-admin-panel-title h3 {
  color: #f8fbff;
  font-size: 1rem;
  font-weight: 950;
}

.gm-admin-panel-title p {
  color: #8fa2bb;
  font-size: .78rem;
}

.gm-admin-create-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .6rem;
  padding: .75rem;
  margin-bottom: .85rem;
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014));
  border: 1px solid rgba(148,163,184,.10);
}

.gm-admin-create-row-3 {
  grid-template-columns: minmax(0, 1fr);
}

.gm-admin-create-row-3 .btn-premium {
  width: fit-content;
  justify-self: end;
}

.gm-admin-list {
  max-height: calc(100vh - 330px);
  overflow: auto;
  padding-right: .25rem;
}

.gm-admin-catalog-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 210px 190px auto;
  gap: .65rem;
  align-items: center;
  padding: .75rem;
  margin-bottom: .85rem;
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014));
  border: 1px solid rgba(148,163,184,.10);
}

.gm-admin-assets-list {
  max-height: calc(100vh - 260px);
  overflow: auto;
  padding-right: .25rem;
}

.gm-admin-base-row,
.gm-admin-employee-row,
.gm-asset-admin-row {
  border-radius: 16px !important;
  background:
    linear-gradient(180deg, rgba(15,23,42,.74), rgba(2,6,23,.70)) !important;
  border: 1px solid rgba(148,163,184,.10) !important;
}

.gm-admin-base-row + .gm-admin-base-row,
.gm-admin-employee-row + .gm-admin-employee-row,
.gm-asset-admin-row + .gm-asset-admin-row {
  margin-top: .55rem;
}

.gm-admin-base-icon {
  background:
    linear-gradient(135deg, rgba(56,189,248,.15), rgba(37,99,235,.08)) !important;
  border: 1px solid rgba(56,189,248,.20) !important;
}

#card-categorias,
#card-setores,
#card-func {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

@media (max-width: 1180px) {
  .gm-admin-layout {
    grid-template-columns: 1fr;
  }

  .gm-admin-side {
    position: relative;
    top: auto;
    min-height: auto;
  }

  .gm-admin-catalog {
    min-height: auto;
  }

  .gm-admin-list,
  .gm-admin-assets-list {
    max-height: none;
  }
}

@media (max-width: 760px) {
  .gm-admin-tabs {
    grid-template-columns: 1fr;
  }

  .gm-admin-create-row,
  .gm-admin-catalog-toolbar {
    grid-template-columns: 1fr;
  }

  .gm-admin-create-row .btn-premium,
  .gm-admin-catalog-toolbar .btn-premium {
    width: 100%;
    justify-content: center;
  }
}


.page-assistencia-v2 .main-wrapper {
  padding-top: 0;
}

.assist-v2-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;

  margin-bottom: 1.25rem;
  padding: 1.2rem;

  border-radius: 24px;

  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.12), transparent 32%),
    radial-gradient(circle at 100% 0%, rgba(37,99,235,.10), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.84), rgba(2,6,23,.86));

  border: 1px solid rgba(148,163,184,.12);

  box-shadow:
    0 26px 70px -54px rgba(0,0,0,.96),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.assist-v2-eyebrow {
  display: inline-flex;
  margin-bottom: .35rem;

  color: #38bdf8;
  font-size: .7rem;
  font-weight: 950;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.assist-v2-main-action {
  min-height: 44px;
  white-space: nowrap;
}

.assist-v2-shell {
  display: grid;
  gap: 1.05rem;
}

.assist-v2-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .9rem;
}

.assist-v2-kpi {
  position: relative;

  display: flex;
  align-items: center;
  gap: .85rem;

  min-height: 92px;
  padding: 1rem;

  border-radius: 20px;

  background:
    linear-gradient(180deg, rgba(15,23,42,.84), rgba(2,6,23,.82));

  border: 1px solid rgba(148,163,184,.11);

  box-shadow:
    0 18px 42px -34px rgba(0,0,0,.94),
    inset 0 1px 0 rgba(255,255,255,.045);

  overflow: hidden;
}

.assist-v2-kpi::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .75;
  background: radial-gradient(circle at 0% 0%, var(--assist-glow, rgba(56,189,248,.12)), transparent 38%);
}

.assist-v2-kpi-icon {
  width: 44px;
  height: 44px;

  display: grid;
  place-items: center;

  border-radius: 15px;

  color: var(--assist-color, #38bdf8);
  background: color-mix(in srgb, var(--assist-color, #38bdf8) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--assist-color, #38bdf8) 24%, transparent);
}

.assist-v2-kpi span {
  display: block;

  color: #8fa2bb;
  font-size: .76rem;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.assist-v2-kpi strong {
  display: block;

  color: #f8fbff;
  font-size: 1.75rem;
  line-height: 1.05;
  font-weight: 950;
}

.assist-v2-kpi.is-open {
  --assist-color: #38bdf8;
  --assist-glow: rgba(56,189,248,.12);
}

.assist-v2-kpi.is-progress {
  --assist-color: #f59e0b;
  --assist-glow: rgba(245,158,11,.12);
}

.assist-v2-kpi.is-done {
  --assist-color: #22c55e;
  --assist-glow: rgba(34,197,94,.12);
}

.assist-v2-kpi.is-critical {
  --assist-color: #ef4444;
  --assist-glow: rgba(239,68,68,.12);
}

.assist-v2-create,
.assist-v2-board {
  padding: 1rem;

  border-radius: 24px;

  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.075), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.86), rgba(2,6,23,.88));

  border: 1px solid rgba(148,163,184,.12);

  box-shadow:
    0 28px 70px -54px rgba(0,0,0,.96),
    inset 0 1px 0 rgba(255,255,255,.045);
}

.assist-v2-create-head,
.assist-v2-board-head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;

  padding-bottom: .9rem;
  margin-bottom: .9rem;

  border-bottom: 1px solid rgba(148,163,184,.10);
}

.assist-v2-create-head h2,
.assist-v2-board-head h2 {
  color: #f8fbff;
  font-size: 1.15rem;
  font-weight: 950;
}

.assist-v2-create-head p,
.assist-v2-board-head p {
  color: #8fa2bb;
  font-size: .82rem;
  line-height: 1.4;
}

.assist-v2-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem;
}

.assist-v2-span-2 {
  grid-column: 1 / -1;
}

.assist-v2-picked-wrap {
  display: flex;
  align-items: center;
  gap: .6rem;
  flex-wrap: wrap;
  margin-top: .55rem;
}

.assist-v2-picked {
  padding: .55rem .7rem;
  border-radius: 14px;
  background: rgba(34,197,94,.10);
  border: 1px solid rgba(34,197,94,.20);
  color: #dcfce7;
}

.assist-v2-suggestions {
  max-height: 260px;
  margin-top: .55rem;
  overflow: auto;

  border-radius: 16px;
  background: rgba(2,6,23,.92);
  border: 1px solid rgba(148,163,184,.12);
}

.assist-v2-suggestions li {
  padding: .75rem;
  border-bottom: 1px solid rgba(148,163,184,.08);
  cursor: pointer;
}

.assist-v2-suggestions li:hover {
  background: rgba(56,189,248,.08);
}

.assist-v2-type {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem;
}

.assist-v2-type .pill-btn {
  min-height: 40px;
  border-radius: 12px;
}

.locked-input {
  position: relative;
}

.locked-input .lock-ico {
  position: absolute;
  right: .8rem;
  top: 50%;
  transform: translateY(-50%);
  opacity: .75;
}

.locked-hint {
  margin-top: .3rem;
  color: #7f91a8;
  font-size: .72rem;
}

.assist-v2-file {
  min-height: 96px;

  display: flex;
  align-items: center;
  gap: .8rem;

  padding: 1rem;

  border-radius: 18px;
  border: 1px dashed rgba(56,189,248,.30);

  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.09), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014));

  cursor: pointer;
}

.assist-v2-file .file-drop__icon {
  width: 46px;
  height: 46px;

  display: grid;
  place-items: center;

  border-radius: 15px;
  color: #bae6fd;
  background: rgba(56,189,248,.12);
  border: 1px solid rgba(56,189,248,.20);
}

.assist-v2-file .file-drop__text {
  display: grid;
  gap: .2rem;
}

.assist-v2-file .file-drop__text strong {
  color: #f8fbff;
}

.assist-v2-file .file-drop__text span {
  color: #8fa2bb;
  font-size: .78rem;
}

.assist-v2-preview {
  margin-top: .75rem;
}

.assist-v2-preview .preview-image {
  max-width: 220px;
  max-height: 150px;
  object-fit: contain;
  border-radius: 14px;
  border: 1px solid rgba(148,163,184,.12);
}

.assist-v2-actions {
  margin-top: 1rem;
}

.assist-v2-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 190px 190px;
  gap: .65rem;

  padding: .75rem;
  margin-bottom: .9rem;

  border-radius: 18px;

  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014));

  border: 1px solid rgba(148,163,184,.10);
}

#ast-list.assist-list {
  display: grid;
  gap: .8rem;
  max-height: none;
  overflow: visible;
  padding-right: 0;
}

#ast-list .assist-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: .9rem;
  align-items: start;

  padding: .9rem;

  border-radius: 18px;

  background:
    linear-gradient(180deg, rgba(15,23,42,.82), rgba(2,6,23,.78));

  border: 1px solid rgba(148,163,184,.11);

  box-shadow:
    0 18px 42px -36px rgba(0,0,0,.92),
    inset 0 1px 0 rgba(255,255,255,.04);

  transition:
    transform .14s ease,
    border-color .14s ease,
    box-shadow .14s ease;
}

#ast-list .assist-card:hover {
  transform: translateY(-1px);
  border-color: rgba(56,189,248,.24);
  box-shadow:
    0 20px 46px -34px rgba(34,211,238,.30),
    inset 0 1px 0 rgba(255,255,255,.05);
}

#ast-list .assist-id {
  min-width: 58px;

  color: #93c5fd;
  font-size: .82rem;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
}

#ast-list .assist-card__body {
  margin-top: 0;
  display: grid;
  gap: .55rem;
  min-width: 0;
}

#ast-list .assist-asset {
  color: #f8fbff;
  font-size: .95rem;
  font-weight: 950;
}

#ast-list .assist-asset-cat {
  color: #8fa2bb;
  font-size: .75rem;
  font-weight: 800;
}

#ast-list .assist-desc {
  color: #b6c3d5;
  font-size: .86rem;
  line-height: 1.45;
}

#ast-list .assist-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;

  color: #7f91a8;
  font-size: .75rem;
}

#ast-list .assist-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}

#ast-list .assist-card__actions {
  display: flex !important;
  flex-direction: column;
  gap: .45rem;
  min-width: 128px;
  margin-top: 0;
}

#ast-list .assist-card__actions .btn-ui {
  width: 100%;
  min-height: 38px;
}

.assist-v2-empty {
  padding: 1rem;
  border-radius: 16px;

  color: #8fa2bb;
  background: rgba(255,255,255,.025);
  border: 1px dashed rgba(148,163,184,.16);
}

@media (max-width: 1120px) {
  .assist-v2-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #ast-list .assist-card {
    grid-template-columns: 1fr;
  }

  #ast-list .assist-card__actions {
    flex-direction: row;
    min-width: 0;
  }
}

@media (max-width: 760px) {
  .assist-v2-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  .assist-v2-main-action {
    width: 100%;
    justify-content: center;
  }

  .assist-v2-kpis,
  .assist-v2-form-grid,
  .assist-v2-toolbar {
    grid-template-columns: 1fr;
  }

  .assist-v2-span-2 {
    grid-column: auto;
  }

  .assist-v2-type {
    grid-template-columns: 1fr;
  }

  #ast-list .assist-card__actions {
    flex-direction: column;
  }
}

.ast-modal-extra-info {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .65rem;
  margin-bottom: 1rem;
}

.ast-detail-mini-card {
  padding: .75rem;
  border-radius: 16px;

  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.016));

  border: 1px solid rgba(148,163,184,.10);
}

.ast-detail-mini-card span {
  display: block;
  margin-bottom: .25rem;

  color: #7f91a8;
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.ast-detail-mini-card strong {
  color: #f8fbff;
  font-size: .84rem;
}

.ast-modal-close-obs {
  margin-top: 1rem;
  padding: .9rem;
  border-radius: 16px;

  background:
    radial-gradient(circle at 0% 0%, rgba(34,197,94,.08), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014));

  border: 1px solid rgba(34,197,94,.18);
}

.ast-modal-close-obs span {
  display: block;
  margin-bottom: .35rem;

  color: #86efac;
  font-size: .7rem;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.ast-modal-close-obs p {
  color: #dcfce7;
  line-height: 1.45;
}

.ast-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 26px;
  padding: .26rem .65rem;

  border-radius: 999px;

  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.ast-chip--status-aberto {
  color: #dbeafe;
  background: rgba(37,99,235,.18);
  border-color: rgba(147,197,253,.30);
}

.ast-chip--status-andamento {
  color: #fef3c7;
  background: rgba(245,158,11,.18);
  border-color: rgba(252,211,77,.30);
}

.ast-chip--status-fechada {
  color: #dcfce7;
  background: rgba(34,197,94,.16);
  border-color: rgba(134,239,172,.28);
}

.ast-chip--status-critico,
.ast-chip--prio-alta {
  color: #fee2e2;
  background: rgba(239,68,68,.18);
  border-color: rgba(252,165,165,.30);
}

.ast-chip--prio-media {
  color: #fef3c7;
  background: rgba(245,158,11,.16);
  border-color: rgba(252,211,77,.28);
}

.ast-chip--prio-baixa {
  color: #dcfce7;
  background: rgba(34,197,94,.14);
  border-color: rgba(134,239,172,.26);
}

.ast-chip--type-corretiva {
  color: #e0f2fe;
  background: rgba(14,165,233,.14);
  border-color: rgba(125,211,252,.24);
}

.ast-chip--type-preventiva {
  color: #e0e7ff;
  background: rgba(99,102,241,.16);
  border-color: rgba(165,180,252,.26);
}

.ast-chip--type-instalacao {
  color: #f5f3ff;
  background: rgba(139,92,246,.16);
  border-color: rgba(196,181,253,.26);
}

.ast-chip--type-upgrade {
  color: #fce7f3;
  background: rgba(236,72,153,.15);
  border-color: rgba(249,168,212,.26);
}

.ast-finish-dialog {
  max-width: 760px !important;
}

.ast-finish-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  margin-bottom: 1rem;
}

.ast-finish-summary > div {
  padding: .85rem;
  border-radius: 16px;

  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.016));

  border: 1px solid rgba(148,163,184,.10);
}

.ast-finish-summary span {
  display: block;
  margin-bottom: .25rem;

  color: #7f91a8;
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .065em;
  text-transform: uppercase;
}

.ast-finish-summary strong {
  color: #f8fbff;
  font-size: .9rem;
}

.ast-finish-check {
  display: flex;
  align-items: flex-start;
  gap: .75rem;

  margin-top: 1rem;
  padding: .9rem;

  border-radius: 16px;

  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.07), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014));

  border: 1px solid rgba(148,163,184,.12);
}

.ast-finish-check input {
  width: 18px;
  height: 18px;
  margin-top: .15rem;
}

.ast-finish-check span {
  display: grid;
  gap: .15rem;
}

.ast-finish-check strong {
  color: #f8fbff;
  font-size: .9rem;
}

.ast-finish-check small {
  color: #8fa2bb;
  font-size: .76rem;
  line-height: 1.35;
}

@media (max-width: 840px) {
  .ast-modal-extra-info,
  .ast-finish-summary {
    grid-template-columns: 1fr;
  }
}

/* Assistência — refino visual real */
#page-assistencia.page-assistencia-v2 {
  --ast-bg: #07111f;
  --ast-panel: rgba(15, 23, 42, .78);
  --ast-panel-2: rgba(2, 6, 23, .74);
  --ast-border: rgba(148, 163, 184, .14);
  --ast-border-strong: rgba(56, 189, 248, .28);
  --ast-text: #f8fbff;
  --ast-muted: #8fa2bb;
  --ast-blue: #38bdf8;
  --ast-cyan: #06b6d4;
}

#page-assistencia .assist-v2-hero {
  min-height: 112px;
  padding: 1.35rem 1.45rem;
  border-radius: 28px;
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.16), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(37,99,235,.14), transparent 32%),
    linear-gradient(135deg, rgba(15,23,42,.92), rgba(2,6,23,.94));
  border: 1px solid rgba(56,189,248,.16);
}

#page-assistencia .assist-v2-hero .page-title {
  font-size: clamp(1.8rem, 2.4vw, 2.7rem);
  letter-spacing: -.04em;
}

#page-assistencia .assist-v2-main-action {
  border-radius: 16px;
  min-height: 48px;
  padding-inline: 1.15rem;
  background:
    linear-gradient(135deg, #2563eb, #06b6d4);
  box-shadow:
    0 16px 32px -24px rgba(34,211,238,.75),
    inset 0 1px 0 rgba(255,255,255,.18);
}

#page-assistencia .assist-v2-kpis {
  gap: .75rem;
}

#page-assistencia .assist-v2-kpi {
  min-height: 82px;
  padding: .9rem;
  border-radius: 22px;
  background:
    radial-gradient(circle at 0% 0%, var(--assist-glow, rgba(56,189,248,.12)), transparent 38%),
    linear-gradient(180deg, rgba(15,23,42,.84), rgba(2,6,23,.86));
}

#page-assistencia .assist-v2-kpi strong {
  font-size: 1.55rem;
}

#page-assistencia #ast-form-card {
  border-radius: 28px;
  padding: 1.2rem;
  background:
    radial-gradient(circle at 12% 0%, rgba(56,189,248,.11), transparent 36%),
    radial-gradient(circle at 88% 0%, rgba(37,99,235,.10), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.88), rgba(2,6,23,.92));
  border: 1px solid rgba(56,189,248,.16);
}

#page-assistencia #ast-form-card .assist-v2-create-head {
  margin-bottom: 1.05rem;
  padding-bottom: 1rem;
}

#page-assistencia #ast-form-card .assist-v2-create-head h2 {
  font-size: 1.35rem;
}

#page-assistencia .assist-v2-form-grid {
  grid-template-columns: 1.05fr .95fr;
  gap: 1rem;
}

#page-assistencia .assist-v2-form-grid > .form-group {
  padding: .9rem;
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014));
  border: 1px solid rgba(148,163,184,.10);
}

#page-assistencia .assist-v2-form-grid > .form-group.assist-v2-span-2 {
  grid-column: 1 / -1;
}

#page-assistencia .form-label {
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #cbd5e1;
}

#page-assistencia #ast-asset-search,
#page-assistencia #ast-desc,
#page-assistencia #ast-priority,
#page-assistencia #ast-owner,
#page-assistencia #ast-sla {
  border-radius: 14px;
  min-height: 46px;
  background:
    linear-gradient(180deg, rgba(15,23,42,.90), rgba(2,6,23,.92));
  border: 1px solid rgba(148,163,184,.14);
}

#page-assistencia #ast-desc {
  min-height: 138px;
}

#page-assistencia #ast-asset-search:focus,
#page-assistencia #ast-desc:focus,
#page-assistencia #ast-priority:focus,
#page-assistencia #ast-sla:focus {
  border-color: rgba(56,189,248,.45);
  box-shadow:
    0 0 0 1px rgba(56,189,248,.14),
    0 18px 38px -30px rgba(34,211,238,.52);
}

#page-assistencia .assist-v2-type {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .55rem;
}

#page-assistencia .assist-v2-type .pill-btn {
  min-height: 48px;
  border-radius: 15px;
  font-weight: 900;
  color: #9fb0c6;
  background:
    linear-gradient(180deg, rgba(15,23,42,.82), rgba(2,6,23,.82));
  border: 1px solid rgba(148,163,184,.12);
  transition:
    transform .14s ease,
    border-color .14s ease,
    background .14s ease,
    box-shadow .14s ease,
    color .14s ease;
}

#page-assistencia .assist-v2-type .pill-btn:hover {
  transform: translateY(-1px);
  color: #e8f7ff;
  border-color: rgba(56,189,248,.30);
}

#page-assistencia .assist-v2-type .pill-btn.is-active {
  color: #f8fbff;
  background:
    linear-gradient(135deg, rgba(37,99,235,.92), rgba(6,182,212,.74));
  border-color: rgba(125,211,252,.38);
  box-shadow:
    0 14px 34px -24px rgba(34,211,238,.72),
    inset 0 1px 0 rgba(255,255,255,.16);
}

#page-assistencia .assist-v2-file {
  justify-content: center;
  min-height: 118px;
  border-radius: 20px;
  background:
    radial-gradient(circle at 50% 0%, rgba(56,189,248,.10), transparent 42%),
    linear-gradient(180deg, rgba(15,23,42,.70), rgba(2,6,23,.76));
}

#page-assistencia .assist-v2-actions {
  position: sticky;
  bottom: .8rem;
  z-index: 2;
  padding: .8rem;
  border-radius: 20px;
  background: rgba(2,6,23,.72);
  border: 1px solid rgba(148,163,184,.10);
  backdrop-filter: blur(14px);
}

#page-assistencia .assist-v2-board {
  border-radius: 28px;
}

#page-assistencia .assist-v2-toolbar {
  border-radius: 20px;
}

#page-assistencia #ast-list .assist-card {
  border-radius: 22px;
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.07), transparent 32%),
    linear-gradient(180deg, rgba(15,23,42,.82), rgba(2,6,23,.86));
}

/* Modal profissional da assistência */
.ast-pro-modal {
  --ast-modal-bg: rgba(2, 6, 23, .92);
}

.ast-pro-backdrop {
  background:
    radial-gradient(circle at 50% 15%, rgba(14,165,233,.10), transparent 35%),
    rgba(0,0,0,.70);
  backdrop-filter: blur(10px);
}

.ast-pro-dialog {
  width: min(1180px, 94vw) !important;
  max-height: 90vh;
  overflow: auto;
  padding: 0 !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.10), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(37,99,235,.10), transparent 32%),
    linear-gradient(180deg, rgba(15,23,42,.96), rgba(2,6,23,.97)) !important;
  border: 1px solid rgba(56,189,248,.18) !important;
  box-shadow:
    0 38px 90px -48px rgba(0,0,0,1),
    0 0 0 1px rgba(255,255,255,.03) inset;
}

.ast-pro-close {
  top: 1rem !important;
  right: 1rem !important;
  z-index: 4;
  background: rgba(15,23,42,.82) !important;
  border-color: rgba(148,163,184,.16) !important;
}

.ast-pro-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.35rem 1.45rem 1rem;
  border-bottom: 1px solid rgba(148,163,184,.12);
}

.ast-pro-title-wrap {
  display: flex;
  align-items: center;
  gap: .95rem;
  min-width: 0;
}

.ast-pro-ticket {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 74px;
  height: 42px;
  padding: 0 .75rem;
  border-radius: 15px;
  color: #bae6fd;
  font-size: .9rem;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  background:
    linear-gradient(135deg, rgba(14,165,233,.18), rgba(37,99,235,.12));
  border: 1px solid rgba(125,211,252,.22);
}

.ast-pro-title-wrap h3 {
  color: #f8fbff;
  font-size: clamp(1.2rem, 2vw, 1.75rem);
  font-weight: 950;
  letter-spacing: -.035em;
}

.ast-pro-title-wrap p {
  margin-top: .2rem;
  color: #8fa2bb;
  font-size: .84rem;
}

.ast-pro-badges {
  display: flex;
  gap: .45rem;
  flex-wrap: wrap;
  justify-content: flex-end;
  padding-right: 3rem;
}

.ast-pro-body {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr) 285px;
  gap: 1rem;
  padding: 1rem 1.45rem;
}

.ast-pro-summary,
.ast-pro-main,
.ast-pro-side {
  min-width: 0;
}

.ast-pro-summary {
  display: grid;
  gap: .65rem;
  align-content: start;
}

.ast-pro-summary-card,
.ast-pro-panel {
  border-radius: 20px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.016));
  border: 1px solid rgba(148,163,184,.11);
  box-shadow:
    0 18px 40px -34px rgba(0,0,0,.9),
    inset 0 1px 0 rgba(255,255,255,.04);
}

.ast-pro-summary-card {
  padding: .85rem;
}

.ast-pro-summary-card span {
  display: block;
  margin-bottom: .45rem;
  color: #7f91a8;
  font-size: .64rem;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.ast-pro-summary-card strong,
.ast-pro-summary-card .chip {
  width: fit-content;
}

.ast-pro-main {
  display: grid;
  gap: 1rem;
}

.ast-pro-panel {
  padding: 1rem;
}

.ast-pro-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .85rem;
}

.ast-pro-kicker {
  color: #38bdf8;
  font-size: .66rem;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.ast-pro-panel h4 {
  color: #f8fbff;
  font-size: 1rem;
  font-weight: 950;
  margin-top: .1rem;
}

.ast-pro-desc {
  min-height: 120px;
  padding: 1rem;
  border-radius: 18px;
  color: #dbeafe;
  line-height: 1.55;
  white-space: pre-wrap;
  background: rgba(2,6,23,.48);
  border: 1px solid rgba(148,163,184,.10);
}

.ast-pro-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .65rem;
  margin-top: .8rem;
}

.ast-pro-meta-grid > div {
  padding: .75rem;
  border-radius: 16px;
  background: rgba(2,6,23,.42);
  border: 1px solid rgba(148,163,184,.09);
}

.ast-pro-meta-grid span {
  display: block;
  margin-bottom: .25rem;
  color: #7f91a8;
  font-size: .65rem;
  font-weight: 950;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.ast-pro-meta-grid strong {
  color: #f8fbff;
  font-size: .82rem;
}

.ast-pro-images {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
  gap: .75rem !important;
}

.ast-pro-images img {
  height: 130px !important;
  border-radius: 16px !important;
  object-fit: cover !important;
  border: 1px solid rgba(125,211,252,.16) !important;
  background: rgba(2,6,23,.5);
  transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}

.ast-pro-images img:hover {
  transform: translateY(-2px);
  border-color: rgba(56,189,248,.38) !important;
  box-shadow: 0 16px 34px -28px rgba(34,211,238,.60);
}

.ast-pro-prevlink {
  padding: .9rem !important;
  border-radius: 16px !important;
  background: rgba(2,6,23,.42) !important;
  border: 1px dashed rgba(148,163,184,.18) !important;
  color: #cbd5e1;
}

.ast-pro-footer {
  display: flex;
  justify-content: flex-end;
  gap: .65rem;
  padding: 1rem 1.45rem 1.3rem;
  border-top: 1px solid rgba(148,163,184,.12);
}

.ast-pro-footer .btn-secondary,
.ast-pro-footer .ast-pro-danger {
  min-height: 44px;
  border-radius: 14px;
  padding-inline: 1rem;
  font-weight: 900;
}

.ast-pro-danger {
  background:
    linear-gradient(135deg, #ef4444, #f97316) !important;
  border: 0 !important;
  color: white !important;
  box-shadow: 0 14px 28px -22px rgba(248,113,113,.75);
}

.ast-modal-extra-info {
  display: none !important;
}

.ast-modal-close-obs {
  margin: 1rem 1.45rem !important;
  border-radius: 18px !important;
}

@media (max-width: 1120px) {
  .ast-pro-body {
    grid-template-columns: 1fr;
  }

  .ast-pro-summary {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .ast-pro-side {
    grid-column: auto;
  }
}

@media (max-width: 760px) {
  #page-assistencia .assist-v2-form-grid,
  #page-assistencia .assist-v2-type,
  .ast-pro-summary,
  .ast-pro-meta-grid {
    grid-template-columns: 1fr;
  }

  .ast-pro-header {
    flex-direction: column;
  }

  .ast-pro-badges {
    justify-content: flex-start;
    padding-right: 0;
  }

  .ast-pro-footer {
    flex-direction: column-reverse;
  }

  .ast-pro-footer button {
    width: 100%;
  }
}

.assist-v2-hero-actions {
  display: flex;
  align-items: center;
  gap: .7rem;
  flex-wrap: wrap;
}

.assist-v2-report-action {
  min-height: 48px;
  border-radius: 16px;
  padding-inline: 1.1rem;
  font-weight: 900;
  color: #dbeafe;
  background:
    linear-gradient(180deg, rgba(15,23,42,.84), rgba(2,6,23,.88));
  border: 1px solid rgba(56,189,248,.20);
  box-shadow:
    0 16px 34px -28px rgba(34,211,238,.55),
    inset 0 1px 0 rgba(255,255,255,.06);
}

.assist-v2-report-action:hover {
  border-color: rgba(56,189,248,.40);
  box-shadow:
    0 18px 38px -28px rgba(34,211,238,.72),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.ast-report-dialog {
  width: min(940px, 94vw) !important;
  max-height: 90vh;
  overflow: auto;
  padding: 0 !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.11), transparent 35%),
    radial-gradient(circle at 100% 0%, rgba(37,99,235,.10), transparent 32%),
    linear-gradient(180deg, rgba(15,23,42,.96), rgba(2,6,23,.97)) !important;
  border: 1px solid rgba(56,189,248,.18) !important;
}

.ast-report-head {
  padding: 1.25rem 1.35rem 1rem;
  border-bottom: 1px solid rgba(148,163,184,.12);
}

.ast-report-head h3 {
  color: #f8fbff;
  font-size: 1.35rem;
  font-weight: 950;
  letter-spacing: -.03em;
}

.ast-report-head p {
  margin-top: .2rem;
  color: #8fa2bb;
  font-size: .86rem;
}

.ast-report-body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
  padding: 1rem 1.35rem;
}

.ast-report-body .form-group {
  padding: .8rem;
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014));
  border: 1px solid rgba(148,163,184,.10);
}

.ast-report-span-2 {
  grid-column: 1 / -1;
}

.ast-report-preview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin: 0 1.35rem 1rem;
  padding: .85rem;
  border-radius: 18px;
  background: rgba(56,189,248,.075);
  border: 1px solid rgba(56,189,248,.16);
}

.ast-report-preview span {
  color: #e0f2fe;
  font-weight: 950;
}

.ast-report-preview small {
  color: #8fa2bb;
}

.ast-report-footer {
  padding: 1rem 1.35rem 1.25rem !important;
}

@media (max-width: 760px) {
  .assist-v2-hero-actions,
  .assist-v2-report-action,
  .assist-v2-main-action {
    width: 100%;
  }

  .ast-report-body {
    grid-template-columns: 1fr;
  }

  .ast-report-span-2 {
    grid-column: auto;
  }

  .ast-report-preview {
    flex-direction: column;
    align-items: flex-start;
  }
}

.ast-report-clean {
  width: min(760px, 94vw) !important;
}

.ast-report-clean-head {
  padding: 1.3rem 1.4rem 1rem;
  border-bottom: 1px solid rgba(148,163,184,.12);
}

.ast-report-clean-head h3 {
  color: #f8fbff;
  font-size: 1.4rem;
  font-weight: 950;
  letter-spacing: -.03em;
}

.ast-report-clean-head p {
  margin-top: .25rem;
  color: #8fa2bb;
  font-size: .86rem;
}

.ast-report-quick {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
  padding: 1rem 1.4rem .35rem;
}

.ast-report-chip {
  min-height: 38px;
  padding: .45rem .85rem;
  border-radius: 999px;
  border: 1px solid rgba(148,163,184,.14);
  background: rgba(15,23,42,.78);
  color: #9fb0c6;
  font-weight: 900;
  cursor: pointer;
  transition:
    transform .14s ease,
    border-color .14s ease,
    background .14s ease,
    color .14s ease,
    box-shadow .14s ease;
}

.ast-report-chip:hover {
  transform: translateY(-1px);
  color: #e8f7ff;
  border-color: rgba(56,189,248,.30);
}

.ast-report-chip.active {
  color: #f8fbff;
  background:
    linear-gradient(135deg, rgba(37,99,235,.90), rgba(6,182,212,.72));
  border-color: rgba(125,211,252,.35);
  box-shadow:
    0 14px 30px -22px rgba(34,211,238,.68),
    inset 0 1px 0 rgba(255,255,255,.15);
}

.ast-report-clean-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .8rem;
  padding: .9rem 1.4rem 1rem;
}

.ast-report-clean-body .form-group {
  padding: 0;
  background: transparent;
  border: 0;
}

.ast-report-wide {
  grid-column: 1 / -1;
}

.ast-report-clean-body .form-input,
.ast-report-clean-body .form-select {
  min-height: 44px;
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(15,23,42,.88), rgba(2,6,23,.90));
  border: 1px solid rgba(148,163,184,.14);
}

.ast-report-clean-preview {
  margin: 0 1.4rem 1rem;
  padding: .9rem;
  border-radius: 18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.10), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014));
  border: 1px solid rgba(56,189,248,.16);
}

.ast-report-clean-preview div {
  display: grid;
  gap: .2rem;
}

.ast-report-clean-preview strong {
  color: #e0f2fe;
  font-size: .95rem;
}

.ast-report-clean-preview span {
  color: #8fa2bb;
  font-size: .78rem;
}

@media (max-width: 720px) {
  .ast-report-clean-body {
    grid-template-columns: 1fr;
  }

  .ast-report-wide {
    grid-column: auto;
  }
}
/* Corrige dropdown branco dos selects no tema escuro */
#page-assistencia select,
.ast-report-modal select,
.ast-report-modal select option {
  background-color: #020617 !important;
  color: #f8fbff !important;
}

#page-assistencia select option:checked,
.ast-report-modal select option:checked {
  background-color: #2563eb !important;
  color: #ffffff !important;
}

#page-assistencia select option:hover,
.ast-report-modal select option:hover {
  background-color: #0f172a !important;
  color: #ffffff !important;
}

/* Reforço global de contraste textual */
:root {
  --text-white: #ffffff;
  --text-main: #f8fafc;
  --text-soft: #e2e8f0;
  --text-muted-strong: #cbd5e1;
}

/* Títulos e textos principais */
.page-title,
.section-title,
.form-section-title,
.card-title,
.asset-title,
.kpi-value,
.kpi-title,
h1, h2, h3, h4,
strong,
b {
  color: var(--text-white) !important;
  -webkit-text-fill-color: unset !important;
  text-shadow:
    0 0 10px rgba(255, 255, 255, .10),
    0 1px 8px rgba(0, 0, 0, .45);
}

/* Subtítulos, descrições e textos cinza */
.page-subtitle,
.form-section p,
.admin-card-sub,
.asset-category,
.asset-label,
.activity-meta,
.kpi-subtitle,
.quick-action-desc,
.upload-hint,
.locked-hint,
small,
.muted {
  color: var(--text-soft) !important;
  opacity: 1 !important;
}

/* Labels dos formulários */
.form-label,
label,
.kpi-title,
.upload-text {
  color: var(--text-main) !important;
  opacity: 1 !important;
  font-weight: 850 !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .35);
}

/* Inputs, selects e textarea */
.form-input,
.form-select,
.form-textarea,
input,
select,
textarea {
  color: #ffffff !important;
  background-color: rgba(2, 6, 23, .72) !important;
}

/* Placeholder ainda cinza, mas legível */
.form-input::placeholder,
.form-textarea::placeholder,
input::placeholder,
textarea::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}

/* Texto dentro dos cards/seções */
.form-section,
.card-premium,
.admin-card,
.asset-card,
.kpi-card,
.quick-action-card,
.activity-feed {
  color: var(--text-main) !important;
}

/* Textos pequenos dentro dos cards */
.form-section span,
.card-premium span,
.asset-card span,
.admin-card span {
  color: inherit;
}

/* Itens que usam cinza apagado */
.text-muted,
.text-slate-400,
.text-slate-500,
.text-gray-400,
.text-gray-500 {
  color: var(--text-muted-strong) !important;
}

/* Badges e pills mais visíveis */
.badge,
.pill,
.status-badge,
.nav-badge,
.pill-soft {
  opacity: 1 !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 6px rgba(0, 0, 0, .35);
}

/* Botões */
.btn-premium,
.btn-secondary,
.btn-ghost,
.btn-ui,
.asset-btn,
button {
  color: #ffffff;
}

/* Select dropdown escuro */
select option {
  background: #020617 !important;
  color: #ffffff !important;
}

/* Glow leve nos títulos de seções */
.form-section-title,
.section-title,
.page-title {
  text-shadow:
    0 0 14px rgba(255, 255, 255, .16),
    0 0 26px rgba(56, 189, 248, .10),
    0 2px 10px rgba(0, 0, 0, .55) !important;
}

/* Assistência — formulário como modal profissional */
body.assist-modal-is-open {
  overflow: hidden;
}

#ast-form-card.assist-modal-open {
  position: fixed !important;
  inset: 0 !important;
  z-index: 3000 !important;

  width: 100vw !important;
  height: 100vh !important;
  max-width: none !important;
  margin: 0 !important;

  display: grid !important;
  place-items: center !important;

  padding: 1.5rem !important;

  background:
    radial-gradient(circle at 50% 0%, rgba(56, 189, 248, .12), transparent 36%),
    rgba(0, 0, 0, .68) !important;

  backdrop-filter: blur(10px);
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#ast-form-card.assist-modal-open > * {
  width: min(1040px, 94vw);
}

#ast-form-card.assist-modal-open .assist-v2-create-head,
#ast-form-card.assist-modal-open .assist-v2-form-grid,
#ast-form-card.assist-modal-open .assist-v2-actions {
  background:
    linear-gradient(180deg, rgba(15, 23, 42, .96), rgba(2, 6, 23, .97));
}

#ast-form-card.assist-modal-open .assist-v2-create-head {
  padding: 1.2rem 1.35rem 1rem;
  border: 1px solid rgba(56, 189, 248, .18);
  border-bottom: 0;
  border-radius: 26px 26px 0 0;
}

#ast-form-card.assist-modal-open .assist-v2-form-grid {
  padding: 1.15rem 1.35rem;
  border-left: 1px solid rgba(56, 189, 248, .18);
  border-right: 1px solid rgba(56, 189, 248, .18);
  max-height: 68vh;
  overflow: auto;
}

#ast-form-card.assist-modal-open .assist-v2-actions {
  margin-top: 0;
  padding: 1rem 1.35rem 1.2rem;
  border: 1px solid rgba(56, 189, 248, .18);
  border-top: 1px solid rgba(148, 163, 184, .10);
  border-radius: 0 0 26px 26px;
  position: static;
}

/* Ativo travado no modal */
.ast-asset-locked #ast-asset-search {
  opacity: .88;
  cursor: not-allowed;
  background:
    linear-gradient(180deg, rgba(15, 23, 42, .74), rgba(2, 6, 23, .84)) !important;
  border-color: rgba(34, 197, 94, .30) !important;
}

.ast-asset-locked::after {
  content: "Ativo selecionado automaticamente";
  display: inline-flex;
  width: fit-content;
  margin-top: .45rem;
  padding: .32rem .65rem;

  border-radius: 999px;

  color: #dcfce7;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .04em;

  background: rgba(34, 197, 94, .12);
  border: 1px solid rgba(34, 197, 94, .24);
}

/* Cabeçalho da aba Assistências do ativo */
.atv-assist-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;

  margin-bottom: 1rem;
  padding-bottom: .9rem;

  border-bottom: 1px solid rgba(148, 163, 184, .12);
}

.atv-assist-head .btn-ui {
  min-height: 42px;
  border-radius: 14px;
  white-space: nowrap;
}

@media (max-width: 760px) {
  #ast-form-card.assist-modal-open {
    padding: .8rem !important;
  }

  #ast-form-card.assist-modal-open > * {
    width: 96vw;
  }

  #ast-form-card.assist-modal-open .assist-v2-form-grid {
    max-height: 72vh;
  }

  .atv-assist-head {
    flex-direction: column;
  }

  .atv-assist-head .btn-ui {
    width: 100%;
  }
}

/* Assistência — search igual Ativos, com camadas e luzes */
.assist-search-uiverse {
  --assist-search-h: 56px;
  --assist-search-radius: 18px;

  position: relative;
  width: 100%;
  height: var(--assist-search-h);
  border-radius: var(--assist-search-radius);
  isolation: isolate;
  overflow: visible;
}

.assist-search-main {
  position: relative;
  z-index: 8;

  width: 100%;
  height: var(--assist-search-h);

  border-radius: var(--assist-search-radius);
  overflow: hidden;

  background:
    linear-gradient(180deg, #07111f 0%, #020617 55%, #07111f 100%);

  border: 1px solid rgba(56, 189, 248, .18);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    inset 0 -1px 0 rgba(56,189,248,.10),
    0 20px 42px -34px rgba(34,211,238,.65);
}

.assist-search-input {
  position: relative;
  z-index: 12;

  width: 100% !important;
  height: var(--assist-search-h) !important;

  padding: 0 1rem 0 3.35rem !important;

  border: 0 !important;
  outline: 0 !important;

  background: transparent !important;

  color: #ffffff !important;
  font-size: .98rem !important;
  font-weight: 850 !important;
  letter-spacing: .01em !important;

  box-shadow: none !important;
}

.assist-search-input::placeholder {
  color: #b8d2ea !important;
  opacity: .95 !important;
}

.assist-search-icon {
  position: absolute;
  z-index: 13;

  left: 19px;
  top: 16px;

  width: 22px;
  height: 22px;

  pointer-events: none;

  filter:
    drop-shadow(0 0 7px rgba(56,189,248,.65))
    drop-shadow(0 0 15px rgba(37,99,235,.45));
}

/* Glow externo */
.assist-search-glow {
  position: absolute;
  inset: -18px;
  z-index: 1;
  overflow: hidden;
  border-radius: calc(var(--assist-search-radius) + 18px);
  pointer-events: none;
}

.assist-search-glow::before {
  content: "";
  position: absolute;
  width: 42%;
  height: 190%;
  left: 50%;
  top: 50%;

  background:
    linear-gradient(
      180deg,
      rgba(56,189,248,0) 0%,
      rgba(56,189,248,.55) 35%,
      rgba(37,99,235,.65) 50%,
      rgba(6,182,212,.42) 65%,
      rgba(56,189,248,0) 100%
    );

  transform: translate(-50%, -50%) rotate(0deg);
  transform-origin: center;

  filter: blur(18px);
  opacity: .72;

  animation: assistSearchRotate 9s linear infinite;
}

/* Bordas escuras animadas */
.assist-search-dark-border {
  position: absolute;
  inset: -2px;
  z-index: 2;
  overflow: hidden;
  border-radius: calc(var(--assist-search-radius) + 2px);
  pointer-events: none;
}

.assist-search-dark-border::before {
  content: "";
  position: absolute;
  width: 28%;
  height: 210%;
  left: 50%;
  top: 50%;

  background:
    linear-gradient(
      180deg,
      rgba(2,6,23,0) 0%,
      rgba(2,6,23,.95) 42%,
      rgba(56,189,248,.20) 50%,
      rgba(2,6,23,.95) 58%,
      rgba(2,6,23,0) 100%
    );

  transform: translate(-50%, -50%) rotate(0deg);
  transform-origin: center;

  animation: assistLoopDark 7.5s linear infinite;
}

.assist-search-dark-border:nth-of-type(2)::before {
  animation-delay: -2.5s;
}

.assist-search-dark-border:nth-of-type(3)::before {
  animation-delay: -5s;
}

/* Luz branca/azulada interna */
.assist-search-white {
  position: absolute;
  inset: -1px;
  z-index: 3;
  overflow: hidden;
  border-radius: calc(var(--assist-search-radius) + 1px);
  pointer-events: none;
}

.assist-search-white::before {
  content: "";
  position: absolute;

  width: 22%;
  height: 210%;
  left: 50%;
  top: 50%;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0) 0%,
      rgba(224,247,255,.72) 47%,
      rgba(56,189,248,.65) 50%,
      rgba(255,255,255,0) 100%
    );

  transform: translate(-50%, -50%) rotate(0deg);
  transform-origin: center;

  filter: blur(6px);
  opacity: .62;

  animation: assistLoopWhite 8.5s linear infinite;
}

/* Borda viva */
.assist-search-border {
  position: absolute;
  inset: 0;
  z-index: 4;
  overflow: hidden;
  border-radius: var(--assist-search-radius);
  pointer-events: none;
}

.assist-search-border::before {
  content: "";
  position: absolute;

  width: 32%;
  height: 210%;
  left: 50%;
  top: 50%;

  background:
    linear-gradient(
      180deg,
      rgba(56,189,248,0) 0%,
      rgba(56,189,248,.95) 45%,
      rgba(37,99,235,.95) 50%,
      rgba(56,189,248,.95) 55%,
      rgba(56,189,248,0) 100%
    );

  transform: translate(-50%, -50%) rotate(0deg);
  transform-origin: center;

  animation: assistLoopBorder 6.5s linear infinite;
}

/* Máscaras dentro do input */
.assist-input-mask,
.assist-blue-mask,
.assist-filter-border {
  position: absolute;
  pointer-events: none;
}

.assist-input-mask {
  inset: 1px;
  z-index: 9;
  border-radius: calc(var(--assist-search-radius) - 1px);

  background:
    linear-gradient(90deg, rgba(2,6,23,.82), transparent 18%, transparent 82%, rgba(2,6,23,.82));
}

.assist-blue-mask {
  z-index: 10;
  left: 0;
  bottom: 0;

  width: 38%;
  height: 2px;

  background:
    linear-gradient(90deg, transparent, rgba(56,189,248,.95), rgba(37,99,235,.85), transparent);

  filter: drop-shadow(0 0 8px rgba(56,189,248,.75));

  animation: assistLineLoop 2.8s ease-in-out infinite;
}

.assist-filter-border {
  z-index: 11;
  inset: 0;
  border-radius: var(--assist-search-radius);
  border: 1px solid rgba(56,189,248,.10);
}

.assist-search-uiverse:hover .assist-search-glow::before,
.assist-search-uiverse:focus-within .assist-search-glow::before {
  opacity: 1;
  filter: blur(20px);
}

.assist-search-uiverse:focus-within .assist-search-main {
  border-color: rgba(56,189,248,.45);
  box-shadow:
    0 0 0 1px rgba(56,189,248,.18),
    0 0 22px rgba(56,189,248,.22),
    0 26px 52px -34px rgba(34,211,238,.90),
    inset 0 1px 0 rgba(255,255,255,.09);
}

/* Toolbar da assistência com search largo */
#page-assistencia .assist-v2-toolbar {
  grid-template-columns: minmax(0, 1fr) 190px 190px !important;
  align-items: center !important;
}

#page-assistencia .assist-search-wide {
  min-width: 0;
}

/* Relatório */
#ast-report-modal .assist-search-report {
  margin-top: .25rem;
}

/* Nova assistência */
#ast-form-card .assist-search-asset {
  margin-top: .1rem;
}

/* Quando o ativo está travado */
.ast-asset-locked .assist-search-main {
  border-color: rgba(34,197,94,.36);
  background:
    linear-gradient(180deg, rgba(6,78,59,.35) 0%, #020617 75%);
}

.ast-asset-locked .assist-search-glow::before {
  background:
    linear-gradient(
      180deg,
      rgba(34,197,94,0) 0%,
      rgba(34,197,94,.50) 42%,
      rgba(56,189,248,.55) 50%,
      rgba(34,197,94,.42) 58%,
      rgba(34,197,94,0) 100%
    );
}

.ast-asset-locked .assist-search-input {
  cursor: not-allowed !important;
  color: #dcfce7 !important;
}

/* Sugestões do campo ativo */
#ast-form-card #ast-asset-sug {
  margin-top: .65rem !important;
  padding: .45rem !important;

  border-radius: 16px !important;
  background:
    linear-gradient(180deg, rgba(15,23,42,.98), rgba(2,6,23,.98)) !important;

  border: 1px solid rgba(56,189,248,.20) !important;

  box-shadow:
    0 24px 55px -32px rgba(0,0,0,.95),
    0 0 0 1px rgba(255,255,255,.03) inset !important;
}

#ast-form-card #ast-asset-sug li,
#ast-form-card #ast-asset-sug .admin-item {
  border-radius: 13px !important;
  background: rgba(15,23,42,.72) !important;
  border: 1px solid rgba(148,163,184,.10) !important;
}

#ast-form-card #ast-asset-sug li:hover,
#ast-form-card #ast-asset-sug .admin-item:hover {
  transform: translateY(-1px);
  border-color: rgba(56,189,248,.34) !important;
  background: rgba(15,23,42,.96) !important;
}

/* Responsivo */
@media (max-width: 760px) {
  #page-assistencia .assist-v2-toolbar {
    grid-template-columns: 1fr !important;
  }

  .assist-search-uiverse {
    --assist-search-h: 52px;
  }

  .assist-search-main,
  .assist-search-input {
    height: 52px !important;
  }

  .assist-search-icon {
    top: 15px;
  }
}

/* Animações */
@keyframes assistSearchRotate {
  100% {
    transform: translate(-50%, -50%) rotate(450deg);
  }
}

@keyframes assistLoopDark {
  100% {
    transform: translate(-50%, -50%) rotate(430deg);
  }
}

@keyframes assistLoopWhite {
  100% {
    transform: translate(-50%, -50%) rotate(420deg);
  }
}

@keyframes assistLoopBorder {
  100% {
    transform: translate(-50%, -50%) rotate(450deg);
  }
}

@keyframes assistLineLoop {
  0% {
    left: 0;
    opacity: .22;
  }

  50% {
    left: 62%;
    opacity: .95;
  }

  100% {
    left: 0;
    opacity: .22;
  }
}

/* Dashboard — card 3D Uiverse adaptado */
#page-dashboard .dash3d-parent {
  width: 100%;
  height: 300px;
  perspective: 1000px;
}

#page-dashboard .dash3d-card {
  height: 100%;
  position: relative;
  border-radius: 50px;
  background: linear-gradient(135deg, var(--dash3d-a, rgb(0, 255, 214)) 0%, var(--dash3d-b, rgb(8, 226, 96)) 100%);
  transition: all 0.5s ease-in-out;
  transform-style: preserve-3d;
  box-shadow:
    rgba(5, 71, 17, 0) 40px 50px 25px -40px,
    rgba(5, 71, 17, 0.2) 0px 25px 25px -5px;
}

#page-dashboard .dash3d-glass {
  transform-style: preserve-3d;
  position: absolute;
  inset: 8px;
  border-radius: 55px;
  border-top-right-radius: 100%;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0.349) 0%, rgba(255, 255, 255, 0.815) 100%);
  transform: translate3d(0px, 0px, 25px);
  border-left: 1px solid white;
  border-bottom: 1px solid white;
  transition: all 0.5s ease-in-out;
}

#page-dashboard .dash3d-content {
  padding: 82px 58px 0px 30px;
  transform: translate3d(0, 0, 26px);
  position: relative;
  z-index: 3;
}

#page-dashboard .dash3d-title {
  display: block;
  color: var(--dash3d-ink, #00894d);
  font-weight: 900;
  font-size: 18px;
  text-transform: uppercase;
  letter-spacing: .04em;
}

#page-dashboard .dash3d-number {
  display: block;
  color: #ffffff;
  font-size: 3.2rem;
  line-height: 1;
  font-weight: 950;
  margin-top: .35rem;
  text-shadow:
    0 2px 0 rgba(0,0,0,.18),
    0 12px 26px rgba(2,6,23,.22);
}

#page-dashboard .dash3d-text {
  display: block;
  color: rgba(7, 89, 133, 0.82);
  font-size: 14px;
  font-weight: 800;
  margin-top: 12px;
  max-width: 190px;
}

#page-dashboard .dash3d-bottom {
  padding: 10px 12px;
  transform-style: preserve-3d;
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transform: translate3d(0, 0, 26px);
  z-index: 5;
}

#page-dashboard .dash3d-view-more {
  display: flex;
  align-items: center;
  width: 40%;
  justify-content: flex-end;
  transition: all 0.2s ease-in-out;
}

#page-dashboard .dash3d-view-more:hover {
  transform: translate3d(0, 0, 10px);
}

#page-dashboard .dash3d-view-more-button {
  background: none;
  border: none;
  color: var(--dash3d-ink, #00c37b);
  font-weight: 950;
  font-size: 12px;
  cursor: pointer;
  white-space: nowrap;
}

#page-dashboard .dash3d-view-arrow {
  fill: none;
  stroke: var(--dash3d-ink, #00c37b);
  stroke-width: 3px;
  max-height: 15px;
  transition: transform .2s ease;
}

#page-dashboard .dash3d-parent.is-open .dash3d-view-arrow {
  transform: rotate(180deg);
}

#page-dashboard .dash3d-buttons-container {
  display: flex;
  gap: 10px;
  transform-style: preserve-3d;
}

#page-dashboard .dash3d-cat-button {
  width: 30px;
  aspect-ratio: 1;
  padding: 5px;
  background: rgb(255, 255, 255);
  border-radius: 50%;
  border: none;
  display: grid;
  place-content: center;
  box-shadow: rgba(5, 71, 17, 0.5) 0px 7px 5px -5px;
  cursor: default;
  color: var(--dash3d-ink, #00894d);
  font-size: 10px;
  font-weight: 950;
  line-height: 1;
}

#page-dashboard .dash3d-cat-button:first-child {
  transition: transform 0.2s ease-in-out 0.4s, box-shadow 0.2s ease-in-out 0.4s;
}

#page-dashboard .dash3d-cat-button:nth-child(2) {
  transition: transform 0.2s ease-in-out 0.6s, box-shadow 0.2s ease-in-out 0.6s;
}

#page-dashboard .dash3d-cat-button:nth-child(3) {
  transition: transform 0.2s ease-in-out 0.8s, box-shadow 0.2s ease-in-out 0.8s;
}

#page-dashboard .dash3d-cat-button:hover {
  background: black;
  color: white;
}

#page-dashboard .dash3d-cat-button:active {
  background: rgb(255, 234, 0);
  color: black;
}

#page-dashboard .dash3d-logo {
  position: absolute;
  right: 0;
  top: 0;
  transform-style: preserve-3d;
}

#page-dashboard .dash3d-circle {
  display: block;
  position: absolute;
  aspect-ratio: 1;
  border-radius: 50%;
  top: 0;
  right: 0;
  box-shadow: rgba(100, 100, 111, 0.2) -10px 10px 20px 0px;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  background: color-mix(in srgb, var(--dash3d-a, #00f9cb) 28%, transparent);
  transition: all 0.5s ease-in-out;
}

#page-dashboard .dash3d-circle1 {
  width: 170px;
  transform: translate3d(0, 0, 20px);
  top: 8px;
  right: 8px;
}

#page-dashboard .dash3d-circle2 {
  width: 140px;
  transform: translate3d(0, 0, 40px);
  top: 10px;
  right: 10px;
  -webkit-backdrop-filter: blur(1px);
  backdrop-filter: blur(1px);
  transition-delay: 0.4s;
}

#page-dashboard .dash3d-circle3 {
  width: 110px;
  transform: translate3d(0, 0, 60px);
  top: 17px;
  right: 17px;
  transition-delay: 0.8s;
}

#page-dashboard .dash3d-circle4 {
  width: 80px;
  transform: translate3d(0, 0, 80px);
  top: 23px;
  right: 23px;
  transition-delay: 1.2s;
}

#page-dashboard .dash3d-circle5 {
  width: 50px;
  transform: translate3d(0, 0, 100px);
  top: 30px;
  right: 30px;
  display: grid;
  place-content: center;
  transition-delay: 1.6s;
}

#page-dashboard .dash3d-circle5 .dash3d-svg {
  width: 22px;
  fill: none;
  stroke: white;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#page-dashboard .dash3d-parent:hover .dash3d-card {
  transform: rotate3d(1, 1, 0, 30deg);
  box-shadow:
    rgba(5, 71, 17, 0.3) 30px 50px 25px -40px,
    rgba(5, 71, 17, 0.1) 0px 25px 30px 0px;
}

#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-bottom .dash3d-buttons-container .dash3d-cat-button {
  transform: translate3d(0, 0, 50px);
  box-shadow: rgba(5, 71, 17, 0.2) -5px 20px 10px 0px;
}

#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle2 {
  transform: translate3d(0, 0, 60px);
}

#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle3 {
  transform: translate3d(0, 0, 80px);
}

#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle4 {
  transform: translate3d(0, 0, 100px);
}

#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle5 {
  transform: translate3d(0, 0, 120px);
}

/* Dropdown de categorias do View more */
#page-dashboard .dash3d-more-list {
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 66px;
  z-index: 8;

  display: grid;
  gap: 6px;

  max-height: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;

  padding: 0;

  border-radius: 18px;

  background:
    linear-gradient(180deg, rgba(255,255,255,.84), rgba(255,255,255,.56));

  border: 1px solid rgba(255,255,255,.8);

  transform: translate3d(0, 0, 45px);

  transition:
    max-height .25s ease,
    opacity .2s ease,
    padding .2s ease;
}

#page-dashboard .dash3d-parent.is-open .dash3d-more-list {
  max-height: 150px;
  opacity: 1;
  pointer-events: auto;
  padding: 8px;
  overflow: auto;
}

#page-dashboard .dash3d-more-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;

  padding: 6px 9px;

  color: #073b4c;
  background: rgba(255,255,255,.54);

  border: 1px solid rgba(255,255,255,.55);
  border-radius: 12px;

  font-size: 12px;
  font-weight: 900;
}

#page-dashboard .dash3d-more-item span:first-child {
  max-width: 175px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#page-dashboard .dash3d-more-item strong {
  color: var(--dash3d-ink, #075985);
}

/* Ajusta o grid do dashboard para esse card maior */
#page-dashboard .kpi-grid {
  align-items: stretch;
}

#page-dashboard .dash3d-parent {
  min-width: 0;
}

@media (max-width: 1200px) {
  #page-dashboard .dash3d-parent {
    height: 290px;
  }
}

@media (max-width: 640px) {
  #page-dashboard .dash3d-parent {
    height: 280px;
  }

  #page-dashboard .dash3d-content {
    padding: 86px 42px 0 26px;
  }

  #page-dashboard .dash3d-number {
    font-size: 2.7rem;
  }
}

/* Dashboard 3D card — versão sem giro e com lista no hover */
#page-dashboard .dash3d-parent:hover .dash3d-card {
  transform: none !important;
  box-shadow:
    rgba(5, 71, 17, 0.18) 0 22px 38px -26px,
    rgba(5, 71, 17, 0.12) 0 14px 26px -12px !important;
}

#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-bottom .dash3d-buttons-container .dash3d-cat-button {
  transform: none !important;
  box-shadow: rgba(5, 71, 17, 0.38) 0px 7px 5px -5px !important;
}

#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle2,
#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle3,
#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle4,
#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle5 {
  transform: var(--dash3d-original-transform, none) !important;
}

/* Mantém as camadas bonitas, mas sem saltar em 3D */
#page-dashboard .dash3d-circle2 {
  --dash3d-original-transform: translate3d(0, 0, 40px);
}

#page-dashboard .dash3d-circle3 {
  --dash3d-original-transform: translate3d(0, 0, 60px);
}

#page-dashboard .dash3d-circle4 {
  --dash3d-original-transform: translate3d(0, 0, 80px);
}

#page-dashboard .dash3d-circle5 {
  --dash3d-original-transform: translate3d(0, 0, 100px);
}

/* Ícones viram filtro clicável */
#page-dashboard .dash3d-cat-button {
  cursor: pointer !important;
}

#page-dashboard .dash3d-cat-button span {
  pointer-events: none;
}

#page-dashboard .dash3d-cat-button:hover {
  transform: translateY(-2px) !important;
  background: #020617 !important;
  color: #ffffff !important;
}

/* Some com o botão visual de Ver mais, porque agora é hover */
#page-dashboard .dash3d-view-more {
  pointer-events: none;
  opacity: .9;
}

#page-dashboard .dash3d-view-more-button {
  cursor: default !important;
}

#page-dashboard .dash3d-view-more-button::before {
  content: "Categorias";
  font-size: 12px;
}

#page-dashboard .dash3d-view-more-button {
  font-size: 0 !important;
}

/* Lista abre no hover do card */
#page-dashboard .dash3d-parent:hover .dash3d-more-list,
#page-dashboard .dash3d-more-list:hover {
  max-height: 126px !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  padding: 8px !important;
  overflow-y: auto !important;
}

/* Lista: aparece só cerca de 3 itens e rola */
#page-dashboard .dash3d-more-list {
  display: grid !important;
  gap: 6px !important;
  max-height: 0 !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(7, 89, 133, .75) rgba(255,255,255,.28);
}

/* Agora item é botão também */
#page-dashboard .dash3d-more-item {
  width: 100%;
  min-height: 34px;

  border: 1px solid rgba(255,255,255,.55);
  cursor: pointer;

  font-family: inherit;
  text-align: left;
}

#page-dashboard .dash3d-more-item:hover {
  background: rgba(255,255,255,.76);
  transform: translateX(2px);
}

#page-dashboard .dash3d-more-item span,
#page-dashboard .dash3d-more-item strong {
  pointer-events: none;
}

/* Scroll bonitinho dentro da lista */
#page-dashboard .dash3d-more-list::-webkit-scrollbar {
  width: 6px;
}

#page-dashboard .dash3d-more-list::-webkit-scrollbar-track {
  background: rgba(255,255,255,.25);
  border-radius: 999px;
}

#page-dashboard .dash3d-more-list::-webkit-scrollbar-thumb {
  background: rgba(7, 89, 133, .75);
  border-radius: 999px;
}

/* Refino do card 3D do dashboard */
#page-dashboard .dash3d-number {
  color: #0f172a !important;
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.45),
    0 10px 22px rgba(15, 23, 42, 0.12) !important;
}

#page-dashboard .dash3d-text {
  color: rgba(15, 23, 42, 0.78) !important;
  font-weight: 800 !important;
}

#page-dashboard .dash3d-title {
  color: #0b4f7a !important;
}

#page-dashboard .dash3d-parent:hover .dash3d-card {
  transform: none !important;
  box-shadow:
    rgba(5, 71, 17, 0.18) 0 22px 38px -26px,
    rgba(5, 71, 17, 0.12) 0 14px 26px -12px !important;
}

#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-bottom .dash3d-buttons-container .dash3d-cat-button {
  transform: none !important;
  box-shadow: rgba(5, 71, 17, 0.38) 0px 7px 5px -5px !important;
}

#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle2,
#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle3,
#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle4,
#page-dashboard .dash3d-parent:hover .dash3d-card .dash3d-logo .dash3d-circle5 {
  transform: none !important;
}

#page-dashboard .dash3d-cat-button {
  cursor: pointer !important;
  color: #0f4c81 !important;
}

#page-dashboard .dash3d-cat-button:hover {
  transform: translateY(-2px) !important;
  background: #0f172a !important;
  color: #ffffff !important;
}

#page-dashboard .dash3d-cat-button span {
  pointer-events: none;
}


#page-dashboard .dash3d-view-more {
  width: auto !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}

#page-dashboard .dash3d-view-more-button {
  pointer-events: none !important;
  background: none !important;
  border: none !important;
  color: #0f4c81 !important;
  font-weight: 900 !important;
  font-size: 13px !important;
}

#page-dashboard .dash3d-view-arrow {
  stroke: #0f4c81 !important;
}


#page-dashboard .dash3d-parent:hover .dash3d-more-list {
  max-height: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  padding: 0 !important;
  overflow: hidden !important;
}


#page-dashboard .dash3d-parent.is-cats-open .dash3d-more-list,
#page-dashboard .dash3d-more-list:hover {
  max-height: 132px !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  padding: 8px !important;
  overflow-y: auto !important;
}

#page-dashboard .dash3d-more-list {
  display: grid !important;
  gap: 6px !important;
  max-height: 0 !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(15, 76, 129, .75) rgba(255,255,255,.25);
}

#page-dashboard .dash3d-more-list::-webkit-scrollbar {
  width: 6px;
}

#page-dashboard .dash3d-more-list::-webkit-scrollbar-track {
  background: rgba(255,255,255,.25);
  border-radius: 999px;
}

#page-dashboard .dash3d-more-list::-webkit-scrollbar-thumb {
  background: rgba(15, 76, 129, .75);
  border-radius: 999px;
}


#page-dashboard .dash3d-more-item {
  width: 100%;
  min-height: 36px;
  border: 1px solid rgba(255,255,255,.55);
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  background: rgba(255,255,255,.66) !important;
  color: #0f172a !important;
}

#page-dashboard .dash3d-more-item:hover {
  background: rgba(255,255,255,.88) !important;
  transform: translateX(2px);
}

#page-dashboard .dash3d-more-item span,
#page-dashboard .dash3d-more-item strong {
  pointer-events: none;
}

#page-dashboard .dash3d-more-item strong {
  min-width: 30px;
  text-align: center;
  padding: 4px 8px;
  border-radius: 999px;
  background: linear-gradient(135deg, #0ea5e9, #2563eb);
  color: #ffffff !important;
  font-weight: 900 !important;
  box-shadow: 0 6px 14px rgba(37, 99, 235, 0.22);
}



#page-dashboard .dash3d-parent:hover .dash3d-more-list {
  max-height: 0 !important;
  opacity: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}


#page-dashboard .dash3d-parent.is-cats-open .dash3d-more-list,
#page-dashboard .dash3d-more-list:hover {
  max-height: 132px !important;
  opacity: 1 !important;
  padding: 8px !important;
  overflow-y: auto !important;
  pointer-events: auto !important;
}


#page-dashboard .dash3d-view-more {
  position: relative !important;
  z-index: 30 !important;
  width: auto !important;
  min-width: 96px !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

#page-dashboard .dash3d-view-more-button,
#page-dashboard .dash3d-view-arrow {
  pointer-events: none !important;
}


#page-dashboard .dash3d-view-more-button {
  color: #063b5f !important;
  font-size: 0 !important;
  font-weight: 950 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.42);
}

#page-dashboard .dash3d-view-more-button::before {
  content: "Categorias";
  font-size: 13px !important;
}

#page-dashboard .dash3d-view-arrow {
  stroke: #063b5f !important;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.4));
}


#page-dashboard .dash3d-number {
  color: #ffffff !important;
  -webkit-text-stroke: 1px rgba(5, 45, 75, .24);
  text-shadow:
    0 2px 0 rgba(7, 89, 133, .42),
    0 8px 18px rgba(2, 6, 23, .30),
    0 0 18px rgba(255,255,255,.22) !important;
}


#page-dashboard .dash3d-text {
  color: #075985 !important;
  font-weight: 950 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.35);
}


#page-dashboard .dash3d-title {
  color: #063b5f !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.35);
}

/* Itens da lista */
#page-dashboard .dash3d-more-item {
  background: rgba(255,255,255,.76) !important;
  color: #0f172a !important;
  border: 1px solid rgba(14, 116, 144, .22) !important;
  box-shadow:
    0 6px 14px rgba(15, 23, 42, .08),
    inset 0 1px 0 rgba(255,255,255,.55);
}

#page-dashboard .dash3d-more-item:hover {
  background: rgba(255,255,255,.94) !important;
  transform: translateX(2px);
}

/* Nome da categoria */
#page-dashboard .dash3d-more-item span {
  color: #0f172a !important;
  font-weight: 950 !important;
}

/* Quantidade da categoria */
#page-dashboard .dash3d-more-item strong {
  min-width: 34px !important;
  text-align: center !important;
  padding: 4px 9px !important;
  border-radius: 999px !important;

  color: #ffffff !important;
  background: linear-gradient(135deg, #0369a1, #2563eb) !important;

  font-weight: 950 !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.35);

  box-shadow:
    0 6px 14px rgba(37, 99, 235, .28),
    inset 0 1px 0 rgba(255,255,255,.22);
}


#page-dashboard .dash3d-cat-button {
  color: #075985 !important;
  font-weight: 950 !important;
  box-shadow:
    0 8px 16px rgba(15, 23, 42, .18),
    inset 0 1px 0 rgba(255,255,255,.75) !important;
}

#page-dashboard .dash3d-cat-button:hover {
  background: #082f49 !important;
  color: #ffffff !important;
}


#page-dashboard .dash3d-parent:hover .dash3d-card {
  transform: none !important;
}

#page-dashboard .dash3d-parent:hover .dash3d-circle2,
#page-dashboard .dash3d-parent:hover .dash3d-circle3,
#page-dashboard .dash3d-parent:hover .dash3d-circle4,
#page-dashboard .dash3d-parent:hover .dash3d-circle5 {
  transform: none !important;
}

#page-dashboard .dash3d-buttons-container,
#page-dashboard #dash3d-top-cats,
#page-dashboard .dash3d-cat-button {
  display: none !important;
}

#page-dashboard .dash3d-bottom {
  justify-content: flex-end !important;
}

#page-dashboard .dash3d-view-more {
  margin-left: auto !important;
  padding: 0.35rem 0.55rem !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.18) !important;
  border: 1px solid rgba(255,255,255,.34) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.35),
    0 8px 18px rgba(15,23,42,.12);
}

#page-dashboard .dash3d-view-more:hover {
  background: rgba(255,255,255,.32) !important;
  transform: translateY(-1px);
}

#page-dashboard .dash-stat-card {
  --stat-a: #38bdf8;
  --stat-b: #2563eb;
  --stat-glow: rgba(56, 189, 248, .24);

  position: relative;
  min-height: 300px;
  padding: 1.35rem;
  border-radius: 34px;
  overflow: hidden;
  cursor: pointer;
  isolation: isolate;

  background:
    radial-gradient(circle at 86% 14%, color-mix(in srgb, var(--stat-a) 32%, transparent), transparent 34%),
    linear-gradient(180deg, rgba(15, 23, 42, .96), rgba(2, 6, 23, .98));

  border: 1px solid rgba(148, 163, 184, .16);

  box-shadow:
    0 24px 60px -38px var(--stat-glow),
    inset 0 1px 0 rgba(255,255,255,.06);

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

#page-dashboard .dash-stat-card::before {
  content: "";
  position: absolute;
  inset: -35%;
  z-index: -1;

  background:
    conic-gradient(
      from 180deg,
      transparent,
      color-mix(in srgb, var(--stat-a) 45%, transparent),
      transparent,
      color-mix(in srgb, var(--stat-b) 34%, transparent),
      transparent
    );

  filter: blur(38px);
  opacity: .36;
  animation: dashStatAura 8s linear infinite;
}

#page-dashboard .dash-stat-card::after {
  content: "";
  position: absolute;
  right: -42px;
  top: -42px;
  width: 154px;
  height: 154px;
  border-radius: 999px;

  background:
    radial-gradient(circle, rgba(255,255,255,.24), transparent 62%),
    linear-gradient(135deg, var(--stat-a), var(--stat-b));

  opacity: .20;
}

#page-dashboard .dash-stat-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--stat-a) 44%, rgba(255,255,255,.12));
  box-shadow:
    0 30px 70px -42px var(--stat-glow),
    0 0 0 1px color-mix(in srgb, var(--stat-a) 22%, transparent),
    inset 0 1px 0 rgba(255,255,255,.08);
}

#page-dashboard .dash-stat-blue {
  --stat-a: #38bdf8;
  --stat-b: #2563eb;
  --stat-glow: rgba(37, 99, 235, .42);
}

#page-dashboard .dash-stat-green {
  --stat-a: #34d399;
  --stat-b: #059669;
  --stat-glow: rgba(16, 185, 129, .36);
}

#page-dashboard .dash-stat-orange {
  --stat-a: #fb923c;
  --stat-b: #ea580c;
  --stat-glow: rgba(249, 115, 22, .38);
}

#page-dashboard .dash-stat-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  margin-bottom: 2.1rem;
}

#page-dashboard .dash-stat-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 18px;

  color: #ffffff;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--stat-a) 24%, transparent), rgba(15, 23, 42, .72));

  border: 1px solid color-mix(in srgb, var(--stat-a) 28%, rgba(255,255,255,.12));

  box-shadow:
    0 14px 32px -20px var(--stat-glow),
    inset 0 1px 0 rgba(255,255,255,.10);
}

#page-dashboard .dash-stat-icon .icon {
  width: 24px;
  height: 24px;
  stroke: currentColor;
  filter: drop-shadow(0 0 10px var(--stat-glow));
}

#page-dashboard .dash-stat-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 30px;
  padding: .35rem .72rem;
  border-radius: 999px;

  color: #ffffff;
  background: color-mix(in srgb, var(--stat-a) 18%, rgba(15, 23, 42, .86));
  border: 1px solid color-mix(in srgb, var(--stat-a) 28%, rgba(255,255,255,.10));

  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

#page-dashboard .dash-stat-body {
  display: grid;
  gap: .35rem;
}

#page-dashboard .dash-stat-label {
  color: #dbeafe;
  font-size: .9rem;
  font-weight: 850;
  letter-spacing: .02em;
}

#page-dashboard .dash-stat-value {
  color: #ffffff;
  font-size: clamp(2.6rem, 4vw, 4.1rem);
  line-height: .95;
  font-weight: 950;
  letter-spacing: -.06em;

  text-shadow:
    0 2px 0 rgba(0,0,0,.28),
    0 0 22px var(--stat-glow);
}

#page-dashboard .dash-stat-sub {
  color: #cbd5e1;
  font-size: .9rem;
  font-weight: 800;
}

#page-dashboard .dash-stat-sub span {
  color: #ffffff;
  font-weight: 950;
}

#page-dashboard .dash-stat-progress {
  position: absolute;
  left: 1.35rem;
  right: 1.35rem;
  bottom: 1.35rem;

  height: 10px;
  border-radius: 999px;
  overflow: hidden;

  background: rgba(15, 23, 42, .82);
  border: 1px solid rgba(148, 163, 184, .14);

  box-shadow: inset 0 1px 4px rgba(0,0,0,.26);
}

#page-dashboard .dash-stat-progress span {
  display: block;
  width: 0%;
  height: 100%;
  border-radius: inherit;

  background:
    linear-gradient(90deg, var(--stat-a), var(--stat-b));

  box-shadow:
    0 0 16px var(--stat-glow),
    inset 0 1px 0 rgba(255,255,255,.22);

  transition: width .45s ease;
}

@keyframes dashStatAura {
  to {
    transform: rotate(360deg);
  }
}

@media (max-width: 1200px) {
  #page-dashboard .dash-stat-card {
    min-height: 260px;
  }
}

@media (max-width: 640px) {
  #page-dashboard .dash-stat-card {
    min-height: 230px;
  }
}

/* Dashboard stats */
#page-dashboard .dash-stat-card {
  min-height: 300px !important;
  border-radius: 38px !important;
  overflow: hidden !important;

  background:
    radial-gradient(circle at 84% 16%, color-mix(in srgb, var(--stat-a) 55%, transparent) 0 18%, transparent 38%),
    radial-gradient(circle at 8% 92%, rgba(255,255,255,.20), transparent 34%),
    linear-gradient(135deg, color-mix(in srgb, var(--stat-a) 34%, #dff7ff) 0%, color-mix(in srgb, var(--stat-b) 72%, #60a5fa) 100%) !important;

  border: 1px solid color-mix(in srgb, var(--stat-a) 48%, rgba(255,255,255,.34)) !important;

  box-shadow:
    0 22px 44px -28px var(--stat-glow),
    inset 0 1px 0 rgba(255,255,255,.36),
    inset 0 -1px 0 rgba(255,255,255,.16) !important;
}

#page-dashboard .dash-stat-card::before {
  content: "";
  position: absolute;
  inset: 8px;
  z-index: -1;

  border-radius: 34px;
  border-top-right-radius: 100%;

  background:
    linear-gradient(0deg, rgba(255,255,255,.22), rgba(255,255,255,.72)) !important;

  border-left: 1px solid rgba(255,255,255,.55);
  border-bottom: 1px solid rgba(255,255,255,.38);

  filter: none !important;
  opacity: 1 !important;
  animation: none !important;
}

#page-dashboard .dash-stat-card::after {
  content: "";
  position: absolute;
  right: -18px;
  top: -18px;
  width: 150px;
  height: 150px;
  border-radius: 999px;

  background:
    radial-gradient(circle, rgba(255,255,255,.36) 0 16%, transparent 17%),
    radial-gradient(circle, color-mix(in srgb, var(--stat-a) 64%, transparent) 0 36%, transparent 37%),
    radial-gradient(circle, color-mix(in srgb, var(--stat-b) 42%, transparent) 0 58%, transparent 59%) !important;

  opacity: .9 !important;
}

#page-dashboard .dash-stat-blue {
  --stat-a: #38bdf8;
  --stat-b: #2563eb;
  --stat-glow: rgba(37,99,235,.42);
}

#page-dashboard .dash-stat-green {
  --stat-a: #22d3ee;
  --stat-b: #059669;
  --stat-glow: rgba(16,185,129,.34);
}

#page-dashboard .dash-stat-orange {
  --stat-a: #fb923c;
  --stat-b: #7c2d12;
  --stat-glow: rgba(249,115,22,.34);
}

#page-dashboard .dash-stat-top,
#page-dashboard .dash-stat-body,
#page-dashboard .dash-stat-progress {
  position: relative;
  z-index: 2;
}

#page-dashboard .dash-stat-icon {
  width: 56px !important;
  height: 56px !important;
  border-radius: 18px !important;

  color: #ffffff !important;

  background:
    linear-gradient(135deg, color-mix(in srgb, var(--stat-a) 72%, #ffffff), var(--stat-b)) !important;

  border: 1px solid rgba(255,255,255,.44) !important;

  box-shadow:
    0 16px 32px -20px rgba(15,23,42,.55),
    inset 0 1px 0 rgba(255,255,255,.42) !important;
}

#page-dashboard .dash-stat-chip {
  color: #ffffff !important;
  background: rgba(15, 23, 42, .22) !important;
  border: 1px solid rgba(255,255,255,.34) !important;

  text-shadow: 0 1px 0 rgba(0,0,0,.28);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    0 8px 18px rgba(15,23,42,.10) !important;
}

#page-dashboard .dash-stat-label {
  color: #073b5f !important;
  font-weight: 950 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.38);
}

#page-dashboard .dash-stat-value {
  color: #ffffff !important;
  font-size: clamp(3.1rem, 4.4vw, 4.6rem) !important;

  -webkit-text-stroke: 1px rgba(5,45,75,.18);

  text-shadow:
    0 2px 0 rgba(7,89,133,.38),
    0 10px 24px rgba(2,6,23,.28),
    0 0 22px rgba(255,255,255,.18) !important;
}

#page-dashboard .dash-stat-sub {
  color: #073b5f !important;
  font-weight: 950 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.36);
}

#page-dashboard .dash-stat-sub span {
  color: #032f4c !important;
}

#page-dashboard .dash-stat-progress {
  height: 9px !important;

  background: rgba(255,255,255,.26) !important;
  border: 1px solid rgba(255,255,255,.34) !important;

  box-shadow:
    inset 0 1px 4px rgba(15,23,42,.12),
    0 8px 18px rgba(15,23,42,.08) !important;
}

#page-dashboard .dash-stat-progress span {
  background:
    linear-gradient(90deg, #ffffff, color-mix(in srgb, var(--stat-b) 82%, #ffffff)) !important;

  box-shadow:
    0 0 16px rgba(255,255,255,.42),
    inset 0 1px 0 rgba(255,255,255,.62) !important;
}

#page-dashboard .dash-stat-card:hover {
  transform: translateY(-3px) !important;
}

#page-dashboard .dash-stat-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 300px !important;
  padding: 1.35rem 1.35rem 3.8rem !important;
}

#page-dashboard .dash-stat-top {
  margin-bottom: 2rem !important;
  flex: 0 0 auto !important;
}

#page-dashboard .dash-stat-body {
  position: relative !important;
  z-index: 3 !important;
  display: grid !important;
  gap: .42rem !important;
  padding-bottom: 1.4rem !important;
}

#page-dashboard .dash-stat-value {
  display: block !important;
  line-height: .9 !important;
  margin: .2rem 0 .1rem !important;
}

#page-dashboard .dash-stat-sub {
  display: block !important;
  position: relative !important;
  z-index: 4 !important;
  margin-top: .15rem !important;
}

#page-dashboard .dash-stat-progress {
  position: absolute !important;
  left: 1.35rem !important;
  right: 1.35rem !important;
  bottom: 1.35rem !important;
  z-index: 3 !important;

  width: auto !important;
  height: 9px !important;
  margin: 0 !important;
  transform: none !important;
}

#page-dashboard .dash-stat-progress span {
  display: block !important;
  height: 100% !important;
}
#page-dashboard .kpi-grid {
  align-items: stretch !important;
}

#page-dashboard .dash3d-parent,
#page-dashboard .dash-stat-card {
  height: 300px !important;
  min-height: 300px !important;
  max-height: 300px !important;
}

#page-dashboard .dash-stat-card {
  display: block !important;
  padding: 1.35rem !important;
  position: relative !important;
  overflow: hidden !important;
}

#page-dashboard .dash-stat-top {
  margin-bottom: 1.85rem !important;
}

#page-dashboard .dash-stat-body {
  position: relative !important;
  z-index: 3 !important;
  padding-bottom: 0 !important;
}

#page-dashboard .dash-stat-value {
  display: block !important;
  line-height: .9 !important;
  margin: .2rem 0 .15rem !important;
}

#page-dashboard .dash-stat-sub {
  display: block !important;
  position: relative !important;
  z-index: 4 !important;
  margin-top: .1rem !important;
}

#page-dashboard .dash-stat-progress {
  position: absolute !important;
  left: 1.35rem !important;
  right: 1.35rem !important;
  bottom: 1.35rem !important;
  z-index: 4 !important;

  width: auto !important;
  height: 8px !important;
  margin: 0 !important;
  transform: none !important;
}

#page-dashboard .dash-stat-progress span {
  display: block !important;
  height: 100% !important;
}

@media (max-width: 1200px) {
  #page-dashboard .dash3d-parent,
  #page-dashboard .dash-stat-card {
    height: 285px !important;
    min-height: 285px !important;
    max-height: 285px !important;
  }
}

@media (max-width: 640px) {
  #page-dashboard .dash3d-parent,
  #page-dashboard .dash-stat-card {
    height: 270px !important;
    min-height: 270px !important;
    max-height: 270px !important;
  }
}

.quick-uiverse-grid {
  grid-template-columns: repeat(3, minmax(240px, 1fr)) !important;
  gap: 1.25rem !important;
}

.quick-viper-card {
  --quick-a: #22d3ee;
  --quick-b: #2563eb;
  --quick-dark: #0b1220;
  --quick-glow: rgba(34, 211, 238, .55);

  z-index: 0;
  position: relative;
  padding: 1rem;
  width: 100%;
  height: 260px;
  box-sizing: border-box;
  border: 0;
  cursor: pointer;
  text-align: left;

  background: transparent;
  backdrop-filter: blur(40px);
  border-radius: 0 2rem;

  background-image:
    radial-gradient(#1118278a, #020617cc),
    linear-gradient(35deg, color-mix(in srgb, var(--quick-b) 58%, #020617) 62%, var(--quick-a) 100%);

  background-origin: border-box;
  background-clip: content-box, border-box;

  box-shadow: 0 0 1rem var(--quick-glow);
  transition: transform .5s ease, box-shadow .5s ease;
  animation: quickPulse 3s infinite;
  overflow: hidden;
}

.quick-viper-card:hover {
  transform: rotateY(14deg);
}

.quick-viper-blue {
  --quick-a: #38bdf8;
  --quick-b: #2563eb;
  --quick-glow: rgba(56, 189, 248, .55);
}

.quick-viper-green {
  --quick-a: #57ff95;
  --quick-b: #124926;
  --quick-glow: rgba(87, 255, 149, .55);
}

.quick-viper-orange {
  --quick-a: #fb923c;
  --quick-b: #7c2d12;
  --quick-glow: rgba(251, 146, 60, .52);
}

.quick-viper-bg {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 0 .8rem;

  background:
    linear-gradient(
      346.8deg,
      color-mix(in srgb, var(--quick-b) 76%, #020617) 30%,
      color-mix(in srgb, var(--quick-b) 55%, var(--quick-a)) 30%,
      rgba(255, 70, 84, 0) 30%,
      rgba(255, 70, 84, 0) 32%,
      color-mix(in srgb, var(--quick-b) 76%, #020617) 32%,
      color-mix(in srgb, var(--quick-b) 76%, #020617) 35%,
      transparent 35%
    );
}

.quick-viper-text-ext,
.quick-viper-text-border {
  display: flex;
  height: fit-content;
  width: 100%;
  text-transform: uppercase;
  font-family: inherit;
  font-size: clamp(1.12rem, 2vw, 1.55rem);
  font-weight: 950;
  align-items: center;
  letter-spacing: .35rem;
  pointer-events: none;
}

.quick-viper-text-ext {
  z-index: -1;
  position: absolute;
  inset: 1rem;

  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #ffffff;

  background:
    linear-gradient(
      346.8deg,
      #ffffff 30%,
      #ffffff 30%,
      #ffffff 32%,
      #ffffff 35%
    );

  background-size: cover;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  padding: 8.4rem 0 0 .55rem;
}

.quick-viper-text-border {
  position: absolute;
  left: 1.45rem;
  bottom: 4.6rem;

  color: transparent;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #ffffff;

  background: linear-gradient(90deg, transparent 100%, #ffffff 65%);
  background-size: cover;
  background-clip: text;
  -webkit-background-clip: text;
}

.quick-viper-marquee {
  top: 0;
  z-index: -5;
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  --offset: 2rem;
  --move-initial: calc(-20% + var(--offset));
  --move-final: calc(-85% + var(--offset));
  border-radius: 0 1rem;
  filter: opacity(.3);
}

.quick-viper-marquee-inner {
  width: fit-content;
  display: flex;
  position: relative;
  transform: translate3d(var(--move-initial), 0, 0);
  animation: quickSlide 60s linear infinite;
  border-radius: 0 1rem;
}

.quick-viper-marquee-inner span {
  display: flex;
  text-transform: uppercase;
  font-family: inherit;
  font-size: 6.4rem;
  font-weight: 950;
  align-items: center;
  line-height: .9em;
  color: transparent;
  white-space: nowrap;

  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #ffffff;
}

.quick-viper-blur {
  display: block;
  position: absolute;
  z-index: -1;
  inset: 0;
  border-radius: 0 1rem;
  backdrop-filter: blur(3px);
  background: linear-gradient(90deg, transparent 0%, #00000044 100%);
}

.quick-viper-logo {
  display: flex;
  position: absolute;
  width: 3.5rem;
  height: 3rem;
  top: 1rem;
  left: 1rem;
  align-items: center;
  justify-content: center;
  clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
}

.quick-viper-logo-spin {
  position: absolute;
  width: 200%;
  height: 200%;

  background:
    conic-gradient(
      var(--quick-b) 0%,
      #ffffff 10%,
      var(--quick-a) 25%,
      #0f172a 50%,
      var(--quick-a) 70%,
      color-mix(in srgb, var(--quick-a) 52%, #ffffff) 90%
    );

  animation: quickSpin 5s linear infinite;
}

.quick-viper-logo-inside {
  display: flex;
  width: 85%;
  height: 85%;
  align-items: center;
  justify-content: center;
  clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
  background-color: #111827;
}

.quick-viper-mark {
  position: absolute;
  width: 30px;
  height: 30px;
  background-color: var(--quick-a);
}

.quick-viper-mark.first {
  clip-path: polygon(0 10%, 70% 90%, 35% 90%, 0 50%);
}

.quick-viper-mark.second {
  clip-path: polygon(100% 10%, 100% 50%, 88% 65%, 55% 65%);
}

.quick-viper-mist-wrap {
  position: absolute;
  width: 450px;
  height: 150px;
  overflow: hidden;
  filter: blur(1rem);
  top: 60%;
  left: 0;
}

.quick-viper-mist {
  width: 100%;
  height: 100%;

  background:
    radial-gradient(
      circle,
      color-mix(in srgb, var(--quick-a) 70%, transparent) 10%,
      rgba(255, 255, 255, 0) 50%
    );

  animation: quickMist 10s infinite both;
}

.quick-viper-info {
  position: absolute;
  left: 1.55rem;
  right: 1.55rem;
  bottom: 1.2rem;
  z-index: 4;

  display: grid;
  gap: .2rem;

  color: #ffffff;
  text-shadow: 0 1px 0 rgba(0,0,0,.45);
}

.quick-viper-info span {
  font-size: .95rem;
  font-weight: 900;
}

.quick-viper-info small {
  color: rgba(255,255,255,.78);
  font-size: .78rem;
  font-weight: 700;
}

.quick-asset-dialog {
  max-width: 760px;
}

.quick-asset-results {
  list-style: none;
  display: grid;
  gap: .55rem;
  max-height: 430px;
  overflow: auto;
  margin-top: .85rem;
  padding-right: .25rem;
}

.quick-asset-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .85rem;

  padding: .85rem 1rem;
  border-radius: 1rem;

  background: rgba(15, 23, 42, .72);
  border: 1px solid rgba(148, 163, 184, .18);

  cursor: pointer;
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.quick-asset-item:hover {
  transform: translateY(-1px);
  background: rgba(15, 23, 42, .92);
  border-color: rgba(56, 189, 248, .38);
}

.quick-asset-item strong {
  display: block;
  color: #ffffff;
  font-weight: 900;
}

.quick-asset-item span {
  display: block;
  color: #cbd5e1;
  font-size: .8rem;
  margin-top: .15rem;
}

.quick-asset-item em {
  font-style: normal;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  color: #e0f2fe;

  padding: .25rem .55rem;
  border-radius: 999px;

  background: rgba(14, 165, 233, .14);
  border: 1px solid rgba(14, 165, 233, .25);
}

@keyframes quickSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes quickMist {
  0% {
    transform: translateX(-50%) translateY(0%) scaleY(.7) rotate(0deg);
    opacity: .3;
  }

  50% {
    transform: translateX(0%) translateY(50%) scaleY(-10.3) rotate(20deg);
    opacity: .5;
  }

  100% {
    transform: translateX(-50%) translateY(0%) scaleY(.7) rotate(-20deg);
    opacity: .3;
  }
}

@keyframes quickPulse {
  0% { box-shadow: 0 0 1rem var(--quick-glow); }
  70% { box-shadow: 0 0 2rem var(--quick-glow); }
  100% { box-shadow: 0 0 1rem var(--quick-glow); }
}

@keyframes quickSlide {
  0% {
    transform: translate3d(var(--move-initial), 0, 0);
  }

  100% {
    transform: translate3d(var(--move-final), 0, 0);
  }
}

@media (max-width: 1100px) {
  .quick-uiverse-grid {
    grid-template-columns: 1fr !important;
  }

  .quick-viper-card {
    height: 240px;
  }
}
#page-dashboard .quick-uiverse-grid {
  gap: 1rem !important;
  margin-bottom: 1.35rem !important;
}

#page-dashboard .quick-viper-card {
  height: 190px !important;
  padding: .78rem !important;
  border-radius: 0 1.35rem !important;
}

#page-dashboard .quick-viper-bg {
  border-radius: 0 .65rem !important;
}

#page-dashboard .quick-viper-logo {
  width: 2.75rem !important;
  height: 2.35rem !important;
  top: .75rem !important;
  left: .8rem !important;
}

#page-dashboard .quick-viper-mark {
  width: 22px !important;
  height: 22px !important;
}

#page-dashboard .quick-viper-marquee-inner span {
  font-size: 4.4rem !important;
  font-weight: 650 !important;
  letter-spacing: .02em !important;
  -webkit-text-stroke-width: 1px !important;
  opacity: .48 !important;
}

#page-dashboard .quick-viper-text-ext,
#page-dashboard .quick-viper-text-border {
  display: flex !important;
  width: 100% !important;
  height: fit-content !important;
  text-transform: uppercase !important;
  font-family: inherit !important;
  font-size: clamp(.95rem, 1.35vw, 1.18rem) !important;
  font-weight: 650 !important;
  letter-spacing: .22rem !important;
  line-height: 1 !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}

#page-dashboard .quick-viper-text-ext {
  z-index: -1 !important;
  inset: .78rem !important;
  padding: 6.15rem 0 0 .42rem !important;
  -webkit-text-stroke-width: .7px !important;
  -webkit-text-stroke-color: rgba(255,255,255,.58) !important;
}

#page-dashboard .quick-viper-text-border {
  left: 1.1rem !important;
  bottom: 3.45rem !important;
  -webkit-text-stroke-width: .85px !important;
  -webkit-text-stroke-color: rgba(255,255,255,.92) !important;
}

#page-dashboard .quick-viper-info {
  left: 1.1rem !important;
  right: 1.1rem !important;
  bottom: .82rem !important;
  gap: .08rem !important;
}

#page-dashboard .quick-viper-info span {
  font-size: .82rem !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.42) !important;
}

#page-dashboard .quick-viper-info small {
  font-size: .72rem !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  color: rgba(255,255,255,.82) !important;
  -webkit-text-fill-color: rgba(255,255,255,.82) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.35) !important;
}

#page-dashboard .quick-viper-mist-wrap {
  width: 330px !important;
  height: 105px !important;
  top: 58% !important;
}

#page-dashboard .quick-viper-card:hover {
  transform: translateY(-2px) rotateY(8deg) !important;
}

@media (max-width: 1100px) {
  #page-dashboard .quick-viper-card {
    height: 175px !important;
  }
}

#page-dashboard .quick-uiverse-grid {
  grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
  gap: 1rem !important;
  margin-top: .45rem !important;
  margin-bottom: 1.6rem !important;
}

#page-dashboard .quick-viper-card {
  height: 155px !important;
  min-height: 155px !important;
  max-height: 155px !important;
  padding: .65rem !important;
  border-radius: 0 1.15rem !important;
  overflow: hidden !important;
}

#page-dashboard .quick-viper-bg {
  border-radius: 0 .55rem !important;
}

#page-dashboard .quick-viper-logo {
  width: 2.35rem !important;
  height: 2.05rem !important;
  top: .65rem !important;
  left: .75rem !important;
}

#page-dashboard .quick-viper-mark {
  width: 19px !important;
  height: 19px !important;
}

#page-dashboard .quick-viper-marquee-inner span {
  font-size: 3.45rem !important;
  font-weight: 650 !important;
  letter-spacing: .01em !important;
  -webkit-text-stroke-width: 1px !important;
  opacity: .34 !important;
}

#page-dashboard .quick-viper-text-ext {
  display: none !important;
}

#page-dashboard .quick-viper-text-border {
  position: absolute !important;
  left: 1.15rem !important;
  bottom: 3.1rem !important;

  display: block !important;
  width: auto !important;

  font-size: clamp(.95rem, 1.25vw, 1.15rem) !important;
  font-weight: 700 !important;
  letter-spacing: .22rem !important;
  line-height: 1 !important;

  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  -webkit-text-stroke: 0 !important;
  text-shadow:
    0 1px 0 rgba(0,0,0,.55),
    0 0 10px rgba(255,255,255,.18) !important;
}

#page-dashboard .quick-viper-info {
  left: 1.15rem !important;
  right: 1.15rem !important;
  bottom: .65rem !important;
  gap: 0 !important;
}

#page-dashboard .quick-viper-info span {
  font-size: .76rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.48) !important;
}

#page-dashboard .quick-viper-info small {
  font-size: .67rem !important;
  font-weight: 450 !important;
  line-height: 1.15 !important;
  color: rgba(255,255,255,.82) !important;
  -webkit-text-fill-color: rgba(255,255,255,.82) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.38) !important;
}

#page-dashboard .quick-viper-mist-wrap {
  width: 280px !important;
  height: 82px !important;
  top: 57% !important;
}

#page-dashboard .quick-viper-card:hover {
  transform: translateY(-2px) rotateY(5deg) !important;
}

@media (max-width: 1100px) {
  #page-dashboard .quick-uiverse-grid {
    grid-template-columns: 1fr !important;
  }

  #page-dashboard .quick-viper-card {
    height: 145px !important;
    min-height: 145px !important;
    max-height: 145px !important;
  }
}

#page-dashboard .quick-viper-bg {
  isolation: isolate !important;
}

#page-dashboard .quick-viper-marquee {
  z-index: 1 !important;
  opacity: 1 !important;
  filter: none !important;
  pointer-events: none !important;
}

#page-dashboard .quick-viper-marquee-inner {
  animation: quickSlide 60s linear infinite !important;
}

#page-dashboard .quick-viper-marquee-inner span {
  font-size: 3.85rem !important;
  font-weight: 750 !important;
  letter-spacing: .03em !important;

  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  -webkit-text-stroke-width: 1.25px !important;
  -webkit-text-stroke-color: rgba(255, 255, 255, .22) !important;

  opacity: 1 !important;
  text-shadow: 0 0 10px rgba(255,255,255,.08) !important;
}

#page-dashboard .quick-viper-blur {
  z-index: 2 !important;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,.12) 0%,
    rgba(0,0,0,.34) 100%
  ) !important;
  backdrop-filter: blur(1.5px) !important;
}

#page-dashboard .quick-viper-logo,
#page-dashboard .quick-viper-mist-wrap,
#page-dashboard .quick-viper-text-border,
#page-dashboard .quick-viper-info {
  z-index: 5 !important;
}

/* Sidebar */
.sidebar {
  background:
    radial-gradient(circle at 20% 0%, rgba(56,189,248,.10), transparent 34%),
    radial-gradient(circle at 100% 18%, rgba(37,99,235,.08), transparent 32%),
    linear-gradient(180deg, rgba(15,23,42,.98), rgba(2,6,23,.98)) !important;
  border-right: 1px solid rgba(56,189,248,.13) !important;
  box-shadow:
    18px 0 48px rgba(2,6,23,.32),
    inset -1px 0 0 rgba(255,255,255,.03);
}

.sidebar-header {
  padding: 1.15rem 1rem !important;
  border-bottom: 1px solid rgba(56,189,248,.13) !important;
}

.sidebar-brand-line {
  display: flex;
  align-items: center;
  gap: .55rem;
  min-width: 0;
}

.sidebar-brand-text h1 {
  font-size: .98rem !important;
  font-weight: 850 !important;
  letter-spacing: .02em;
  white-space: nowrap;
}

.sidebar-subtitle {
  margin-top: .18rem;
  color: rgba(203,213,225,.72) !important;
  font-size: .68rem !important;
  letter-spacing: .03em;
}

/* Version badge */
.version-badge {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: .26rem .54rem;
  border-radius: 999px;

  color: #ffffff;
  font-size: .68rem;
  font-weight: 850;
  letter-spacing: .04em;
  line-height: 1;

  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.18);

  box-shadow:
    0 10px 24px rgba(2,6,23,.24),
    inset 0 1px 0 rgba(255,255,255,.25);

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  user-select: none;
  overflow: visible;
}

.version-badge::before {
  content: "";
  position: absolute;
  inset: -1px;
  z-index: -1;

  border-radius: inherit;

  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.12);

  box-shadow:
    0 0 20px rgba(56,189,248,.18),
    0 8px 32px rgba(105,106,111,.20);
}

.version-badge::after {
  content: "";
  position: absolute;
  inset: 0;

  border-radius: inherit;

  background:
    linear-gradient(
      115deg,
      transparent 0%,
      transparent 32%,
      rgba(255,255,255,.46) 48%,
      transparent 62%,
      transparent 100%
    );

  transform: translateX(-135%);
  animation: versionBadgeSweep 3.2s ease-in-out infinite;
  pointer-events: none;
}

.version-badge span {
  width: 22px;
  height: 22px;
  position: absolute;
  top: -11px;
  right: -4px;
  transform: rotate(-20deg);
  filter: blur(.35px);
  pointer-events: none;
}

.version-badge span::before,
.version-badge span::after {
  content: "";
  position: absolute;
  display: block;
}

.version-badge span::before {
  width: 1px;
  height: 100%;
  left: 11px;
  background: linear-gradient(
    to bottom,
    transparent,
    rgba(255,255,255,.78),
    transparent
  );
  animation: versionBadgeSpark 3s ease-in-out infinite;
}

.version-badge span::after {
  width: 100%;
  height: 1px;
  top: 11px;
  background: linear-gradient(
    to left,
    transparent,
    rgba(255,255,255,.78),
    transparent
  );
  animation: versionBadgeSpark 3s ease-in-out infinite;
}

@keyframes versionBadgeSweep {
  0%, 38% {
    transform: translateX(-135%);
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  78%, 100% {
    transform: translateX(135%);
    opacity: 0;
  }
}

@keyframes versionBadgeSpark {
  0% {
    transform: rotate(0deg) scale(1);
    opacity: .5;
  }

  50% {
    transform: rotate(180deg) scale(1.55);
    opacity: 1;
  }

  100% {
    transform: rotate(360deg) scale(1);
    opacity: .5;
  }
}

/* Menu lateral */
.nav-item {
  height: 44px !important;
  margin: .1rem 0 !important;
  padding: 0 .8rem !important;
  padding-right: 104px !important;

  border-radius: 14px !important;
  border: 1px solid transparent !important;

  color: rgba(226,232,240,.90) !important;
  background:
    linear-gradient(180deg, rgba(15,23,42,.24), rgba(15,23,42,.08)) !important;

  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease !important;
}

.nav-item:hover {
  transform: translateX(3px);
  color: #ffffff !important;
  border-color: rgba(56,189,248,.20) !important;
  background:
    radial-gradient(circle at 10% 50%, rgba(56,189,248,.16), transparent 36%),
    linear-gradient(180deg, rgba(15,23,42,.72), rgba(2,6,23,.48)) !important;

  box-shadow:
    0 14px 30px rgba(2,6,23,.22),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.nav-item.active {
  color: #ffffff !important;
  border-color: rgba(56,189,248,.36) !important;
  background:
    radial-gradient(circle at 12% 50%, rgba(56,189,248,.32), transparent 38%),
    linear-gradient(135deg, rgba(37,99,235,.92), rgba(14,165,233,.78)) !important;

  box-shadow:
    0 14px 34px rgba(14,165,233,.18),
    inset 0 1px 0 rgba(255,255,255,.18);
}

.nav-icon {
  width: 1.12rem !important;
  height: 1.12rem !important;
  color: currentColor;
  filter: drop-shadow(0 0 8px rgba(56,189,248,.12));
}

.nav-label {
  font-weight: 760;
  letter-spacing: .01em;
}

.nav-badge {
  height: 19px !important;
  padding: 0 9px !important;
  right: 10px !important;

  color: #dfffea !important;
  background: rgba(34,197,94,.16) !important;
  border: 1px solid rgba(34,197,94,.35) !important;

  box-shadow:
    0 0 14px rgba(34,197,94,.16),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}

.nav-hub {
  margin-top: .75rem !important;
  min-height: 54px !important;
  border-color: rgba(56,189,248,.20) !important;

  background:
    radial-gradient(circle at 12% 50%, rgba(14,165,233,.22), transparent 36%),
    linear-gradient(180deg, rgba(15,23,42,.82), rgba(15,23,42,.44)) !important;
}

/* Atividades recentes */
#page-dashboard .section-header {
  margin-top: 1.9rem !important;
  margin-bottom: .9rem !important;
}

#page-dashboard .section-title {
  display: inline-flex;
  align-items: center;
  gap: .65rem;

  color: #ffffff !important;
  font-size: 1.1rem !important;
  font-weight: 850 !important;
  letter-spacing: .01em;
}

#page-dashboard .section-title::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 999px;

  background: #38bdf8;
  box-shadow: 0 0 18px rgba(56,189,248,.72);
}

#activity-list {
  display: grid !important;
  gap: .72rem !important;
  padding: .25rem 0 0 !important;
}

#activity-list .activity-item {
  position: relative;
  min-height: 58px;

  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: .85rem;

  padding: .86rem 1rem .86rem .95rem !important;

  border-radius: 18px !important;
  overflow: hidden;

  background:
    radial-gradient(circle at 0% 50%, rgba(56,189,248,.16), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.88), rgba(2,6,23,.88)) !important;

  border: 1px solid rgba(148,163,184,.14) !important;

  box-shadow:
    0 14px 34px rgba(2,6,23,.24),
    inset 0 1px 0 rgba(255,255,255,.04);

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

#activity-list .activity-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  bottom: 12px;

  width: 3px;
  border-radius: 999px;

  background: linear-gradient(180deg, #38bdf8, #2563eb);
  box-shadow: 0 0 18px rgba(56,189,248,.52);
}

#activity-list .activity-item::after {
  content: "";
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      110deg,
      transparent 0%,
      transparent 38%,
      rgba(255,255,255,.055) 50%,
      transparent 62%,
      transparent 100%
    );

  transform: translateX(-130%);
  transition: transform .75s ease;
  pointer-events: none;
}

#activity-list .activity-item:hover {
  transform: translateY(-2px);
  border-color: rgba(56,189,248,.28) !important;
  box-shadow:
    0 18px 44px rgba(2,6,23,.30),
    0 0 0 1px rgba(56,189,248,.08),
    inset 0 1px 0 rgba(255,255,255,.06);
}

#activity-list .activity-item:hover::after {
  transform: translateX(130%);
}

#activity-list .activity-icon {
  position: relative;
  z-index: 2;

  width: 34px;
  height: 34px;
  border-radius: 13px;

  background:
    radial-gradient(circle at 35% 30%, rgba(255,255,255,.24), transparent 34%),
    linear-gradient(135deg, rgba(56,189,248,.28), rgba(37,99,235,.16));

  border: 1px solid rgba(56,189,248,.26);

  box-shadow:
    0 10px 22px rgba(14,165,233,.13),
    inset 0 1px 0 rgba(255,255,255,.12);
}

#activity-list .activity-icon::before {
  content: "";
  position: absolute;
  inset: 11px;

  border-radius: 999px;
  background: #38bdf8;
  box-shadow: 0 0 14px rgba(56,189,248,.76);
}

#activity-list .activity-body {
  position: relative;
  z-index: 2;
  min-width: 0;
}

#activity-list .activity-title {
  color: #f8fafc !important;
  font-size: .9rem !important;
  font-weight: 760 !important;
  letter-spacing: .005em;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#activity-list .activity-title .muted {
  color: rgba(203,213,225,.72) !important;
  font-weight: 650;
}

#activity-list .activity-meta {
  position: relative;
  z-index: 2;

  justify-self: end;

  color: rgba(226,232,240,.86) !important;
  font-size: .78rem !important;
  font-weight: 700 !important;

  padding: .28rem .62rem;
  border-radius: 999px;

  background: rgba(15,23,42,.72);
  border: 1px solid rgba(148,163,184,.14);

  white-space: nowrap;
}

#activity-list .admin-card-sub {
  padding: 1rem 1.15rem;
  border-radius: 18px;

  color: rgba(226,232,240,.82) !important;
  background:
    linear-gradient(180deg, rgba(15,23,42,.72), rgba(2,6,23,.72));
  border: 1px solid rgba(148,163,184,.14);
}


@media (max-width: 900px) {
  #activity-list .activity-item {
    grid-template-columns: 34px minmax(0, 1fr);
  }

  #activity-list .activity-meta {
    grid-column: 2;
    justify-self: start;
  }
}


.sidebar.collapsed .version-badge,
.sidebar.collapsed .sidebar-subtitle {
  display: none !important;
}

.sidebar.collapsed .nav-item {
  padding-right: .5rem !important;
}

#activity-list {
  display: grid !important;
  gap: .75rem !important;
  padding-top: .3rem !important;
}

#activity-list .activity-item {
  position: relative !important;

  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 1rem !important;

  min-height: 58px !important;
  padding: .9rem 1rem .9rem 1.15rem !important;

  border-radius: 18px !important;
  overflow: hidden !important;

  background:
    radial-gradient(circle at 0% 50%, rgba(56,189,248,.14), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.90), rgba(2,6,23,.92)) !important;

  border: 1px solid rgba(148,163,184,.14) !important;

  box-shadow:
    0 14px 34px rgba(2,6,23,.22),
    inset 0 1px 0 rgba(255,255,255,.04) !important;

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease !important;
}

#activity-list .activity-item::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 12px !important;
  bottom: 12px !important;

  width: 3px !important;
  border-radius: 999px !important;

  background: linear-gradient(180deg, #38bdf8, #2563eb) !important;
  box-shadow: 0 0 18px rgba(56,189,248,.52) !important;
}

#activity-list .activity-item::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;

  background:
    linear-gradient(
      110deg,
      transparent 0%,
      transparent 38%,
      rgba(255,255,255,.055) 50%,
      transparent 62%,
      transparent 100%
    ) !important;

  transform: translateX(-130%) !important;
  transition: transform .75s ease !important;
  pointer-events: none !important;
}

#activity-list .activity-item:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(56,189,248,.28) !important;

  box-shadow:
    0 18px 44px rgba(2,6,23,.30),
    0 0 0 1px rgba(56,189,248,.08),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

#activity-list .activity-item:hover::after {
  transform: translateX(130%) !important;
}

#activity-list .activity-title {
  position: relative !important;
  z-index: 2 !important;

  min-width: 0 !important;

  color: #f8fafc !important;
  font-size: .92rem !important;
  font-weight: 720 !important;
  letter-spacing: .005em !important;

  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  line-height: 1.35 !important;
}

#activity-list .activity-title .muted {
  color: rgba(203,213,225,.74) !important;
  font-weight: 600 !important;
}

#activity-list .activity-meta {
  position: relative !important;
  z-index: 2 !important;

  justify-self: end !important;

  color: rgba(226,232,240,.88) !important;
  font-size: .78rem !important;
  font-weight: 700 !important;

  padding: .32rem .68rem !important;
  border-radius: 999px !important;

  background: rgba(15,23,42,.72) !important;
  border: 1px solid rgba(148,163,184,.14) !important;

  white-space: nowrap !important;
}

@media (max-width: 900px) {
  #activity-list .activity-item {
    grid-template-columns: 1fr !important;
  }

  #activity-list .activity-meta {
    justify-self: start !important;
  }
}

.sidebar-nav {
  gap: .48rem !important;
  padding: 1rem .75rem !important;
}

.nav-item {
  position: relative !important;

  height: 46px !important;
  min-height: 46px !important;

  display: flex !important;
  align-items: center !important;

  padding: 0 .82rem !important;
  padding-right: 104px !important;

  border-radius: 15px !important;
  border: 1px solid rgba(148,163,184,.08) !important;

  color: rgba(226,232,240,.88) !important;

  background:
    radial-gradient(circle at 0% 50%, rgba(56,189,248,.08), transparent 38%),
    linear-gradient(180deg, rgba(15,23,42,.52), rgba(2,6,23,.34)) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 8px 18px rgba(2,6,23,.12) !important;

  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease,
    color .18s ease !important;
}

.nav-item::before {
  content: "" !important;
  position: absolute !important;
  left: 8px !important;
  top: 50% !important;

  width: 3px !important;
  height: 0 !important;

  border-radius: 999px !important;
  background: linear-gradient(180deg, #38bdf8, #2563eb) !important;
  box-shadow: 0 0 14px rgba(56,189,248,.55) !important;

  transform: translateY(-50%) !important;
  transition: height .18s ease !important;
}

.nav-item:hover {
  transform: translateX(3px) !important;

  color: #ffffff !important;
  border-color: rgba(56,189,248,.24) !important;

  background:
    radial-gradient(circle at 8% 50%, rgba(56,189,248,.18), transparent 42%),
    linear-gradient(180deg, rgba(15,23,42,.78), rgba(2,6,23,.58)) !important;

  box-shadow:
    0 14px 30px rgba(2,6,23,.26),
    0 0 0 1px rgba(56,189,248,.06),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.nav-item:hover::before,
.nav-item.active::before {
  height: 22px !important;
}

.nav-item.active {
  color: #ffffff !important;
  border-color: rgba(56,189,248,.34) !important;

  background:
    radial-gradient(circle at 10% 50%, rgba(56,189,248,.32), transparent 42%),
    linear-gradient(135deg, rgba(37,99,235,.92), rgba(14,165,233,.72)) !important;

  box-shadow:
    0 16px 36px rgba(14,165,233,.20),
    inset 0 1px 0 rgba(255,255,255,.16) !important;
}

.nav-icon {
  width: 1.08rem !important;
  height: 1.08rem !important;
  margin-right: .72rem !important;

  color: currentColor !important;
  filter: drop-shadow(0 0 8px rgba(56,189,248,.16)) !important;
}

.nav-label {
  font-weight: 780 !important;
  letter-spacing: .01em !important;
}

.nav-badge {
  right: 10px !important;
  height: 20px !important;

  color: #dcfce7 !important;
  background: rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.38) !important;

  box-shadow:
    0 0 14px rgba(34,197,94,.18),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}

.nav-badge::before {
  background: #22c55e !important;
  box-shadow: 0 0 10px rgba(34,197,94,.75) !important;
}

.nav-hub {
  margin-top: .8rem !important;
  min-height: 56px !important;

  border-color: rgba(56,189,248,.22) !important;

  background:
    radial-gradient(circle at 10% 50%, rgba(14,165,233,.24), transparent 42%),
    linear-gradient(180deg, rgba(15,23,42,.86), rgba(15,23,42,.48)) !important;
}

.nav-hub:hover {
  border-color: rgba(56,189,248,.36) !important;
}

.sidebar.collapsed .nav-item {
  justify-content: center !important;
  padding: 0 !important;
}

.sidebar.collapsed .nav-icon {
  margin-right: 0 !important;
}

.sidebar.collapsed .nav-item::before,
.sidebar.collapsed .nav-badge {
  display: none !important;
}

#page-historico.hist-v2 {
  position: relative;
}

#page-historico .hist-hero {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 1.25rem;

  margin-bottom: 1.4rem;
  padding: 1.3rem 1.45rem;

  border-radius: 28px;
  overflow: hidden;

  background:
    radial-gradient(circle at 8% 20%, rgba(56,189,248,.20), transparent 36%),
    radial-gradient(circle at 92% 20%, rgba(37,99,235,.16), transparent 32%),
    linear-gradient(180deg, rgba(15,23,42,.86), rgba(2,6,23,.88));

  border: 1px solid rgba(56,189,248,.18);

  box-shadow:
    0 22px 54px rgba(2,6,23,.28),
    inset 0 1px 0 rgba(255,255,255,.06);
}

#page-historico .hist-hero::after {
  content: "";
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      115deg,
      transparent 0%,
      transparent 38%,
      rgba(255,255,255,.055) 50%,
      transparent 62%,
      transparent 100%
    );

  transform: translateX(-130%);
  animation: histHeroSweep 5s ease-in-out infinite;
  pointer-events: none;
}

#page-historico .hist-eyebrow,
#page-historico .hist-section-kicker {
  display: inline-flex;
  align-items: center;
  gap: .45rem;

  color: #38bdf8;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

#page-historico .hist-eyebrow::before,
#page-historico .hist-section-kicker::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;

  background: #38bdf8;
  box-shadow: 0 0 16px rgba(56,189,248,.72);
}

#page-historico .hist-hero .page-title {
  margin-top: .35rem;
  margin-bottom: .35rem;
}

#page-historico .hist-hero .page-subtitle {
  max-width: 760px;
  color: rgba(226,232,240,.82) !important;
}

#page-historico .hist-hero-card {
  min-width: 240px;
  display: grid;
  align-content: center;
  gap: .2rem;

  padding: 1rem 1.1rem;
  border-radius: 22px;

  background:
    radial-gradient(circle at 80% 20%, rgba(56,189,248,.22), transparent 38%),
    linear-gradient(180deg, rgba(15,23,42,.82), rgba(2,6,23,.70));

  border: 1px solid rgba(148,163,184,.14);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 14px 34px rgba(2,6,23,.22);
}

#page-historico .hist-hero-card span {
  color: rgba(203,213,225,.74);
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .12em;
}

#page-historico .hist-hero-card strong {
  color: #ffffff;
  font-size: 1.55rem;
  font-weight: 950;
  letter-spacing: -.03em;
}

#page-historico .hist-hero-card small {
  color: rgba(226,232,240,.72);
  font-size: .78rem;
  font-weight: 650;
}

#page-historico .hist-shell {
  display: grid;
  gap: 1.15rem;
}

#page-historico .hist-filter-card,
#page-historico .hist-list-card {
  position: relative;

  padding: 1.25rem;
  border-radius: 26px;
  overflow: hidden;

  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.11), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.86), rgba(2,6,23,.88));

  border: 1px solid rgba(148,163,184,.14);

  box-shadow:
    0 18px 44px rgba(2,6,23,.22),
    inset 0 1px 0 rgba(255,255,255,.045);
}

#page-historico .hist-filter-head,
#page-historico .hist-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;

  margin-bottom: 1rem;
}

#page-historico .hist-filter-head h2,
#page-historico .hist-list-head h2 {
  margin-top: .22rem;
  color: #ffffff;
  font-size: 1.05rem;
  font-weight: 900;
  letter-spacing: .01em;
}

#page-historico .hist-filter-chip,
#page-historico .hist-live-dot {
  display: inline-flex;
  align-items: center;
  gap: .45rem;

  padding: .38rem .7rem;
  border-radius: 999px;

  color: #e0f2fe;
  font-size: .75rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .05em;

  background: rgba(14,165,233,.12);
  border: 1px solid rgba(14,165,233,.24);

  box-shadow:
    0 0 18px rgba(14,165,233,.10),
    inset 0 1px 0 rgba(255,255,255,.08);
}

#page-historico .hist-live-dot span {
  width: 7px;
  height: 7px;
  border-radius: 999px;

  background: #22c55e;
  box-shadow: 0 0 12px rgba(34,197,94,.75);
}

#page-historico .hist-search-wrap {
  position: relative;
}

#page-historico .hist-search-icon {
  position: absolute;
  left: 1rem;
  top: 50%;
  z-index: 2;

  width: 1.05rem;
  height: 1.05rem;

  transform: translateY(-50%);
  color: #38bdf8;

  filter: drop-shadow(0 0 10px rgba(56,189,248,.32));
}

#page-historico .hist-search-input {
  height: 52px !important;
  width: 100% !important;
  padding-left: 2.85rem !important;

  color: #ffffff !important;

  background:
    radial-gradient(circle at 0% 50%, rgba(56,189,248,.08), transparent 36%),
    rgba(2,6,23,.78) !important;

  border: 1px solid rgba(56,189,248,.18) !important;
  border-radius: 18px !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 30px rgba(2,6,23,.18) !important;
}

#page-historico .hist-search-input:focus {
  border-color: rgba(56,189,248,.46) !important;
  box-shadow:
    0 0 0 3px rgba(56,189,248,.10),
    0 0 28px rgba(56,189,248,.16),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

#page-historico #hist-list {
  list-style: none;
  display: grid !important;
  gap: .8rem !important;

  max-height: 520px;
  overflow: auto;

  padding: .2rem .25rem .2rem 0 !important;
}

#page-historico #hist-list .admin-item {
  position: relative;

  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: .9rem;
  align-items: center;

  padding: .95rem 1rem .95rem 1.05rem !important;
  border-radius: 20px !important;
  overflow: hidden;

  background:
    radial-gradient(circle at 0% 50%, rgba(56,189,248,.12), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.92), rgba(2,6,23,.88)) !important;

  border: 1px solid rgba(148,163,184,.14) !important;

  box-shadow:
    0 14px 34px rgba(2,6,23,.20),
    inset 0 1px 0 rgba(255,255,255,.04) !important;

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

#page-historico #hist-list .admin-item::before {
  content: "";
  width: 34px;
  height: 34px;
  border-radius: 14px;

  background:
    radial-gradient(circle at 35% 30%, rgba(255,255,255,.24), transparent 34%),
    linear-gradient(135deg, rgba(56,189,248,.26), rgba(37,99,235,.16));

  border: 1px solid rgba(56,189,248,.25);

  box-shadow:
    0 10px 22px rgba(14,165,233,.12),
    inset 0 1px 0 rgba(255,255,255,.10);
}

#page-historico #hist-list .admin-item::after {
  content: "";
  position: absolute;
  left: 16px;
  top: 50%;

  width: 10px;
  height: 10px;
  border-radius: 999px;

  background: #38bdf8;
  box-shadow: 0 0 14px rgba(56,189,248,.75);

  transform: translateY(-50%);
}

#page-historico #hist-list .admin-item:hover {
  transform: translateY(-2px);
  border-color: rgba(56,189,248,.28) !important;

  box-shadow:
    0 18px 44px rgba(2,6,23,.28),
    0 0 0 1px rgba(56,189,248,.08),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

#page-historico #hist-list .admin-name {
  color: #ffffff !important;
  font-size: .95rem !important;
  font-weight: 900 !important;
  letter-spacing: .01em;
}

#page-historico #hist-list .admin-pills {
  margin-top: .55rem;
  display: flex !important;
  align-items: center;
  gap: .42rem !important;
  flex-wrap: wrap;
}

#page-historico #hist-list .pill {
  color: rgba(226,232,240,.90) !important;

  padding: .28rem .62rem !important;
  border-radius: 999px !important;

  background: rgba(15,23,42,.74) !important;
  border: 1px solid rgba(148,163,184,.14) !important;

  font-size: .74rem !important;
  font-weight: 800 !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 8px 18px rgba(2,6,23,.12);
}

#page-historico #hist-list .btn-grad {
  border: 0 !important;
  border-radius: 999px !important;

  padding: .38rem .78rem !important;

  color: #ffffff !important;
  font-size: .76rem !important;
  font-weight: 900 !important;

  background:
    linear-gradient(135deg, #8b5cf6, #a855f7) !important;

  box-shadow:
    0 10px 24px rgba(168,85,247,.22),
    inset 0 1px 0 rgba(255,255,255,.18) !important;

  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease;
}

#page-historico #hist-list .btn-grad:hover {
  transform: translateY(-1px);
  box-shadow:
    0 14px 30px rgba(168,85,247,.30),
    inset 0 1px 0 rgba(255,255,255,.22) !important;
}

#page-historico .hist-empty {
  margin-top: .8rem;
  padding: 1rem 1.1rem;
  border-radius: 18px;

  color: rgba(226,232,240,.82) !important;

  background:
    linear-gradient(180deg, rgba(15,23,42,.72), rgba(2,6,23,.72));
  border: 1px solid rgba(148,163,184,.14);
}

@keyframes histHeroSweep {
  0%, 42% {
    transform: translateX(-130%);
    opacity: 0;
  }

  55% {
    opacity: 1;
  }

  86%, 100% {
    transform: translateX(130%);
    opacity: 0;
  }
}

@media (max-width: 900px) {
  #page-historico .hist-hero {
    flex-direction: column;
  }

  #page-historico .hist-hero-card {
    min-width: 0;
  }

  #page-historico .hist-filter-head,
  #page-historico .hist-list-head {
    align-items: flex-start;
    flex-direction: column;
  }
}

#page-historico .hist-hero {
  min-height: unset !important;
  margin-bottom: 1rem !important;
  padding: .9rem 1.1rem !important;
  border-radius: 22px !important;
  align-items: center !important;
}

#page-historico .hist-eyebrow {
  font-size: .64rem !important;
  letter-spacing: .12em !important;
}

#page-historico .hist-hero .page-title {
  margin: .25rem 0 .2rem !important;
  font-size: clamp(1.45rem, 2vw, 2rem) !important;
  line-height: 1.05 !important;
}

#page-historico .hist-hero .page-subtitle {
  max-width: 680px !important;
  font-size: .86rem !important;
  line-height: 1.45 !important;
  color: rgba(226,232,240,.78) !important;
}

#page-historico .hist-hero-card {
  min-width: 190px !important;
  padding: .78rem .9rem !important;
  border-radius: 18px !important;
}

#page-historico .hist-hero-card span {
  font-size: .62rem !important;
}

#page-historico .hist-hero-card strong {
  font-size: 1.25rem !important;
}

#page-historico .hist-hero-card small {
  font-size: .68rem !important;
}

#page-historico .hist-filter-card {
  padding: 1rem !important;
  border-radius: 22px !important;
}

#page-historico .hist-filter-head {
  margin-bottom: .75rem !important;
}

#page-historico .hist-filter-head h2 {
  font-size: .95rem !important;
}

#page-historico .hist-filter-chip {
  height: 30px !important;
  padding: .25rem .65rem !important;
  font-size: .68rem !important;
}

#page-historico .hist-search-wrap {
  position: relative !important;
  isolation: isolate !important;
  border-radius: 18px !important;
}

#page-historico .hist-search-wrap::before {
  content: "" !important;
  position: absolute !important;
  inset: -1px !important;
  z-index: 0 !important;

  border-radius: 19px !important;

  background:
    linear-gradient(
      120deg,
      rgba(56,189,248,.18),
      rgba(37,99,235,.32),
      rgba(14,165,233,.18)
    ) !important;

  opacity: .75 !important;
  filter: blur(.2px) !important;
}

#page-historico .hist-search-wrap::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;

  border-radius: 18px !important;

  background:
    linear-gradient(
      110deg,
      transparent 0%,
      transparent 35%,
      rgba(255,255,255,.12) 48%,
      transparent 62%,
      transparent 100%
    ) !important;

  transform: translateX(-130%) !important;
  animation: histSearchLight 3.6s ease-in-out infinite !important;
  pointer-events: none !important;
}

#page-historico .hist-search-input {
  position: relative !important;
  z-index: 1 !important;

  height: 54px !important;
  padding-left: 3rem !important;

  border-radius: 18px !important;

  background:
    radial-gradient(circle at 0% 50%, rgba(56,189,248,.12), transparent 38%),
    linear-gradient(180deg, rgba(2,6,23,.94), rgba(2,6,23,.82)) !important;

  border: 1px solid rgba(56,189,248,.28) !important;

  box-shadow:
    0 0 0 1px rgba(56,189,248,.08),
    0 16px 34px rgba(2,6,23,.24),
    inset 0 1px 0 rgba(255,255,255,.055) !important;

  color: #ffffff !important;
  font-weight: 650 !important;
}

#page-historico .hist-search-input::placeholder {
  color: rgba(203,213,225,.62) !important;
}

#page-historico .hist-search-wrap:focus-within::before {
  opacity: 1 !important;
  background:
    linear-gradient(
      120deg,
      rgba(56,189,248,.38),
      rgba(37,99,235,.48),
      rgba(14,165,233,.32)
    ) !important;
}

#page-historico .hist-search-wrap:focus-within .hist-search-input {
  border-color: rgba(56,189,248,.56) !important;

  box-shadow:
    0 0 0 3px rgba(56,189,248,.10),
    0 0 32px rgba(56,189,248,.18),
    inset 0 1px 0 rgba(255,255,255,.07) !important;
}

#page-historico .hist-search-icon {
  z-index: 3 !important;
  left: 1.05rem !important;
  color: #38bdf8 !important;
  filter:
    drop-shadow(0 0 8px rgba(56,189,248,.65))
    drop-shadow(0 0 18px rgba(37,99,235,.28)) !important;
}

@keyframes histSearchLight {
  0%, 42% {
    transform: translateX(-130%);
    opacity: 0;
  }

  52% {
    opacity: 1;
  }

  82%, 100% {
    transform: translateX(130%);
    opacity: 0;
  }
}

@media (max-width: 900px) {
  #page-historico .hist-hero {
    padding: .9rem !important;
  }

  #page-historico .hist-hero-card {
    display: none !important;
  }
}


#page-historico .hist-filter-card {
  overflow: visible !important;
}

#page-historico .hist-search-uiverse {
  position: relative !important;
  width: 100% !important;
  height: 54px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  isolation: isolate !important;
  z-index: 2 !important;
}

#page-historico .ativos-search-white,
#page-historico .ativos-search-border,
#page-historico .ativos-search-dark-border,
#page-historico .ativos-search-glow {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  z-index: -1 !important;
}

#page-historico .ativos-search-white {
  inset: 3px !important;
  filter: blur(2px) !important;
}

#page-historico .ativos-search-border {
  inset: 4px !important;
  filter: blur(.5px) !important;
}

#page-historico .ativos-search-dark-border {
  inset: 1px !important;
  filter: blur(3px) !important;
}

#page-historico .ativos-search-glow {
  inset: -24px !important;
  filter: blur(24px) !important;
  opacity: .32 !important;
}

#page-historico .ativos-search-white::before,
#page-historico .ativos-search-border::before,
#page-historico .ativos-search-dark-border::before,
#page-historico .ativos-search-glow::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;

  width: 720px !important;
  height: 720px !important;

  transform: translate(-50%, -50%) rotate(78deg) !important;
  transition: transform 2s ease !important;

  background-repeat: no-repeat !important;
  background-position: 0 0 !important;
}

#page-historico .ativos-search-white::before {
  background-image: conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(147,197,253,0) 35deg,
    rgba(224,247,255,.92) 82deg,
    rgba(56,189,248,.78) 104deg,
    rgba(37,99,235,.28) 128deg,
    rgba(56,189,248,0) 160deg,
    transparent 360deg
  ) !important;
}

#page-historico .ativos-search-border::before {
  background-image: conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(14,165,233,0) 38deg,
    rgba(56,189,248,.95) 92deg,
    rgba(37,99,235,.55) 120deg,
    rgba(14,165,233,0) 155deg,
    transparent 360deg
  ) !important;
}

#page-historico .ativos-search-dark-border::before {
  background-image: conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(2,132,199,0) 42deg,
    rgba(14,165,233,.55) 98deg,
    rgba(29,78,216,.36) 130deg,
    rgba(2,132,199,0) 165deg,
    transparent 360deg
  ) !important;
}

#page-historico .ativos-search-glow::before {
  background-image: conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(6,182,212,0) 40deg,
    rgba(34,211,238,.68) 95deg,
    rgba(59,130,246,.48) 124deg,
    rgba(6,182,212,0) 160deg,
    transparent 360deg
  ) !important;
}

#page-historico .ativos-search-main {
  position: relative !important;
  z-index: 3 !important;

  display: flex !important;
  align-items: center !important;

  width: 100% !important;
  height: 54px !important;

  border-radius: 14px !important;
  overflow: hidden !important;

  background: linear-gradient(180deg, #030b19 0%, #020617 100%) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 0 1px rgba(56,189,248,.06) !important;
}

#page-historico .ativos-search-input.hist-search-input {
  position: relative !important;
  z-index: 8 !important;

  width: 100% !important;
  height: 54px !important;

  padding: 0 70px 0 54px !important;

  border: 0 !important;
  outline: 0 !important;

  background: transparent !important;
  box-shadow: none !important;

  color: #ffffff !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
}

#page-historico .ativos-search-input.hist-search-input::placeholder {
  color: rgba(203,213,225,.72) !important;
  opacity: 1 !important;
}

#page-historico .ativos-input-mask {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;

  background:
    linear-gradient(
      90deg,
      rgba(7,17,31,.92) 0%,
      rgba(7,17,31,.35) 18%,
      rgba(7,17,31,.08) 50%,
      rgba(7,17,31,.30) 84%,
      rgba(7,17,31,.88) 100%
    ) !important;

  pointer-events: none !important;
}

#page-historico .ativos-blue-mask {
  position: absolute !important;
  left: 32% !important;
  top: 50% !important;
  z-index: 1 !important;

  width: 42% !important;
  height: 160% !important;

  transform: translateY(-50%) !important;

  background:
    radial-gradient(circle, rgba(37,99,235,.18) 0%, rgba(37,99,235,0) 72%) !important;

  filter: blur(16px) !important;
  pointer-events: none !important;
}

#page-historico .ativos-filter-border {
  position: absolute !important;
  right: 8px !important;
  top: 7px !important;
  z-index: 2 !important;

  width: 42px !important;
  height: 40px !important;

  border-radius: 12px !important;
  border: 1px solid rgba(125,211,252,.22) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 0 16px rgba(59,130,246,.12) !important;

  pointer-events: none !important;
}

#page-historico .ativos-filter-icon {
  position: absolute !important;
  right: 17px !important;
  top: 15px !important;
  z-index: 4 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  opacity: .95 !important;
  pointer-events: none !important;
}

#page-historico .ativos-search-icon {
  position: absolute !important;
  left: 18px !important;
  top: 16px !important;
  z-index: 4 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  filter:
    drop-shadow(0 0 8px rgba(56,189,248,.60))
    drop-shadow(0 0 16px rgba(37,99,235,.35)) !important;

  pointer-events: none !important;
}

#page-historico .hist-search-uiverse:hover .ativos-search-white::before,
#page-historico .hist-search-uiverse:hover .ativos-search-border::before,
#page-historico .hist-search-uiverse:hover .ativos-search-dark-border::before,
#page-historico .hist-search-uiverse:hover .ativos-search-glow::before,
#page-historico .hist-search-uiverse:focus-within .ativos-search-white::before,
#page-historico .hist-search-uiverse:focus-within .ativos-search-border::before,
#page-historico .hist-search-uiverse:focus-within .ativos-search-dark-border::before,
#page-historico .hist-search-uiverse:focus-within .ativos-search-glow::before {
  transform: translate(-50%, -50%) rotate(438deg) !important;
}

#page-historico .hist-search-uiverse:focus-within .ativos-search-main {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 0 1px rgba(56,189,248,.12),
    0 0 20px rgba(56,189,248,.10) !important;
}

#page-dashboard .kpi-grid {
  gap: 1rem !important;
  margin-bottom: 1.25rem !important;
}

#page-dashboard .dash3d-parent,
#page-dashboard .dash-stat-card {
  height: 230px !important;
  min-height: 230px !important;
  max-height: 230px !important;
}

#page-dashboard .dash3d-card,
#page-dashboard .dash-stat-card {
  border-radius: 28px !important;
}

#page-dashboard .dash-stat-card {
  padding: 1.05rem !important;
}

#page-dashboard .dash-stat-top {
  margin-bottom: 1.2rem !important;
}

#page-dashboard .dash-stat-icon {
  width: 46px !important;
  height: 46px !important;
  border-radius: 15px !important;
}

#page-dashboard .dash-stat-icon .icon {
  width: 20px !important;
  height: 20px !important;
}

#page-dashboard .dash-stat-chip {
  min-height: 26px !important;
  padding: .28rem .62rem !important;
  font-size: .66rem !important;
}

#page-dashboard .dash-stat-label {
  font-size: .82rem !important;
}

#page-dashboard .dash-stat-value {
  font-size: clamp(2.7rem, 3.2vw, 3.55rem) !important;
  line-height: .9 !important;
  margin-top: .1rem !important;
}

#page-dashboard .dash-stat-sub {
  font-size: .78rem !important;
  margin-top: .1rem !important;
}

#page-dashboard .dash-stat-progress {
  left: 1.05rem !important;
  right: 1.05rem !important;
  bottom: 1.05rem !important;
  height: 7px !important;
}

/* Card principal: Itens cadastrados */
#page-dashboard .dash3d-card {
  padding: 1.05rem !important;
}

#page-dashboard .dash3d-title {
  font-size: .88rem !important;
  letter-spacing: .12em !important;
}

#page-dashboard .dash3d-number {
  font-size: clamp(2.75rem, 3.5vw, 3.7rem) !important;
  line-height: .9 !important;
}

#page-dashboard .dash3d-text {
  font-size: .78rem !important;
  line-height: 1.45 !important;
}

#page-dashboard .dash3d-view-more-button {
  height: 28px !important;
  padding: 0 .7rem !important;
  font-size: .72rem !important;
  right: 1rem !important;
  bottom: 1rem !important;
}

#page-dashboard .dash3d-icon-wrap {
  width: 44px !important;
  height: 44px !important;
}

/* Responsivo */
@media (max-width: 1200px) {
  #page-dashboard .dash3d-parent,
  #page-dashboard .dash-stat-card {
    height: 220px !important;
    min-height: 220px !important;
    max-height: 220px !important;
  }
}

@media (max-width: 640px) {
  #page-dashboard .dash3d-parent,
  #page-dashboard .dash-stat-card {
    height: 210px !important;
    min-height: 210px !important;
    max-height: 210px !important;
  }
}

/* Botão HUB da sidebar */
#btnHubSidebar.hub-uiverse-rocket {
  --hub-bg-1: #4f46e5;
  --hub-bg-2: #2563eb;
  --hub-bg-3: #7c3aed;
  --hub-cyan: #22d3ee;

  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;

  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 16px !important;
  margin-top: 12px !important;

  border: 1px solid rgba(255,255,255,.22) !important;
  border-radius: 999px !important;

  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.28), transparent 24%),
    linear-gradient(135deg, var(--hub-bg-1), var(--hub-bg-2) 55%, var(--hub-bg-3)) !important;

  color: #fff !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase !important;

  box-shadow:
    0 10px 26px rgba(79,70,229,.36),
    0 0 0 1px rgba(255,255,255,.06) inset,
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -10px 18px rgba(15,23,42,.26) !important;

  cursor: pointer !important;
  transform: translateZ(0) !important;
  transition:
    transform .18s ease,
    box-shadow .22s ease,
    filter .22s ease !important;
}

#btnHubSidebar.hub-uiverse-rocket:hover {
  transform: translateY(-1px) scale(1.02) !important;
  filter: brightness(1.08) saturate(1.1) !important;
  box-shadow:
    0 14px 32px rgba(79,70,229,.48),
    0 0 24px rgba(34,211,238,.28),
    inset 0 1px 0 rgba(255,255,255,.40),
    inset 0 -10px 18px rgba(15,23,42,.22) !important;
}

#btnHubSidebar.hub-uiverse-rocket:active {
  transform: translateY(0) scale(.98) !important;
}

#btnHubSidebar .hub-uiverse-liquid {
  position: absolute;
  inset: -80%;
  z-index: -3;

  background:
    radial-gradient(circle at 22% 34%, rgba(255,255,255,.40) 0 7%, transparent 8%),
    radial-gradient(circle at 70% 58%, rgba(34,211,238,.46) 0 9%, transparent 10%),
    radial-gradient(circle at 46% 78%, rgba(168,85,247,.46) 0 10%, transparent 11%),
    radial-gradient(circle at 72% 24%, rgba(96,165,250,.35) 0 8%, transparent 9%);

  filter: blur(9px);
  opacity: .95;
  animation: hubLiquidWave 5.4s ease-in-out infinite alternate;
}

#btnHubSidebar.hub-uiverse-rocket::before {
  content: "";
  position: absolute;
  inset: 1px;
  z-index: -2;
  border-radius: inherit;
  background:
    linear-gradient(
      110deg,
      transparent 0%,
      transparent 34%,
      rgba(255,255,255,.38) 46%,
      rgba(255,255,255,.12) 52%,
      transparent 64%,
      transparent 100%
    );
  transform: translateX(-120%);
  transition: transform .65s ease;
}

#btnHubSidebar.hub-uiverse-rocket:hover::before {
  transform: translateX(120%);
}

#btnHubSidebar.hub-uiverse-rocket::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -4;
  border-radius: inherit;
  background:
    radial-gradient(circle at 50% 110%, rgba(34,211,238,.45), transparent 45%);
  opacity: .72;
}

#btnHubSidebar .hub-uiverse-stars {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

#btnHubSidebar .hub-uiverse-stars span {
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 0 10px rgba(255,255,255,.85);
  opacity: .7;
  animation: hubStarPulse 2.4s ease-in-out infinite;
}

#btnHubSidebar .hub-uiverse-stars span:nth-child(1) {
  top: 9px;
  left: 18px;
}

#btnHubSidebar .hub-uiverse-stars span:nth-child(2) {
  right: 18px;
  top: 12px;
  width: 3px;
  height: 3px;
  animation-delay: .45s;
}

#btnHubSidebar .hub-uiverse-stars span:nth-child(3) {
  left: 36px;
  bottom: 10px;
  width: 3px;
  height: 3px;
  animation-delay: .9s;
}

#btnHubSidebar .hub-uiverse-icon {
  position: relative;
  z-index: 2;
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  font-size: 15px;
  filter: drop-shadow(0 0 8px rgba(255,255,255,.45));
  animation: hubRocketFloat 2.4s ease-in-out infinite;
}

#btnHubSidebar .hub-uiverse-text {
  position: relative;
  z-index: 2;
  color: #fff !important;
  text-shadow:
    0 1px 2px rgba(0,0,0,.35),
    0 0 10px rgba(255,255,255,.26);
}

#btnHubSidebar:hover .hub-uiverse-icon {
  animation: hubRocketBoost .7s ease-in-out infinite;
}

.sidebar.collapsed #btnHubSidebar.hub-uiverse-rocket {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  margin-inline: auto !important;
  border-radius: 16px !important;
}

.sidebar.collapsed #btnHubSidebar .hub-uiverse-text {
  display: none !important;
}

.sidebar.collapsed #btnHubSidebar .hub-uiverse-icon {
  margin: 0 !important;
}

@keyframes hubLiquidWave {
  0% {
    transform: translate3d(-4%, -2%, 0) rotate(0deg) scale(1);
  }
  50% {
    transform: translate3d(4%, 3%, 0) rotate(8deg) scale(1.04);
  }
  100% {
    transform: translate3d(-2%, 5%, 0) rotate(-7deg) scale(1.02);
  }
}

@keyframes hubStarPulse {
  0%, 100% {
    transform: scale(.75);
    opacity: .45;
  }
  50% {
    transform: scale(1.45);
    opacity: 1;
  }
}

@keyframes hubRocketFloat {
  0%, 100% {
    transform: translateY(0) rotate(-8deg);
  }
  50% {
    transform: translateY(-2px) rotate(4deg);
  }
}

@keyframes hubRocketBoost {
  0%, 100% {
    transform: translateY(0) rotate(-10deg) scale(1);
  }
  50% {
    transform: translateY(-3px) rotate(8deg) scale(1.08);
  }
}

@media (prefers-reduced-motion: reduce) {
  #btnHubSidebar .hub-uiverse-liquid,
  #btnHubSidebar .hub-uiverse-stars span,
  #btnHubSidebar .hub-uiverse-icon {
    animation: none !important;
  }
}

#btnHubSidebar.hub-uiverse-rocket {
  --hub-bg-1: #4f46e5;
  --hub-bg-2: #2563eb;
  --hub-bg-3: #7c3aed;

  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;

  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 18px !important;
  margin-top: 12px !important;

  border: 1px solid rgba(255,255,255,.22) !important;
  border-radius: 999px !important;

  background:
    radial-gradient(circle at 22% 34%, rgba(255,255,255,.24), transparent 22%),
    linear-gradient(135deg, var(--hub-bg-1), var(--hub-bg-2) 55%, var(--hub-bg-3)) !important;

  color: #fff !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;

  box-shadow:
    0 10px 26px rgba(79,70,229,.36),
    0 0 0 1px rgba(255,255,255,.06) inset,
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -10px 18px rgba(15,23,42,.26) !important;

  cursor: pointer !important;
  transform: translateZ(0) !important;

  transition:
    transform .18s ease,
    box-shadow .22s ease,
    filter .22s ease !important;
}

#btnHubSidebar .hub-uiverse-liquid {
  position: absolute !important;
  inset: -80% !important;
  z-index: -3 !important;

  background:
    radial-gradient(circle at 22% 34%, rgba(255,255,255,.40) 0 7%, transparent 8%),
    radial-gradient(circle at 70% 58%, rgba(34,211,238,.46) 0 9%, transparent 10%),
    radial-gradient(circle at 46% 78%, rgba(168,85,247,.46) 0 10%, transparent 11%),
    radial-gradient(circle at 72% 24%, rgba(96,165,250,.35) 0 8%, transparent 9%) !important;

  filter: blur(9px) !important;
  opacity: .95 !important;
  animation: hubLiquidWaveSidebar 5.4s ease-in-out infinite alternate !important;
}

#btnHubSidebar.hub-uiverse-rocket::before {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  z-index: -1 !important;
  border-radius: inherit !important;

  background: linear-gradient(
    115deg,
    transparent 0 28%,
    rgba(255,255,255,.44) 43%,
    transparent 59% 100%
  ) !important;

  transform: translateX(-135%) !important;
  transition: transform .65s cubic-bezier(.2,.8,.2,1) !important;
}

#btnHubSidebar.hub-uiverse-rocket:hover::before {
  transform: translateX(135%) !important;
}

#btnHubSidebar.hub-uiverse-rocket::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -2 !important;
  border-radius: inherit !important;
  pointer-events: none !important;

  background: linear-gradient(
    135deg,
    rgba(255,255,255,.30),
    rgba(34,211,238,.18),
    rgba(124,58,237,.28)
  ) !important;

  opacity: .45 !important;
}

#btnHubSidebar .hub-uiverse-stars {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

#btnHubSidebar .hub-uiverse-stars span {
  position: absolute !important;
  width: 3px !important;
  height: 3px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.85) !important;
  box-shadow: 0 0 8px rgba(255,255,255,.7) !important;
  animation: hubStarTwinkleSidebar 2.4s ease-in-out infinite !important;
}

#btnHubSidebar .hub-uiverse-stars span:nth-child(1) {
  top: 10px !important;
  left: 18px !important;
}

#btnHubSidebar .hub-uiverse-stars span:nth-child(2) {
  top: 27px !important;
  left: 36px !important;
  animation-delay: .45s !important;
}

#btnHubSidebar .hub-uiverse-stars span:nth-child(3) {
  top: 12px !important;
  right: 18px !important;
  animation-delay: .9s !important;
}

#btnHubSidebar .hub-uiverse-icon {
  position: relative !important;
  z-index: 2 !important;

  display: inline-grid !important;
  place-items: center !important;

  width: 18px !important;
  height: 18px !important;

  color: #fff !important;

  transform: translateZ(0) !important;
  filter: drop-shadow(0 0 8px rgba(255,255,255,.50)) !important;
  animation: hubRocketFloatSidebar 2.25s ease-in-out infinite !important;
}

#btnHubSidebar .hub-rocket-svg {
  width: 15px !important;
  height: 15px !important;
  display: block !important;
  transform: rotate(-45deg) !important;
  transform-origin: center center !important;
}

#btnHubSidebar .hub-uiverse-icon::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 15px !important;

  width: 7px !important;
  height: 22px !important;
  border-radius: 999px !important;

  background: linear-gradient(
    180deg,
    rgba(255,255,255,.96) 0%,
    rgba(125,211,252,.92) 20%,
    rgba(34,211,238,.80) 48%,
    rgba(167,139,250,.45) 78%,
    transparent 100%
  ) !important;

  transform: translateX(-50%) !important;
  transform-origin: top center !important;
  opacity: .92 !important;
  filter: blur(.35px) !important;
  animation: hubRocketTrailSidebar .9s ease-in-out infinite !important;
}

#btnHubSidebar .hub-uiverse-text {
  position: relative !important;
  z-index: 2 !important;

  color: #fff !important;
  line-height: 1 !important;

  text-shadow:
    0 1px 8px rgba(0,0,0,.40),
    0 0 10px rgba(255,255,255,.25) !important;
}

#btnHubSidebar.hub-uiverse-rocket:hover {
  transform: translateY(-2px) scale(1.045) !important;
  filter: brightness(1.08) saturate(1.15) !important;

  box-shadow:
    0 14px 34px rgba(79,70,229,.54),
    0 0 32px rgba(34,211,238,.24),
    0 0 0 1px rgba(255,255,255,.08) inset,
    inset 0 1px 0 rgba(255,255,255,.36),
    inset 0 -10px 18px rgba(15,23,42,.26) !important;
}

#btnHubSidebar.hub-uiverse-rocket:hover .hub-uiverse-icon {
  animation: hubRocketTakeoffSidebar .78s cubic-bezier(.18,.85,.25,1) forwards !important;
}

#btnHubSidebar.hub-uiverse-rocket:active {
  transform: translateY(0) scale(.96) !important;
}

#btnHubSidebar.hub-uiverse-rocket:focus-visible {
  outline: none !important;

  box-shadow:
    0 0 0 3px rgba(99,102,241,.35),
    0 14px 34px rgba(79,70,229,.52) !important;
}

.sidebar.collapsed #btnHubSidebar.hub-uiverse-rocket {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  margin-inline: auto !important;
  border-radius: 999px !important;
}

.sidebar.collapsed #btnHubSidebar .hub-uiverse-text {
  display: none !important;
}

@keyframes hubLiquidWaveSidebar {
  0% {
    transform: translate3d(-5%, -4%, 0) rotate(0deg) scale(1);
  }

  50% {
    transform: translate3d(5%, 4%, 0) rotate(13deg) scale(1.09);
  }

  100% {
    transform: translate3d(-2%, 7%, 0) rotate(-11deg) scale(1.05);
  }
}

@keyframes hubRocketFloatSidebar {
  0%, 100% {
    transform: translate(0, 0);
  }

  50% {
    transform: translate(0, -2px);
  }
}

@keyframes hubRocketTakeoffSidebar {
  0% {
    opacity: 1;
    transform: translate(0, 0) scale(1);
  }

  35% {
    opacity: 1;
    transform: translate(0, -8px) scale(1.08);
  }

  70% {
    opacity: .75;
    transform: translate(0, -26px) scale(.92);
  }

  100% {
    opacity: 0;
    transform: translate(0, -54px) scale(.72);
  }
}

@keyframes hubRocketTrailSidebar {
  0%, 100% {
    opacity: .45;
    transform: translateX(-50%) scaleY(.72);
  }

  50% {
    opacity: 1;
    transform: translateX(-50%) scaleY(1.22);
  }
}

@keyframes hubStarTwinkleSidebar {
  0%, 100% {
    opacity: .25;
    transform: scale(.7);
  }

  50% {
    opacity: 1;
    transform: scale(1.25);
  }
}

@media (prefers-reduced-motion: reduce) {
  #btnHubSidebar .hub-uiverse-liquid,
  #btnHubSidebar .hub-uiverse-icon,
  #btnHubSidebar .hub-uiverse-icon::before,
  #btnHubSidebar .hub-uiverse-stars span,
  #btnHubSidebar.hub-uiverse-rocket:hover .hub-uiverse-icon {
    animation: none !important;
  }
}

#btnHubSidebar.hub-flight-btn {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .55rem !important;

  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  margin-top: .75rem !important;
  padding: 0 1rem !important;

  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, .24) !important;

  background:
    radial-gradient(circle at 18% 30%, rgba(255,255,255,.32), transparent 16%),
    radial-gradient(circle at 72% 22%, rgba(125,211,252,.24), transparent 20%),
    linear-gradient(135deg, #4f46e5 0%, #2563eb 48%, #7c3aed 100%) !important;

  box-shadow:
    0 14px 30px rgba(79,70,229,.34),
    0 0 24px rgba(34,211,238,.18),
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -10px 18px rgba(15,23,42,.22) !important;

  color: #ffffff !important;
  cursor: pointer !important;

  transform: translateZ(0) !important;
  transition:
    transform .18s ease,
    filter .18s ease,
    box-shadow .18s ease !important;
}

#btnHubSidebar.hub-flight-btn:hover {
  transform: translateY(-2px) scale(1.035) !important;
  filter: brightness(1.08) saturate(1.15) !important;

  box-shadow:
    0 18px 38px rgba(79,70,229,.48),
    0 0 32px rgba(34,211,238,.30),
    inset 0 1px 0 rgba(255,255,255,.42),
    inset 0 -10px 18px rgba(15,23,42,.22) !important;
}

#btnHubSidebar.hub-flight-btn::before {
  content: "";
  position: absolute;
  inset: 1px;
  z-index: 1;

  border-radius: inherit;

  background:
    linear-gradient(
      110deg,
      transparent 0%,
      transparent 34%,
      rgba(255,255,255,.48) 47%,
      rgba(255,255,255,.12) 55%,
      transparent 68%,
      transparent 100%
    );

  transform: translateX(-135%);
  transition: transform .7s cubic-bezier(.2,.8,.2,1);
  pointer-events: none;
}

#btnHubSidebar.hub-flight-btn:hover::before {
  transform: translateX(135%);
}

#btnHubSidebar .hub-flight-liquid {
  position: absolute;
  inset: -90%;
  z-index: -2;

  background:
    radial-gradient(circle at 20% 35%, rgba(255,255,255,.42) 0 6%, transparent 7%),
    radial-gradient(circle at 68% 58%, rgba(34,211,238,.50) 0 9%, transparent 10%),
    radial-gradient(circle at 44% 78%, rgba(168,85,247,.48) 0 10%, transparent 11%),
    radial-gradient(circle at 76% 22%, rgba(96,165,250,.38) 0 8%, transparent 9%);

  filter: blur(9px);
  opacity: .95;

  animation: hubLiquidMove 5.2s ease-in-out infinite alternate;
  pointer-events: none;
}

#btnHubSidebar .hub-flight-stars {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

#btnHubSidebar .hub-flight-stars i {
  position: absolute;
  width: 3px;
  height: 3px;

  border-radius: 999px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 0 10px rgba(255,255,255,.85);

  animation: hubStarBlink 2.3s ease-in-out infinite;
}

#btnHubSidebar .hub-flight-stars i:nth-child(1) {
  top: 10px;
  left: 16px;
}

#btnHubSidebar .hub-flight-stars i:nth-child(2) {
  top: 29px;
  left: 37px;
  animation-delay: .35s;
}

#btnHubSidebar .hub-flight-stars i:nth-child(3) {
  top: 10px;
  right: 18px;
  animation-delay: .7s;
}

#btnHubSidebar .hub-flight-stars i:nth-child(4) {
  bottom: 9px;
  right: 42px;
  width: 2px;
  height: 2px;
  animation-delay: 1.05s;
}

#btnHubSidebar .hub-flight-rocket {
  position: relative;
  z-index: 4;

  display: inline-grid;
  place-items: center;

  width: 20px;
  height: 20px;

  font-size: 15px;
  line-height: 1;

  filter:
    drop-shadow(0 0 7px rgba(255,255,255,.65))
    drop-shadow(0 0 14px rgba(34,211,238,.34));

  transform: translateY(0) rotate(-10deg);
  animation: hubRocketIdle 2.2s ease-in-out infinite;

  will-change: transform, opacity;
}

#btnHubSidebar .hub-flight-rocket::after {
  content: "";
  position: absolute;

  left: 50%;
  top: 18px;

  width: 7px;
  height: 26px;

  border-radius: 999px;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.95) 0%,
      rgba(125,211,252,.92) 18%,
      rgba(34,211,238,.78) 46%,
      rgba(168,85,247,.42) 72%,
      transparent 100%
    );

  transform: translateX(-50%) scaleY(.75);
  transform-origin: top center;

  opacity: .9;
  filter: blur(.35px);

  animation: hubRocketTrail 650ms ease-in-out infinite;
  pointer-events: none;
}

#btnHubSidebar.hub-flight-btn:hover .hub-flight-rocket {
  animation: hubRocketTakeoff 900ms cubic-bezier(.18,.85,.25,1) forwards !important;
}

#btnHubSidebar.hub-flight-btn:hover .hub-flight-rocket::after {
  animation: hubRocketTrailBoost 320ms ease-in-out infinite !important;
}

#btnHubSidebar .hub-flight-text {
  position: relative;
  z-index: 4;

  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;

  font-size: .86rem;
  font-weight: 950;
  letter-spacing: .22em;
  line-height: 1;
  text-transform: uppercase;

  text-shadow:
    0 1px 8px rgba(0,0,0,.42),
    0 0 12px rgba(255,255,255,.28);
}

.sidebar.collapsed #btnHubSidebar.hub-flight-btn {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;

  padding: 0 !important;
  margin-inline: auto !important;

  border-radius: 999px !important;
}

.sidebar.collapsed #btnHubSidebar .hub-flight-text {
  display: none !important;
}

@keyframes hubLiquidMove {
  0% {
    transform: translate3d(-5%, -3%, 0) rotate(0deg) scale(1);
  }

  50% {
    transform: translate3d(5%, 4%, 0) rotate(12deg) scale(1.08);
  }

  100% {
    transform: translate3d(-2%, 7%, 0) rotate(-10deg) scale(1.04);
  }
}

@keyframes hubStarBlink {
  0%, 100% {
    opacity: .28;
    transform: scale(.7);
  }

  50% {
    opacity: 1;
    transform: scale(1.35);
  }
}

@keyframes hubRocketIdle {
  0%, 100% {
    transform: translateY(0) rotate(-10deg);
  }

  50% {
    transform: translateY(-2px) rotate(-5deg);
  }
}

@keyframes hubRocketTakeoff {
  0% {
    opacity: 1;
    transform: translateY(0) rotate(-10deg) scale(1);
  }

  22% {
    opacity: 1;
    transform: translateY(-7px) rotate(-12deg) scale(1.08);
  }

  58% {
    opacity: 1;
    transform: translateY(-31px) rotate(-14deg) scale(.92);
  }

  100% {
    opacity: 0;
    transform: translateY(-68px) rotate(-16deg) scale(.62);
  }
}

@keyframes hubRocketTrail {
  0%, 100% {
    opacity: .45;
    transform: translateX(-50%) scaleY(.62);
  }

  50% {
    opacity: 1;
    transform: translateX(-50%) scaleY(1.1);
  }
}

@keyframes hubRocketTrailBoost {
  0%, 100% {
    opacity: .75;
    transform: translateX(-50%) scaleY(1);
  }

  50% {
    opacity: 1;
    transform: translateX(-50%) scaleY(1.65);
  }
}

#btnHubSidebar.hub-flight-btn {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: .62rem;

  width: 100%;
  height: 48px;
  min-height: 48px;
  margin-top: .75rem;
  padding: 0 1rem;

  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.22);

  background:
    radial-gradient(circle at 18% 28%, rgba(255,255,255,.18), transparent 14%),
    radial-gradient(circle at 72% 24%, rgba(125,211,252,.18), transparent 18%),
    linear-gradient(135deg, #5b5cf0 0%, #3b82f6 45%, #7c3aed 100%);

  box-shadow:
    0 10px 28px rgba(59,130,246,.24),
    0 0 18px rgba(34,211,238,.14),
    inset 0 1px 0 rgba(255,255,255,.24),
    inset 0 -8px 16px rgba(15,23,42,.18);

  color: #fff;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

#btnHubSidebar.hub-flight-btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow:
    0 14px 34px rgba(59,130,246,.30),
    0 0 26px rgba(34,211,238,.20),
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 -8px 16px rgba(15,23,42,.18);
}

#btnHubSidebar .hub-flight-liquid {
  position: absolute;
  inset: -80%;
  z-index: -2;
  background:
    radial-gradient(circle at 22% 34%, rgba(255,255,255,.32) 0 5%, transparent 6%),
    radial-gradient(circle at 70% 58%, rgba(34,211,238,.28) 0 8%, transparent 9%),
    radial-gradient(circle at 50% 78%, rgba(168,85,247,.28) 0 9%, transparent 10%);
  filter: blur(10px);
  animation: hubLiquidMove 5s ease-in-out infinite alternate;
}

#btnHubSidebar .hub-flight-stars {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

#btnHubSidebar .hub-flight-stars i {
  position: absolute;
  width: 3px;
  height: 3px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 0 10px rgba(255,255,255,.75);
  animation: hubStarBlink 2.3s ease-in-out infinite;
}

#btnHubSidebar .hub-flight-stars i:nth-child(1) {
  top: 10px;
  left: 14px;
}

#btnHubSidebar .hub-flight-stars i:nth-child(2) {
  top: 29px;
  left: 34px;
  animation-delay: .35s;
}

#btnHubSidebar .hub-flight-stars i:nth-child(3) {
  top: 11px;
  right: 18px;
  animation-delay: .7s;
}

#btnHubSidebar .hub-flight-stars i:nth-child(4) {
  bottom: 10px;
  right: 42px;
  width: 2px;
  height: 2px;
  animation-delay: 1s;
}

#btnHubSidebar .hub-flight-rocket {
  position: relative;
  z-index: 3;
  width: 18px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;

  transform: translateY(0);
  transform-origin: center center;
  animation: hubRocketIdle 2s ease-in-out infinite;
}

#btnHubSidebar .hub-flight-rocket svg {
  width: 100%;
  height: 100%;
  display: block;
  filter:
    drop-shadow(0 0 6px rgba(255,255,255,.55))
    drop-shadow(0 0 10px rgba(34,211,238,.24));
}

#btnHubSidebar .hub-flight-rocket::after {
  content: "";
  position: absolute;
  left: 50%;
  top: calc(100% - 1px);
  width: 8px;
  height: 22px;
  transform: translateX(-50%);
  transform-origin: top center;
  border-radius: 999px;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.95) 0%,
      rgba(125,211,252,.9) 18%,
      rgba(34,211,238,.72) 48%,
      rgba(168,85,247,.35) 74%,
      transparent 100%
    );

  opacity: .92;
  filter: blur(.2px);
  animation: hubRocketTrail 650ms ease-in-out infinite;
}

#btnHubSidebar.hub-flight-btn:hover .hub-flight-rocket {
  animation: hubRocketTakeoff 900ms cubic-bezier(.18,.85,.25,1) forwards;
}

#btnHubSidebar.hub-flight-btn:hover .hub-flight-rocket::after {
  animation: hubRocketTrailBoost 320ms ease-in-out infinite;
}

#btnHubSidebar .hub-flight-text {
  position: relative;
  z-index: 3;
  color: #fff;
  font-size: .96rem;
  font-weight: 900;
  letter-spacing: .26em;
  line-height: 1;
  text-transform: uppercase;
  text-shadow:
    0 1px 8px rgba(0,0,0,.35),
    0 0 12px rgba(255,255,255,.14);
}

.sidebar.collapsed #btnHubSidebar.hub-flight-btn {
  width: 46px;
  min-width: 46px;
  height: 46px;
  min-height: 46px;
  padding: 0;
  margin-inline: auto;
}

.sidebar.collapsed #btnHubSidebar .hub-flight-text {
  display: none;
}

@keyframes hubLiquidMove {
  0% {
    transform: translate3d(-4%, -2%, 0) rotate(0deg) scale(1);
  }
  50% {
    transform: translate3d(4%, 3%, 0) rotate(8deg) scale(1.06);
  }
  100% {
    transform: translate3d(-2%, 6%, 0) rotate(-8deg) scale(1.03);
  }
}

@keyframes hubStarBlink {
  0%, 100% {
    opacity: .28;
    transform: scale(.7);
  }
  50% {
    opacity: 1;
    transform: scale(1.35);
  }
}

@keyframes hubRocketIdle {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-2px);
  }
}

@keyframes hubRocketTakeoff {
  0% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  22% {
    opacity: 1;
    transform: translateY(-6px) scale(1.04);
  }
  60% {
    opacity: 1;
    transform: translateY(-26px) scale(.92);
  }
  100% {
    opacity: 0;
    transform: translateY(-60px) scale(.62);
  }
}

@keyframes hubRocketTrail {
  0%, 100% {
    opacity: .5;
    transform: translateX(-50%) scaleY(.65);
  }
  50% {
    opacity: 1;
    transform: translateX(-50%) scaleY(1.08);
  }
}

@keyframes hubRocketTrailBoost {
  0%, 100% {
    opacity: .78;
    transform: translateX(-50%) scaleY(1);
  }
  50% {
    opacity: 1;
    transform: translateX(-50%) scaleY(1.55);
  }
}
/* ===============================
   RELATÓRIOS V3
================================ */
#page-relatorios.reports-v3 {
  --reports-cyan: #38bdf8;
  --reports-blue: #2563eb;
  --reports-card: rgba(15, 23, 42, .82);
  --reports-border: rgba(148, 163, 184, .16);
}

#page-relatorios .reports-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;

  margin-bottom: 1.2rem;
  padding: 1.15rem 1.25rem;

  border-radius: 26px;
  overflow: hidden;

  background:
    radial-gradient(circle at 8% 20%, rgba(56,189,248,.18), transparent 34%),
    radial-gradient(circle at 90% 0%, rgba(37,99,235,.14), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.88), rgba(2,6,23,.90));

  border: 1px solid rgba(56,189,248,.18);

  box-shadow:
    0 18px 44px rgba(2,6,23,.26),
    inset 0 1px 0 rgba(255,255,255,.055);
}

#page-relatorios .reports-eyebrow,
#page-relatorios .reports-section-kicker {
  display: inline-flex;
  align-items: center;
  gap: .45rem;

  color: var(--reports-cyan);
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

#page-relatorios .reports-eyebrow::before,
#page-relatorios .reports-section-kicker::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--reports-cyan);
  box-shadow: 0 0 16px rgba(56,189,248,.72);
}

#page-relatorios .reports-wrapper {
  display: grid;
  gap: 1rem;
}

#page-relatorios .reports-home,
#page-relatorios .reports-builder {
  padding: 1.25rem;
  border-radius: 26px;

  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.10), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.84), rgba(2,6,23,.88));

  border: 1px solid var(--reports-border);

  box-shadow:
    0 18px 44px rgba(2,6,23,.22),
    inset 0 1px 0 rgba(255,255,255,.045);
}

#page-relatorios .reports-section-head,
#page-relatorios .reports-builder-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

#page-relatorios .reports-section-head h2,
#page-relatorios .reports-builder-head h2 {
  color: #fff;
  font-size: 1.18rem;
  font-weight: 950;
  margin-top: .25rem;
}

#page-relatorios .reports-section-head p,
#page-relatorios .reports-builder-head p {
  color: rgba(226,232,240,.76);
  font-size: .86rem;
}

#page-relatorios .reports-v3-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(230px, 1fr));
  gap: 1rem;
}

#page-relatorios .reports-v3-card {
  position: relative;
  min-height: 154px;

  display: grid;
  gap: .45rem;
  align-content: start;

  padding: 1rem;
  border-radius: 22px;
  text-align: left;
  cursor: pointer;

  color: #fff;
  background:
    radial-gradient(circle at 82% 18%, rgba(56,189,248,.18), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.92), rgba(2,6,23,.92));

  border: 1px solid rgba(148,163,184,.15);

  box-shadow:
    0 14px 34px rgba(2,6,23,.22),
    inset 0 1px 0 rgba(255,255,255,.045);

  overflow: hidden;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

#page-relatorios .reports-v3-card::after {
  content: "";
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      110deg,
      transparent 0%,
      transparent 38%,
      rgba(255,255,255,.06) 50%,
      transparent 62%,
      transparent 100%
    );

  transform: translateX(-130%);
  transition: transform .75s ease;
  pointer-events: none;
}

#page-relatorios .reports-v3-card:hover {
  transform: translateY(-2px);
  border-color: rgba(56,189,248,.34);
  box-shadow:
    0 20px 46px rgba(2,6,23,.30),
    0 0 0 1px rgba(56,189,248,.08),
    inset 0 1px 0 rgba(255,255,255,.07);
}

#page-relatorios .reports-v3-card:hover::after {
  transform: translateX(130%);
}

#page-relatorios .reports-v3-card.is-primary {
  border-color: rgba(56,189,248,.30);
}

#page-relatorios .reports-card-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;

  border-radius: 15px;
  background:
    radial-gradient(circle at 35% 30%, rgba(255,255,255,.20), transparent 34%),
    linear-gradient(135deg, rgba(56,189,248,.28), rgba(37,99,235,.16));

  border: 1px solid rgba(56,189,248,.24);
}

#page-relatorios .reports-card-title {
  color: #ffffff;
  font-size: .96rem;
  font-weight: 950;
}

#page-relatorios .reports-card-desc {
  color: rgba(226,232,240,.76);
  font-size: .78rem;
  line-height: 1.35;
}

#page-relatorios .reports-card-pill {
  width: fit-content;
  margin-top: auto;

  padding: .28rem .62rem;
  border-radius: 999px;

  color: #e0f2fe;
  font-size: .7rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .05em;

  background: rgba(14,165,233,.12);
  border: 1px solid rgba(14,165,233,.24);
}

#page-relatorios .reports-card-pill.danger {
  color: #fee2e2;
  background: rgba(239,68,68,.14);
  border-color: rgba(239,68,68,.28);
}

#page-relatorios .reports-card-pill.muted {
  color: #e2e8f0;
  background: rgba(148,163,184,.12);
  border-color: rgba(148,163,184,.20);
}

#page-relatorios .reports-filter-panel {
  display: grid;
  gap: 1rem;
}

#page-relatorios .reports-filter-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(190px, 1fr));
  gap: .85rem;
}

#page-relatorios .reports-actions-row {
  display: flex;
  justify-content: flex-end;
  gap: .75rem;
  flex-wrap: wrap;
}

#page-relatorios .reports-count-box {
  min-width: 150px;
  padding: .8rem .95rem;
  border-radius: 18px;

  background:
    radial-gradient(circle at 80% 20%, rgba(56,189,248,.20), transparent 36%),
    linear-gradient(180deg, rgba(15,23,42,.86), rgba(2,6,23,.76));

  border: 1px solid rgba(56,189,248,.18);
}

#page-relatorios .reports-count-box span {
  display: block;
  color: #fff;
  font-size: 1.55rem;
  font-weight: 950;
  line-height: 1;
}

#page-relatorios .reports-count-box small {
  color: rgba(226,232,240,.70);
  font-size: .72rem;
}

#page-relatorios .reports-preview {
  display: grid;
  gap: .55rem;
  margin-top: .25rem;
}

#page-relatorios .reports-preview-row,
#page-relatorios .reports-preview-empty {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;

  padding: .75rem .9rem;
  border-radius: 15px;

  background: rgba(15,23,42,.70);
  border: 1px solid rgba(148,163,184,.12);
}

#page-relatorios .reports-preview-row strong {
  color: #fff;
  font-size: .84rem;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#page-relatorios .reports-preview-row span {
  color: #cbd5e1;
  font-size: .76rem;
  font-weight: 800;
  white-space: nowrap;
}

#page-relatorios .form-input,
#page-relatorios .form-select {
  background: rgba(2,6,23,.78) !important;
  border-color: rgba(56,189,248,.18) !important;
  color: #fff !important;
}

#page-relatorios .form-input:focus,
#page-relatorios .form-select:focus {
  border-color: rgba(56,189,248,.48) !important;
  box-shadow:
    0 0 0 3px rgba(56,189,248,.10),
    0 0 24px rgba(56,189,248,.10) !important;
}

@media (max-width: 1100px) {
  #page-relatorios .reports-v3-grid,
  #page-relatorios .reports-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  #page-relatorios .reports-hero,
  #page-relatorios .reports-section-head,
  #page-relatorios .reports-builder-head {
    flex-direction: column;
    align-items: stretch;
  }

  #page-relatorios .reports-v3-grid,
  #page-relatorios .reports-filter-grid {
    grid-template-columns: 1fr;
  }
}

/* ===============================
   AUTO AJUSTE DOS CARDS EM 100%
================================ */
#page-dashboard .quick-viper-card,
#page-dashboard .dash3d-card,
#page-dashboard .dash-stat-card {
  min-width: 0 !important;
  overflow: hidden !important;
}

#page-dashboard .quick-viper-text-border {
  max-width: calc(100% - 2.2rem) !important;

  font-size: clamp(.78rem, 1.05vw, 1.05rem) !important;
  letter-spacing: clamp(.10rem, .55vw, .22rem) !important;

  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#page-dashboard .quick-viper-info {
  min-width: 0 !important;
}

#page-dashboard .quick-viper-info span,
#page-dashboard .quick-viper-info small {
  max-width: 100% !important;
  overflow: hidden !important;
}

#page-dashboard .quick-viper-info span {
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}

#page-dashboard .quick-viper-info small {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

#page-dashboard .dash3d-title,
#page-dashboard .dash-stat-label,
#page-dashboard .dash-stat-sub {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

#page-dashboard .dash-stat-chip,
#page-dashboard .dash3d-view-more-button {
  max-width: 45% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#btnHubSidebar .hub-flight-text {
  font-size: clamp(.72rem, .95vw, .96rem) !important;
  letter-spacing: clamp(.10em, .7vw, .26em) !important;
  white-space: nowrap !important;
}

/* Relatórios — cabeçalho compacto */
#page-relatorios .reports-hero {
  min-height: unset !important;
  margin-bottom: .85rem !important;
  padding: .52rem 1rem !important;
  border-radius: 18px !important;

  display: flex !important;
  align-items: center !important;
}

#page-relatorios .reports-eyebrow {
  font-size: .58rem !important;
  letter-spacing: .12em !important;
  margin-bottom: .15rem !important;
}

#page-relatorios .reports-eyebrow::before {
  width: 6px !important;
  height: 6px !important;
}

#page-relatorios .reports-hero .page-title {
  margin: .12rem 0 .12rem !important;
  font-size: clamp(1.25rem, 1.55vw, 1.65rem) !important;
  line-height: 1 !important;
}

#page-relatorios .reports-hero .page-subtitle {
  max-width: 760px !important;
  font-size: .78rem !important;
  line-height: 1.25 !important;
  color: rgba(226,232,240,.76) !important;
}

#page-relatorios .reports-back {
  height: 34px !important;
  padding: 0 .8rem !important;
  border-radius: 12px !important;
  font-size: .78rem !important;
}

/* =====================================================
   DASHBOARD — correção final do card "Itens cadastrados"
   Mantém o card compacto sem cortar textos/botão
   ===================================================== */

#page-dashboard .dash3d-parent {
  height: 230px !important;
  min-height: 230px !important;
  max-height: 230px !important;
}

#page-dashboard .dash3d-card {
  position: relative !important;
  height: 100% !important;
  overflow: hidden !important;
  border-radius: 34px !important;
}

/* cancela o padding antigo que empurrava tudo pra baixo */
#page-dashboard .dash3d-content {
  position: absolute !important;
  inset: 0 !important;
  z-index: 6 !important;

  padding: 0 !important;
  transform: translate3d(0, 0, 26px) !important;
}

/* título fixo e seguro */
#page-dashboard .dash3d-title {
  position: absolute !important;
  left: 1.25rem !important;
  top: 4.75rem !important;

  width: min(175px, calc(100% - 8.5rem)) !important;
  max-width: min(175px, calc(100% - 8.5rem)) !important;

  font-size: clamp(.78rem, .88vw, .92rem) !important;
  line-height: 1.12 !important;
  letter-spacing: .10em !important;

  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  overflow-wrap: normal !important;
}

/* número não sai mais pra fora */
#page-dashboard .dash3d-number {
  position: absolute !important;
  left: 1.25rem !important;
  top: 7.35rem !important;

  margin: 0 !important;

  font-size: clamp(2.55rem, 3.05vw, 3.25rem) !important;
  line-height: .88 !important;

  white-space: nowrap !important;
}

/* descrição curta e sem invadir o botão */
#page-dashboard .dash3d-text {
  position: absolute !important;
  left: 1.25rem !important;
  top: 10.45rem !important;

  width: min(170px, calc(100% - 8rem)) !important;
  max-width: min(170px, calc(100% - 8rem)) !important;

  margin: 0 !important;

  font-size: clamp(.67rem, .72vw, .76rem) !important;
  line-height: 1.28 !important;

  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;

  white-space: normal !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* barra inferior só controla o botão */
#page-dashboard .dash3d-bottom {
  position: absolute !important;
  left: 1rem !important;
  right: 1rem !important;
  bottom: .85rem !important;

  padding: 0 !important;
  z-index: 12 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;

  transform: translate3d(0, 0, 26px) !important;
}

/* botão Categorias inteiro, sem cortar */
#page-dashboard .dash3d-view-more {
  width: auto !important;
  min-width: 122px !important;
  max-width: none !important;

  height: 31px !important;
  margin-left: auto !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .35rem !important;

  padding: 0 .75rem !important;
  border-radius: 999px !important;

  pointer-events: auto !important;
  cursor: pointer !important;
}

#page-dashboard .dash3d-view-more-button {
  width: auto !important;
  min-width: auto !important;
  max-width: none !important;

  height: auto !important;
  padding: 0 !important;

  font-size: 0 !important;
  line-height: 1 !important;

  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: unset !important;
}

#page-dashboard .dash3d-view-more-button::before {
  content: "Categorias" !important;
  display: inline-block !important;

  font-size: .76rem !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: .01em !important;

  white-space: nowrap !important;
}

#page-dashboard .dash3d-view-arrow {
  width: 14px !important;
  min-width: 14px !important;
  height: 14px !important;
  max-height: 14px !important;
  flex: 0 0 auto !important;
}

/* dropdown fica dentro do card sem esmagar conteúdo */
#page-dashboard .dash3d-more-list {
  left: 1rem !important;
  right: 1rem !important;
  bottom: 3.1rem !important;

  max-height: 0 !important;
  z-index: 20 !important;
}

#page-dashboard .dash3d-parent.is-cats-open .dash3d-more-list,
#page-dashboard .dash3d-more-list:hover {
  max-height: 112px !important;
}


@media (max-width: 1300px) {
  #page-dashboard .dash3d-title {
    top: 4.45rem !important;
    width: calc(100% - 7.7rem) !important;
    max-width: calc(100% - 7.7rem) !important;
  }

  #page-dashboard .dash3d-number {
    top: 7.05rem !important;
    font-size: clamp(2.35rem, 2.9vw, 3rem) !important;
  }

  #page-dashboard .dash3d-text {
    top: 10rem !important;
    width: calc(100% - 8rem) !important;
    max-width: calc(100% - 8rem) !important;
  }

  #page-dashboard .dash3d-view-more {
    min-width: 112px !important;
  }

  #page-dashboard .dash3d-view-more-button::before {
    font-size: .72rem !important;
  }
}

/* карточки панели активов */
#page-dashboard .asset-kpi-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin-bottom:1.25rem;
}

#page-dashboard .asset-kpi-card{
  --kpi-a:#60a5fa;
  --kpi-b:#2563eb;
  --kpi-glow:rgba(96,165,250,.22);

  position:relative;
  overflow:hidden;
  isolation:isolate;

  min-height:230px;
  padding:1.05rem;
  border-radius:28px;

  background:
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--kpi-a) 26%, transparent), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.97), rgba(2,6,23,.99));

  border:1px solid rgba(148,163,184,.16);
  box-shadow:
    0 24px 60px -38px var(--kpi-glow),
    inset 0 1px 0 rgba(255,255,255,.06);

  cursor:pointer;
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

#page-dashboard .asset-kpi-card:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb, var(--kpi-a) 40%, rgba(255,255,255,.12));
  box-shadow:
    0 28px 70px -34px var(--kpi-glow),
    inset 0 1px 0 rgba(255,255,255,.08);
}

#page-dashboard .asset-kpi-card::before{
  content:"";
  position:absolute;
  inset:-38%;
  z-index:-2;
  background:
    conic-gradient(
      from 180deg,
      transparent,
      color-mix(in srgb, var(--kpi-a) 38%, transparent),
      transparent,
      color-mix(in srgb, var(--kpi-b) 32%, transparent),
      transparent
    );
  opacity:.20;
  filter:blur(18px);
  animation:assetKpiAura 9s linear infinite;
}

#page-dashboard .asset-kpi-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.07), transparent);
  transform:translateX(-130%);
  opacity:.65;
  transition:transform .7s ease;
}

#page-dashboard .asset-kpi-card:hover::after{
  transform:translateX(130%);
}

#page-dashboard .asset-kpi-blue{
  --kpi-a:#60a5fa;
  --kpi-b:#2563eb;
  --kpi-glow:rgba(96,165,250,.24);
}

#page-dashboard .asset-kpi-cyan{
  --kpi-a:#22d3ee;
  --kpi-b:#0284c7;
  --kpi-glow:rgba(34,211,238,.24);
}

#page-dashboard .asset-kpi-green{
  --kpi-a:#34d399;
  --kpi-b:#059669;
  --kpi-glow:rgba(52,211,153,.24);
}

#page-dashboard .asset-kpi-orange{
  --kpi-a:#fb923c;
  --kpi-b:#f97316;
  --kpi-glow:rgba(251,146,60,.24);
}

#page-dashboard .asset-kpi-glow{
  position:absolute;
  top:-120px;
  left:50%;
  width:240px;
  height:240px;
  transform:translateX(-50%);
  border-radius:999px;
  background:var(--kpi-glow);
  filter:blur(54px);
  pointer-events:none;
}

#page-dashboard .asset-kpi-head{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:.75rem;
  padding-bottom:.85rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}

#page-dashboard .asset-kpi-icon{
  width:46px;
  height:46px;
  flex:0 0 46px;

  display:grid;
  place-items:center;
  border-radius:15px;

  color:var(--kpi-a);
  background:color-mix(in srgb, var(--kpi-a) 13%, transparent);
  border:1px solid color-mix(in srgb, var(--kpi-a) 28%, rgba(255,255,255,.06));
  box-shadow:0 0 22px color-mix(in srgb, var(--kpi-a) 14%, transparent);
}

#page-dashboard .asset-kpi-icon .icon{
  width:20px;
  height:20px;
  filter:
    drop-shadow(0 0 8px color-mix(in srgb, var(--kpi-a) 65%, transparent))
    drop-shadow(0 0 16px color-mix(in srgb, var(--kpi-b) 38%, transparent));
}

#page-dashboard .asset-kpi-head span,
#page-dashboard .asset-kpi-values span{
  display:block;
  color:#8fa1ba;
  font-size:.62rem;
  font-weight:950;
  letter-spacing:.14em;
  text-transform:uppercase;
}

#page-dashboard .asset-kpi-head strong{
  display:block;
  margin-top:.15rem;
  color:#f8fafc;
  font-size:.86rem;
  font-weight:950;
  letter-spacing:.07em;
  text-transform:uppercase;
  white-space:nowrap;
}

#page-dashboard .asset-kpi-values{
  position:relative;
  z-index:2;

  display:grid;
  grid-template-columns:1.25fr .9fr;
  gap:0;

  padding:.95rem 0 .85rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}

#page-dashboard .asset-kpi-values > div:first-child{
  padding-right:.85rem;
  border-right:1px solid rgba(255,255,255,.08);
}

#page-dashboard .asset-kpi-values > div:last-child{
  padding-left:.85rem;
}

#page-dashboard .asset-kpi-values strong{
  display:block;
  margin-top:.25rem;
  color:#ffffff;
  font-size:clamp(2.35rem,3vw,3.2rem);
  font-weight:950;
  line-height:.92;
  letter-spacing:-.055em;
  text-shadow:
    0 0 14px rgba(255,255,255,.10),
    0 0 26px var(--kpi-glow);
}

#page-dashboard .asset-kpi-values > div:last-child strong{
  font-size:clamp(1.65rem,2vw,2.2rem);
  letter-spacing:-.04em;
}

#page-dashboard .asset-kpi-values small{
  display:block;
  margin-top:.35rem;
  color:color-mix(in srgb, var(--kpi-a) 76%, #dbeafe);
  font-size:.70rem;
  font-weight:900;
}

#page-dashboard .asset-kpi-foot{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
  margin-top:.75rem;
}

#page-dashboard .asset-kpi-foot span{
  min-width:0;
  color:#94a3b8;
  font-size:.72rem;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

#page-dashboard .asset-kpi-foot strong{
  flex-shrink:0;
  color:var(--kpi-a);
  font-size:.70rem;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}

#page-dashboard .asset-kpi-line{
  position:absolute;
  left:1.05rem;
  right:1.05rem;
  bottom:1.05rem;
  height:7px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.06);
}

#page-dashboard .asset-kpi-line span{
  display:block;
  width:0%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--kpi-b),var(--kpi-a));
  box-shadow:0 0 18px var(--kpi-glow);
  transition:width .45s ease;
}

@keyframes assetKpiAura{
  to{ transform:rotate(360deg); }
}

/* быстрые действия */
#page-dashboard .asset-action-panel{
  margin:0 0 1.5rem;
  padding:1rem;
  border-radius:26px;
  border:1px solid rgba(148,163,184,.13);
  background:
    radial-gradient(circle at 10% 0%, rgba(96,165,250,.10), transparent 32%),
    linear-gradient(180deg, rgba(15,23,42,.72), rgba(2,6,23,.74));
  box-shadow:
    0 18px 46px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.04);
}

#page-dashboard .asset-action-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:.9rem;
  padding:0 .15rem .75rem;
  border-bottom:1px solid rgba(255,255,255,.07);
}

#page-dashboard .asset-action-head span{
  display:block;
  color:#60a5fa;
  font-size:.62rem;
  font-weight:950;
  letter-spacing:.16em;
  text-transform:uppercase;
}

#page-dashboard .asset-action-head h2{
  margin:.25rem 0 0;
  color:#f8fafc;
  font-size:1.05rem;
  font-weight:950;
  letter-spacing:-.02em;
}

#page-dashboard .asset-action-head small{
  color:#94a3b8;
  font-size:.76rem;
  font-weight:800;
  text-align:right;
}

#page-dashboard .asset-action-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.85rem;
}

#page-dashboard .asset-action-card{
  --act-a:#38bdf8;
  --act-b:#2563eb;

  position:relative;
  overflow:hidden;
  min-height:92px;

  display:grid;
  grid-template-columns:50px minmax(0,1fr);
  align-items:center;
  gap:.85rem;

  padding:.85rem;
  border-radius:20px;
  border:1px solid rgba(148,163,184,.13);
  background:
    radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--act-a) 16%, transparent), transparent 34%),
    linear-gradient(180deg, rgba(15,23,42,.80), rgba(2,6,23,.86));

  color:#f8fafc;
  text-align:left;
  cursor:pointer;

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

#page-dashboard .asset-action-card:hover{
  transform:translateY(-2px);
  border-color:color-mix(in srgb, var(--act-a) 34%, rgba(255,255,255,.12));
  box-shadow:0 18px 34px rgba(0,0,0,.24);
}

#page-dashboard .asset-action-blue{
  --act-a:#38bdf8;
  --act-b:#2563eb;
}

#page-dashboard .asset-action-green{
  --act-a:#34d399;
  --act-b:#059669;
}

#page-dashboard .asset-action-orange{
  --act-a:#fb923c;
  --act-b:#f97316;
}

#page-dashboard .asset-action-icon{
  position:relative;
  width:50px;
  height:44px;
  display:grid;
  place-items:center;
  clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%);
  background:conic-gradient(var(--act-b),#fff,var(--act-a),#111827,var(--act-a),var(--act-b));
  box-shadow:
    0 0 20px color-mix(in srgb, var(--act-a) 35%, transparent),
    0 8px 18px rgba(0,0,0,.24);
}

#page-dashboard .asset-action-icon::before{
  content:"";
  position:absolute;
  inset:4px;
  clip-path:inherit;
  background:#0b1220;
}

#page-dashboard .asset-action-icon i{
  position:relative;
  z-index:2;
  width:25px;
  height:25px;
  background:var(--act-a);
  clip-path:polygon(0 10%,70% 90%,35% 90%,0 50%);
  filter:drop-shadow(0 0 10px var(--act-a));
}

#page-dashboard .asset-action-card strong{
  display:block;
  color:#ffffff;
  font-size:.92rem;
  font-weight:950;
  letter-spacing:.01em;
}

#page-dashboard .asset-action-card small{
  display:block;
  margin-top:.24rem;
  color:#94a3b8;
  font-size:.76rem;
  font-weight:750;
  line-height:1.35;
}

@media(max-width:1200px){
  #page-dashboard .asset-kpi-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:860px){
  #page-dashboard .asset-action-grid{
    grid-template-columns:1fr;
  }

  #page-dashboard .asset-action-head{
    align-items:flex-start;
    flex-direction:column;
  }

  #page-dashboard .asset-action-head small{
    text-align:left;
  }
}

@media(max-width:640px){
  #page-dashboard .asset-kpi-grid{
    grid-template-columns:1fr;
  }

  #page-dashboard .asset-kpi-card{
    min-height:220px;
  }
}
/* выравнивание карточек активов */
#page-dashboard .asset-kpi-card{
  min-height:238px !important;
  padding-bottom:2.35rem !important;
}

#page-dashboard .asset-kpi-values{
  padding:.85rem 0 .70rem !important;
}

#page-dashboard .asset-kpi-foot{
  margin-top:.58rem !important;
  padding-bottom:.55rem !important;
  align-items:flex-start !important;
}

#page-dashboard .asset-kpi-foot span{
  max-width:68% !important;
  font-size:.68rem !important;
  line-height:1.15 !important;
}

#page-dashboard .asset-kpi-foot strong{
  max-width:30% !important;
  text-align:right !important;
  font-size:.66rem !important;
  line-height:1.15 !important;
}

#page-dashboard .asset-kpi-line{
  bottom:.92rem !important;
  height:6px !important;
}
/* быстрые действия: живые значки */
#page-dashboard .asset-action-icon{
  overflow:hidden !important;
  isolation:isolate !important;
  animation:assetActionHexFloat 2.8s ease-in-out infinite !important;
}

#page-dashboard .asset-action-icon::after{
  content:"";
  position:absolute;
  inset:-55%;
  z-index:0;
  background:
    conic-gradient(
      from 0deg,
      var(--act-b),
      rgba(255,255,255,.95),
      var(--act-a),
      #0f172a,
      var(--act-a),
      var(--act-b)
    );
  animation:assetActionHexSpin 4.8s linear infinite;
}

#page-dashboard .asset-action-icon::before{
  z-index:1 !important;
  inset:4px !important;
  background:#0b1220 !important;
}

#page-dashboard .asset-action-icon i{
  animation:assetActionMarkPulse 1.8s ease-in-out infinite !important;
}

#page-dashboard .asset-action-card:hover .asset-action-icon{
  animation:assetActionHexHover .72s ease-in-out infinite !important;
}

#page-dashboard .asset-action-card:hover .asset-action-icon::after{
  animation-duration:1.35s !important;
}

@keyframes assetActionHexSpin{
  to{
    transform:rotate(360deg);
  }
}

@keyframes assetActionHexFloat{
  0%,100%{
    transform:translateY(0) scale(1);
  }
  50%{
    transform:translateY(-2px) scale(1.025);
  }
}

@keyframes assetActionHexHover{
  0%,100%{
    transform:translateY(-1px) scale(1.02);
  }
  50%{
    transform:translateY(-4px) scale(1.07);
  }
}

@keyframes assetActionMarkPulse{
  0%,100%{
    opacity:.82;
    transform:scale(.92) rotate(0deg);
  }
  50%{
    opacity:1;
    transform:scale(1.08) rotate(-2deg);
  }
}
@media (max-width: 900px) {
  #page-catalogo.page-ativos-v2 .ativos-pagination {
    flex-direction: column;
    align-items: stretch;
  }

  #page-catalogo.page-ativos-v2 .ativos-pagination-controls {
    justify-content: flex-start;
  }
}

/* профиль GM Hall */
.asset-profile-topbar{
  position: sticky;
  top: 0;
  z-index: 35;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-height: 64px;
  margin: -0.25rem 0 1.25rem;
  padding: 0.75rem 0;
  background:
    linear-gradient(180deg, hsl(var(--background) / .96), hsl(var(--background) / .78) 72%, transparent);
  backdrop-filter: blur(8px);
}

.asset-profile-btn{
  height: 50px;
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding: 6px 14px 6px 7px;
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 999px;
  color: hsl(var(--foreground));
  background: rgba(2, 6, 23, .42);
  cursor: pointer;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 14px 34px rgba(0,0,0,.22);
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.asset-profile-btn:hover{
  transform: translateY(-1px);
  border-color: rgba(96,165,250,.38);
  background: rgba(15, 23, 42, .76);
}

.asset-profile-btn img,
#asset-profile-avatar-fallback{
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 999px;
}

.asset-profile-btn img{
  object-fit: cover;
  border: 1px solid rgba(96,165,250,.34);
}

#asset-profile-avatar-fallback{
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 14px;
  font-weight: 950;
  background: linear-gradient(135deg, #38bdf8, #6366f1, #a855f7);
  box-shadow: 0 0 22px rgba(99,102,241,.22);
}

.asset-profile-text{
  min-width: 0;
}

.asset-profile-text strong,
.asset-profile-text small{
  display: block;
  text-align: left;
  line-height: 1.1;
}

.asset-profile-text strong{
  max-width: 160px;
  color: hsl(var(--foreground));
  font-size: 13px;
  font-weight: 950;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.asset-profile-text small{
  margin-top: 4px;
  color: hsl(var(--muted-foreground));
  font-size: 10px;
  font-weight: 800;
}

@media (max-width: 760px){
  .asset-profile-topbar{
    justify-content: stretch;
  }

  .asset-profile-btn{
    width: 100%;
  }
}

/* фикс аватара */
#asset-profile-avatar-img[hidden],
#asset-profile-avatar-fallback[hidden]{
  display: none !important;
}
/* Contas de consulta não devem ver comandos que alteram dados. O !important
   garante que componentes com display próprio não anulem o atributo hidden. */
body.ativos-readonly [data-page="cadastro"],
body.ativos-readonly [data-page="vincular"],
body.ativos-readonly [data-quick-action="cadastro"],
body.ativos-readonly [data-quick-action="vincular"],
body.ativos-readonly #ast-toggle-form {
  display: none !important;
}
