@charset "utf-8";
/* CSS Document */

.margem{
	width: 95%;
	padding-bottom: 3rem;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
    .card { width: 100%; }
	  
    .question {margin-bottom:20px; text-align: left; font-weight: bold; font-size: 1rem; background:#EAEAEA; border-radius: 10px; padding: 10px}
    .q-label { display:block; font-weight:600; margin-bottom:10px; }
    /* radios: cada opção é uma coluna; label em cima, input em baixo; as 4 colunas ficam em uma linha */
    .radios {
      display:flex;
      flex-direction:row;
      gap:18px;
      align-items:flex-start;
      white-space:nowrap;
      overflow-x:auto; /* permite scroll horizontal em telas estreitas */
      padding-bottom:4px;
	  margin: auto
    }
    .option {
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:8px;
      flex:0 0 auto;
      padding:8px;
      border-radius:8px;
	  margin: auto;
	  max-width: 24%;
	  white-space:normal;
    }
    .option .opt-label {
     color:#181818;
	 font-weight: 400;
	 font-size: 0.8rem;
     text-align: center;
    }
    .option input[type="radio"]{
      transform:scale(1.15);
      cursor:pointer;
    }
    .score { font-weight:700; font-size:1.05rem; }
    .result { margin-top:12px; padding:12px; border-radius:10px; }
    .none { background:#ecfdf5; color:#065f46; }
    .mild { background:#fefce8; color:#92400e; }
    .moderate { background:#fff7ed; color:#92400e; }
    .severe { background:#fef2f2; color:#881337; }
    .urgent { background:#ffecec; color:#7b0b0b; font-weight:700; }
    .actions { margin-top:12px; display:flex; gap:8px; flex-wrap:wrap;}
	.footer { font-size:1rem; color:#444; margin-top:14px; }
    input[type="radio"]:focus { outline:3px solid #bfe1ff; outline-offset:4px; border-radius:6px; }