/* Ajustes para páginas HTML independentes, sem scripts. */
.main{
  width: min(1180px, calc(100% - 96px));
  margin: 0 auto;
  min-height: 55vh;
  padding: 44px 0 64px;
}
.site-header{
  padding-inline: max(32px, calc((100% - 1180px) / 2));
}
a{
  color: inherit;
}
.area-tabs a{
  display: flex;
  gap: 9px;
  align-items: center;
  padding: 16px 24px;
  text-decoration: none;
  font-size: 13px;
}
.area-tabs a.active{
  border-bottom: 3px solid #ec6a1c;
}
.primary-nav a{
  text-decoration: none;
  font-size: 12px;
  padding-block: 12px;
}
.workspace-nav a{
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 10px;
  text-decoration: none;
  font-size: 11px;
}
.workspace-nav a.active{
  background: #fff1e8;
  border-radius: 8px;
}
.workspace-nav .mobile-only{
  display: none !important;
}
.hero{
  grid-template-columns: 1fr;
  min-height: 0;
  padding-block: 26px 45px;
}
.hero h1{
  max-width: 780px;
}
.object-name{
  display: block;
  padding: 24px;
  min-height: 78px;
  text-decoration: none;
  font-size: 15px;
  font-weight: 500;
}
.object-name:hover{
  background: #fff1e8;
}
.card{
  transform: none;
}
.request-panel{
  max-width: 700px;
  margin-inline: auto;
}
.site-footer a{
  display: block;
  font-size: 12px;
  padding-block: 7px;
  text-decoration: none;
}
.site-footer .brand{
  padding: 0;
}
input, select, textarea{
  max-width: 100%;
}
@media (max-width: 900px){
  .main{
    width: calc(100% - 48px);
  }
  .site-header{
    flex-wrap: wrap;
    padding-inline: 24px;
  }
  .primary-nav{
    order: 3;
    width: 100%;
    justify-content: center;
  }
}
@media (max-width: 680px){
  .main{
    width: calc(100% - 40px);
    padding-block: 28px 40px;
  }
  .site-header{
    padding-inline: 20px;
    gap: 16px;
  }
  .primary-nav{
    display: flex;
    gap: 16px;
  }
  .primary-nav a{
    font-size: 10px;
  }
  .workspace-nav{
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    padding-inline: 20px;
    gap: 8px;
  }
  .workspace-nav a{
    flex-shrink: 0;
  }
  .header-actions .btn{
    font-size: 10px;
    padding: 10px 12px;
  }
  .grid{
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .object-name{
    min-height: 64px;
    padding: 20px;
  }
  .area-tabs a{
    flex: 1;
    justify-content: center;
    padding: 14px 10px;
  }
  .hero h1{
    font-size: 34px;
  }
  .site-footer{
    padding-inline: 20px;
  }
}

/* Navegação entre telas usando fragmentos de URL e CSS. */
.screen { display: none; }
.screen:target { display: block; }
.main:not(:has(> .screen:target)) > .screen-default { display: block; }
.screen { scroll-margin-top: 24px; }
body:has(#cadastro:target) nav a[href="#cadastro"] { color: #b8490c; font-weight: 600; }
body:has(#como-funciona:target) nav a[href="#como-funciona"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000125:target) nav a[href="#detail-AP-000125"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000126:target) nav a[href="#detail-AP-000126"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000127:target) nav a[href="#detail-AP-000127"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000128:target) nav a[href="#detail-AP-000128"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000129:target) nav a[href="#detail-AP-000129"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000130:target) nav a[href="#detail-AP-000130"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000131:target) nav a[href="#detail-AP-000131"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000132:target) nav a[href="#detail-AP-000132"] { color: #b8490c; font-weight: 600; }
body:has(#entrar:target) nav a[href="#entrar"] { color: #b8490c; font-weight: 600; }
body:has(#index:target) nav a[href="#index"] { color: #b8490c; font-weight: 600; }
body:has(#meus-registros:target) nav a[href="#meus-registros"] { color: #b8490c; font-weight: 600; }
body:has(#minha-conta:target) nav a[href="#minha-conta"] { color: #b8490c; font-weight: 600; }
body:has(#notificacoes:target) nav a[href="#notificacoes"] { color: #b8490c; font-weight: 600; }
body:has(#objetos:target) nav a[href="#objetos"] { color: #b8490c; font-weight: 600; }
body:has(#recuperar-acesso:target) nav a[href="#recuperar-acesso"] { color: #b8490c; font-weight: 600; }
body:has(#registrar-perda:target) nav a[href="#registrar-perda"] { color: #b8490c; font-weight: 600; }
body:has(#cadastrar-objeto:target) nav a[href="#cadastrar-objeto"] { color: #b8490c; font-weight: 600; }
body:has(#claim-SOL-001:target) nav a[href="#claim-SOL-001"] { color: #b8490c; font-weight: 600; }
body:has(#como-funciona:target) nav a[href="#como-funciona"] { color: #b8490c; font-weight: 600; }
body:has(#configuracoes:target) nav a[href="#configuracoes"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000125:target) nav a[href="#detail-AP-000125"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000126:target) nav a[href="#detail-AP-000126"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000127:target) nav a[href="#detail-AP-000127"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000128:target) nav a[href="#detail-AP-000128"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000129:target) nav a[href="#detail-AP-000129"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000130:target) nav a[href="#detail-AP-000130"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000131:target) nav a[href="#detail-AP-000131"] { color: #b8490c; font-weight: 600; }
body:has(#detail-AP-000132:target) nav a[href="#detail-AP-000132"] { color: #b8490c; font-weight: 600; }
body:has(#entrar:target) nav a[href="#entrar"] { color: #b8490c; font-weight: 600; }
body:has(#estoque:target) nav a[href="#estoque"] { color: #b8490c; font-weight: 600; }
body:has(#lossdetail-PER-001:target) nav a[href="#lossdetail-PER-001"] { color: #b8490c; font-weight: 600; }
body:has(#minha-conta:target) nav a[href="#minha-conta"] { color: #b8490c; font-weight: 600; }
body:has(#notificacoes:target) nav a[href="#notificacoes"] { color: #b8490c; font-weight: 600; }
body:has(#painel:target) nav a[href="#painel"] { color: #b8490c; font-weight: 600; }
body:has(#perdas:target) nav a[href="#perdas"] { color: #b8490c; font-weight: 600; }
body:has(#relatorios:target) nav a[href="#relatorios"] { color: #b8490c; font-weight: 600; }
body:has(#solicitacoes:target) nav a[href="#solicitacoes"] { color: #b8490c; font-weight: 600; }
body:has(#solicitar-AP-000125:target) nav a[href="#solicitar-AP-000125"] { color: #b8490c; font-weight: 600; }
body:has(#solicitar-AP-000126:target) nav a[href="#solicitar-AP-000126"] { color: #b8490c; font-weight: 600; }
body:has(#solicitar-AP-000127:target) nav a[href="#solicitar-AP-000127"] { color: #b8490c; font-weight: 600; }
body:has(#solicitar-AP-000128:target) nav a[href="#solicitar-AP-000128"] { color: #b8490c; font-weight: 600; }
body:has(#solicitar-AP-000129:target) nav a[href="#solicitar-AP-000129"] { color: #b8490c; font-weight: 600; }
body:has(#solicitar-AP-000130:target) nav a[href="#solicitar-AP-000130"] { color: #b8490c; font-weight: 600; }
body:has(#solicitar-AP-000131:target) nav a[href="#solicitar-AP-000131"] { color: #b8490c; font-weight: 600; }
body:has(#solicitar-AP-000132:target) nav a[href="#solicitar-AP-000132"] { color: #b8490c; font-weight: 600; }

/* Fotografias nas listagens administrativas. */
.inventory-photo {
  display: block;
  float: left;
  width: 60px;
  height: 76px;
  margin-right: 14px;
  border-radius: 8px;
  background: #f5f6f8;
}
.object-photo {
  display: block;
  width: 100%;
  height: 100%;
}