@charset "UTF-8";

/* Nowoczesny naglowek i menu - tylko desktop */
    @media only screen and (min-width:1024px) {
      .OpisNaglowek {
        display:block !important;
      }
      .SklepNaglowek {
        background:#ffffff;
        border-bottom:1px solid #edf0f3;
        box-shadow:0 8px 28px rgba(20, 28, 40, 0.06);
      }
      .NaglowekTop {
        display:none;
      }
      .LogoSzukanieIkony {
        padding:16px 0 14px 0;
        background:#ffffff;
      }
      .LogoSzukanieIkony .Strona {
        width:calc(100% - 80px) !important;
        max-width:none;
        min-height:58px;
        align-items:center;
        gap:26px;
      }
      #LinkLogo {
        width:auto;
        min-width:118px;
        height:70px;
        display:flex;
        align-items:center;
        text-decoration:none;
      }
      #LinkLogo img.RwdKomputer {
        display:block !important;
        width:70px !important;
        height:70px !important;
        object-fit:contain;
      }
      .Wyszukiwanie {
        width:34vw;
        max-width:460px;
        flex:0 1 460px;
        padding:0;
      }
      .Wyszukiwanie .KontenterWyszukiwania {
        position:relative;
      }
      .RamkaSzukania {
        position:relative;
        height:46px;
        border:1px solid #eceff3;
        border-radius:999px;
        background:#f8fafc;
        box-shadow:inset 0 1px 2px rgba(20, 28, 40, 0.04);
        overflow:hidden;
      }
      .RamkaSzukania::after {
        content:"";
        position:absolute;
        top:0;
        right:0;
        width:46px;
        height:46px;
        border-radius:999px;
        background:#ef2d38 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="none" stroke="%23ffffff" stroke-width="2.6" stroke-linecap="round" d="m20 20-4.6-4.6"/><circle cx="10.5" cy="10.5" r="6.5" fill="none" stroke="%23ffffff" stroke-width="2.6"/></svg>') no-repeat center center;
        background-size:21px 21px;
        pointer-events:none;
        z-index:2;
      }
      #InSzukaj {
        position:relative;
        z-index:1;
        height:46px;
        width:calc(100% - 64px);
        padding:0 18px 0 24px;
        color:#6a7280 !important;
        font-size:14px;
        line-height:46px;
      }
      #ButSzukaj {
        position:absolute;
        top:0;
        right:0;
        z-index:3;
        width:46px;
        height:46px;
        margin:0;
        padding:0;
        box-sizing:border-box;
        background:transparent;
        border-radius:999px;
        filter:none;
        opacity:0;
        cursor:pointer;
      }
      .Wyszukiwanie .WyszukiwanieZaawansowane {
        display:none;
      }
      .IkonyNawigacja {
        max-width:none;
        gap:22px;
        align-items:center;
        justify-content:flex-end;
      }
      .IkonyNawigacja div.IkonaNawigacjiMenu {
        margin-left:0;
      }
      .IkonyNawigacja .IkonaNawigacjiMenu .PozycjaIkonka {
        min-width:72px;
        min-height:42px;
        padding:0 0 0 32px;
        background-position:left center;
        background-size:25px 25px;
        display:flex;
        align-items:center;
        justify-content:flex-start;
      }
      .IkonyNawigacja .PozycjaOpisIkony {
        display:inline-block;
        font-size:13px;
        font-weight:700;
        color:#1f2937;
      }
      .IkonyNawigacja .PozycjaStrzalka {
        background:none;
        padding:0;
      }
      .IkonyNawigacja .IkonaNawigacjiMenu .IkonaNaglowek span.PozycjaIlosc {
        top:-4px;
        left:22px;
        min-width:18px;
        height:18px;
        line-height:18px;
        background:#ffc328;
        color:#1f2937;
      }
      .LogowanieNaglowek span.PozycjaIkonka {
        background-position:left center;
      }
      .KoszykNaglowek span.PozycjaIkonka {
        background-position:left center;
      }
      .GorneMenuTlo {
        padding:0 0 14px 0;
        background:#ffffff;
      }
      .GorneMenuTlo .Strona {
        width:min(calc(100% - 80px), 1740px) !important;
        max-width:1740px;
        margin:0 auto;
        background:#ffffff;
        border:1px solid #edf0f3;
        border-radius:0;
        box-shadow:0 8px 20px rgba(20, 28, 40, 0.04);
      }
      .GorneMenu {
        padding:9px clamp(12px, 1.25vw, 24px);
      }
      ul.GlowneGorneMenu {
        justify-content:center;
        gap:clamp(8px, 1.05vw, 22px);
        height:46px;
        overflow:visible;
      }
      ul.GlowneGorneMenu > li {
        display:flex;
        align-items:center;
        flex:0 0 auto;
        min-width:0;
      }
      ul.GlowneGorneMenu > li:first-child {
        display:none;
      }
      .GorneMenu div > a,
      .GorneMenu div > span {
        display:flex;
        align-items:center;
        justify-content:center;
        box-sizing:border-box;
        max-width:100%;
        min-width:0;
        height:44px;
        padding:0 3px;
        flex-direction:row;
        gap:5px;
        border-radius:999px;
        font-size:12px;
        font-weight:700;
        color:#303847;
        white-space:nowrap;
      }
      .GorneMenu div > a b,
      .GorneMenu div > span b {
        min-width:0;
      }
      .GorneMenu ul li i {
        flex:0 0 20px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        width:20px;
        height:20px;
        padding:0;
      }
      .GorneMenu ul li i img {
        max-width:20px !important;
        max-height:20px !important;
        transition:filter .2s ease, transform .2s ease;
      }
      .GorneMenu div > a[href*="artykuly-szkolne-c-139.html"]::before {
        content:"";
        display:inline-block;
        flex:0 0 20px;
        width:20px;
        height:20px;
        background:url("https://www.zabawkiewy.pl/images/artykuly-szkolne.svg") no-repeat center center / contain;
        transition:filter .2s ease, transform .2s ease;
      }
      .PozycjaRozwijanaMenu b {
        padding-right:18px;
      }
      .PozycjaRozwijanaMenu b::before {
        width:11px;
        height:11px;
        background-size:11px 11px;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > div > a {
        background:#ef2d38;
        color:#ffffff;
        padding:0 15px;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > div > a i {
        display:none;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > div > a b {
        font-size:0;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > div > a b::after {
        content:"Kategorie";
        font-size:14px;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > div > a b::before {
        filter:brightness(0) invert(1);
      }
      ul.GlowneGorneMenu li ul.MenuRozwijaneKolumny {
        top:calc(100% + 10px) !important;
        bottom:auto !important;
        transform-origin:left top !important;
        max-height:calc(100vh - 190px);
        overflow-y:auto;
        overflow-x:hidden;
        z-index:300;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > ul.MenuRozwijaneKolumny {
        left:0 !important;
        right:auto !important;
        width:min(1040px, calc(100vw - 80px)) !important;
        max-width:calc(100vw - 80px) !important;
      }
      ul.GlowneGorneMenu > li:hover > div > a,
      ul.GlowneGorneMenu > li:hover > div > span {
        background:#fff3f4;
        color:#ef2d38;
      }
      ul.GlowneGorneMenu > li:hover > div > a i img,
      ul.GlowneGorneMenu > li:hover > div > span i img {
        transform:translateY(-2px);
        filter:drop-shadow(0 4px 7px rgba(239,45,56,0.22)) drop-shadow(0 0 5px rgba(99,206,196,0.22));
      }
      ul.GlowneGorneMenu > li:hover > div > a[href*="artykuly-szkolne-c-139.html"]::before {
        transform:translateY(-2px);
        filter:drop-shadow(0 4px 7px rgba(239,45,56,0.20));
      }
      ul.GlowneGorneMenu > li:nth-child(2):hover > div > a {
        background:#df2530;
        color:#ffffff;
      }
    }
    @media only screen and (min-width:1024px) and (max-width:1399px) {
      .LogoSzukanieIkony .Strona,
      .GorneMenuTlo .Strona {
        width:calc(100% - 56px) !important;
      }
      #LinkLogo {
        min-width:108px;
      }
      .Wyszukiwanie {
        width:34vw;
        max-width:420px;
        flex-basis:420px;
      }
      .IkonyNawigacja {
        gap:14px;
      }
      .GorneMenu {
        padding:9px 14px;
      }
      ul.GlowneGorneMenu {
        gap:8px;
      }
      .GorneMenu div > a,
      .GorneMenu div > span {
        font-size:12px;
        gap:4px;
        padding-left:4px;
        padding-right:4px;
      }
      .GorneMenu ul li i {
        flex-basis:18px;
        width:18px;
        height:18px;
      }
      .GorneMenu ul li i img {
        max-width:18px !important;
        max-height:18px !important;
      }
      .GorneMenu div > a[href*="artykuly-szkolne-c-139.html"]::before {
        flex-basis:18px;
        width:18px;
        height:18px;
      }
      ul.GlowneGorneMenu > li > div > a[href$="promocje.html"] {
        min-width:112px;
        padding-left:14px;
        padding-right:14px;
        border-radius:10px;
        background:#ffbf0f;
        color:#3b2a00;
        box-shadow:0 5px 12px rgba(199, 139, 0, 0.18);
      }
      ul.GlowneGorneMenu > li > div > a[href$="promocje.html"] i img {
        filter:brightness(0) saturate(100%);
        opacity:.72;
      }
      ul.GlowneGorneMenu > li > div > a[href$="promocje.html"] b {
        color:#3b2a00 !important;
      }
      ul.GlowneGorneMenu > li:hover > div > a[href$="promocje.html"] {
        background:#f4b300;
        color:#2f2200;
      }
      ul.GlowneGorneMenu > li:hover > div > a[href$="promocje.html"] b {
        color:#2f2200 !important;
      }
    }
    @media only screen and (min-width:1024px) and (max-width:1240px) {
      .GorneMenuTlo .Strona {
        width:calc(100% - 32px) !important;
      }
      .GorneMenu {
        padding:9px 8px;
      }
      ul.GlowneGorneMenu {
        gap:4px;
      }
      ul.GlowneGorneMenu > li {
        flex-shrink:0;
      }
      .GorneMenu div > a,
      .GorneMenu div > span {
        font-size:12px;
        gap:3px;
        padding-left:2px;
        padding-right:2px;
      }
      .GorneMenu ul li i {
        flex-basis:17px;
        width:17px;
        height:17px;
      }
      .GorneMenu ul li i img {
        max-width:17px !important;
        max-height:17px !important;
      }
      .GorneMenu div > a[href*="artykuly-szkolne-c-139.html"]::before {
        flex-basis:17px;
        width:17px;
        height:17px;
      }
      .PozycjaRozwijanaMenu b {
        padding-right:13px;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > div > a {
        padding-left:13px;
        padding-right:13px;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > div > a b::after {
        font-size:13px;
      }
      ul.GlowneGorneMenu > li > div > a[href$="promocje.html"] {
        min-width:108px;
        padding-left:11px;
        padding-right:11px;
      }
    }
    @media only screen and (min-width:1241px) and (max-width:1599px) {
      .GorneMenuTlo .Strona {
        width:calc(100% - 32px) !important;
      }
      .GorneMenu {
        padding:9px 8px;
      }
      ul.GlowneGorneMenu {
        justify-content:space-between;
        gap:4px;
      }
      .GorneMenu ul.GlowneGorneMenu > li:not(:nth-child(2)):not(:last-child) i {
        display:none;
      }
      .GorneMenu div > a,
      .GorneMenu div > span {
        gap:3px;
        padding-left:2px;
        padding-right:2px;
        font-size:11px;
      }
      .GorneMenu div > a[href*="artykuly-szkolne-c-139.html"]::before {
        flex-basis:17px;
        width:17px;
        height:17px;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > div > a {
        padding-left:13px;
        padding-right:13px;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > div > a b::after {
        font-size:13px;
      }
      ul.GlowneGorneMenu > li > div > a[href$="promocje.html"] {
        min-width:104px;
        padding-left:10px;
        padding-right:10px;
        border-radius:10px;
        background:#ffbf0f;
        color:#3b2a00;
        font-size:11px;
        box-shadow:0 5px 12px rgba(199, 139, 0, 0.18);
      }
      ul.GlowneGorneMenu > li > div > a[href$="promocje.html"] b {
        color:#3b2a00 !important;
      }
    }
    @media only screen and (min-width:1024px) and (max-width:1160px) {
      .GorneMenu ul.GlowneGorneMenu > li:not(:nth-child(2)):not(:last-child) i {
        display:none;
      }
      .GorneMenu div > a[href*="artykuly-szkolne-c-139.html"]::before {
        display:none;
      }
      .GorneMenu div > a,
      .GorneMenu div > span {
        font-size:11px;
        padding-left:3px;
        padding-right:3px;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > div > a,
      ul.GlowneGorneMenu > li:last-child > div > a,
      ul.GlowneGorneMenu > li:last-child > div > span {
        padding-left:12px;
        padding-right:12px;
      }
      ul.GlowneGorneMenu > li:nth-child(2) > div > a b::after {
        font-size:12px;
      }
      ul.GlowneGorneMenu > li > div > a[href$="promocje.html"] {
        min-width:100px;
        padding-left:10px;
        padding-right:10px;
        font-size:11px;
      }
    }

    /* Keep every primary navigation item inside compact laptop viewports. */
    @media only screen and (min-width:1024px) and (max-width:1279px) {
      ul.GlowneGorneMenu {
        width:100%;
        gap:3px !important;
      }
      ul.GlowneGorneMenu > li {
        flex:1 1 0 !important;
        min-width:0 !important;
      }
      .GorneMenu ul.GlowneGorneMenu > li > div > a i,
      .GorneMenu ul.GlowneGorneMenu > li > div > span i,
      .GorneMenu div > a[href*="artykuly-szkolne-c-139.html"]::before {
        display:none !important;
      }
      .GorneMenu ul.GlowneGorneMenu > li > div > a,
      .GorneMenu ul.GlowneGorneMenu > li > div > span {
        width:100%;
        min-width:0 !important;
        padding-left:3px !important;
        padding-right:3px !important;
      }
      .GorneMenu ul.GlowneGorneMenu > li > div > a b,
      .GorneMenu ul.GlowneGorneMenu > li > div > span b {
        white-space:normal !important;
        text-align:center;
        line-height:1.15;
      }
      .GorneMenu .PozycjaRozwijanaMenu b {
        padding-right:12px !important;
      }
      .GorneMenu .PozycjaRozwijanaMenu b::before {
        top:calc(50% - 4px) !important;
        width:8px !important;
        height:8px !important;
        background-size:8px 8px !important;
      }
    }

/* Mobilny naglowek: male logo, widoczna wyszukiwarka, bez gornego paska */
    @media only screen and (max-width:1023px) {
      .GorneMenu div > a[href*="artykuly-szkolne-c-139.html"]::before {
        content:"";
        display:inline-block;
        flex:0 0 26px;
        width:26px;
        height:26px;
        margin-right:10px;
        background:url("https://www.zabawkiewy.pl/images/artykuly-szkolne.svg") no-repeat center center / contain;
      }
      .OpisNaglowek {
        display:none !important;
      }
      .LogoSzukanieIkony {
        padding:10px 0 12px 0;
      }
      .LogoSzukanieIkony .Strona {
        display:flex;
        flex-wrap:wrap;
        align-items:center;
        gap:10px 12px;
        width:calc(100% - 20px) !important;
      }
      #LinkLogo {
        order:1;
        display:flex !important;
        align-items:center;
        justify-content:flex-start;
        width:96px !important;
        height:60px !important;
        margin:0 !important;
        padding:0 !important;
        flex:0 0 96px;
      }
      #LinkLogo img.RwdMobilny {
        display:block !important;
        width:auto !important;
        height:auto !important;
        max-width:96px !important;
        max-height:60px !important;
        object-fit:contain;
      }
      #LinkLogo img.RwdKomputer {
        display:none !important;
      }
      .Wyszukiwanie {
        order:2;
        display:block !important;
        flex:1 1 calc(100% - 112px);
        min-width:0;
        width:auto !important;
        margin:0 !important;
        padding:0 !important;
      }
      .Wyszukiwanie .KontenterWyszukiwania {
        display:block;
        width:100%;
      }
      .RamkaSzukania {
        position:relative;
        display:flex;
        align-items:center;
        height:48px;
        border:1px solid #c9c9c9;
        border-radius:14px;
        background:#ffffff;
        overflow:hidden;
        box-sizing:border-box;
      }
      #InSzukaj {
        position:relative;
        z-index:1;
        width:calc(100% - 54px) !important;
        height:48px;
        padding:0 14px !important;
        border:0 !important;
        background:#ffffff !important;
        color:#444444 !important;
        font-size:15px;
        line-height:48px;
        box-sizing:border-box;
      }
      #ButSzukaj {
        position:absolute;
        top:0;
        right:0;
        z-index:2;
        width:54px !important;
        height:48px !important;
        margin:0 !important;
        padding:13px !important;
        border:0 !important;
        border-radius:0 14px 14px 0;
        background:#0b7fba !important;
        box-sizing:border-box;
        cursor:pointer;
      }
      .Wyszukiwanie .WyszukiwanieZaawansowane,
      .SzukajNaglowek {
        display:none !important;
      }
      .IkonyNawigacja {
        order:3;
        display:flex !important;
        align-items:center;
        justify-content:space-between;
        width:100% !important;
        min-height:52px;
        margin:6px 0 0 0 !important;
        padding:0 !important;
        gap:12px;
      }
      #IkonaWysuwaniaMenu {
        order:1;
      }
      .LogowanieNaglowek {
        order:2;
        width:auto !important;
        min-width:136px;
        margin-left:auto !important;
      }
      .LogowanieNaglowek .LogowanieMenuLabel {
        display:flex;
        align-items:center;
      }
      .LogowanieNaglowek span.PozycjaIkonka {
        display:flex !important;
        align-items:center;
        min-height:40px;
        padding-left:30px;
        background-position:left center;
        background-size:24px 24px;
      }
      .LogowanieNaglowek span.PozycjaOpisIkony {
        display:inline-flex !important;
        align-items:center;
        color:#444444;
        font-size:18px;
        font-weight:500;
        line-height:1.1;
        white-space:nowrap;
      }
      .LogowanieNaglowek span.PozycjaOpisIkony::before {
        content:"Zaloguj się";
      }
      .LogowanieNaglowek span.PozycjaOpisIkony {
        font-size:0;
      }
      .LogowanieNaglowek span.PozycjaOpisIkony::before {
        font-size:18px;
        white-space:nowrap;
      }
      #Koszyk {
        order:3;
        width:48px !important;
        height:48px !important;
        flex:0 0 48px;
      }
      #Koszyk .KoszykNaglowek {
        width:48px;
        height:48px;
      }
      #Koszyk .PozycjaIkonka {
        width:48px;
        height:48px;
        background-size:38px 38px;
        background-position:center center;
      }
      #Koszyk span.PozycjaIlosc {
        top:0;
        right:-2px;
      }
    }
