/* SUS360 Painel Cirurgias v0.8.0 — csv */

        /* ═══════ CSV CARD — Exact from git 61abb02 ═══════ */
        /* csv.css
           =======================================================================
           SEÇÃO DE DOWNLOAD – BASES CSV (TIPO / ANO / COMPETÊNCIA)
           ======================================================================= */

           .sus-csv-card {
            background-color: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 0.9rem;
            box-shadow: 0 8px 18px rgba(15, 23, 42, 0.55);
            overflow: hidden; /* garante que nada passe da borda do card */
          }

          body:not(.dark) .sus-csv-card {
            background-color: var(--bg-card);
            border-color: var(--border-color);
            box-shadow: 0 6px 14px rgba(15, 23, 42, 0.12);
          }

          /* -----------------------------------------------------------------------
             Cabeçalho
             ----------------------------------------------------------------------- */

          .sus-csv-header {
            border-bottom: 1px dashed rgba(148, 163, 184, 0.45);
            padding-bottom: 0.6rem;
          }

          .sus-csv-icon {
            width: 40px;
            height: 40px;
            border-radius: 0.85rem;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: radial-gradient(
              circle at 30% 20%,
              rgba(59, 130, 246, 0.6),
              rgba(15, 23, 42, 0.9)
            );
            color: #e5f2ff;
            font-size: 1.2rem;
            box-shadow: 0 4px 10px rgba(15, 23, 42, 0.6);
          }

          body:not(.dark) .sus-csv-icon {
            background: radial-gradient(circle at 30% 20%, #0d6efd, #1d4ed8);
            color: #ffffff;
            box-shadow: 0 4px 10px rgba(15, 23, 42, 0.25);
          }

          .sus-csv-title-line {
            align-items: center;
          }

          .sus-csv-title {
            font-size: 0.95rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            color: var(--text-primary);
          }

          body:not(.dark) .sus-csv-title {
            color: #111827;
          }

          .sus-csv-tag {
            padding: 0.1rem 0.55rem;
            border-radius: 999px;
            font-size: 0.65rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            background: rgba(34, 197, 94, 0.1);
            border: 1px solid rgba(34, 197, 94, 0.5);
            color: #22c55e;
          }

          .sus-csv-subtitle {
            font-size: 0.78rem;
            color: var(--text-muted);
          }

          .sus-csv-meta {
            min-width: 230px;
          }

          .sus-csv-chip {
            display: inline-flex;
            align-items: center;
            gap: 0.35rem;
            padding: 0.15rem 0.65rem;
            border-radius: 999px;
            background: rgba(15, 23, 42, 0.75);
            border: 1px solid rgba(34, 197, 94, 0.6);
            font-size: 0.7rem;
          }

          body:not(.dark) .sus-csv-chip {
            background: rgba(240, 253, 244, 0.98);
            border-color: rgba(74, 222, 128, 1);
          }

          .sus-csv-chip-label {
            text-transform: uppercase;
            letter-spacing: 0.08em;
            color: var(--text-muted);
          }

          /* valor "nov/2025" – verde pulsando só na cor */
          .sus-csv-chip-value {
            font-weight: 700;
            color: #22c55e;
            animation: csv-pulse-green 1.7s ease-in-out infinite;
          }

          .sus-csv-volume {
            font-size: 0.75rem;
            color: var(--text-muted);
          }

          /* ícone antes de "Volume total" – verde pulsando só na cor */
          .sus-csv-volume i {
            color: #22c55e;
            animation: csv-pulse-green 1.8s ease-in-out infinite;
          }

          /* -----------------------------------------------------------------------
             Controles (dropdowns e botão)
             ----------------------------------------------------------------------- */

          .csv-controls {
            padding-top: 0.75rem;
          }

          .sus-csv-label {
            font-size: 0.75rem;
            font-weight: 700;
            letter-spacing: 0.05em;
            text-transform: uppercase;
            color: var(--text-muted);
          }

          #csv-bases-section .form-select-sm {
            font-size: 0.82rem;
          }

          /* Botão azul padrão + progresso */

          .csv-download-btn {
            border-radius: 999px;
            padding: 0.45rem 1.2rem;
            font-size: 0.85rem;
            font-weight: 700;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 0.35rem;
            border: 1px solid #0d6efd;
            background-color: #0d6efd;
            color: #f8f9fa;
            box-shadow: 0 4px 12px rgba(15, 23, 42, 0.45);
            white-space: nowrap;
          }

          .csv-download-btn i {
            font-size: 0.9rem;
          }

          /* garante uma única linha de texto no botão */
          .csv-download-btn span {
            white-space: nowrap;
          }

          .csv-download-btn:hover,
          .csv-download-btn:focus-visible {
            background-color: #0b5ed7;
            border-color: #0b5ed7;
            color: #f8f9fa;
          }

          .csv-download-btn:disabled {
            opacity: 0.65;
            cursor: not-allowed;
            box-shadow: none;
          }

          /* -----------------------------------------------------------------------
             Info em "pílulas"
             ----------------------------------------------------------------------- */

          .csv-base-info {
            margin-top: 0.7rem;
            padding-top: 0.6rem;
            border-top: 1px dashed rgba(148, 163, 184, 0.55);
          }

          .csv-base-pill-row {
            display: flex;
            flex-wrap: wrap;
            gap: 0.35rem;
            margin-bottom: 0.35rem;
          }

          .csv-base-pill {
            min-width: 0;
            padding: 0.35rem 0.6rem;
            border-radius: 0.65rem;
            background: rgba(15, 23, 42, 0.7);
            border: 1px solid rgba(148, 163, 184, 0.55);
            display: flex;
            flex-direction: column;
            gap: 0.1rem;
          }

          body:not(.dark) .csv-base-pill {
            background: rgba(248, 249, 250, 0.95);
            border-color: rgba(222, 226, 230, 1);
          }

          .csv-base-pill-small {
            max-width: 150px;
          }

          .csv-base-pill-label {
            font-size: 0.7rem;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            color: var(--text-muted);
          }

          /* desktop: mantém uma linha, com reticências se precisar */
          .csv-base-pill-value {
            font-size: 0.78rem;
            color: var(--text-primary);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
          }

          body:not(.dark) .csv-base-pill-value {
            color: #111827;
          }

          /* Destaque extra para o tamanho aproximado – azul pulsando só na cor */
          .csv-base-pill-small .csv-base-pill-value {
            font-size: 0.9rem;
            font-weight: 700;
            text-align: right;
            color: #38bdf8;
            animation: csv-pulse-blue 1.8s ease-in-out infinite;
          }

          /* Dica – ícone amarelo pulsando só na cor */
          .csv-base-tip {
            font-size: 0.75rem;
            color: var(--text-muted);
          }

          .csv-base-tip i {
            color: #facc15;
            animation: csv-pulse-yellow 1.8s ease-in-out infinite;
          }

          /* -----------------------------------------------------------------------
             Responsivo
             ----------------------------------------------------------------------- */

          @media (max-width: 992px) {
            .sus-csv-meta {
              text-align: left !important;
            }
          }

          @media (max-width: 768px) {
            .sus-csv-card {
              border-radius: 0.75rem;
            }

            .csv-base-pill-row {
              flex-direction: column;
            }

            .csv-base-pill {
              width: 100%;
            }

            /* no mobile, deixa quebrar e não sair do card */
            .csv-base-pill-value {
              white-space: normal;
              overflow: visible;
              text-overflow: clip;
              overflow-wrap: anywhere;
            }

            .csv-base-pill-small {
              max-width: 100%;
            }

            .csv-download-col {
              margin-top: 0.2rem;
            }

            .csv-download-btn {
              width: 100%;
            }
          }

          /* -----------------------------------------------------------------------
             Animações (cor pulsando somente)
             ----------------------------------------------------------------------- */

          @keyframes csv-pulse-green {
            0% {
              color: #22c55e;
            }
            50% {
              color: #4ade80;
            }
            100% {
              color: #22c55e;
            }
          }

          @keyframes csv-pulse-yellow {
            0% {
              color: #facc15;
            }
            50% {
              color: #fde68a;
            }
            100% {
              color: #facc15;
            }
          }

          @keyframes csv-pulse-blue {
            0% {
              color: #38bdf8;
            }
            50% {
              color: #0ea5e9;
            }
            100% {
              color: #38bdf8;
            }
          }