/* ================================================= */
/* ===                  BASE.CSS                 === */
/* ================================================= */

/* --- Variáveis de Cor e Fonte (Tema) --- */
:root {
    --primary-color: #3498db;
    --secondary-color: #2c3e50;
    --background-color: #ecf0f1;
    --content-bg-color: #ffffff;
    --danger-color: #e74c3c;
    --success-color: #2ecc71;
    --warning-color: #f1c40f;
    --font-family: 'Arial', sans-serif;
    --status-expired-bg: #ffebee;
    --status-warning-bg: #fffde7;
    --status-active-bg: #e8f5e9;
    --text-color: #2c3e50;
    --text-light-color: #ffffff;
    --table-border-color: #ddd;
    --modal-overlay-color: rgba(0,0,0,0.5);
    --input-border-color: #ccc;
    --box-shadow-color: rgba(0,0,0,0.1);
    --header-bg-color: #ffffff;
    --purple-color: #9b59b6;
    --status-expiring-app-bg: #f2e7fe;
    --orange-color: #f39c12;
}

.body-hidden { visibility: hidden; }

/* --- TEMA ESCURO --- */
html[data-theme='dark'] {
    --primary-color: #3498db;
    --secondary-color: #1a2531;
    --background-color: #222b35;
    --content-bg-color: #2c3e50;
    --danger-color: #e74c3c;
    --success-color: #2ecc71;
    --warning-color: #f1c40f;
    --status-expired-bg: #4a1c1f;
    --status-warning-bg: #53450f;
    --status-active-bg: #1c3e23;
    --text-color: #ecf0f1;
    --text-light-color: #ffffff;
    --table-border-color: #4a627a;
    --modal-overlay-color: rgba(0,0,0,0.7);
    --input-border-color: #555;
    --box-shadow-color: rgba(0,0,0,0.3);
    --header-bg-color: #2c3e50;
    --status-expiring-app-bg: #4a235a;
}

/* --- Reset Básico e Estilos Globais --- */
* { margin: 0; padding: 0; box-sizing: border-box; }

body {
    font-family: var(--font-family);
    background-color: var(--background-color);
    color: var(--text-color);
    overflow-x: hidden;
    transition: background-color 0.3s, color 0.3s;
}

#device-code { text-transform: uppercase; }

/* --- Loaders e Overlays --- */
#loading-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background-color: var(--modal-overlay-color);
    display: flex; justify-content: center; align-items: center;
    z-index: 9999; transition: opacity 0.3s;
}

.loader-wrapper {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    display: flex; justify-content: center; align-items: center;
    z-index: 20; display: none;
}
html[data-theme='dark'] .loader-wrapper { background-color: rgba(44, 62, 80, 0.7); }

.loader {
    border: 8px solid #f3f3f3; border-top: 8px solid var(--primary-color);
    border-radius: 50%; width: 60px; height: 60px;
    animation: spin 1s linear infinite;
}
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

/* --- BOTÕES GERAIS (Correção de Botões sem CSS) --- */
.btn-add {
    background-color: var(--success-color); color: var(--text-light-color);
    padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer;
    font-size: 1em; transition: background-color 0.3s;
}
.btn-add:hover { background-color: #27ae60; }

.btn-action {
    background-color: var(--primary-color); color: var(--text-light-color);
    padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer;
    font-size: 1em; transition: background-color 0.3s; display: flex; align-items: center; gap: 8px;
}
.btn-action:hover { background-color: #2980b9; }

.btn-danger { background-color: var(--danger-color); color: white; border: none; padding: 10px 20px; border-radius: 5px; cursor: pointer; }
.btn-danger:hover { background-color: #c0392b; }

.btn-secondary { background-color: #bdc3c7; color: #333; border: none; padding: 10px 20px; border-radius: 5px; cursor: pointer; }
.btn-secondary:hover { background-color: #95a5a6; }

/* Botões Específicos que estavam faltando */
.btn-copy-apk { background-color: var(--orange-color); }
.btn-insert-code { background-color: var(--warning-color); }

.btn-primary-action {
    background-color: var(--primary-color); color: white; font-weight: bold;
    padding: 14px 0; border-radius: 6px; cursor: pointer; border: none;
    font-size: 1rem; transition: background-color 0.3s;
}
.btn-primary-action:hover { background-color: #2980b9; }

.btn-secondary-action {
    background-color: #bdc3c7; color: #333; font-weight: bold;
    padding: 14px 0; border-radius: 6px; cursor: pointer; border: none;
    font-size: 1rem; transition: background-color 0.3s;
}
html[data-theme='dark'] .btn-secondary-action { background-color: #4a5568; color: #e2e8f0; }

/* --- Toasts (Notificações) --- */
#toast-container {
    position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%);
    z-index: 9999; display: flex; flex-direction: column-reverse;
    gap: 10px; align-items: center;
}

.toast {
    padding: 15px 25px; border-radius: 50px; background-color: #333; color: white;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2); opacity: 0;
    transform: translateY(20px); transition: opacity 0.4s ease, transform 0.4s ease;
}
.toast.show { opacity: 1; transform: translateY(0); }

.toast-success { background-color: var(--success-color); }
.toast-error { background-color: var(--danger-color); }
.toast-warning { background-color: var(--warning-color); }