/* Importa a base do style.css original sem conflitar */
@import url('style.css');

.admin-body { 
    display: flex; 
    height: 100vh; 
    overflow: hidden; 
    background: var(--bg-dark); 
}

/* Sidebar / Menu Lateral */
.sidebar { 
    width: 280px; 
    background: var(--glass-bg); 
    backdrop-filter: blur(20px); 
    border-right: var(--glass-border); 
    padding: 30px 20px; 
    display: flex; 
    flex-direction: column; 
    gap: 30px; 
    transition: left 0.3s ease; 
    z-index: 2000; 
}

.menu-item { 
    padding: 15px; 
    border-radius: 10px; 
    color: var(--text-dark); 
    text-decoration: none; 
    display: flex; 
    align-items: center; 
    gap: 15px; 
    font-weight: 600; 
    transition: 0.3s; 
    opacity: 0.7; 
    cursor: pointer; 
    border: 1px solid transparent; 
}

.menu-item:hover, .menu-item.active { 
    opacity: 1; 
    background: rgba(0, 229, 255, 0.1); 
    border: 1px solid var(--primary); 
    color: var(--primary); 
}

/* Conteúdo Principal */
.admin-content { 
    flex: 1; 
    overflow-y: auto; 
    padding: 40px; 
    position: relative; 
}

.dashboard-header { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    margin-bottom: 40px; 
}

.header-left { 
    display: flex; 
    align-items: center; 
    gap: 15px; 
}

.dashboard-header h1 { 
    font-size: 2.2rem; 
    margin: 0; 
}

.user-profile { 
    display: flex; 
    align-items: center; 
    gap: 15px; 
    font-weight: 700; 
}

/* Botão Menu Mobile (Invisível no PC) */
.mobile-menu-btn { 
    display: none; 
    background: rgba(255,255,255,0.1); 
    border: 1px solid rgba(255,255,255,0.2); 
    color: white; 
    padding: 8px 12px; 
    border-radius: 8px; 
    cursor: pointer; 
    font-size: 1.2rem; 
}

/* Overlay Fundo Escuro Mobile */
.sidebar-overlay { 
    display: none; 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background: rgba(0,0,0,0.6); 
    z-index: 1999; 
    backdrop-filter: blur(5px); 
}

.sidebar-overlay.active { 
    display: block; 
}

/* Cards de Resumo */
.summary-grid { 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); 
    gap: 20px; 
    margin-bottom: 40px; 
}

.summary-card { 
    padding: 25px; 
    border-radius: 16px; 
    background: var(--glass-bg); 
    border: var(--glass-border); 
    display: flex; 
    flex-direction: column; 
    gap: 10px; 
}

.summary-card h3 { 
    font-size: 1rem; 
    opacity: 0.8; 
}

.summary-card .value { 
    font-size: 2.5rem; 
    font-weight: 800; 
    color: var(--primary); 
}

/* Formulário de O.S. */
.os-form-grid { 
    display: grid; 
    grid-template-columns: 1fr 1fr; 
    gap: 20px; 
}

.os-form-grid .full-col { 
    grid-column: span 2; 
}

.admin-input { 
    width: 100%; 
    padding: 14px; 
    border-radius: 8px; 
    border: 1px solid rgba(255,255,255,0.2); 
    background: rgba(0,0,0,0.2); 
    color: white; 
    outline: none; 
    font-family: inherit; 
    font-size: 1rem; 
}

.admin-input:focus { 
    border-color: var(--primary); 
}

/* Múltiplas Paradas no Admin */
.admin-stop-row { 
    display: flex; 
    gap: 10px; 
    margin-bottom: 10px; 
    animation: fadeIn 0.3s ease;
}

.btn-remove-stop-admin { 
    background: rgba(239, 68, 68, 0.1); 
    color: #ef4444; 
    border: 1px solid rgba(239, 68, 68, 0.3); 
    border-radius: 8px; 
    width: 50px; 
    cursor: pointer; 
    font-size: 1.2rem; 
    transition: 0.3s; 
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-remove-stop-admin:hover { 
    background: #ef4444; 
    color: white; 
}

.checkbox-label { 
    display: flex; 
    align-items: center; 
    gap: 10px; 
    cursor: pointer; 
    font-size: 1rem; 
    font-weight: 600; 
    opacity: 0.9; 
}

.custom-checkbox { 
    width: 22px; 
    height: 22px; 
    accent-color: var(--secondary); 
    cursor: pointer; 
}

/* Tabela de O.S. */
.table-container { 
    overflow-x: auto; 
    background: var(--glass-bg); 
    border-radius: 16px; 
    border: var(--glass-border); 
    padding: 20px; 
}

.os-table { 
    width: 100%; 
    border-collapse: collapse; 
    min-width: 900px; 
}

.os-table th, .os-table td { 
    padding: 15px; 
    text-align: left; 
    border-bottom: 1px solid rgba(255,255,255,0.1); 
    font-size: 0.95rem; 
}

.os-table th { 
    color: var(--primary); 
    font-weight: 800; 
    text-transform: uppercase; 
    font-size: 0.8rem; 
}

.status-select { 
    background: #1e293b; 
    color: white; 
    border: 1px solid rgba(255,255,255,0.2); 
    padding: 8px; 
    border-radius: 6px; 
    outline: none; 
    font-weight: 600; 
    cursor: pointer; 
}

/* Botões de Ação na Tabela */
.action-btns { 
    display: flex; 
    gap: 10px; 
}

.btn-sm { 
    padding: 8px 12px; 
    border-radius: 6px; 
    border: none; 
    cursor: pointer; 
    font-weight: 700; 
    font-size: 0.8rem; 
    display: flex; 
    align-items: center; 
    gap: 5px; 
    color: white; 
    transition: 0.3s;
}

.btn-pdf { background: #ef4444; }
.btn-wpp { background: #22c55e; }

.btn-sm:hover { 
    transform: scale(1.05); 
    filter: brightness(1.2); 
}

/* Template do PDF Oculto */
#receipt-template { 
    display: none; 
    position: absolute; 
    top: -9999px; 
    left: -9999px; 
    background: white; 
    color: black; 
    width: 800px; 
    padding: 40px; 
    font-family: Arial, sans-serif; 
}

/* RESPONSIVIDADE MOBILE (Menu Deslizante e Colunas Ajustadas) */
@media (max-width: 900px) {
    .mobile-menu-btn { 
        display: block; 
    }
    
    .sidebar { 
        position: fixed; 
        left: -300px; 
        top: 0; 
        bottom: 0; 
        width: 260px; 
    }
    
    .sidebar.active { 
        left: 0; 
    }
    
    .admin-content { 
        padding: 20px; 
    }
    
    .dashboard-header h1 { 
        font-size: 1.5rem; 
    }
    
    .user-profile { 
        font-size: 0.9rem; 
    }
    
    .os-form-grid { 
        grid-template-columns: 1fr; 
    }
    
    .os-form-grid .full-col { 
        grid-column: span 1; 
    }
    
    .summary-grid { 
        grid-template-columns: 1fr; 
    }
}
