/**
 * Amanda Estética v1.10.7 — ajustes do checklist de auditoria visual:
 * 1) fallback sólido para navegadores sem suporte a backdrop-filter;
 * 2) área de toque mínima de 44px nos ícones pequenos, sem alterar o tamanho visual;
 * 3) tabela de produtos do protocolo vira cards no mobile, sem rolagem horizontal.
 * Carregado por último de propósito, para vencer o empate de especificidade com !important.
 */

/* =========================================================
   1) Fallback de vidro para navegadores sem backdrop-filter
   ========================================================= */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .sidebar,
  .topbar,
  .mobile-bottom-nav{
    background:rgba(255,248,251,.97)!important;
  }
  .sidebar{border-right:1px solid var(--line)!important}
  .topbar{border-bottom:1px solid var(--line)!important}

  .modal-backdrop,
  .app-confirm-backdrop,
  .ios-wheel-backdrop{
    background:rgba(46,31,39,.62)!important;
  }
  .app-confirm-dialog,
  .ios-wheel-sheet{
    background:rgba(253,247,250,.99)!important;
  }
  .login-brand-copy,
  .global-search{
    background:rgba(255,248,251,.96)!important;
  }
}

/* =========================================================
   2) Área de toque ≥44px nos icon-btn pequenos (visual intacto)
   Um pseudo-elemento invisível expande a região clicável/tocável
   sem alterar o box visível — mantém a densidade minimalista.
   Em clusters muito apertados (gap de 4-5px) as áreas podem se
   sobrepor levemente; ações destrutivas continuam pedindo confirmação.
   ========================================================= */
.icon-btn{position:relative}
.icon-btn::after{
  content:"";
  position:absolute;
  top:50%;left:50%;
  width:44px;height:44px;
  transform:translate(-50%,-50%);
}

/* =========================================================
   3) Tabela de produtos do protocolo → cards no mobile
   Depende dos atributos data-label adicionados nas células
   (js/forms/00-appointments-clients.js).
   ========================================================= */
@media(max-width:600px){
  .responsive-table table,
  .responsive-table thead,
  .responsive-table tbody,
  .responsive-table th,
  .responsive-table td,
  .responsive-table tr{
    display:block;
    width:100%;
  }
  .responsive-table thead{
    position:absolute;
    width:1px;height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    white-space:nowrap;
  }
  .responsive-table tbody{display:grid;gap:10px}
  .responsive-table tr{
    background:rgba(255,255,255,.85);
    border:1px solid var(--line);
    border-radius:14px;
    padding:4px 13px;
  }
  .responsive-table td{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:9px 0;
    border-bottom:1px dashed rgba(101,60,77,.12);
    white-space:normal;
    text-align:right;
    font-size:12px;
  }
  .responsive-table tr td:last-child{border-bottom:0}
  .responsive-table td::before{
    content:attr(data-label);
    flex:none;
    text-align:left;
    font-size:9px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--muted);
  }
}

/* =========================================================
   4) Fim dos ajustes do checklist de auditoria.
   ========================================================= */