:root {

  --bg: #080808;

  --panel: #111111;

  --panel-2: #171717;

  --panel-3: #242424;

  --text: #f8f8f8;

  --muted: #a3a3a3;

  --line: rgba(255, 255, 255, 0.11);

  --brand: #e30613;

  --brand-2: #ff3b30;

  --success: #21c45d;

  --warning: #ffcc4d;

  --danger: #ff3b3b;

  --shadow: 0 18px 55px rgba(0, 0, 0, 0.42);

}



* { box-sizing: border-box; }



html { scroll-behavior: smooth; }



body {

  margin: 0;

  background: var(--bg);

  color: var(--text);

  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  line-height: 1.5;

}



a { color: inherit; text-decoration: none; }

button, input, select, textarea { font: inherit; }

button { cursor: pointer; }



.container {

  width: min(1180px, calc(100% - 32px));

  margin: 0 auto;

}



.site-header {

  position: sticky;

  top: 0;

  z-index: 30;

  border-bottom: 1px solid var(--line);

  background: rgba(8, 8, 8, 0.92);

  backdrop-filter: blur(18px);

}



.header-grid {

  display: flex;

  min-height: 72px;

  align-items: center;

  justify-content: space-between;

  gap: 18px;

}



.brand {

  display: inline-flex;

  align-items: center;

  gap: 12px;

}



.brand-mark {

  display: grid;

  width: 42px;

  height: 42px;

  place-items: center;

  border-radius: 8px;

  background: linear-gradient(135deg, var(--brand), var(--brand-2));

  font-size: 13px;

  font-weight: 800;

}



.brand strong,

.brand small { display: block; }

.brand small, .hint { color: var(--muted); }



.top-nav {

  display: flex;

  align-items: center;

  gap: 8px;

}



.top-nav a,

.nav-button {

  border: 0;

  border-radius: 8px;

  background: transparent;

  color: var(--muted);

  padding: 10px 12px;

  font-weight: 700;

}



.top-nav a:hover,

.nav-button:hover {

  background: rgba(255, 255, 255, 0.06);

  color: var(--text);

}



.hero {

  padding: 78px 0 48px;

  background:

    radial-gradient(circle at 16% 10%, rgba(227, 6, 19, 0.26), transparent 28%),

    radial-gradient(circle at 82% 12%, rgba(255, 59, 48, 0.16), transparent 26%);

}



.hero-grid {

  display: grid;

  grid-template-columns: minmax(0, 1fr) 340px;

  align-items: center;

  gap: 34px;

}



.eyebrow {

  display: inline-block;

  color: var(--brand-2);

  font-size: 12px;

  font-weight: 800;

  letter-spacing: 0.08em;

  text-transform: uppercase;

}



h1, h2, h3, p { margin-top: 0; }



h1 {

  max-width: 760px;

  margin-bottom: 18px;

  font-size: clamp(38px, 7vw, 66px);

  line-height: 1;

  letter-spacing: 0;

}



h2 {

  margin-bottom: 8px;

  font-size: clamp(26px, 4vw, 38px);

  line-height: 1.05;

}



h3 { margin-bottom: 8px; font-size: 20px; }



.hero-copy p {

  max-width: 650px;

  color: var(--muted);

  font-size: 18px;

}



.hero-actions,

.backup-grid {

  display: flex;

  flex-wrap: wrap;

  gap: 12px;

}



.button,

.file-import {

  display: inline-flex;

  min-height: 44px;

  align-items: center;

  justify-content: center;

  border: 0;

  border-radius: 8px;

  padding: 0 18px;

  font-weight: 800;

}



.button-primary {

  background: linear-gradient(135deg, var(--brand), var(--brand-2));

  color: #fff;

}



.button-secondary,

.button-ghost {

  border: 1px solid var(--line);

  background: rgba(255, 255, 255, 0.06);

  color: var(--text);

}



.button-full { width: 100%; }



.hero-panel,

.product-card,

.admin-product,

.stat-card,

.login-card,

.empty-state {

  border: 1px solid var(--line);

  border-radius: 8px;

  background: linear-gradient(180deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.035));

  box-shadow: var(--shadow);

}



.hero-panel {

  display: grid;

  gap: 12px;

  padding: 18px;

}



.hero-panel > div {

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.055);

  padding: 16px;

}



.metric-value {

  display: block;

  font-size: 32px;

  font-weight: 800;

}



.metric-label {

  color: var(--muted);

  font-weight: 700;

}



.toolbar-section {

  border-top: 1px solid var(--line);

  border-bottom: 1px solid var(--line);

  background: var(--panel);

  padding: 18px 0;

}



.toolbar,

.note-form {

  display: grid;

  grid-template-columns: minmax(0, 1fr) 220px;

  gap: 14px;

}



.input-field,

.search-field,

.select-field {

  display: grid;

  gap: 7px;

  color: var(--muted);

  font-size: 13px;

  font-weight: 800;

}



input, select, textarea {

  width: 100%;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.065);

  color: var(--text);

  outline: 0;

  padding: 12px 13px;

}



textarea { resize: vertical; }

select option { background: #151515; }

input:focus, select:focus, textarea:focus { border-color: rgba(255, 42, 42, 0.75); }



.section,

.admin-section { padding: 44px 0; }



.section-heading,

.admin-top {

  display: flex;

  align-items: flex-end;

  justify-content: space-between;

  gap: 18px;

  margin-bottom: 24px;

}



.section-heading p {

  max-width: 420px;

  margin-bottom: 0;

  color: var(--muted);

}



.product-grid {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 18px;

}



.product-card {

  display: grid;

  gap: 16px;

  padding: 16px;

}



.product-media {

  display: grid;

  min-height: 210px;

  place-items: center;

  border-radius: 8px;

  background: linear-gradient(135deg, rgba(227, 6, 19, 0.13), rgba(255, 42, 42, 0.08));

  overflow: hidden;

}



.product-image {

  width: 100%;

  height: 210px;

  object-fit: contain;

  padding: 16px;

}



.product-icon {

  width: 76px;

  height: 116px;

  border-radius: 18px 18px 12px 12px;

  background: linear-gradient(160deg, var(--brand), #121212 58%, var(--brand-2));

}



.product-badge {

  display: inline-flex;

  width: fit-content;

  border-radius: 999px;

  background: rgba(227, 6, 19, 0.16);

  color: #ffd6d6;

  padding: 6px 10px;

  font-size: 12px;

  font-weight: 800;

}



.product-title { margin: 8px 0 4px; }



.product-meta {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

  color: var(--muted);

  font-size: 13px;

}



.price-row {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

}



.price-row strong { font-size: 24px; }



.flavor-list {

  display: grid;

  gap: 10px;

}



.flavor-row {

  display: grid;

  grid-template-columns: 1fr 78px;

  align-items: center;

  gap: 10px;

}



.flavor-info {

  display: grid;

  gap: 2px;

}



.flavor-info small,

.stock-muted { color: var(--muted); }

.stock-ok { color: var(--success); }

.stock-low { color: var(--warning); }

.stock-out { color: var(--danger); }

.qty-input { padding: 9px; }



.cart-widget {

  position: fixed;

  right: 18px;

  bottom: 18px;

  z-index: 40;

  width: min(390px, calc(100vw - 36px));

}



.cart-tab {

  display: grid;

  grid-template-columns: 38px 1fr;

  width: 100%;

  align-items: center;

  gap: 4px 10px;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: linear-gradient(135deg, var(--panel), var(--panel-2));

  color: var(--text);

  padding: 12px 14px;

  box-shadow: var(--shadow);

  text-align: left;

}



.cart-tab-arrow {

  grid-row: 1 / span 2;

  display: grid;

  width: 34px;

  height: 34px;

  place-items: center;

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.08);

  font-weight: 900;

  transition: transform 0.2s ease;

}



.cart-tab small { color: var(--muted); font-weight: 700; }



.cart-panel {

  display: grid;

  max-height: calc(100vh - 132px);

  margin-top: 10px;

  overflow: hidden;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: rgba(17, 24, 39, 0.98);

  box-shadow: var(--shadow);

}



.cart-widget.is-collapsed .cart-panel { display: none; }

.cart-widget:not(.is-collapsed) .cart-tab-arrow { transform: rotate(180deg); }



.cart-header,

.cart-footer {

  padding: 16px;

}



.cart-header {

  display: flex;

  align-items: center;

  justify-content: space-between;

  border-bottom: 1px solid var(--line);

}



.icon-button {

  border: 1px solid var(--line);

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.06);

  color: var(--text);

  padding: 8px 10px;

  font-weight: 800;

}



.cart-items {

  display: grid;

  max-height: 250px;

  overflow: auto;

  gap: 10px;

  padding: 14px 16px;

}



.cart-line {

  display: grid;

  grid-template-columns: 1fr auto;

  gap: 8px;

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.055);

  padding: 12px;

}



.cart-line span {

  display: block;

  color: var(--muted);

  font-size: 13px;

}



.cart-empty {

  display: grid;

  gap: 4px;

  padding: 18px;

  color: var(--muted);

}



.cart-empty strong { color: var(--text); }



.cart-footer {

  display: grid;

  gap: 12px;

  border-top: 1px solid var(--line);

}



.cart-total {

  display: flex;

  align-items: center;

  justify-content: space-between;

}



.cart-total strong { font-size: 22px; }



.minimum-warning {

  margin: 0;

  color: var(--warning);

  font-size: 13px;

  font-weight: 800;

}



.empty-state {

  padding: 28px;

  text-align: center;

}



.auth-body,

.login-screen {

  min-height: 100vh;

}



.login-screen {

  display: grid;

  place-items: center;

  padding: 32px 16px;

}



.login-card {

  display: grid;

  width: min(420px, 100%);

  gap: 16px;

  padding: 26px;

}



.admin-main { min-height: calc(100vh - 72px); }

.admin-top { padding-top: 40px; }



.stats-grid {

  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: 14px;

}



.stat-card {

  display: grid;

  gap: 8px;

  padding: 18px;

}



.stat-card span {

  color: var(--muted);

  font-weight: 800;

}



.stat-card strong { font-size: 28px; }



.admin-products {

  display: grid;

  gap: 16px;

}



.admin-product { padding: 18px; }



.admin-card-grid {

  display: grid;

  grid-template-columns: 170px minmax(0, 1fr);

  gap: 16px;

}



.admin-product-preview {

  display: grid;

  min-height: 170px;

  place-items: center;

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.05);

  color: var(--muted);

  overflow: hidden;

}



.admin-product-preview img {

  width: 100%;

  height: 170px;

  object-fit: contain;

  padding: 10px;

}



.admin-product-head {

  display: grid;

  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) 120px 120px;

  gap: 10px;

}



.admin-image-field { margin: 12px 0; }



.admin-switches {

  display: flex;

  flex-wrap: wrap;

  gap: 12px;

  margin-bottom: 12px;

}



.switch-field {

  display: flex;

  align-items: center;

  gap: 8px;

  color: var(--muted);

  font-weight: 800;

}



.switch-field input { width: auto; }



.admin-flavors {

  display: grid;

  gap: 10px;

}



.admin-flavor {

  display: grid;

  grid-template-columns: minmax(0, 1fr) 120px 130px;

  align-items: center;

  gap: 10px;

}



.input-wide { grid-column: 1 / -1; }



.note-form {

  grid-template-columns: repeat(4, minmax(0, 1fr));

  margin-bottom: 22px;

}



.table-wrap {

  overflow: auto;

  border: 1px solid var(--line);

  border-radius: 8px;

}



table {

  width: 100%;

  min-width: 820px;

  border-collapse: collapse;

}



th, td {

  border-bottom: 1px solid var(--line);

  padding: 13px;

  text-align: left;

  vertical-align: top;

}



th {

  color: var(--muted);

  font-size: 12px;

  text-transform: uppercase;

}



tr:last-child td { border-bottom: 0; }



.toast {

  position: fixed;

  left: 50%;

  bottom: 20px;

  z-index: 70;

  max-width: min(420px, calc(100vw - 32px));

  transform: translateX(-50%) translateY(24px);

  border-radius: 8px;

  background: #fff;

  color: #151515;

  opacity: 0;

  padding: 12px 16px;

  box-shadow: var(--shadow);

  font-weight: 800;

  transition: 0.2s ease;

}



.toast.is-visible {

  opacity: 1;

  transform: translateX(-50%) translateY(0);

}



.is-hidden { display: none !important; }



@media (max-width: 980px) {

  .hero-grid,

  .product-grid,

  .stats-grid {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .hero-copy { grid-column: 1 / -1; }

  .admin-product-head,

  .note-form { grid-template-columns: 1fr 1fr; }

}



@media (max-width: 720px) {

  .header-grid,

  .section-heading,

  .admin-top {

    align-items: flex-start;

    flex-direction: column;

  }



  .hero-grid,

  .product-grid,

  .toolbar,

  .stats-grid,

  .admin-card-grid,

  .admin-product-head,

  .admin-flavor,

  .note-form {

    grid-template-columns: 1fr;

  }



  .hero { padding-top: 48px; }

  h1 { font-size: 42px; }



  .cart-widget {

    right: 12px;

    bottom: 12px;

    width: calc(100vw - 24px);

  }

}





/* Ajustes do catalogo compacto */

.product-card-compact {

  cursor: pointer;

  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;

}



.product-card-compact:hover {

  transform: translateY(-3px);

  border-color: rgba(255, 42, 42, 0.45);

  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.42);

}



.product-card-compact .product-media {

  min-height: 230px;

}



.product-card-compact .product-image {

  height: 230px;

}



.product-card-compact .button {

  margin-top: auto;

}



/* Modal base */

.modal-backdrop {

  position: fixed;

  inset: 0;

  z-index: 60;

  display: grid;

  place-items: center;

  background: rgba(0, 0, 0, 0.68);

  padding: 18px;

}



.modal-card {

  position: relative;

  width: min(980px, 100%);

  max-height: calc(100vh - 36px);

  overflow: auto;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: #101010;

  box-shadow: var(--shadow);

  padding: 22px;

}



.admin-modal-card {

  width: min(1080px, 100%);

}



.modal-close {

  position: sticky;

  top: 0;

  float: right;

  z-index: 2;

  display: grid;

  width: 38px;

  height: 38px;

  place-items: center;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.08);

  color: var(--text);

  font-weight: 900;

}



/* Modal do produto no catalogo */

.product-modal-grid {

  display: grid;

  grid-template-columns: 360px minmax(0, 1fr);

  gap: 24px;

  align-items: start;

}



.product-modal-media {

  display: grid;

  min-height: 360px;

  place-items: center;

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.05);

  overflow: hidden;

}



.product-modal-media img {

  width: 100%;

  height: 360px;

  object-fit: contain;

  padding: 18px;

}



.product-modal-info h2 {

  margin: 10px 0;

}



.modal-price {

  margin: 22px 0;

  border-top: 1px solid var(--line);

  border-bottom: 1px solid var(--line);

  padding: 16px 0;

}



.modal-flavor-list {

  display: grid;

  gap: 10px;

  margin-bottom: 16px;

}



.modal-flavor-row {

  display: grid;

  grid-template-columns: minmax(0, 1fr) 90px;

  gap: 12px;

  align-items: center;

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.055);

  padding: 12px;

}



.modal-flavor-row span,

.modal-flavor-row strong,

.modal-flavor-row small {

  display: block;

}



/* ADM novo em cards */

.admin-actions {

  display: flex;

  flex-wrap: wrap;

  gap: 12px;

}



.admin-products {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 16px;

}



.admin-product-card {

  display: grid;

  min-height: 100%;

  overflow: hidden;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: linear-gradient(180deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.035));

  box-shadow: var(--shadow);

  cursor: pointer;

  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;

}



.admin-product-card:hover {

  transform: translateY(-3px);

  border-color: rgba(255, 42, 42, 0.45);

  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.42);

}



.admin-product-thumb {

  display: grid;

  height: 180px;

  place-items: center;

  background: rgba(255, 255, 255, 0.045);

  color: var(--muted);

  overflow: hidden;

}



.admin-product-thumb img {

  width: 100%;

  height: 180px;

  object-fit: contain;

  padding: 12px;

}



.admin-product-card-body {

  display: grid;

  gap: 18px;

  padding: 16px;

}



.admin-product-card-body h3 {

  margin-bottom: 4px;

}



.admin-product-card-body p {

  margin-bottom: 0;

  color: var(--muted);

  font-size: 13px;

}



.admin-card-footer {

  display: flex;

  align-items: flex-end;

  justify-content: space-between;

  gap: 12px;

}



.admin-card-footer strong {

  font-size: 20px;

}



.admin-card-footer span {

  color: var(--muted);

  font-size: 12px;

  text-align: right;

}



/* Form do modal ADM */

.modal-heading {

  margin-bottom: 18px;

}



.modal-subhead {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

  margin: 20px 0 12px;

}



.modal-subhead h3 {

  margin-bottom: 0;

}



.admin-form-grid {

  display: grid;

  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) 130px 140px;

  gap: 12px;

}



.modal-admin-flavor {

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.045);

  padding: 12px;

}



/* Responsivo dos novos blocos */

@media (max-width: 980px) {

  .admin-products {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .product-modal-grid,

  .admin-form-grid {

    grid-template-columns: 1fr;

  }



  .product-modal-media,

  .product-modal-media img {

    min-height: 280px;

    height: 280px;

  }

}



@media (max-width: 720px) {

  .admin-products {

    grid-template-columns: 1fr;

  }



  .modal-card {

    padding: 16px;

  }



  .modal-flavor-row {

    grid-template-columns: 1fr;

  }

}



/* Paginacao */

.pagination {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 10px;

  margin-top: 28px;

  flex-wrap: wrap;

}



.pagination-pages {

  display: flex;

  align-items: center;

  gap: 8px;

  flex-wrap: wrap;

  justify-content: center;

}



.pagination-button,

.pagination-number {

  min-width: 42px;

  height: 42px;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.06);

  color: var(--text);

  padding: 0 14px;

  font-weight: 800;

}



.pagination-number.is-active {

  border-color: rgba(255, 42, 42, 0.75);

  background: linear-gradient(135deg, var(--brand), var(--brand-2));

}



.pagination-button:disabled,

.pagination-number:disabled {

  cursor: not-allowed;

  opacity: 0.45;

}



@media (max-width: 720px) {

  .pagination {

    justify-content: stretch;

  }



  .pagination-button {

    flex: 1;

  }

}



/* Filtros do ADM */

.admin-filters {

  display: grid;

  grid-template-columns: minmax(260px, 1.5fr) repeat(4, minmax(150px, 1fr));

  gap: 12px;

  margin-bottom: 18px;

  padding: 14px;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.035);

}



.admin-empty-state {

  grid-column: 1 / -1;

}



@media (max-width: 1100px) {

  .admin-filters {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }

}



@media (max-width: 720px) {

  .admin-filters {

    grid-template-columns: 1fr;

  }

}





/* Dashboard e equipe do painel administrativo */

.dashboard-grid {

  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 24px;

  margin-top: 24px;

}

.dashboard-panel {

  min-width: 0;

  padding: 20px;

  border: 1px solid var(--line);

  border-radius: 16px;

  background: var(--panel);

}

.dashboard-panel-head h3 { margin: 0 0 8px; }

.dashboard-panel-head span, .admin-user-card p { color: var(--muted); }

.admin-user-form {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;

  gap: 16px;

  align-items: end;

}

.admin-users-list { display: grid; gap: 12px; margin-top: 24px; }

.admin-user-card {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 16px;

  padding: 20px;

  border: 1px solid var(--line);

  border-radius: 12px;

  background: var(--panel);

  overflow-wrap: anywhere;

}

.admin-user-card p { margin: 8px 0 0; }

.admin-section[id] { scroll-margin-top: 110px; }

@media (max-width: 980px) {

  .dashboard-grid { grid-template-columns: 1fr; }

  .admin-user-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }

}

@media (max-width: 720px) {

  .admin-user-form { grid-template-columns: 1fr; }

  .dashboard-panel { padding: 14px; }

}



.admin-user-card > div:first-child { display: grid; gap: 8px; min-width: 0; }

.admin-user-card small, .admin-user-card > div:first-child > span { color: var(--muted); }

.admin-user-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }

@media (max-width: 720px) {

  .admin-user-card { flex-direction: column; align-items: stretch; }

}



/* Dashboard */

.dashboard-stats {

  margin-bottom: 18px;

}



.dashboard-grid {

  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 16px;

}



.dashboard-panel {

  border: 1px solid var(--line);

  border-radius: 8px;

  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.03));

  box-shadow: var(--shadow);

  overflow: hidden;

}



.dashboard-panel-head {

  display: flex;

  align-items: flex-end;

  justify-content: space-between;

  gap: 12px;

  padding: 16px;

  border-bottom: 1px solid var(--line);

}



.dashboard-panel-head h3 {

  margin-bottom: 0;

}



.dashboard-panel-head span {

  color: var(--muted);

  font-size: 13px;

  font-weight: 700;

}



.dashboard-table-wrap {

  border: 0;

  border-radius: 0;

}



.dashboard-table-wrap table {

  min-width: 620px;

}



/* Painel de ADMs */

.admin-user-form {

  display: grid;

  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(180px, 0.7fr) auto;

  gap: 12px;

  align-items: end;

  margin-bottom: 18px;

  padding: 14px;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.035);

}



.admin-users-list {

  display: grid;

  gap: 12px;

}



.admin-user-card {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 16px;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.025));

  padding: 14px;

}



.admin-user-card strong,

.admin-user-card span,

.admin-user-card small {

  display: block;

}



.admin-user-card span {

  color: var(--muted);

  font-size: 14px;

}



.admin-user-card small {

  margin-top: 4px;

  color: var(--muted);

  font-size: 12px;

}



.admin-user-actions {

  display: flex;

  align-items: center;

  justify-content: flex-end;

  gap: 12px;

  flex-wrap: wrap;

}



/* Ajuste do formulario de nota com mais campos */

.note-form {

  grid-template-columns: repeat(6, minmax(0, 1fr));

}



.note-form .input-wide {

  grid-column: 1 / -1;

}



/* Responsivo */

@media (max-width: 1100px) {

  .dashboard-grid {

    grid-template-columns: 1fr;

  }



  .admin-user-form {

    grid-template-columns: repeat(2, minmax(0, 1fr));

  }



  .note-form {

    grid-template-columns: repeat(3, minmax(0, 1fr));

  }

}



@media (max-width: 720px) {

  .admin-user-form,

  .note-form {

    grid-template-columns: 1fr;

  }



  .admin-user-card {

    align-items: flex-start;

    flex-direction: column;

  }



  .admin-user-actions {

    justify-content: flex-start;

  }

}



/* Logo Tech Market */

.brand-logo {

  display: grid;

  width: 46px;

  height: 46px;

  place-items: center;

  overflow: hidden;

  border-radius: 8px;

  background: #fff;

}



.brand-logo img {

  width: 100%;

  height: 100%;

  object-fit: contain;

  padding: 4px;

}