/* Admin layout refatorado para Bootstrap
   - Este arquivo substitui /assets/css/admin.css nas páginas do /admin.
   - Compatível com Bootstrap 4 (e inclui pequenos shims se você estiver em Bootstrap 5).
*/

/* ------- Pequenos shims (para quando o projeto estiver em Bootstrap 5) ------- */
.ml-2{margin-left:.5rem!important}
.ml-3{margin-left:1rem!important}
.mr-1{margin-right:.25rem!important}
.mr-2{margin-right:.5rem!important}
.pr-3{padding-right:1rem!important}
.border-right{border-right:1px solid rgba(0,0,0,.125)!important}
.btn-block{display:block;width:100%}

/* ------- Branding ------- */
.admin-brand-logo{
  height: 34px;
  width: auto;
  display: inline-block;
}
@media (min-width: 992px){
  .admin-brand-logo{ height: 40px; }
}
.admin-login-card{ max-width: 480px; }

/* ------- Sidebar ------- */
.pv-admin-sidebar-col{
  flex: 0 0 260px;
  max-width: 260px;
}
@media (max-width: 991.98px){
  .pv-admin-sidebar-col{ flex: 0 0 auto; max-width: none; }
}

.pv-admin-sidebar{
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: auto;
  box-shadow: 0 .25rem 1rem rgba(0,0,0,.06);
}
.pv-admin-sidebar .nav-link{
  border-radius: .5rem;
  color: #212529;
}
.pv-admin-sidebar .nav-link:hover{
  background: rgba(13,110,253,.08);
}
.pv-admin-sidebar .nav-link.active{
  background: #0d6efd;
  color: #fff;
}
.pv-admin-sidebar .nav-link.active i{ color: #fff; }

/* ------- Stats (dashboard) ------- */
.admin-stat{
  font-weight: 700;
  line-height: 1.1;
  margin: .25rem 0 .75rem 0;
}
@media (max-width: 576px){
  .admin-stat{ font-size: 2.25rem; }
}

/* ------- Grid (lista de cards) ------- */
.pv-admin-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  grid-gap: 1rem;
}
.pv-admin-grid-posts{
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}

/* ------- Cards gerados pelo JS (produtos/posts) -------
   Como o HTML dos itens vem de JS (admin-products.js/admin-blog.js),
   deixamos regras genéricas que funcionam com vários padrões.
*/
:root{
  --pv-card-media-h: 220px;
  --pv-card-radius: .75rem;
}

.pv-admin-grid > *{
  display: flex;
  flex-direction: column;
  gap: .5rem;
  border-radius: var(--pv-card-radius);
}

.pv-admin-grid img{
  width: 100%;
  height: var(--pv-card-media-h);
  object-fit: contain;
  background: #f8f9fa;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: .5rem;
}

/* Ações no rodapé do card (se existirem) */
.pv-admin-grid .pv-admin-actions,
.pv-admin-grid .actions,
.pv-admin-grid .pv-admin-item-actions{
  margin-top: auto;
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
}

@media (max-width: 576px){
  :root{ --pv-card-media-h: 180px; }
}

/* Evita o "17/02/2026, 16:59:40" quebrar deixando a vírgula sozinha */
#statUpdated{
  font-size: 2.25rem;
  line-height: 1.05;
  white-space: normal;
  word-break: keep-all;
}

@media (max-width: 576px){
  #statUpdated{ font-size: 1.9rem; }
}

/* Caso o JS gere cards com classes antigas, damos um visual de “card” Bootstrap */
.pv-admin-card,
.pv-admin-item,
.pv-admin-post-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.125);
  border-radius: .75rem;
  padding: 1rem;
  box-shadow: 0 .125rem .25rem rgba(0,0,0,.04);
}
.pv-admin-card-title,
.pv-admin-item-title{
  font-weight: 700;
}
.pv-admin-muted{
  color: #6c757d;
  font-size: .875rem;
}

/* Botões antigos (fallback, se existirem no HTML gerado pelo JS) */
.pv-admin-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  border-radius: .5rem;
  padding: .45rem .75rem;
  border: 1px solid rgba(0,0,0,.125);
  background: #fff;
  color: #212529;
  text-decoration: none;
}
.pv-admin-btn:hover{ background: #f8f9fa; text-decoration: none; }
.pv-admin-btn-primary{ background: #0d6efd; border-color: #0d6efd; color: #fff; }
.pv-admin-btn-primary:hover{ background: #0b5ed7; border-color: #0b5ed7; color: #fff; }
.pv-admin-btn-danger{ background: #dc3545; border-color: #dc3545; color: #fff; }
.pv-admin-btn-danger:hover{ background: #bb2d3b; border-color: #bb2d3b; color: #fff; }

/* ------- Drawer (edição) ------- */
.pv-admin-drawer{
  position: fixed;
  inset: 0;
  z-index: 1050;
  pointer-events: none;
}
.pv-admin-drawer-backdrop{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  transition: opacity .18s ease;
}
.pv-admin-drawer-panel{
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 520px;
  max-width: 95vw;
  background: #fff;
  transform: translateX(100%);
  transition: transform .22s ease;
  box-shadow: -8px 0 24px rgba(0,0,0,.16);
  display: flex;
  flex-direction: column;
}
.pv-admin-drawer-head{ flex: 0 0 auto; }
.pv-admin-drawer-body{
  flex: 1 1 auto;
  overflow: auto;
}

/* Estados abertos (cobrimos vários padrões para compatibilidade com o JS existente) */
.pv-admin-drawer[aria-hidden="false"],
.pv-admin-drawer.is-open,
.pv-admin-drawer.open{
  pointer-events: auto;
}
.pv-admin-drawer[aria-hidden="false"] .pv-admin-drawer-backdrop,
.pv-admin-drawer.is-open .pv-admin-drawer-backdrop,
.pv-admin-drawer.open .pv-admin-drawer-backdrop{
  opacity: 1;
}
.pv-admin-drawer[aria-hidden="false"] .pv-admin-drawer-panel,
.pv-admin-drawer.is-open .pv-admin-drawer-panel,
.pv-admin-drawer.open .pv-admin-drawer-panel{
  transform: translateX(0);
}

/* Preview de imagens */
#previewImage, #previewThumb, #previewCover{
  max-height: 160px;
  object-fit: cover;
  width: 100%;
}
