
/* ================================================================
   EduCantina 3.4.2 — PWA Oficial do Portfólio
   Interface fiel ao mockup promocional aprovado.
   ================================================================ */
@media(max-width:900px){
 body.role-parent.action-portal{
   background:#F4F7FA!important;
   color:#10233A!important;
 }
 body.role-parent.action-portal .parent-app{
   background:#F4F7FA!important;
   min-height:100vh!important;
   padding-bottom:86px!important;
 }
 body.role-parent.action-portal .parent-shell{
   max-width:520px!important;
   margin:0 auto!important;
   padding:10px 12px 96px!important;
 }
 body.role-parent.action-portal .mobile-app-dashboard{
   display:block!important;
   background:transparent!important;
   padding:0!important;
 }
 body.role-parent.action-portal .mobile-app-dashboard.mobile-active{display:block!important}
 body.role-parent.action-portal .mobile-app-brand{
   display:flex!important;
   align-items:center!important;
   gap:9px!important;
   padding:4px 1px 15px!important;
 }
 body.role-parent.action-portal .mobile-app-brand:before{
   width:0!important;height:0!important;flex:0 0 0!important;background:none!important;
 }
 body.role-parent.action-portal .mobile-app-brand>div{
   display:flex!important;align-items:center!important;gap:9px!important;margin-right:auto!important;
 }
 body.role-parent.action-portal .mobile-app-brand>div:before{
   content:"";width:34px;height:34px;flex:0 0 34px;
   background:url("brand/educantina-symbol.svg") center/contain no-repeat;
 }
 body.role-parent.action-portal .mobile-app-brand b{
   font-size:13px!important;font-weight:800!important;color:#10233A!important;
 }
 body.role-parent.action-portal .mobile-app-brand small{
   display:block!important;font-size:7px!important;color:#7B8B9D!important;margin-top:2px!important;
 }
 body.role-parent.action-portal .mobile-app-brand>span{
   width:34px!important;height:34px!important;border-radius:50%!important;
   border:0!important;background:#fff!important;
   box-shadow:0 4px 14px rgba(18,59,99,.08)!important;
   display:grid!important;place-items:center!important;
 }

 body.role-parent.action-portal .mobile-welcome{
   display:block!important;
   padding:2px 2px 12px!important;
 }
 body.role-parent.action-portal .mobile-welcome strong{
   display:block!important;font-size:17px!important;line-height:1.2!important;
   color:#10233A!important;letter-spacing:-.025em!important;
 }
 body.role-parent.action-portal .mobile-welcome small{
   display:block!important;font-size:8px!important;color:#7C8C9D!important;margin-top:4px!important;
 }
 body.role-parent.action-portal .mobile-student{
   display:flex!important;align-items:center!important;gap:8px!important;
   background:#fff!important;border:1px solid #E4EBF1!important;border-radius:13px!important;
   padding:9px 10px!important;margin:0 0 11px!important;
   box-shadow:0 4px 14px rgba(18,59,99,.04)!important;
 }
 body.role-parent.action-portal .mobile-student .mobile-avatar{
   width:30px!important;height:30px!important;border-radius:50%!important;
 }
 body.role-parent.action-portal .mobile-student strong{font-size:9.5px!important}
 body.role-parent.action-portal .mobile-student small{font-size:6.8px!important}

 body.role-parent.action-portal .mobile-balance{
   display:grid!important;
   grid-template-columns:1fr auto!important;
   align-items:center!important;
   gap:12px!important;
   min-height:112px!important;
   padding:17px!important;
   margin-bottom:12px!important;
   border-radius:15px!important;
   background:#fff!important;
   color:#10233A!important;
   border:1px solid #E4EBF1!important;
   box-shadow:0 5px 18px rgba(18,59,99,.06)!important;
 }
 body.role-parent.action-portal .mobile-balance:before{
   content:"Saldo da carteira";
   display:block;
   grid-column:1;
   font-size:8px;
   color:#7B8B9D;
   align-self:end;
 }
 body.role-parent.action-portal .mobile-balance small{display:none!important}
 body.role-parent.action-portal .mobile-balance strong{
   grid-column:1;
   display:block!important;
   font-size:25px!important;
   line-height:1!important;
   color:#10233A!important;
   margin-top:-10px!important;
 }
 body.role-parent.action-portal .mobile-balance button{
   grid-column:1;
   justify-self:start;
   min-height:auto!important;
   padding:0!important;
   background:transparent!important;
   border:0!important;
   box-shadow:none!important;
   color:#1E6CFB!important;
   font-size:7.5px!important;
   margin-top:-8px!important;
 }
 body.role-parent.action-portal .mobile-balance:after{
   content:"";
   grid-column:2;
   grid-row:1/4;
   width:48px;height:48px;border-radius:14px;
   background:#EEF5FF url("brand/educantina-icon-96.png") center/33px no-repeat;
 }

 body.role-parent.action-portal .mobile-title{
   margin:13px 1px 9px!important;
 }
 body.role-parent.action-portal .mobile-title strong{
   font-size:11px!important;color:#10233A!important;
 }
 body.role-parent.action-portal .mobile-title small{
   font-size:7px!important;color:#8795A5!important;
 }

 body.role-parent.action-portal .mobile-actions{
   display:grid!important;
   grid-template-columns:repeat(3,1fr)!important;
   gap:9px!important;
   margin-bottom:14px!important;
 }
 body.role-parent.action-portal .mobile-actions button{
   min-height:92px!important;
   padding:12px 7px!important;
   border-radius:13px!important;
   display:flex!important;
   flex-direction:column!important;
   justify-content:center!important;
   align-items:center!important;
   gap:6px!important;
   border:1px solid #E4EBF1!important;
   box-shadow:0 5px 16px rgba(18,59,99,.045)!important;
 }
 body.role-parent.action-portal .mobile-actions button i{
   width:36px!important;height:36px!important;
   border-radius:10px!important;
   display:grid!important;place-items:center!important;
   font-style:normal!important;font-size:16px!important;
   background:rgba(255,255,255,.28)!important;
 }
 body.role-parent.action-portal .mobile-actions button b{
   font-size:8.5px!important;font-weight:800!important;
 }
 body.role-parent.action-portal .mobile-actions button span{
   display:none!important;
 }
 body.role-parent.action-portal .mobile-actions button:nth-child(1){
   background:linear-gradient(145deg,#2BC861,#16A748)!important;color:#fff!important;border-color:transparent!important;
 }
 body.role-parent.action-portal .mobile-actions button:nth-child(2){
   background:#EEF5FF!important;color:#1E6CFB!important;
 }
 body.role-parent.action-portal .mobile-actions button:nth-child(3){
   background:#F1EEFF!important;color:#7454D8!important;
 }
 body.role-parent.action-portal .mobile-actions button:nth-child(n+4){
   min-height:82px!important;background:#fff!important;color:#10233A!important;
 }
 body.role-parent.action-portal .mobile-actions button:nth-child(4) i{background:#E9F9EE!important;color:#18A747!important}
 body.role-parent.action-portal .mobile-actions button:nth-child(5) i{background:#EEF5FF!important;color:#1E6CFB!important}
 body.role-parent.action-portal .mobile-actions button:nth-child(6) i{background:#FFF5E5!important;color:#F59E0B!important}

 body.role-parent.action-portal .mobile-last-order{
   border:1px solid #E4EBF1!important;
   border-radius:14px!important;
   background:#fff!important;
   box-shadow:0 5px 16px rgba(18,59,99,.045)!important;
   padding:12px!important;
 }
 body.role-parent.action-portal .mobile-last-order strong{font-size:9px!important}
 body.role-parent.action-portal .mobile-last-order small{font-size:7px!important}
 body.role-parent.action-portal .mobile-last-order .status{font-size:6.6px!important}

 body.role-parent.action-portal .mobile-app-nav{
   position:fixed!important;
   left:50%!important;transform:translateX(-50%)!important;
   bottom:0!important;
   width:min(100%,520px)!important;
   height:70px!important;
   padding:7px 10px calc(7px + env(safe-area-inset-bottom))!important;
   display:grid!important;
   grid-template-columns:repeat(4,1fr)!important;
   background:rgba(255,255,255,.97)!important;
   border-top:1px solid #E4EBF1!important;
   box-shadow:0 -8px 24px rgba(18,59,99,.06)!important;
   backdrop-filter:blur(18px)!important;
   z-index:3000!important;
 }
 body.role-parent.action-portal .mobile-app-nav button{
   border:0!important;background:transparent!important;
   color:#718194!important;border-radius:10px!important;
   display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
   gap:3px!important;font-size:6.8px!important;
 }
 body.role-parent.action-portal .mobile-app-nav button i{
   font-size:16px!important;font-style:normal!important;
 }
 body.role-parent.action-portal .mobile-app-nav button.active{
   color:#1E6CFB!important;background:#EEF5FF!important;
 }

 body.role-parent.action-portal .mobile-screen-header{
   position:sticky!important;top:0!important;z-index:20!important;
   min-height:56px!important;
   padding:9px 2px!important;
   background:rgba(244,247,250,.96)!important;
   backdrop-filter:blur(16px)!important;
   border-bottom:0!important;
 }
 body.role-parent.action-portal .mobile-screen-header button{
   background:#fff!important;border:1px solid #E4EBF1!important;border-radius:10px!important;
   width:34px!important;height:34px!important;
 }
 body.role-parent.action-portal .mobile-screen-header h2{
   font-size:15px!important;color:#10233A!important;letter-spacing:-.025em!important;
 }
 body.role-parent.action-portal .mobile-screen-header small{
   font-size:7px!important;color:#7B8B9D!important;
 }
 body.role-parent.action-portal .app-view{
   background:transparent!important;
 }
 body.role-parent.action-portal .parent-card{
   border-radius:14px!important;
   box-shadow:0 5px 17px rgba(18,59,99,.045)!important;
 }
 body.role-parent.action-portal .parent-card-head{
   padding:13px 14px!important;
 }
 body.role-parent.action-portal .parent-card-body{
   padding:13px!important;
 }
 body.role-parent.action-portal .parent-order-row,
 body.role-parent.action-portal .purchase-item,
 body.role-parent.action-portal .charge-item{
   border-radius:12px!important;
   padding:11px!important;
   margin-bottom:8px!important;
 }
 body.role-parent.action-portal .parent-order-main strong,
 body.role-parent.action-portal .purchase-item strong{
   font-size:9px!important;
 }
 body.role-parent.action-portal .parent-order-main small,
 body.role-parent.action-portal .purchase-item small{
   font-size:7px!important;
 }

 body.role-parent.action-portal .menu-day-tabs,
 body.role-parent.action-portal .store-filter-tabs{
   display:flex!important;gap:6px!important;overflow:auto!important;
   padding-bottom:6px!important;
 }
 body.role-parent.action-portal .menu-day-tabs button,
 body.role-parent.action-portal .store-filter-tabs button{
   flex:0 0 auto!important;border-radius:8px!important;
   background:#fff!important;border:1px solid #DDE6EC!important;
   color:#647488!important;font-size:7.5px!important;padding:7px 10px!important;
 }
 body.role-parent.action-portal .menu-day-tabs button.active,
 body.role-parent.action-portal .store-filter-tabs button.active{
   background:#EEF5FF!important;border-color:#1E6CFB!important;color:#1E6CFB!important;
 }
 body.role-parent.action-portal .menu-product-card,
 body.role-parent.action-portal .store-product-card{
   display:grid!important;
   grid-template-columns:52px 1fr auto!important;
   gap:10px!important;
   align-items:center!important;
   border:0!important;border-bottom:1px solid #EDF2F6!important;
   border-radius:0!important;background:#fff!important;
   padding:11px 0!important;
   box-shadow:none!important;
 }
 body.role-parent.action-portal .menu-product-card img,
 body.role-parent.action-portal .store-product-card img{
   width:48px!important;height:48px!important;border-radius:12px!important;object-fit:cover!important;
 }
 body.role-parent.action-portal .menu-product-card h3,
 body.role-parent.action-portal .store-product-card h3{
   font-size:9.5px!important;margin:0 0 3px!important;
 }
 body.role-parent.action-portal .menu-product-card p,
 body.role-parent.action-portal .store-product-card p{
   font-size:7px!important;color:#7B8B9D!important;line-height:1.35!important;
 }
 body.role-parent.action-portal .menu-product-card .price,
 body.role-parent.action-portal .store-product-card .price{
   font-size:9px!important;font-weight:800!important;color:#10233A!important;
 }
}

/* Tela inicial instalada: largura e proporção semelhantes ao mockup */
@media(display-mode:standalone) and (max-width:900px){
 body.role-parent.action-portal .parent-shell{
   padding-top:max(12px,env(safe-area-inset-top))!important;
 }
 body.role-parent.action-portal .mobile-app-version{display:none!important}
}

/* Desktop mantém a versão institucional completa */
@media(min-width:901px){
 body.role-parent.action-portal .mobile-welcome{display:none!important}
}
