/* BACK-NAVIGATION-351: jedinstveni izgled i čitljivost svih STVARNIH natrag kontrola.
   Primjenjuje se isključivo na .arena-back351 (dodaje se uz postojeće kontekstne klase).
   Ne dira: klizače, karusele, next/previous kontrole, otvaranje/zatvaranje panela.
   Učitava se POSLJEDNJI u <head> svakog renderera i svih samostalnih dokumenata. */

html body .arena-back351.arena-back351 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    /* kontrola se nikad ne smije skupiti (smanjiti) u uskom flex/grid retku zaglavlja */
    flex: 0 0 auto !important;
    gap: 6px !important;
    box-sizing: border-box !important;

    /* kvadratne kontrole pretvorene u horizontalne oznake sa tekstom */
    width: auto !important;
    /* max-content = nikad uže od sadržaja (ikona + natpis); uz min-height 44px
       time i dalje ostvaruje cilj dodira veći od 44x44 */
    min-width: max-content !important;
    max-width: none !important;
    height: auto !important;
    min-height: 44px !important;
    padding: 0 12px !important;

    white-space: nowrap !important;
    text-decoration: none !important;
    text-align: center !important;
    cursor: pointer;
}

/* Skriveno stanje ostaje skriveno. Gornji display:inline-flex !important inače bi
   otkrio skrivene statefulne kontrole (npr. data-clock-return) koje JS vrti
   hidden atributom. Ovdje se [hidden] vraća na display:none bez ijednog drugog
   utjecaja na vidljive kontrole. */
html body .arena-back351.arena-back351[hidden] {
    display: none !important;
}

/* ikona: canonical assets/icons/robo-arena/back.svg, uvijek 28px */
html body .arena-back351.arena-back351 > img,
html body .arena-back351.arena-back351 > svg {
    display: block !important;
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    object-fit: contain !important;
}

/* vidljiva kratka oznaka (standardno "Natrag"), 14px podebljano */
html body .arena-back351.arena-back351 > span {
    display: block !important;
    flex: 0 0 auto !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: normal;
    white-space: nowrap !important;
}

/* Tekstualni natrag natpis koji se prikazuje umjesto prazne slike */
html body .arena-back351.arena-back351 .arena-back351__label {
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

/* Konteksti koji su kvadratni gumbi: poništava samo širinu/visinu/padding na ovoj klasi.
   Boje, pozicija, border i hover ostaju kako ih je zadao kontekst. */
html body :is(
    .results-back,
    .lb326-back,
    .tasks304-back,
    .mail310-back,
    .class316-back,
    .dashboard-back,
    .reward321-back,
    .rewards-back,
    .teacher-management-back,
    .devices315-back,
    .inbox308-back,
    .clock337-back,
    .p347-icon,
    .install318-back,
    .install-reference-back,
    .parent-forgot-back,
    .parent-verify-back,
    .parent-login-v2-back,
    .parent-register-v2-back,
    .teacher-signin-reference-back,
    .teacher-register-reference-back,
    .child-id-back,
    .foundation-back,
    .trainer-back,
    .ra-game-back,
    .switch-back,
    .t329-back,
    .d335-back,
    .pc347-back,
    .back
).arena-back351.arena-back351 {
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    height: auto !important;
    min-height: 44px !important;
    padding: 0 12px !important;
}

/* zaglavlja s fiksnim pozicioniranjem: oznaka ostaje uz strelicu, ne preklapa sadržaj */
html body .arena-back351.arena-back351 > img + span,
html body .arena-back351.arena-back351 > svg + span {
    align-self: center !important;
}

/* === IZMJERENO 2026-10-08: tri konkretna preklapanja koja generičko pravilo nije
   moglo popraviti jer ih kontekstni stilovi pobjeđuju specifičnošću. ===

   1) /play.php – body.palace-setup-318 #game-setup .trainer-back (1,2,1 !important)
      držao je kvadrat 46x46 s overflow:hidden, pa je natpis "Natrag" rezan.
      Novi selektor (1,4,2) pobjeđuje; position/inset ostaju iz palace-setup-318
      (kontrola ostaje apsolutno pozicionirana), samo je mjerenje/visina/padding
      usklađeno s oznakom. */

/* ---------- 1) dječja priprema /play.php (palace-setup-318) ---------- */
html body.palace-setup-318 #game-setup .trainer-back.arena-back351.arena-back351 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    box-sizing: border-box !important;
    width: max-content !important;
    min-width: max-content !important;
    max-width: none !important;
    height: auto !important;
    min-height: 44px !important;
    padding: 0 10px !important;
    border-radius: 22px !important;
    overflow: visible !important;
    /* position / inset / background / border ostaju kako ih je zadao palace-setup-318 */
}

html body.palace-setup-318 #game-setup .trainer-back.arena-back351.arena-back351 > img,
html body.palace-setup-318 #game-setup .trainer-back.arena-back351.arena-back351 > svg {
    display: block !important;
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    object-fit: contain !important;
}

/* ---------- 2) /games.php?view=tasks – .tasks304-back u mreži zaglavlja ----------
   Prvi stupac mreže bio je 44px, pa je width:auto razvukao kontrolu na 44px i
   natpis je izlazio iz pilota. Kontrola sada sama određuje širinu, a zaglavlje
   dobiva stupac od 100px; logo (92/90/112px) i zvono od 44px ostaju na svojim
   mjestima i ne dodiruju se ni na 360px (100 + 12 + 1fr + 12 + 44 = 332px). */
html body .tasks304 .tasks304-header > .tasks304-back.arena-back351.arena-back351 {
    min-width: max-content !important;
    justify-self: start !important;
    flex: none !important;
}

html body .tasks304 .tasks304-header {
    grid-template-columns: 100px 112px 1fr 48px;
}

@media (max-width: 900px) {
    html body .tasks304 .tasks304-header {
        grid-template-columns: 100px 90px 1fr 44px;
    }
}

@media (max-width: 600px) {
    html body .tasks304 .tasks304-header {
        grid-template-columns: 100px 1fr 44px;
    }
}

/* ---------- 3) Nastavničko zaglavlje (.teacher-app-header) ----------
   Zaglavlje je tamnoplavo, a .arena-back-button je transparentan i nasljeđuje
   tamnu boju teksta -> nečitljivo. Kontrola dobije bijelu pilotu s tamnoplavim
   tekstom, polumjer 22px i min-visinu 44px. Pozicija (absolute/top/left/z-index)
   ostaje kako ju je zadao nastavnički kontekst. */
html body .teacher-app-header > .arena-back351.arena-back351 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    gap: 6px !important;
    box-sizing: border-box !important;
    width: max-content !important;
    min-width: max-content !important;
    max-width: none !important;
    height: auto !important;
    min-height: 44px !important;
    padding: 0 12px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 22px !important;
    background: #fff !important;
    background-image: none !important;
    box-shadow: 0 6px 18px rgba(4, 26, 82, .24) !important;
    color: #0d3c91 !important;
}

html body .teacher-app-header > .arena-back351.arena-back351:hover,
html body .teacher-app-header > .arena-back351.arena-back351:active {
    background: #fff !important;
    background-image: none !important;
}

html body .teacher-app-header > .arena-back351.arena-back351 > span {
    color: #0d3c91 !important;
}

html body .teacher-app-header > .arena-back351.arena-back351 > img,
html body .teacher-app-header > .arena-back351.arena-back351 > svg {
    display: block !important;
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    object-fit: contain !important;
}

/* Uski zasloni (360px i manje): kontrola ostaje >= 44px i tekst se ne skriva */
@media (max-width: 420px) {
    html body .arena-back351.arena-back351 {
        min-height: 44px !important;
        /* ostaje max-content (ne 44px) inače bi se na malim zaslonima ponovno
           ukrilao natpis; cilj > 44px i dalje vrijedi preko min-height + sadržaja */
        min-width: max-content !important;
        padding: 0 10px !important;
        gap: 6px !important;
    }

    html body .arena-back351.arena-back351 > img,
    html body .arena-back351.arena-back351 > svg {
        width: 28px !important;
        height: 28px !important;
    }

    html body .arena-back351.arena-back351 > span {
        font-size: 14px !important;
        white-space: nowrap !important;
    }
}

/* BACK-364: jedna vidljiva strelica na svim stvarnim kontrolama povratka.
   Tekst ostaje dostupan čitačima zaslona i postojeći selektori/odredišta ostaju. */
html body .arena-back351.arena-back351,
html body .arena-back351.arena-back351.arena-back351,
html body .teacher-app-header > .arena-back351.arena-back351,
html body.palace-setup-318 #game-setup .trainer-back.arena-back351.arena-back351 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 !important;
    gap: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #fff !important;
    background-image: none !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    box-shadow: 0 2px 9px rgba(11, 42, 74, .18) !important;
    text-indent: 0 !important;
    font-size: 0 !important;
}
html body .arena-back351.arena-back351[hidden] { display: none !important; }
html body .arena-back351.arena-back351 > img,
html body .arena-back351.arena-back351 > svg {
    display: block !important;
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    margin: 0 !important;
    object-fit: contain !important;
}
html body .arena-back351.arena-back351 > span,
html body .arena-back351.arena-back351 .arena-back351__label {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}
html body .tasks304 .tasks304-header { grid-template-columns: 44px 1fr 44px !important; }
/* Sporedni dječji prikazi imaju povratak i ime profila; logotip se zadržava u Mojoj areni. */
html body .ra-secondary-topbar .ra-secondary-logo-link { display: none !important; }
html body .ra-secondary-topbar { flex-wrap: nowrap !important; justify-content: space-between !important; }
html body .ra-secondary-topbar .ra-secondary-player { margin-left: auto !important; }
html body .foundation-back.arena-back351.arena-back351,
html body #game-screen .ra-game-back.arena-back351.arena-back351 {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 !important;
}
html body.space-parity-page .foundation-header > a.foundation-back.arena-back-button.arena-back351,
html body.ra-game-page.blue-game-305 #game-root #game-screen .ra-game-back.arena-back351.arena-back351,
html body.ra-game-page.blue-game-305 #game-root[data-world-key]:not([data-world-key=""]) #game-screen:not([hidden]) .ra-game-back.arena-back351 {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 !important;
}
/* PARENT-SIGNIN-365: Keep the full family illustration below the logo. */
html body.parent-login-v2-page .parent-login-v2-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: auto !important;
    min-height: 0 !important;
    padding: 46px 16px 0;
}
html body.parent-login-v2-page .parent-login-v2-logo {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: min(36cqi, 330px) !important;
    height: auto !important;
    max-width: 100% !important;
    transform: none !important;
    object-fit: contain !important;
}
html body.parent-login-v2-page .parent-login-v2-characters {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: min(63cqi, 520px) !important;
    max-width: 100% !important;
    height: auto !important;
    margin-top: -35px;
}
html body.parent-login-v2-page .parent-login-v2-panel { margin-top: -48px !important; }
@media (max-width: 560px) {
    html body.parent-login-v2-page .parent-login-v2-hero { padding-top: 55px; }
    html body.parent-login-v2-page .parent-login-v2-logo { width: min(53cqi, 205px) !important; }
    html body.parent-login-v2-page .parent-login-v2-characters { width: min(73cqi, 285px) !important; margin-top: -12px; }
    html body.parent-login-v2-page .parent-login-v2-panel { margin-top: -23px !important; }
}