/* Ficheiro: public_html/css/style.css - Versão Mais Profissional */

/* CSS Variables para fácil customização de cores e fontes */
:root {
    --primary-color: #007bff; /* Azul primário (Bootstrap Blue) */
    --primary-color-darker: #0056b3;
    --secondary-color: #6c757d; /* Cinza secundário */
    --success-color: #28a745; /* Verde para sucesso */
    --danger-color: #dc3545;  /* Vermelho para erro/perigo */
    --warning-color: #ffc107; /* Amarelo para aviso */
    --info-color: #17a2b8;    /* Azul claro para informação */

    --background-color: #f4f7f6; /* Fundo geral da página (cinza muito claro) */
    --surface-color: #ffffff;    /* Fundo de containers, caixas, etc. (branco) */
    --text-color: #212529;       /* Cor de texto principal (quase preto) */
    --text-color-muted: #6c757d; /* Cor de texto secundário/silenciado */
    --border-color: #dee2e6;     /* Cor de borda subtil */
    --border-radius: 0.3rem;     /* Raio de borda padrão */

    --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

    --box-shadow-sm: 0 .125rem .25rem rgba(0,0,0,.075);
    --box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}

/* Reset Básico e Padrões Globais */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 16px; /* Base para unidades REM */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: var(--font-family-sans-serif);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6;
    color: var(--text-color);
    background-color: var(--background-color);
    margin: 0;
    padding: 0;
    display: flex; /* Para centralizar .login-container, etc. se body for o único wrapper */
    flex-direction: column;
    min-height: 100vh;
}

/* Cabeçalho Padrão das Páginas Internas */
.page-header {
    background-color: #343a40; /* Tom escuro para o cabeçalho */
    color: #fff;
    padding: 0.75rem 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    box-shadow: var(--box-shadow-sm);
}
.page-header h1 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 500;
}
.page-header a {
    color: #adb5bd;
    text-decoration: none;
    font-size: 0.9rem;
    margin-left: 1rem;
}
.page-header a:hover {
    color: #fff;
}

/* Containers Principais */
.main-container,
.login-container, /* Usado em login.php */
.register-container, /* Usado em register.php */
.welcome-container, /* Usado em default.php */
.survey-container {  /* Usado em responder_inquerito.php */
    width: 100%;
    max-width: 900px; /* Ajustar conforme necessidade da página */
    margin: 1.5rem auto;
    padding: 1.5rem;
    background-color: var(--surface-color);
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
}

.login-container,
.register-container {
    max-width: 400px; /* Mais estreito para formulários de login/registo */
    margin-top: 5rem; /* Mais margem no topo para centralizar verticalmente com flex no body */
}
body.login-page-body { /* Adicione esta classe ao body de login.php e register.php */
    justify-content: center;
    align-items: center;
}


/* Títulos */
h1, h2, h3, h4, h5, h6 {
    color: var(--text-color);
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 0.75rem;
}
h1 { font-size: 2rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.5rem; }

/* Secções dentro de containers */
.section-box {
    background-color: var(--surface-color); /* Pode ser útil se o container tiver outra cor */
    padding: 1.5rem;
    border-radius: var(--border-radius);
    margin-bottom: 1.5rem;
    border: 1px solid var(--border-color); /* Borda subtil */
}
.section-box h2 {
    font-size: 1.4rem;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 0.75rem;
    margin-bottom: 1.25rem;
}

/* Formulários */
.form-group {
    margin-bottom: 1.25rem;
}
.form-group label {
    display: block;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: var(--text-color-muted);
}
.form-group input[type="text"],
.form-group input[type="email"],
.form-group input[type="password"],
.form-group textarea,
.form-group select {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da; /* var(--border-color) */
    border-radius: var(--border-radius);
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.form-group input[type="text"]:focus,
.form-group input[type="email"]:focus,
.form-group input[type="password"]:focus,
.form-group textarea:focus,
.form-group select:focus {
    border-color: var(--primary-color);
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}
.form-group textarea {
    min-height: 100px;
    resize: vertical;
}
.form-group small {
    font-size: 0.875em;
    color: var(--text-color-muted);
    margin-top: 0.25rem;
    display: block;
}
.form-group input[type="checkbox"] {
    width: auto;
    margin-right: 0.5rem;
    vertical-align: middle;
}
.form-group label input[type="checkbox"] { /* Se o checkbox estiver dentro do label */
    display: inline-block;
    width: auto;
}

/* Botões */
.btn,
.submit-button, /* Classe existente */
.login-button,   /* Classe existente */
.register-button, /* Classe existente */
.btn-criar {      /* Classe existente */
    display: inline-block;
    font-weight: 500;
    color: var(--surface-color);
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    background-color: var(--primary-color);
    border: 1px solid var(--primary-color);
    padding: 0.6rem 1.2rem;
    font-size: 1rem;
    border-radius: var(--border-radius);
    text-decoration: none;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.btn:hover,
.submit-button:hover,
.login-button:hover,
.register-button:hover,
.btn-criar:hover {
    background-color: var(--primary-color-darker);
    border-color: var(--primary-color-darker);
    color: #fff;
    text-decoration: none;
}
.btn-criar, .register-button { /* Verde para criar/registar */
    background-color: var(--success-color);
    border-color: var(--success-color);
}
.btn-criar:hover, .register-button:hover {
    background-color: #1e7e34; /* Verde mais escuro */
    border-color: #1e7e34;
}
/* Botões de Ação na Tabela meus_inqueritos.php */
.inqueritos-table .acoes a, .inqueritos-table .acoes button {
    margin-right: 0.5rem; margin-bottom: 0.3rem; text-decoration: none; font-size: 0.8rem; padding: 0.25rem 0.6rem; border-radius: var(--border-radius); border: 1px solid transparent; cursor: pointer; display: inline-block; transition: opacity 0.15s ease-in-out;
}
.inqueritos-table .acoes a:hover, .inqueritos-table .acoes button:hover { opacity: 0.8; }
.acoes .link-editar { color: #fff; background-color: var(--primary-color); border-color: var(--primary-color); }
.acoes .link-publico { color: #fff; background-color: var(--info-color); border-color: var(--info-color); }
.acoes .link-resultados { color: #212529; background-color: var(--warning-color); border-color: var(--warning-color); }
.acoes .btn-publicar { color: #fff; background-color: var(--success-color); border-color: var(--success-color); }
.acoes .btn-despublicar { color: #212529; background-color: var(--warning-color); border-color: var(--warning-color); }
.acoes .btn-fechar { color: #fff; background-color: var(--danger-color); border-color: var(--danger-color); }
.acoes .btn-reabrir { color: #fff; background-color: #6f42c1; border-color: #6f42c1; } /* Roxo */

/* Mensagens de Feedback */
.message,
.error-message,  /* Classe existente */
.success-message { /* Classe existente */
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: var(--border-radius);
    text-align: left; /* Mais profissional que centralizado para mensagens em formulários */
}
.error-message {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}
.success-message {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

/* Tabelas (ex: meus_inqueritos.php) */
.inqueritos-table {
    width: 100%;
    border-collapse: collapse;
    background-color: var(--surface-color);
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow-sm);
    overflow: hidden;
    margin-bottom: 1.5rem;
}
.inqueritos-table th,
.inqueritos-table td {
    padding: 0.9rem 1rem;
    text-align: left;
    vertical-align: middle;
    border-bottom: 1px solid var(--border-color);
}
.inqueritos-table thead th {
    background-color: #e9ecef; /* Cinza claro para cabeçalho da tabela */
    font-weight: 600;
    font-size: 0.85rem;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.inqueritos-table tbody tr:last-child td {
    border-bottom: none;
}
.inqueritos-table tbody tr:hover {
    background-color: #f8f9fa; /* Efeito hover subtil nas linhas */
}
/* Status de Inquéritos */
.status-Rascunho { color: var(--text-color-muted); font-style: italic; }
.status-Publicado { color: var(--success-color); font-weight: 600; }
.status-Fechado { color: var(--danger-color); }

/* Listas de Perguntas (editar_inquerito.php, ver_resultados.php) */
.question-list { list-style: none; padding: 0; }
.question-item, .question-result-box {
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    background-color: #fdfdfd; /* Ligeiramente diferente da superfície para destaque */
    position: relative;
}
.question-item .q-order, .question-result-box .q-order {
    font-weight: bold; color: var(--text-color-muted); font-size: 0.9em; margin-right: 0.5rem;
}
.question-item .q-text, .question-result-box .q-text {
    font-weight: 600; display: block; margin-bottom: 0.5rem; color: var(--text-color);
}
.question-item .q-type, .question-result-box .q-info .q-type { /* Adicionado q-info */
    font-size: 0.85em; color: var(--text-color-muted); margin-bottom: 0.75rem; display: block;
}
.question-item .q-required { font-size: 0.8em; color: var(--danger-color); font-weight: bold; margin-left: 0.25rem; }
.question-item .q-options { margin-top: 0.75rem; margin-left: 1.5rem; font-size: 0.9em; }
.question-item .q-options li { margin-bottom: 0.3rem; color: #495057; list-style: disc; }

/* Resultados (ver_resultados.php) */
.survey-title-header {
    margin-bottom: 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid var(--border-color);
}
.survey-title-header h2 { margin-top: 0; margin-bottom: 0.25rem; font-size: 1.8rem; }
.survey-title-header p { margin: 0; color: var(--text-color-muted); }
.results-table { width: 100%; border-collapse: collapse; margin-top: 0.75rem; }
.results-table th, .results-table td { padding: 0.6rem 0.8rem; text-align: left; border-bottom: 1px solid #f1f1f1; font-size: 0.9rem; }
.results-table th { background-color: #f8f9fa; font-weight: 600; }
.results-table td.count-cell { text-align: right; width: 70px; font-weight: bold; }
.results-table td.percent-cell { text-align: right; width: 70px; }
.results-table .bar-cell { width: 180px; background-color: #e9ecef; border-radius: 3px; }
.results-table .bar { background-color: var(--primary-color); height: 16px; display: block; border-radius: 3px; transition: width 0.5s ease-in-out;}
.text-answers-list { max-height: 250px; overflow-y: auto; border: 1px solid var(--border-color); padding: 0.75rem; background-color: #fdfdfd; border-radius: var(--border-radius); margin-top: 0.75rem; font-size: 0.9rem; }
.text-answers-list li { margin-bottom: 0.5rem; padding-bottom: 0.5rem; border-bottom: 1px dashed #eee; word-wrap: break-word; }
.text-answers-list li:last-child { border-bottom: none; }
.no-responses { color: var(--text-color-muted); font-style: italic; padding: 1rem 0; }

/* Página de Responder Inquérito */
.survey-container .survey-header h1 { font-size: 1.8rem; }
.survey-container .survey-header .description { color: #555; margin-bottom: 2rem; line-height: 1.6; }
.question-block { margin-bottom: 2rem; padding: 1.25rem; border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color:var(--surface-color); }
.question-block label.question-text { font-weight: 600; display: block; margin-bottom: 1rem; font-size: 1.1rem; color: var(--text-color); }
.question-block label.question-text .required-star { color: var(--danger-color); margin-left: 0.25rem; }
.question-block .options-list { list-style: none; padding-left: 0; } /* Removido padding-left: 5px */
.question-block .options-list li { margin-bottom: 0.75rem; }
.question-block .options-list label { font-weight: normal; margin-left: 0.5rem; color: #495057; cursor: pointer; }
.question-block input[type="radio"], .question-block input[type="checkbox"] { margin-right: 0.3rem; vertical-align: middle; cursor: pointer; transform: scale(1.1); /* Torna um pouco maior */ }
.question-block textarea { width: 100%; min-height: 100px; padding: 0.75rem; border: 1px solid #ccc; border-radius: var(--border-radius); font-size: 1rem; resize: vertical; }
.validation-error { color: var(--danger-color); font-size: 0.85em; margin-top: 0.3rem; display: block; font-weight: 500; }


/* Links genéricos e de navegação (ex: "Voltar", "Registe-se aqui") */
.register-link, .default-link, .login-link, .back-link {
    display: block; /* Para ocupar largura e permitir text-align */
    text-align: center;
    margin-top: 1rem;
    font-size: 0.9em;
}
.register-link a, .default-link a, .login-link a, .back-link {
    color: var(--primary-color);
    text-decoration: none;
}
.register-link a:hover, .default-link a:hover, .login-link a:hover, .back-link:hover {
    text-decoration: underline;
}
.back-link { text-align: left; } /* Para formulários */
.form-actions .back-link { margin-right: 1rem; float: left; line-height: 2.5; /* Alinhar com botão */}


/* Dashboard Action Cards */
.dashboard-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-top: 1.5rem;
}
.action-card {
    background-color: var(--surface-color);
    padding: 1.5rem;
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow-sm);
    text-align: center;
    text-decoration: none;
    color: var(--text-color);
    border: 1px solid var(--border-color);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.action-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--box-shadow);
    color: var(--primary-color);
}
.action-card h3 {
    margin-top: 0;
    margin-bottom: 0.75rem;
    color: var(--primary-color);
    font-size: 1.25rem;
}
.action-card p {
    font-size: 0.9rem;
    color: var(--text-color-muted);
    line-height: 1.5;
}


/* Footer */
.footer {
    width: 100%;
    margin-top: auto; /* Empurra o footer para baixo em páginas com pouco conteúdo */
    padding: 1.5rem 1rem;
    border-top: 1px solid var(--border-color);
    font-size: 0.875em;
    color: var(--text-color-muted);
    text-align: center;
    background-color: var(--surface-color); /* Ou var(--background-color) */
}
.footer p {
    margin: 0.25rem 0;
}

/* Responsividade básica (Exemplo) */
@media (max-width: 768px) {
    .page-header {
        flex-direction: column;
        align-items: flex-start;
    }
    .page-header h1 {
        margin-bottom: 0.5rem;
    }
    .page-header div a:first-child { /* Evita margem extra no primeiro link de navegação no mobile */
        margin-left: 0;
    }
    .main-container,
    .login-container,
    .register-container,
    .welcome-container,
    .survey-container {
        margin-left: 1rem;
        margin-right: 1rem;
        padding: 1rem;
    }
    .results-table .bar-cell { display: none; } /* Esconde barras em ecrãs pequenos */
}

/* Adicionar ao seu style.css ou ao <style> da página */

/* Adicionar ao seu style.css ou ao <style> da página */

.survey-logo-container {
    text-align: center; /* Centraliza a imagem se ela for inline-block */
    margin-bottom: 1.5rem; /* Espaçamento abaixo do logo */
    line-height: 0; /* Remove espaço extra abaixo da imagem se for inline-block */
}

.survey-logo {
    display: inline-block; /* Permite centralização com text-align e não quebra o fluxo como block */
    max-width: 50px;   /* Defina a LARGURA máxima que o logo pode ter */
    max-height: 20px;  /* Defina a ALTURA máxima que o logo pode ter */
    width: auto;        /* A largura real será a da imagem ou max-width, o que for menor */
    height: auto;       /* A altura real será a da imagem ou max-height, o que for menor, mantendo a proporção */
    
    /* Estilos opcionais para melhorar a aparência */
    border-radius: var(--border-radius-sm, 4px); /* Usa variável se definida, senão 4px */
    /* box-shadow: var(--box-shadow-xs, 0 1px 2px rgba(0,0,0,0.05)); */ /* Sombra subtil opcional */
    /* object-fit: contain; */ /* Garante que toda a imagem é visível dentro dos limites, pode adicionar "letterboxing" */
}