/*
 * AptOn — responsividade global da área pública
 * Versão: 1.1.0 (AptOn v2.33.0 RC1h-HF10i-MOBILE-FINAL-UX1)
 * Requisitos: R58–R67
 * Finalidade: manter uma única implementação funcional por tela e adaptar somente a apresentação
 * entre desktop, tablet e mobile. Não contém regras de negócio nem depende de detecção server-side de dispositivo.
 */

/* Regras seguras e compartilhadas. */
.apton-public img,.apton-auth img{max-width:100%}
.apton-public .apton-footer-links,.apton-auth .footer-auth-links{align-items:center}
.apton-public .container{min-width:0}
.apton-public .container>*{min-width:0}

/* -------------------------------------------------------------------------- */
/* Tablet e mobile — shell público unificado                                  */
/* -------------------------------------------------------------------------- */
@media(max-width:780px){
  .apton-public{overflow-x:hidden}
  .apton-public .apton-env-banner,.apton-auth .apton-env-banner{
    padding:7px 10px!important;
    font-size:10px!important;
    line-height:1.15!important;
    letter-spacing:.025em!important;
  }

  .apton-public .header-publico{
    position:sticky;
    top:0;
    z-index:40;
    display:grid;
    grid-template-columns:minmax(0,1fr);
    align-items:center;
    gap:7px;
    padding:8px 12px;
  }
  .apton-public .header-brand-zone{
    width:auto;
    min-width:0;
    display:flex;
    align-items:center;
    flex-wrap:nowrap;
    gap:7px;
  }
  .apton-public .apton-platform-brand{gap:.48rem;min-width:0}
  .apton-public .apton-platform-brand .apton-mark{width:34px;height:29px}
  .apton-public .apton-platform-brand .apton-wordmark{width:94px;max-width:29vw}
  .apton-public .apton-platform-brand .apton-brand-copy small{display:none}
  .apton-public .header-platform-tagline{display:none}
  .apton-public .apton-brand-divider{display:none}
  .apton-public .apton-sponsor-brand{width:auto;min-width:0;padding:0;margin-left:2px}
  .apton-public .apton-sponsor-logo-shell{width:62px;height:32px;padding:4px 6px;border-radius:8px}
  .apton-public .apton-sponsor-copy{display:none}

  .apton-public .nav-links{
    width:100%;
    min-width:0;
    max-width:100%;
    margin-left:0;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    flex-wrap:nowrap;
    gap:6px;
    overflow-x:auto;
    overflow-y:visible;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .apton-public .nav-links::-webkit-scrollbar{display:none}
  .apton-public .nav-links>a:first-child{display:none}
  .apton-public .nav-links>a{
    white-space:nowrap;
    font-size:.80rem;
    line-height:1.15;
  }
  .apton-public .nav-links>a.accent{
    min-height:38px;
    display:inline-flex;
    align-items:center;
    padding:7px 10px;
    border:1px solid #c9dcea;
    border-radius:9px;
    background:#fff;
  }
  .apton-public .nav-user{width:auto;font-size:.78rem}
  .apton-public .user-menu summary{font-size:.78rem;white-space:nowrap}
  .apton-public .user-menu-box{position:fixed;left:10px;right:10px;top:auto;bottom:max(12px,env(safe-area-inset-bottom));min-width:0;max-height:72dvh;overflow:auto}

  .apton-public .container{
    width:100%;
    max-width:none;
    margin:18px auto 0;
    padding:0 12px;
  }
  .apton-public .footer-publico{
    margin-top:30px;
    padding:18px 14px calc(92px + env(safe-area-inset-bottom));
    font-size:.78rem;
    line-height:1.35;
  }
  .apton-public .footer-publico .apton-footer-brand{gap:.4rem}
  .apton-public .footer-publico .apton-footer-brand img{height:20px}
  .apton-public .footer-publico .apton-footer-copy{gap:.3rem}
  .apton-public .footer-publico .apton-footer-copy .apton-footer-sep{display:none}
  .apton-public .footer-publico .apton-footer-copy span:not(.apton-footer-sep){width:100%}
  .apton-public .apton-footer-links{gap:8px!important;margin-top:8px!important}
  .apton-public .apton-footer-links a{font-size:.78rem}

  /* R58/R67 — conteúdo público nunca cria largura maior que a viewport. */
  .apton-public .container table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .apton-public .container pre,.apton-public .container code{max-width:100%;overflow-wrap:anywhere}
  .apton-public .container input,.apton-public .container select,.apton-public .container textarea{max-width:100%}

  /* R62 — Home/Catálogo: mesma view, composição mobile. */
  .apton-public .catalog-intro{
    align-items:flex-start!important;
    margin-bottom:18px!important;
    gap:10px!important;
  }
  .apton-public .catalog-intro-copy{width:100%}
  .apton-public .catalog-intro h1{margin-bottom:4px!important}
  .apton-public .catalog-intro-text{
    font-size:.89rem;
    line-height:1.42!important;
    max-width:44rem;
  }
  .apton-public .catalog-all-courses{width:100%;text-align:center;padding:9px 12px!important}
  .apton-public .catalog-section-title{margin-bottom:10px!important}
  .apton-public .catalog-filter{
    padding:14px!important;
    border-radius:12px!important;
    gap:9px!important;
    margin-bottom:16px!important;
    align-items:stretch!important;
  }
  .apton-public .catalog-search-field{min-width:0!important;width:100%}
  .apton-public .catalog-search-field label{margin-bottom:5px!important}
  .apton-public .catalog-search-field input{padding:10px 12px!important;border-radius:8px!important}
  .apton-public .catalog-filter-check{
    width:100%;
    min-height:38px!important;
    font-size:.82rem!important;
    gap:7px!important;
  }
  .apton-public .catalog-filter-check input{width:17px!important;height:17px!important;flex:0 0 auto}
  .apton-public .catalog-grid{grid-template-columns:1fr!important;gap:14px!important}
  .apton-public .catalog-card{
    padding:16px!important;
    border-radius:12px!important;
    box-shadow:0 4px 16px rgba(20,50,75,.055)!important;
  }
  .apton-public .catalog-card-top{align-items:flex-start!important;gap:8px!important;margin-bottom:8px!important}
  .apton-public .catalog-card-badges{gap:5px!important;min-width:0}
  .apton-public .catalog-badge{padding:3px 7px!important;font-size:.70rem!important;line-height:1.18!important}
  .apton-public .catalog-card-logo{width:70px!important;height:34px!important;padding:4px 6px!important;flex:0 0 70px}
  .apton-public .catalog-card-title{margin:7px 0 6px!important;font-size:1.08rem!important;line-height:1.28!important}
  .apton-public .catalog-card-description{
    margin:0!important;
    font-size:.86rem;
    line-height:1.45!important;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .apton-public .catalog-card-meta{
    margin:12px 0!important;
    padding:10px!important;
    font-size:.82rem;
    line-height:1.5!important;
  }
  .apton-public .catalog-card-action{
    min-height:42px;
    display:flex!important;
    align-items:center;
    justify-content:center;
    padding:10px 12px!important;
    border-radius:8px!important;
    font-size:.86rem;
  }
  .apton-public .catalog-empty{padding:24px 12px!important}

  /* R60 — Validação pública compacta, mantendo exatamente os mesmos dados. */
  .apton-public .public-validation{
    max-width:none!important;
    padding:18px!important;
    border-radius:12px!important;
    border-top-width:4px!important;
    box-shadow:0 4px 16px rgba(15,23,42,.065)!important;
  }
  .apton-public .public-validation-head{margin-bottom:15px!important}
  .apton-public .public-validation-head>div:first-child{font-size:.72rem;letter-spacing:.055em!important}
  .apton-public .public-validation-head h1{margin:5px 0 4px!important}
  .apton-public .public-validation-head p{font-size:.84rem;line-height:1.42!important}
  .apton-public .public-validation-form{margin:16px 0!important;display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .apton-public .public-validation-code{min-width:0!important;width:100%!important;padding:10px 12px!important}
  .apton-public .public-validation-submit{width:100%;min-height:42px!important;padding:9px 12px!important}
  .apton-public .public-validation-result{padding:16px!important;border-radius:8px!important}
  .apton-public .public-validation-result h2{margin-bottom:12px!important}
  .apton-public .public-validation-grid{grid-template-columns:1fr!important;gap:2px!important;font-size:.84rem}
  .apton-public .public-validation-grid>strong{margin-top:8px;color:#31465a}
  .apton-public .public-validation-grid>strong:first-child{margin-top:0}
  .apton-public .public-validation-grid>span{padding-bottom:4px;overflow-wrap:anywhere}
  .apton-public .public-validation-signatures{padding:15px!important;margin-top:12px!important}
  .apton-public .public-validation-signatures h2{margin-bottom:9px!important}
  .apton-public .public-validation-signature{padding:9px 10px!important;font-size:.82rem;line-height:1.42}
  .apton-public .public-validation-signatures>p{font-size:.78rem;line-height:1.4!important}

  /* R61/R63 — páginas institucionais compartilham a mesma densidade mobile. */
  .apton-public .apton-info{max-width:none}
  .apton-public .apton-info-hero{padding:17px 15px!important;margin-bottom:12px!important;border-radius:12px!important}
  .apton-public .apton-info-hero h1{margin-bottom:6px!important}
  .apton-public .apton-info-hero p{font-size:.86rem;line-height:1.48!important}
  .apton-public .apton-info-grid{grid-template-columns:1fr!important;gap:10px!important}
  .apton-public .apton-info-card,.apton-public .apton-info-section{padding:15px!important;border-radius:12px!important}
  .apton-public .apton-info-section{margin:10px 0!important}
  .apton-public .apton-info-card p,.apton-public .apton-info-card li,.apton-public .apton-info-section p,.apton-public .apton-info-section li{font-size:.85rem;line-height:1.52!important}
  .apton-public .apton-info-actions{display:grid!important;grid-template-columns:1fr!important;gap:7px!important;margin-top:12px!important}
  .apton-public .apton-info-btn{width:100%;min-height:42px!important;padding:9px 12px!important}
  .apton-public .apton-info-toc{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
  .apton-public .apton-info-toc a{white-space:nowrap;flex:0 0 auto;padding:6px 9px!important;font-size:.78rem!important}

  /* Detalhes de evento — mesma view pública com densidade adequada. */
  .apton-public .event-shell{max-width:none!important}
  .apton-public .event-card{padding:17px!important;border-radius:10px!important}
  .apton-public .event-top{align-items:flex-start!important;gap:9px!important}
  .apton-public .event-title{margin:12px 0 6px!important}
  .apton-public .event-description{font-size:.86rem;line-height:1.5!important}
  .apton-public .event-grid{grid-template-columns:1fr!important;gap:10px!important;padding:13px!important;margin:15px 0!important;font-size:.84rem}
  .apton-public .event-card .action{width:100%;text-align:center;margin-top:7px;padding:11px 13px!important}
  .apton-public .event-card .info,.apton-public .event-card .flash{padding:12px!important;margin:12px 0!important;font-size:.84rem}

  /* R65 — autenticação mantém mesma função e recebe apenas ajustes de composição. */
  .apton-auth{padding-left:10px!important;padding-right:10px!important}
  .apton-auth .auth-shell{max-width:410px}
  .apton-auth .auth-wrapper{box-shadow:0 8px 28px rgba(20,50,75,.095)}
}

/* Telefones estreitos. */
@media(max-width:420px){
  .apton-public .header-publico{padding-left:10px;padding-right:10px}
  .apton-public .apton-platform-brand .apton-mark{width:31px;height:27px}
  .apton-public .apton-platform-brand .apton-wordmark{width:88px}
  .apton-public .nav-links>a.accent{padding:7px 8px;font-size:.76rem}
  .apton-public .container{padding-left:10px;padding-right:10px;margin-top:14px}
  .apton-public .catalog-card{padding:14px!important}
  .apton-public .catalog-card-logo{width:64px!important;flex-basis:64px;height:32px!important}
  .apton-public .public-validation{padding:15px!important}
}

/* 320–359 px: prioridade absoluta para conteúdo e ações essenciais. */
@media(max-width:359px){
  .apton-public .apton-platform-brand .apton-mark{display:none}
  .apton-public .apton-platform-brand .apton-wordmark{width:84px;max-width:none}
  .apton-public .nav-links>a.accent{font-size:.72rem;padding:7px}
  .apton-public .catalog-card-top{display:grid!important;grid-template-columns:1fr auto}
  .apton-public .catalog-badge{font-size:.67rem!important}
}


/* MOBILE-FULL-NAV1 / MOBILE-FULL-ACTIONS1 — Minha Área Web no celular. */
.personal-mobile-bar{display:none}
@media(max-width:900px){
  .apton-public .personal-sidebar{display:none!important}
  .apton-public .personal-main{min-width:0}
  .apton-public .personal-topbar{display:none!important}
  .apton-public .personal-mobile-bar{position:sticky;top:0;z-index:72;display:flex;align-items:center;gap:8px;min-height:58px;padding:8px max(12px,env(safe-area-inset-left)) 8px max(12px,env(safe-area-inset-right));background:rgba(255,255,255,.98);border-bottom:1px solid #dce6ef;box-shadow:0 3px 14px rgba(20,50,75,.05);backdrop-filter:blur(10px)}
  .apton-public .personal-mobile-brand{order:1;display:inline-flex;align-items:center;gap:8px;min-width:0;color:#17324d;text-decoration:none}
  .apton-public .personal-mobile-brand img{width:34px;height:29px;object-fit:contain;flex:0 0 auto}
  .apton-public .personal-mobile-brand span{display:grid;min-width:0;line-height:1.08}
  .apton-public .personal-mobile-brand strong{font-size:.9rem;color:#17324d}
  .apton-public .personal-mobile-brand small{margin-top:2px;font-size:.62rem;font-weight:850;letter-spacing:.045em;text-transform:uppercase;color:#718398}
  .apton-public .personal-mobile-menu{order:3;position:relative;flex:0 0 auto}
  .apton-public .personal-mobile-menu>summary{list-style:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:42px;min-height:42px;padding:8px 10px;border:1px solid #cbd8e2;border-radius:11px;background:#fff;color:#17324d;font-weight:850;cursor:pointer}
  .apton-public .personal-mobile-menu>summary::-webkit-details-marker{display:none}
  .apton-public .personal-mobile-menu-label{font-size:.76rem}
  .apton-public .personal-mobile-menu-box{position:absolute;right:0;top:calc(100% + 8px);width:min(90vw,360px);max-height:calc(100dvh - 86px - env(safe-area-inset-bottom));overflow:auto;padding:10px;border:1px solid #dce6ef;border-radius:14px;background:#fff;box-shadow:0 18px 46px rgba(15,23,42,.18)}
  .apton-public .personal-mobile-user{padding:9px 10px 11px;border-bottom:1px solid #edf2f6;color:#607386;font-size:.78rem}
  .apton-public .personal-mobile-menu-box nav{display:grid;gap:2px;padding-top:7px}
  .apton-public .personal-mobile-menu-box nav>span{margin:9px 8px 4px;color:#91a2b3;font-size:.64rem;font-weight:900;letter-spacing:.045em;text-transform:uppercase}
  .apton-public .personal-mobile-menu-box nav>a{display:flex;align-items:center;min-height:40px;padding:8px 10px;border-radius:9px;color:#33485c;text-decoration:none;font-size:.84rem;font-weight:720;border-left:3px solid transparent}
  .apton-public .personal-mobile-menu-box nav>a.is-active{background:#f1f7fb;color:var(--crt-primary);border-left-color:var(--crt-secondary)}
  .apton-public .personal-mobile-menu-box nav>a.personal-mobile-mode-link{margin-top:7px;border:1px solid #cfe1ee;border-left:3px solid #0868b8;background:#f7fbfe;color:#0868b8}
  .apton-public .personal-mobile-menu-box nav>a.danger{color:#b42318}
  .apton-public .personal-content{padding:16px 14px}
  .apton-public .personal-content>:first-child{margin-top:0}
  .apton-public .personal-main>.footer-publico{padding-bottom:calc(24px + env(safe-area-inset-bottom))}
}
@media(max-width:420px){
  .apton-public .personal-mobile-menu-label{display:none}
  .apton-public .personal-mobile-menu>summary{width:42px;padding:8px}
}
