/* EcoForWorld KVKS v2.1 — mobile UI polish */

/* ---- Navigation icons (all widths) ---- */
.eco-nav-span{display:inline-grid;place-items:center}
.eco-nav-ic{width:22px;height:22px;display:block}
.eco-menu .eco-nav-ic{width:22px;height:22px}
.heritage-bottom-nav button .eco-nav-ic{width:23px;height:23px;margin-bottom:2px}

/* ---- Home order: today's mission comes right after the hero (all widths) ---- */
.heritage-dashboard{display:flex;flex-direction:column}
.heritage-dashboard>*{order:10}
.heritage-dashboard>.eco-hero{order:1}
.heritage-dashboard>#student-missions{order:2}
.heritage-dashboard>#eco-own-metrics{order:3}
.heritage-dashboard>#eco-rank-card{order:4}
.heritage-dashboard>#eco-my-achievements{order:5}
.heritage-dashboard>#student-impact{order:6}
.heritage-dashboard>#student-missions{margin-top:20px}
#eco-own-metrics{margin-top:20px!important}

/* ---- Settings card in Profil (all widths) ---- */
.eco-settings-card h2{margin-top:0}
.eco-settings-actions{display:grid;gap:10px}
.eco-settings-actions .eco-set-btn{width:100%;min-height:48px;justify-content:center;text-align:center;margin:0!important}
.eco-set-logout{color:#a2412a!important;border-color:#efc3ad!important}
body.heritage-dark .eco-set-logout{color:#ffb59c!important;border-color:#6b3a2c!important}
#eco-session-message,.eco-session-refresh{display:none!important}
#student-profile>.heritage-info-card{margin-top:20px!important}
#student-profile>.heritage-info-card:first-of-type{padding-bottom:26px}
.eco-settings-card .eco-about{margin:22px 0 0!important;padding-top:16px;border-top:1px solid var(--eco-line);text-align:center;font-size:12px!important;line-height:1.5!important;color:var(--eco-muted)}
.heritage-footer{display:none!important}
.app-shell{padding-bottom:calc(95px + env(safe-area-inset-bottom))}
@media(min-width:901px){.app-shell{padding-bottom:40px!important}}

/* ---- Status: single empty state ---- */
#eco-status-empty[data-v2]:not([hidden]){display:grid!important;justify-items:center;text-align:center;gap:10px;padding:22px 18px}
#eco-status-empty .eco-empty-art{width:84px;height:84px}
#eco-status-empty p{margin:0;line-height:1.6}
#eco-status-empty .eco-empty-btn{width:100%;max-width:320px;margin-top:6px}
#local-storage-status.eco-hide-default{display:none!important}

/* ---- Back button breathing room on flow screens (from v1.9.1) ---- */
.student-flow-card>button.secondary-button:first-child{display:inline-flex;align-items:center;margin:0 0 26px!important}

/* ---- Login page ---- */
.platform-auth>section{display:flex;flex-direction:column}
.platform-auth>section>details{order:20;margin:22px 0 0!important;padding-top:16px;border-top:1px solid var(--eco-line);font-size:13px;color:var(--eco-muted)}
.platform-auth>section>details summary{cursor:pointer;min-height:44px;display:flex;align-items:center}
.platform-auth>section>details .secondary-button{width:100%;min-height:46px}
.platform-auth a{color:#1f6b4f;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.platform-auth a:hover{text-decoration:underline}
.platform-auth .primary-button{min-height:48px}

@media(min-width:901px){.eco-short-title{display:none!important}}

/* ================= PHONES ================= */
@media(max-width:900px){
  /* Top bar: logo + short title only. Theme & logout live in Profil. */
  .eco-topbar.has-cobrand #eco-page-title{display:none}
  .eco-short-title{display:block;font-size:19px;font-weight:800;letter-spacing:-.4px;color:var(--eco-text);white-space:nowrap}
  .eco-topbar .eco-toolbar{display:none!important}
  .eco-topbar{height:68px!important}
  .eco-cobrand img{height:32px!important}

  /* Tap targets ≥44px */
  .primary-button,.secondary-button{min-height:46px}
  .efw-browser-back,.efw-browser-close{min-height:44px;min-width:44px;padding:0 16px}
  .efw-browser-filters{gap:8px;padding-right:28px;-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent);scroll-padding-left:16px}
  .efw-browser-filters button{min-height:44px;padding:0 16px;white-space:nowrap}
  .eco-actions,.preview-actions{gap:12px}
  .eco-actions>button{flex:1 1 140px}
  .eco-actions .secondary-button,.eco-actions .primary-button{min-height:46px!important;height:auto!important}

  /* Today's mission card */
  .heritage-section-heading{flex-direction:column;align-items:flex-start!important;gap:10px}
  .eco-mission-body{margin:14px 0 18px!important}
  .eco-mission-body:has(.eco-mission-symbol[data-sticker]){align-items:start!important}
  #student-mission-title{font-size:19px!important}

  /* Compact stats 3×2 */
  #eco-own-metrics{grid-template-columns:repeat(3,1fr)!important;gap:8px!important}
  #eco-own-metrics>div{padding:11px 12px!important;border-radius:14px}
  #eco-own-metrics strong{font-size:21px!important;margin-top:3px!important}
  #eco-own-metrics span{font-size:11px!important}

  /* Rank card stacks */
  .eco-rank-card{grid-template-columns:1fr!important;gap:12px!important;padding:18px!important}
  .eco-rank-pos{display:flex;align-items:baseline;gap:10px;text-align:left!important;min-width:0!important;padding:0 0 12px!important;border-right:0!important;border-bottom:1px solid rgba(223,255,175,.25)}
  .eco-rank-pos small{order:-1}
  .eco-rank-pos strong{font-size:34px!important}
  .eco-rank-text .eco-eyebrow{letter-spacing:.14em}
  .eco-rank-text h3{font-size:17px!important}
  .eco-rank-link{grid-column:1/-1;justify-content:center;display:flex;align-items:center;min-height:44px}

  /* Mission detail: sticker sits above the title, never on top of it */
  .efw-browser-detail-icon[data-sticker]{position:static!important;display:block;width:76px!important;height:76px!important;margin:12px 0 4px!important;transform:rotate(-4deg)!important}

  /* Achievements history rows */
  .platform-history{gap:14px}
  .platform-history b{display:inline-block;margin-top:6px}
}
@media(max-width:380px){
  #eco-own-metrics strong{font-size:19px!important}
  .eco-short-title{font-size:17px}
}

/* Evidence thumbnails: the whole photo is the tap target */
.platform-history>div:first-child>a{display:block;line-height:0;border-radius:14px}