

:root{
    --back:#fff;
    --text:#1a1f24;
    --muted:#6b7280;
    --apnblue:#005397;
    --apngreen:#51B948;
    --apnorange:#f58021;
    --darkgrey:#2e2e2e;
    --hovergrey:rgba(168, 166, 166, 0.2);
    /* footer styles */
    --f-primary:#2c3e50;
    --f-secondary: #34495e;
    --f-accent: #3498db;
    --f-light:#ecf0f1;
    --f-success: #27ae60;
    --f-warning: #f39c12;
    --f-alert:#e74c3c;
    --f-text:#2c3e50;
    --f-text-light: #7f8c8d;
    --f-border:rgba(189, 195, 199, 0.5);
    --f-shadow: rgba(44,62,80,0.15);
    --f-transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    --footer-height: 80px;
}


footer{
  flex-shrink: 0;
  position: relative;
  text-align:left;
  padding:1rem;
  background: var(--f-light);
}


/* ============= DA FOOoTAR ===================*/

.site-footer{
  flex: 0 0 auto;
  display:flex;
  flex-shrink:0;
  position: sticky;
  z-index:1;
  width:100%; 
  background:var(--back); 
  box-shadow:0 -2px 16px rgba(0,0,0,0.08); 
  flex-wrap:wrap; 
  justify-content:center; 
  align-items:flex-start; 
  padding:10px 5vw 10px 5vw; 
  font-size:0.95rem;
  
}

/*mobile collapsible panel*/
.portal-footer{
  width:100%;
  max-width:1100px;
  background:var(--back);
  border-radius:12px 12px 0 0;
  box-shadow: 0 -4px 20px var(--f-shadow);
}

.footer-col{
  flex:1 1 120px;
  min-width:120px;
  margin-bottom:12px;
  display:flex;
  flex-direction: column;
  align-items: flex-start;
}

.footer-toggle{
  width:100%;
  padding: 8px 0px;
  background: none;
  border: none;
  color: #fff;
  display: flex;
  justify-content:space-between;
  align-items: center;
  cursor: pointer;
  user-select:none;

}


.footer-toggle .plus {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-left: 10px;
  position: relative;
  vertical-align: middle;
}





.toggle-title{
  font-weight:600;
  font-size:14px;
  display:flex;
  align-items: center;
  gap:8px;
}

.toggle-control{
  display: flex;
  align-items: center;
  gap: 12px;
}

.toggle-control .status{
  font-size:12px;
   opacity:.9;
}


/*.toggle-arrow{
  font-size:18px;
  transition:var(--f-transition);
}
  .toggle-arrow.open{
  transform:rotate(180deg);}
*/
  .footer-content{
  max-height:0; 
  overflow:hidden;
  transition:max-height .5s cubic-bezier(0,1,0,1);
  border-top:1px solid var(--f-border);
  background:#fff;
  }
  .footer-content.expanded{
  max-height: 70vh;
  transition:max-height .5s cubic-bezier(.25,.8,.25,1);
  overflow:auto;
  }

  /* Footer inner responsiveness */
  .footer-sections{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  padding:24px;
  }
  .footer-section{
  flex:1 1 220px;
  display:flex;
  flex-direction:column;
  align-items: flex-start;
  }

  .footer-logo {
  display:flex;
  align-items:flex-start;
  justify-content: center;
   padding:8px 0;
  }

  .footer-logo img{
  height:48px;
  width:auto;
  max-width:100%;
  object-fit: contain;
height: 200px;  }


  .section-title{
  font-size:14px; 
  font-weight:600; 
  color:var(--f-secondary);
  margin-bottom:15px; 
  position:relative; 
  display:flex; 
  align-items:center; 
  gap:8px;
  width: 100%;
  }
  .section-title::after{
  content:''; 
  position:absolute; 
  left:0; 
  bottom:-5px; 
  width:30px; 
  height:2px; 
  background:var(--f-accent);
  transition:var(--f-transition);
  }
  .footer-section:hover .section-title::after{ width:100%; }

  .section-links{ 
  display:flex; 
  flex-direction:column; 
  gap:10px; 
  list-style:none; 
  padding:0; 
  margin:0;
  width: 100%;
}

  .link-item{
  font-size:13px; 
  color:var(--f-text-light);
  text-decoration:none;
  display:flex; 
  align-items:center; 
  gap:8px;
  transition:var(--f-transition);
  }

  .link-item:hover{
  /* text-decoration:underline; */
  color:var(--f-accent); 
  transform:translateX(5px); }

  .badge{
  display:inline-flex; 
  align-items:center; 
  justify-content:center;
  border-radius:10px; 
  font-size:10px; 
  font-weight:500; 
  height:18px; 
  padding:0 6px; 
  margin-left:5px;
  color:#fff;
  }
  .badge.new{ 
  background-color:var(--f-success); 
  }
  .badge.updated{ 
  background-color:var(--f-warning); 
  }

  .footer-bottom{
  background:#f5f7fa;
  border-top:1px solid var(--f-border);
  padding:15px 24px;
  display:flex; 
  justify-content:space-between; 
  align-items:center;
  font-size:12px; 
  color:var(--f-text-light);
  }
  .footer-actions{ 
  display:flex; 
  align-items:center; 
  gap:15px; }

  .footer-social{
  display:flex; 
  align-items:center; 
  gap:10px;
  justify-content:center;
  flex-wrap:wrap;
  /*margin-top:5px;*/
  width:100%;
  height: 15%;
  }

  .footer-social a{
  color:var(--f-text-light);
  text-decoration:none;
  transition:var(--f-transition);
  text-align:center; 
   font-size:2.9em;
  }

  .footer-copyright{
  font-size:12px; 
  color:var(--f-text-light);
  width:100%; 
  text-align:center;
   margin-top:5px; 
   font-size:0.9em; 
   color:#444;
  }

  .action-button{
  background:none; 
  border:none; 
  color:var(--f-text-light); cursor:pointer;
  display:flex; 
  align-items:center; 
  gap:5px; 
  font-size:12px; 
  transition:var(--f-transition);
  }
  .action-button:hover{ 
  color:var(--f-accent); 
}

footer a {
  color: var(--f-text-light);
  text-decoration: none;
  transition: var(--f-transition);
}

footer a:hover {
  color: var(--f-accent); 
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}
/*=========== End of Footer ===========*/