html[data-bs-theme] {
      transition: none !important;
    }
    html[data-bs-theme].theme-loaded {
      transition: all 0.3s ease;
    }

body {
        background: var(--bs-dark, #212529);
        margin: 0;
        font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
        display: flex;
        flex-direction: column;
        min-height: 100vh;
      }

      [data-bs-theme='light'] body {
        background: var(--bs-body-bg, #fff);
        color: var(--bs-body-color, #212529);
      }
      main, .container { flex: 1; }

      .navbar, .nav-header {
        font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
      }
      .nav-header {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
      }
      

      /* Nav header: adapta ao tema */
      .nav-header {
        background: var(--bs-body-bg);
        border-bottom: 1px solid var(--bs-border-color);
      }
      .nav-top {
        background: var(--bs-body-bg);
      }
      .nav-top .navbar-brand { color: var(--bs-body-color) !important; font-weight: 700; }
      .nav-top-btn { color: var(--bs-secondary-color) !important; }
      .nav-top-btn:hover { color: var(--bs-body-color) !important; background: var(--bs-tertiary-bg); }
      .nav-bottom {
        background: var(--bs-tertiary-bg);
        border-top: 1px solid var(--bs-border-color);
      }
      .nav-menu-link {
        color: var(--bs-body-color) !important;
      }
      .nav-menu-link:hover { color: var(--bs-primary) !important; background: rgba(0,0,0,0.03); }
      .nav-menu-link.active { color: var(--bs-primary) !important; border-bottom-color: var(--bs-primary); }
      .nav-menu-link i { color: var(--bs-secondary-color); }

      /* Mobile nav */
      .nav-mobile {
        background: var(--bs-body-bg);
        border-bottom: 1px solid var(--bs-border-color);
        box-shadow: 0 1px 4px rgba(0,0,0,0.06);
      }
      .nav-mobile .navbar-brand { color: var(--bs-body-color) !important; }

      /* Dark mode overrides */
      [data-bs-theme='dark'] .nav-header { background: #111; border-color: #222; }
      [data-bs-theme='dark'] .nav-top { background: #111; }
      [data-bs-theme='dark'] .nav-top .navbar-brand { color: #fff !important; }
      [data-bs-theme='dark'] .nav-top-btn { color: rgba(255,255,255,0.7) !important; }
      [data-bs-theme='dark'] .nav-top-btn:hover { color: #fff !important; background: rgba(255,255,255,0.1); }
      [data-bs-theme='dark'] .nav-bottom { background: #1a1a1a; border-color: #222; }
      [data-bs-theme='dark'] .nav-menu-link { color: rgba(255,255,255,0.8) !important; }
      [data-bs-theme='dark'] .nav-menu-link:hover { color: #fff !important; background: rgba(255,255,255,0.05); }
      [data-bs-theme='dark'] .nav-menu-link i { color: rgba(255,255,255,0.5); }
      [data-bs-theme='dark'] .nav-mobile { background: #111; border-color: #222; }
      [data-bs-theme='dark'] .nav-mobile .navbar-brand { color: #fff !important; }

      /* Agora! - link chamativo no menu */
      .nav-agora {
        font-weight: 700 !important;
        position: relative;
      }
      [data-bs-theme='dark'] .nav-agora {
        color: #ffd60a !important;
        text-shadow: 0 0 8px rgba(255, 214, 10, 0.4);
      }
      [data-bs-theme='dark'] .nav-agora:hover {
        color: #ffe45a !important;
        text-shadow: 0 0 12px rgba(255, 214, 10, 0.6);
      }
      [data-bs-theme='light'] .nav-agora {
        color: #e65100 !important;
      }
      [data-bs-theme='light'] .nav-agora:hover {
        color: #ff6d00 !important;
      }
      .nav-agora .bi {
        animation: agora-pulse 2s ease-in-out infinite;
      }
      @keyframes agora-pulse {
        0%, 100% { opacity: 1; }
        50% { opacity: 0.5; }
      }

      .nav-detail {
        height: 4px;
        background-color: var(--bs-gray-600, #6c757d);
      }

      [data-bs-theme='light'] .nav-detail {
        background-color: var(--bs-gray-500, #adb5bd);
      }

      .icon-btn-plain {
        border: none;
        background: none;
        font-size: 1.5rem;
        color: var(--bs-secondary-color);
      }
      .icon-btn-plain:hover { color: var(--bs-body-color); }

      /* Navbar icon buttons - size adjustments */
      .navbar .icon-btn {
        width: 32px; height: 32px; padding: 0;
        display: flex; align-items: center; justify-content: center;
        font-size: 0.85rem;
      }

      /* Telas entre lg (992px) e xxl (1400px): navbar compacto */
      @media (min-width: 992px) and (max-width: 1399.98px) {
        .navbar-nav .nav-link { font-size: 0.82rem; padding: 0.4rem 0.3rem !important; }
        .navbar .icon-btn { width: 30px; height: 30px; font-size: 0.8rem; }
        .navbar-brand { font-size: 0.9rem !important; }
      }

      .icon-btn-plain.search {
        font-size: 1.25rem;
      }

      [data-bs-theme='dark'] .btn.btn-outline-secondary.icon-btn {
        border-color: var(--bs-gray-500, #6c757d);
        color: var(--bs-gray-400, #ced4da);
      }

      [data-bs-theme='dark'] .btn.btn-outline-secondary.icon-btn:hover {
        background-color: var(--bs-gray-700, #495057);
        color: var(--bs-white, #fff);
      }

      [data-bs-theme='light'] .btn.btn-outline-secondary.icon-btn {
        border-color: var(--bs-gray-500, #6c757d);
        color: var(--bs-gray-800, #343a40);
      }

      [data-bs-theme='light'] .btn.btn-outline-secondary.icon-btn:hover {
        background-color: var(--bs-gray-200, #e9ecef);
        color: var(--bs-primary, #0d6efd);
      }

      .hero {
        position: relative;
        padding: 5rem 1rem;
        text-align: center;
        color: var(--bs-white, #fff);
        background: var(--bs-gray-800, #343a40);
        border-radius: 1rem;
      }

      [data-bs-theme='light'] .hero {
        background: var(--bs-gray-100, #f8f9fa);
        color: var(--bs-gray-800, #343a40);
      }

      .hero h1 {
        font-size: 3.5rem;
        font-weight: 700;
        animation: fadeInUp 1s ease-out;
      }

      .hero p {
        font-size: 1.25rem;
        max-width: 600px;
        margin: 1rem auto 2rem;
        animation: fadeInUp 1s ease-out 0.2s forwards;
      }

      .search-hero {
        max-width: 700px;
        margin: 0 auto;
      }

      .search-bar {
        margin-bottom: 2rem;
        animation: fadeInUp 1s ease-out 0.4s forwards;
      }

      .search-results {
        margin-top: 2rem;
      }

      /* Botões de ação no card da resposta IA — garantir visibilidade em dark mode */
      .ai-response-card .btn-outline-success,
      .ai-response-card .btn-outline-danger,
      .ai-response-card .btn-outline-secondary {
        border-width: 1.5px;
      }
      [data-bs-theme='dark'] .ai-response-card .btn-outline-success { color: #4ade80; border-color: #4ade80; }
      [data-bs-theme='dark'] .ai-response-card .btn-outline-danger { color: #f87171; border-color: #f87171; }
      [data-bs-theme='dark'] .ai-response-card .btn-outline-secondary { color: #a1a1aa; border-color: #a1a1aa; }
      [data-bs-theme='dark'] .ai-response-card .btn-outline-primary { color: #60a5fa; border-color: #60a5fa; }

      /* Animação "pensando" da busca IA */
      @keyframes search-think-pulse {
        0%, 100% { transform: scale(1); opacity: 1; }
        50% { transform: scale(1.08); opacity: 0.8; }
      }
      @keyframes search-dot-bounce {
        0%, 100% { transform: translateY(0); opacity: 0.4; }
        50% { transform: translateY(-5px); opacity: 1; }
      }

      .search-results .card {
        border-radius: 0.5rem;
        background: var(--bs-gray-800, #343a40);
        color: var(--bs-white, #fff);
        transition: transform 0.3s ease, box-shadow 0.3s ease;
      }

      [data-bs-theme='light'] .search-results .card {
        background: var(--bs-white, #fff);
        color: var(--bs-gray-800, #343a40);
        border: 1px solid var(--bs-border-color, #dee2e6);
      }

      .search-results .card:hover {
        transform: translateY(-5px);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
      }

      .search-results .card-title {
        color: var(--bs-primary, #0d6efd);
      }

      .search-results .card-text {
        font-size: 0.9rem;
      }

      .search-results .badge {
        background-color: var(--bs-primary, #0d6efd);
        color: var(--bs-white, #fff);
      }

      .search-buttons-container {
        display: flex;
        align-items: center;
        gap: 0.2rem;
        max-width: 700px;
        margin: 0 auto;
        position: relative;
      }

      .search-container {
        flex: 1;
        border-radius: 2rem;
        background: #f8f9fa;
        border: 2px solid #ccc;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
        transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
        padding: 0.5rem;
        position: relative;
        overflow: hidden;
      }

      [data-bs-theme='dark'] .search-container {
        background: #495057;
      }

      .search-container:focus-within {
        border-color: var(--bs-primary);
        box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.2);
      }

      .search-container:hover {
        transform: scale(1.02);
        box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
      }

      .search-container input {
        width: 100%;
        padding: 8px 0.75rem;
        border: none;
        border-radius: 30px;
        font-size: 0.85rem;
        outline: none;
        transition: all 0.3s;
        background: transparent;
        color: var(--bs-gray-400, #ced4da);
        white-space: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        position: relative;
        z-index: 1;
        aria-live: 'polite';
      }

      .search-container input::placeholder {
        color: var(--bs-gray-500, #6c757d);
        opacity: 1;
      }

      [data-bs-theme='light'] .search-container input {
        color: var(--bs-gray-800, #343a40);
      }

      [data-bs-theme='light'] .search-container input::placeholder {
        color: var(--bs-gray-600, #6c757d);
        opacity: 1;
      }

      .search-container input::-webkit-scrollbar {
        display: none;
      }

      .search-container input {
        scrollbar-width: none;
      }

      .btn-character,
      .btn-search {
        background: var(--bs-primary, #0d6efd);
        color: #ffffff;
        border: 1px solid #ffffff;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: background 0.3s, box-shadow 0.3s;
        min-width: 48px;
        min-height: 48px;
        z-index: 2;
        visibility: visible;
      }

      .btn-character {
        width: 3rem;
        height: 3rem;
        font-size: 1.1rem;
      }

      .btn-search {
        width: 2.5rem;
        height: 2.5rem;
        font-size: 0.9rem;
      }

      .btn-character:hover,
      .btn-search:hover {
        background: var(--bs-primary-dark, #0056b3);
        box-shadow: 0 0 8px rgba(255, 255, 255, 0.5);
      }

      .btn-character i,
      .btn-search i {
        color: #ffffff;
      }

      .search-buttons {
        display: flex;
        justify-content: center;
        gap: 1rem;
        animation: fadeInUp 1s ease-out 0.6s forwards;
      }

      .search-buttons .btn {
        padding: 0.75rem 2rem;
        font-weight: 600;
        border-radius: 0.5rem;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
      }

      .search-buttons .btn:hover {
        transform: translateY(-3px);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
      }

      .search-buttons .btn-random {
        background-color: var(--bs-success, #28a745);
        color: var(--bs-white, #fff);
        border: 1px solid var(--bs-gray-500, #6c757d);
      }

      .search-buttons .btn-register {
        background-color: var(--bs-primary, #0d6efd);
        color: var(--bs-white, #fff);
        border: 1px solid var(--bs-gray-500, #6c757d);
      }

      .search-buttons .btn-random:hover {
        background-color: var(--bs-success-dark, #218838);
      }

      .search-buttons .btn-register:hover {
        background-color: var(--bs-primary-dark, #0069d9);
      }

      .search-buttons .btn-random:focus,
      .search-buttons .btn-random:active {
        background-color: var(--bs-success-dark, #1e7e34);
        color: var(--bs-white, #fff);
        box-shadow: none;
        outline: none;
        border-color: var(--bs-gray-500, #6c757d);
      }

      .search-buttons .btn-register:focus,
      .search-buttons .btn-register:active {
        background-color: var(--bs-primary-dark, #0069d9);
        color: var(--bs-white, #fff);
        box-shadow: none;
        outline: none;
        border-color: var(--bs-gray-500, #6c757d);
      }

      .search-container input {
        aria-label: 'Pesquisar comércios locais';
      }

      .btn-character,
      .btn-search {
        aria-label: 'Ação de pesquisa';
      }

      .search-buttons .btn {
        min-width: 48px;
        min-height: 48px;
      }

      @keyframes fadeInUp {
        from { opacity: 0; transform: translateY(20px); }
        to { opacity: 1; transform: translateY(0); }
      }

      .offcanvas-left-style,
      .offcanvas-end {
        background: var(--bs-gray-900, #212529);
        color: var(--bs-white, #fff);
        width: 280px;
        border-right: 1px solid var(--bs-border-color-dark, #495057);
      }

      [data-bs-theme='light'] .offcanvas-left-style,
      [data-bs-theme='light'] .offcanvas-end {
        background: var(--bs-light, #f8f9fa);
        color: var(--bs-gray-800, #343a40);
        border-right: 1px solid var(--bs-border-color, #dee2e6);
      }

      .offcanvas-header {
        border-bottom: 1px solid var(--bs-border-color-dark, #495057);
        padding: 1.5rem;
      }

      [data-bs-theme='light'] .offcanvas-header {
        border-bottom: 1px solid var(--bs-border-color, #dee2e6);
      }

      .offcanvas-title {
        font-weight: 600;
        font-size: 1.5rem;
        color: var(--bs-white, #fff);
      }

      [data-bs-theme='light'] .offcanvas-title {
        color: var(--bs-gray-800, #343a40);
      }

      .btn-close {
        background-color: rgba(255, 255, 255, 0.2);
        color: var(--bs-white, #fff);
        border-radius: 50%;
        width: 30px;
        height: 30px;
        opacity: 0.8;
        transition: background-color 0.3s ease, opacity 0.3s ease;
      }

      .btn-close:hover {
        background-color: rgba(255, 255, 255, 0.4);
        opacity: 1;
      }

      [data-bs-theme='light'] .btn-close {
        background-color: var(--bs-gray-200, #e9ecef);
        color: var(--bs-gray-800, #343a40);
      }

      [data-bs-theme='light'] .btn-close:hover {
        background-color: var(--bs-gray-300, #dee2e6);
      }

      .offcanvas-left-style .nav-link {
        display: flex;
        align-items: center;
        padding: 0.75rem 1.5rem;
        color: var(--bs-gray-400, #ced4da);
        font-size: 1rem;
        border-bottom: 1px solid var(--bs-border-color-dark, #495057);
        transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease;
        font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
      }

      [data-bs-theme='light'] .offcanvas-left-style .nav-link {
        color: var(--bs-gray-800, #343a40);
        border-bottom: 1px solid var(--bs-border-color, #dee2e6);
      }

      .offcanvas-left-style .nav-link:hover,
      .offcanvas-left-style .nav-link.active {
        background-color: var(--bs-gray-800, #343a40);
        color: var(--bs-gray-200, #e9ecef);
        transform: translateX(5px);
      }

      [data-bs-theme='light'] .offcanvas-left-style .nav-link:hover,
      [data-bs-theme='light'] .offcanvas-left-style .nav-link.active {
        background-color: var(--bs-gray-200, #e9ecef);
        color: var(--bs-primary, #0d6efd);
      }

      .offcanvas-left-style .nav-link i {
        margin-right: 0.75rem;
        font-size: 1.2rem;
        width: 24px;
        text-align: center;
      }

      .navbar-nav {
        padding: 0.5rem 0;
      }

      .offcanvas-end .offcanvas-body {
        padding: 1.5rem;
      }

      .offcanvas-end input.form-control {
        background-color: var(--bs-gray-900, #212529);
        border: 1px solid var(--bs-border-color-dark, #495057);
        color: var(--bs-gray-400, #ced4da);
        transition: background-color 0.3s ease, border-color 0.3s ease;
      }

      .offcanvas-end input.form-control::placeholder {
        color: var(--bs-gray-500, #6c757d);
        opacity: 1;
      }

      [data-bs-theme='light'] .offcanvas-end input.form-control {
        background-color: var(--bs-white, #fff);
        border: 1px solid var(--bs-border-color, #ced4da);
        color: var(--bs-gray-800, #343a40);
      }

      [data-bs-theme='light'] .offcanvas-end input.form-control::placeholder {
        color: var(--bs-gray-600, #6c757d);
        opacity: 1;
      }

      .offcanvas-end input.form-control:focus {
        background-color: var(--bs-gray-800, #343a40);
        border-color: var(--bs-primary, #0d6efd);
        color: var(--bs-white, #fff);
      }

      [data-bs-theme='light'] .offcanvas-end input.form-control:focus {
        background-color: var(--bs-white, #fff);
        border-color: var(--bs-primary, #0d6efd);
        color: var(--bs-gray-800, #343a40);
      }

      .offcanvas-right-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
        margin-top: 1.5rem;
      }

      .action-grid-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 1rem;
        border: 1px solid var(--bs-border-color-dark, #495057);
        border-radius: 0.5rem;
        color: var(--bs-gray-400, #ced4da);
        text-decoration: none;
        background-color: var(--bs-gray-900, #212529);
        transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
      }

      [data-bs-theme='light'] .action-grid-btn {
        border: 1px solid var(--bs-border-color, #dee2e6);
        background-color: var(--bs-gray-100, #f8f9fa);
        color: var(--bs-gray-800, #343a40);
      }

      .action-grid-btn:hover,
      .action-grid-btn:active {
        background-color: var(--bs-gray-800, #343a40);
        color: var(--bs-gray-200, #e9ecef);
        transform: translateY(-3px);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
      }

      [data-bs-theme='light'] .action-grid-btn:hover,
      [data-bs-theme='light'] .action-grid-btn:active {
        background-color: var(--bs-gray-200, #e9ecef);
        color: var(--bs-primary, #0d6efd);
      }

      .action-grid-btn i {
        font-size: 2rem;
        margin-bottom: 0.5rem;
      }

      .action-grid-btn span {
        font-size: 0.9rem;
        text-align: center;
      }

      .meriendafontedif {
        font-family: 'Merienda', cursive, sans-serif;
        font-optical-sizing: auto;
        font-weight: 300;
        font-style: normal;
        font-display: swap;
      }

      @media (min-width: 576px) {
        .search-buttons-container {
          position: relative;
          display: block;
        }

        .search-container {
          position: relative;
          padding: 0.5rem;
        }

        .search-container input {
          padding: 10px 3rem 10px 4rem;
        }

        .btn-character,
        .btn-search {
          position: absolute;
          top: 50%;
          transform: translateY(-50%);
          z-index: 2;
          background: var(--bs-primary, #0d6efd);
          color: #ffffff;
          border: 1px solid #ffffff;
          visibility: visible;
        }

        .btn-character {
          left: 8px;
        }

        .btn-search {
          right: 8px;
        }

        .btn-character:hover,
        .btn-search:hover {
          background: var(--bs-primary-dark, #0056b3);
          box-shadow: 0 0 8px rgba(255, 255, 255, 0.5);
        }
      }

      @media (max-width: 575.98px) {
        .search-buttons-container {
          flex-direction: row;
          align-items: center;
          gap: 0.35rem;
        }

        .search-container {
          min-width: 0;
          flex: 1;
        }

        .search-container input {
          padding: 10px 0.85rem;
          font-size: 0.9rem;
        }

        .btn-character {
          width: 2.4rem;
          height: 2.4rem;
          font-size: 0.9rem;
          flex-shrink: 0;
        }

        .btn-search {
          width: 2.2rem;
          height: 2.2rem;
          font-size: 0.85rem;
          flex-shrink: 0;
        }

        .hero {
          padding: 2rem 1rem 1.5rem;
          margin-bottom: 1.5rem !important;
        }

        .hero h1 {
          font-size: 1.8rem;
        }

        .hero p {
          font-size: 0.9rem;
          margin-bottom: 0.75rem !important;
        }

        .hero .lead {
          font-size: 0.9rem;
        }

        .search-buttons {
          flex-direction: row;
          gap: 0.5rem;
        }

        .search-buttons .btn {
          padding: 0.6rem 1rem;
          font-size: 0.82rem;
          flex: 1;
        }

        .offcanvas-left-style,
        .offcanvas-end {
          width: 250px;
        }

        .scrolling::placeholder {
          animation: scrollText 10s linear infinite;
          animation-play-state: running;
        }

        .search-container input:focus::placeholder,
        .search-container input:not(:placeholder-shown)::placeholder {
          animation: none;
        }

        .search-container:hover input::placeholder {
          animation-play-state: paused;
        }

        @media (prefers-reduced-motion: reduce) {
          .scrolling::placeholder {
            animation: none;
          }
        }
      }

      @keyframes scrollText {
        0% { transform: translateX(100%); }
        100% { transform: translateX(-100%); }
      }

     

.user-status-content {
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}
