@charset "UTF-8";
/* theme-name: Clínica Vitta */
/*
 * ============================================================
 * CLÍNICA VITTA - TEMA INSTITUCIONAL GLPI 11
 * ============================================================
 *
 * Central de Serviços - Clínica Vitta
 *
 * Tema customizado utilizando a arquitetura nativa de temas
 * do GLPI 11.
 *
 * IMPORTANTE:
 * Não alterar arquivos do Core do GLPI para aplicar este tema.
 *
 * ============================================================
 */
:root[data-glpi-theme=vitta] {
  /*
   * --------------------------------------------------------
   * CORES BASE
   * --------------------------------------------------------
   */
  --tblr-primary-rgb: 32, 132, 181;
  --tblr-secondary: #64748b;
  --tblr-link-color-rgb: 0, 92, 169;
  /*
   * --------------------------------------------------------
   * NAVEGAÇÃO / MENU PRINCIPAL
   * --------------------------------------------------------
   */
  --glpi-mainmenu-bg: #005ca9;
  --glpi-mainmenu-fg: #ffffff;
  --glpi-mainmenu-fg-muted: rgba(255, 255, 255, 0.72);
  /*
   * --------------------------------------------------------
   * HELPDESK / PORTAL DO SOLICITANTE
   * --------------------------------------------------------
   */
  --glpi-helpdesk-header: #c5e5f5;
  --glpi-illustrations-gradient-1: #edf8fd;
  --glpi-illustrations-gradient-2: #a8d8ef;
  --glpi-illustrations-gradient-3: #005ca9;
  /*
   * --------------------------------------------------------
   * ÁREAS DA CENTRAL DE SERVIÇOS
   * --------------------------------------------------------
   */
  /* Área dos atalhos / quadros */
  --glpi-helpdesk-tiles-section-bg: #f7fafc;
  /* Área de acompanhamento dos chamados */
  --glpi-helpdesk-tabs-section-bg: #ffffff;
  /*
   * --------------------------------------------------------
   * BADGES / ELEMENTOS SECUNDÁRIOS
   * --------------------------------------------------------
   */
  --tblr-badge-bg: #dceef7;
  --tblr-badge-color: #23445b;
  /*
   * --------------------------------------------------------
   * PALETA DE PREVISUALIZAÇÃO DO GLPI
   * --------------------------------------------------------
   */
  --glpi-palette-color-1: #005ca9;
  --glpi-palette-color-2: #2084b5;
  --glpi-palette-color-3: #8dcce8;
  --glpi-palette-color-4: #ffffff;
}

/*
 * ============================================================
 * IDENTIDADE VISUAL - LOGOTIPOS VITTA
 * ============================================================
 */
:root[data-glpi-theme=vitta] {
  /*
   * Cabeçalho normal:
   * utiliza a assinatura horizontal oficial Clínica Vitta.
   */
  --glpi-logo: url("/pics/vitta/vitta-logo-horizontal.png");
  /*
   * Menu reduzido:
   * utiliza somente o símbolo institucional.
   */
  --glpi-logo-reduced: url("/pics/vitta/vitta-logo.png");
}

/*
 * ============================================================
 * CABEÇALHO - LOGO HORIZONTAL
 * ============================================================
 */
:root[data-glpi-theme=vitta] .page .glpi-logo {
  background-image: var(--glpi-logo);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
  width: 190px;
  height: 48px;
}

/*
 * ============================================================
 * MENU REDUZIDO
 * ============================================================
 *
 * Quando o GLPI recolher a navegação lateral, voltamos ao
 * símbolo compacto da Clínica Vitta.
 */
@media (min-width: 992px) {
  :root[data-glpi-theme=vitta] body.navbar-collapsed .navbar-brand .glpi-logo {
    background-image: var(--glpi-logo-reduced);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 40px;
    height: 40px;
  }
}
/*
 * ============================================================
 * CENTRAL DE SERVIÇOS - ACABAMENTO VISUAL
 * ============================================================
 */
/*
 * Título principal da Central
 */
:root[data-glpi-theme=vitta] .helpdesk-home-container h1 {
  color: #16324a;
  font-weight: 700;
  letter-spacing: 0.02em;
}

/*
 * Campo de pesquisa principal
 */
:root[data-glpi-theme=vitta] .home-search {
  border-radius: 10px;
}

/*
 * Área dos atalhos
 */
:root[data-glpi-theme=vitta] .tiles-banner {
  border-top: 1px solid rgba(0, 92, 169, 0.08);
}

/*
 * Cards da Central
 *
 * Aplicamos o acabamento somente aos cards existentes
 * dentro da área de atalhos.
 */
:root[data-glpi-theme=vitta] .tiles-banner .card {
  border: 1px solid rgba(0, 92, 169, 0.12);
  border-radius: 12px;
  box-shadow: 0 3px 12px rgba(15, 55, 80, 0.06);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

/*
 * Feedback visual ao passar o mouse
 */
:root[data-glpi-theme=vitta] .tiles-banner .card:hover {
  transform: translateY(-2px);
  border-color: rgba(0, 92, 169, 0.25);
  box-shadow: 0 7px 18px rgba(15, 55, 80, 0.1);
}

/*
 * ============================================================
 * CLÍNICA VITTA - V4
 * TELA DE AUTENTICAÇÃO
 * ============================================================
 *
 * Personalização exclusivamente visual.
 * Mantém formulário, autenticação e templates nativos do GLPI.
 *
 * Wallpaper:
 * /pics/vitta/wallpapers/login-vitta.png
 *
 * ============================================================
 */
/*
 * ------------------------------------------------------------
 * FUNDO DA PÁGINA DE LOGIN
 * ------------------------------------------------------------
 */
body.welcome-anonymous {
  background-color: #063d78;
  background-image: url("/pics/vitta/wallpapers/login-vitta.png");
  /*
   * Preenchimento integral da viewport.
   * A arte institucional ocupa 100% da área disponível.
   */
  background-position: center center;
  background-size: 100vw 100vh;
  background-repeat: no-repeat;
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  overflow: hidden;
}

/*
 * O container principal do GLPI precisa ser transparente para
 * permitir a visualização do wallpaper institucional.
 */
body.welcome-anonymous .page-anonymous {
  background: transparent;
  height: 100vh;
  min-height: 100vh;
  overflow: hidden;
}

/*
 * ------------------------------------------------------------
 * LOGOTIPO NATIVO DO GLPI
 * ------------------------------------------------------------
 *
 * A identidade Clínica Vitta já está incorporada ao wallpaper.
 * Portanto, ocultamos somente a logo existente na página
 * anônima.
 */
body.welcome-anonymous .page-anonymous .glpi-logo {
  display: none;
}

/*
 * ------------------------------------------------------------
 * POSICIONAMENTO DO LOGIN
 * ------------------------------------------------------------
 *
 * Mantemos a estrutura nativa do GLPI.
 * O deslocamento vertical posiciona o formulário abaixo da
 * identidade visual existente no wallpaper.
 */
body.welcome-anonymous .page-anonymous > .flex-fill {
  justify-content: center !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  min-height: 100vh;
  transform: translateY(185px);
}

/*
 * ------------------------------------------------------------
 * CONTAINER DO FORMULÁRIO
 * ------------------------------------------------------------
 */
body.welcome-anonymous .page-anonymous .container-tight {
  width: 100%;
  max-width: 42rem !important;
  padding-top: 0 !important;
}

/*
 * ------------------------------------------------------------
 * CONTEÚDO INTERNO DO FORMULÁRIO
 * ------------------------------------------------------------
 *
 * O GLPI utiliza nativamente "col-md-5" no formulário de login,
 * limitando excessivamente sua largura dentro do card.
 *
 * A personalização abaixo atua somente na página anônima,
 * preservando a estrutura e o template original do GLPI.
 */
body.welcome-anonymous .page-anonymous .main-content-card form .row {
  margin-left: 0;
  margin-right: 0;
}

body.welcome-anonymous .page-anonymous .main-content-card form .row > .col-md-5 {
  width: 100%;
  max-width: 400px;
  flex: 0 0 400px;
  margin-left: auto;
  margin-right: auto;
}

/*
 * Título do formulário
 */
body.welcome-anonymous .page-anonymous .main-content-card h2 {
  white-space: nowrap;
  text-align: center;
}

/*
 * ------------------------------------------------------------
 * CARD DE AUTENTICAÇÃO
 * ------------------------------------------------------------
 *
 * Leve transparência para integrar o formulário ao wallpaper
 * sem prejudicar a leitura.
 */
body.welcome-anonymous .page-anonymous .main-content-card {
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(0, 92, 169, 0.12);
  border-radius: 14px;
  box-shadow: 0 18px 45px rgba(15, 55, 80, 0.12), 0 2px 8px rgba(15, 55, 80, 0.05);
  backdrop-filter: blur(5px);
}

/*
 * ============================================================
 * RESPONSIVIDADE - MOBILE
 * ============================================================
 */
@media (max-width: 768px) {
  /*
   * WALLPAPER
   */
  body.welcome-anonymous {
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: scroll;
  }
  body.welcome-anonymous .page-anonymous {
    width: 100%;
    height: 100dvh;
    min-height: 100dvh;
    overflow: hidden;
  }
  /*
   * POSICIONAMENTO GERAL
   * Remove completamente o deslocamento usado no desktop.
   */
  body.welcome-anonymous .page-anonymous > .flex-fill {
    width: 100% !important;
    min-height: 100dvh !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 16px !important;
    margin: 0 !important;
    transform: none !important;
  }
  /*
   * CONTAINER EXTERNO
   */
  body.welcome-anonymous .page-anonymous .container-tight {
    width: 100% !important;
    max-width: 420px !important;
    padding: 0 !important;
    margin: 0 auto !important;
  }
  /*
   * CARD
   */
  body.welcome-anonymous .page-anonymous .main-content-card {
    width: 100% !important;
    max-width: 420px !important;
    margin: 0 auto !important;
    border-radius: 14px;
    overflow: hidden;
    box-sizing: border-box;
  }
  /*
   * CORPO DO CARD
   */
  body.welcome-anonymous .page-anonymous .main-content-card .card-body {
    width: 100% !important;
    padding: 28px 24px !important;
    margin: 0 !important;
    box-sizing: border-box;
  }
  /*
   * FORMULÁRIO
   */
  body.welcome-anonymous .page-anonymous .main-content-card form {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  /*
   * ROW DO BOOTSTRAP
   *
   * O Bootstrap utiliza margens negativas na .row.
   * Aqui removemos isso completamente.
   */
  body.welcome-anonymous .page-anonymous .main-content-card form > .row {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    --tblr-gutter-x: 0 !important;
    --bs-gutter-x: 0 !important;
  }
  /*
   * COLUNA INTERNA DO LOGIN
   */
  body.welcome-anonymous .page-anonymous .main-content-card form > .row > .col-md-5 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
  }
  /*
   * CABEÇALHO INTERNO
   */
  body.welcome-anonymous .page-anonymous .main-content-card .card-header {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  body.welcome-anonymous .page-anonymous .main-content-card h2 {
    width: 100% !important;
    max-width: 100% !important;
    text-align: center;
    white-space: normal;
  }
  /*
   * CAMPOS
   */
  body.welcome-anonymous .page-anonymous .main-content-card .form-control {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
  /*
   * CHECKBOX
   */
  body.welcome-anonymous .page-anonymous .main-content-card .form-check {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  /*
   * BOTÃO
   */
  body.welcome-anonymous .page-anonymous .main-content-card .form-footer {
    width: 100% !important;
  }
  body.welcome-anonymous .page-anonymous .main-content-card .btn {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
}