/*
  DRR DAMSON — MOBILE UX HOTFIX 26.05
  Cel: naprawa headera, logo, menu poziomego i pomocnika na telefonach.
  Bez ruszania logiki JS/PHP i bez zmiany desktopu.
*/

@media (max-width: 900px){
  html, body{
    overflow-x:hidden !important;
    max-width:100% !important;
  }

  .top-bar{display:none !important;}

  .container,
  header .container,
  nav .container,
  main .container{
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:12px !important;
    padding-right:12px !important;
    box-sizing:border-box !important;
  }

  .site-header-v2{
    padding:14px 0 12px !important;
    overflow:hidden !important;
    border-bottom:1px solid rgba(70,255,205,.12) !important;
  }

  .header-v2-inner{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
    align-items:center !important;
    justify-items:center !important;
    min-height:0 !important;
    padding:0 !important;
  }

  .header-v2-inner .brand,
  a.brand{
    width:100% !important;
    max-width:260px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    transform:none !important;
    position:relative !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    margin:0 auto !important;
    padding:0 !important;
    z-index:2 !important;
  }

  .header-v2-inner .brand img,
  a.brand img{
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    max-width:54px !important;
    object-fit:contain !important;
    position:static !important;
    transform:none !important;
    margin:0 !important;
  }

  .header-v2-inner .brand > div,
  a.brand > div{
    min-width:0 !important;
    max-width:170px !important;
    overflow:visible !important;
    text-align:left !important;
    flex:0 1 auto !important;
  }

  .header-v2-inner .brand span:first-child,
  a.brand span:first-child{
    font-size:25px !important;
    line-height:.94 !important;
    letter-spacing:.04em !important;
    white-space:nowrap !important;
  }

  .header-v2-inner .brand span:nth-child(2),
  a.brand span:nth-child(2){
    font-size:17px !important;
    line-height:1.02 !important;
    letter-spacing:.16em !important;
    white-space:nowrap !important;
  }

  .header-v2-inner .brand span:nth-child(3),
  a.brand span:nth-child(3){
    font-size:12px !important;
    letter-spacing:.08em !important;
    white-space:nowrap !important;
  }

  .user-actions{
    order:2 !important;
    width:100% !important;
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:10px !important;
    margin:0 !important;
    padding:0 !important;
    align-items:stretch !important;
    justify-content:center !important;
    position:relative !important;
    z-index:1 !important;
  }

  .user-actions .action-item{
    min-width:0 !important;
    width:100% !important;
    min-height:62px !important;
    padding:9px 8px !important;
    border-radius:24px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:5px !important;
    font-size:14px !important;
    line-height:1.05 !important;
    text-align:center !important;
    white-space:normal !important;
    overflow:hidden !important;
  }

  .user-actions .action-item i{
    font-size:18px !important;
    margin:0 !important;
  }

  .search-container{
    order:3 !important;
    width:100% !important;
    max-width:100% !important;
    margin:2px auto 0 !important;
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    position:relative !important;
    z-index:3 !important;
  }

  .search-input{
    width:100% !important;
    min-width:0 !important;
    height:56px !important;
    padding:0 70px 0 18px !important;
    font-size:16px !important;
    border-radius:24px !important;
  }

  .search-btn{
    width:52px !important;
    height:52px !important;
    min-width:52px !important;
    border-radius:22px !important;
    position:absolute !important;
    right:3px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:18px !important;
  }

  .main-nav-v2{
    overflow:hidden !important;
    padding:10px 0 12px !important;
    border-top:1px solid rgba(70,255,205,.08) !important;
    border-bottom:1px solid rgba(70,255,205,.12) !important;
  }

  .nav-v2-list,
  .nav-v2-list--rich,
  .main-nav-v2 ul{
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:10px !important;
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    scrollbar-width:none !important;
    scroll-snap-type:x proximity !important;
    padding:2px 12px 8px !important;
    margin:0 !important;
    list-style:none !important;
  }

  .nav-v2-list::-webkit-scrollbar,
  .nav-v2-list--rich::-webkit-scrollbar,
  .main-nav-v2 ul::-webkit-scrollbar{display:none !important;}

  .nav-v2-list li,
  .nav-v2-list--rich li,
  .main-nav-v2 li{
    flex:0 0 auto !important;
    scroll-snap-align:start !important;
    max-width:none !important;
  }

  .nav-v2-list a,
  .nav-v2-list--rich a,
  .main-nav-v2 a{
    min-height:48px !important;
    padding:12px 16px !important;
    border-radius:24px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    white-space:nowrap !important;
    font-size:14px !important;
    line-height:1 !important;
    max-width:none !important;
  }

  .hero-v2,
  .hero,
  .page-hero,
  .premium-hero,
  .category-hero{
    margin-top:18px !important;
    padding:28px 18px !important;
    border-radius:28px !important;
    overflow:hidden !important;
  }

  .hero-v2-content h1,
  h1{
    font-size:clamp(32px, 10vw, 54px) !important;
    line-height:1.02 !important;
    max-width:100% !important;
    overflow-wrap:break-word !important;
  }

  .hero-v2-content p,
  .page-hero p,
  .premium-hero p{
    font-size:clamp(17px, 4.5vw, 22px) !important;
    line-height:1.55 !important;
  }

  .hero-v2-content [style*="display: flex; gap: 40px"]{
    gap:18px !important;
    flex-wrap:wrap !important;
    justify-content:center !important;
  }

  .hero-v2-content [style*="grid-template-columns: repeat(4"]{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
    margin-top:28px !important;
  }

  .hero-v2-image,
  .hero-v2-image--brand-row,
  .hero-sidebar{display:none !important;}

  .hero-main-logo,
  .hero-main-logo--new{display:none !important;}

  .tools-strip-home,
  .categories-v2,
  section{
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  .tool-card-home,
  .cat-card-v2,
  .product-card,
  .project-card,
  .topic-card,
  .card{
    max-width:100% !important;
    overflow:hidden !important;
  }

  /* Generator pages — mniej odpustowego glow, więcej czytelności */
  [class*="generator"] h1,
  [class*="Generator"] h1,
  .generator h1,
  .generator-title{
    text-shadow:0 0 18px rgba(72,255,205,.28) !important;
  }
}

@media (max-width: 520px){
  .site-header-v2{padding-top:12px !important;}

  .header-v2-inner .brand,
  a.brand{max-width:238px !important;}

  .header-v2-inner .brand img,
  a.brand img{
    width:48px !important;
    height:48px !important;
    min-width:48px !important;
    max-width:48px !important;
  }

  .header-v2-inner .brand span:first-child,
  a.brand span:first-child{font-size:23px !important;}

  .header-v2-inner .brand span:nth-child(2),
  a.brand span:nth-child(2){font-size:15px !important;}

  .header-v2-inner .brand span:nth-child(3),
  a.brand span:nth-child(3){font-size:11px !important;}

  .user-actions{gap:8px !important;}
  .user-actions .action-item{
    min-height:58px !important;
    border-radius:22px !important;
    font-size:13px !important;
    padding:8px 6px !important;
  }

  .search-input{height:54px !important; font-size:15px !important;}
  .search-btn{width:50px !important; height:50px !important; min-width:50px !important;}

  .hero-v2,
  .hero,
  .page-hero,
  .premium-hero,
  .category-hero{
    padding:24px 16px !important;
    border-radius:26px !important;
  }

  .hero-v2-content [style*="grid-template-columns: repeat(4"]{
    grid-template-columns:1fr !important;
  }
}

/* Pływający pomocnik — nie może robić żółtej belki przez całą stronę */
@media (max-width: 900px){
  .ai-helper-button{
    right:16px !important;
    bottom:18px !important;
    width:58px !important;
    height:58px !important;
    min-width:58px !important;
    max-width:58px !important;
    padding:0 !important;
    border-radius:50% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:0 !important;
    font-size:0 !important;
    color:transparent !important;
    overflow:hidden !important;
    background:linear-gradient(135deg,#45f3c5,#ffe28d) !important;
    box-shadow:0 14px 42px rgba(72,255,205,.32),0 18px 60px rgba(0,0,0,.42) !important;
    z-index:2147483000 !important;
  }

  .ai-helper-button::before{
    content:"💬" !important;
    font-size:25px !important;
    line-height:1 !important;
    color:#061512 !important;
  }

  .ai-helper-button .helper-icon,
  .ai-helper-button span,
  .ai-helper-button strong{
    display:none !important;
  }

  .ai-helper-container{
    right:10px !important;
    left:10px !important;
    bottom:86px !important;
    width:auto !important;
    max-width:none !important;
    max-height:min(74vh, 620px) !important;
    border-radius:22px !important;
    z-index:2147483001 !important;
  }
}

@media (max-width: 360px){
  .container,
  header .container,
  nav .container,
  main .container{padding-left:10px !important;padding-right:10px !important;}

  .user-actions .action-item{font-size:12px !important;min-height:54px !important;}
  .nav-v2-list a,
  .nav-v2-list--rich a,
  .main-nav-v2 a{font-size:13px !important;padding:11px 14px !important;}
}

@media (max-width: 900px){
  .main-nav-v2::before,
  .main-nav-v2::after,
  .nav-v2-list::before,
  .nav-v2-list::after,
  .nav-v2-list--rich::before,
  .nav-v2-list--rich::after,
  .main-nav-v2 a::before,
  .main-nav-v2 a::after{
    max-width:0 !important;
    width:0 !important;
    display:none !important;
    content:none !important;
  }

  .main-nav-v2 .container{
    overflow:hidden !important;
  }

  .hero-v2 *{
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  .hero-v2-content{
    width:100% !important;
    max-width:100% !important;
    text-align:center !important;
  }

  .hero-v2-content a,
  .page-hero a,
  .premium-hero a{
    max-width:100% !important;
    white-space:normal !important;
    text-align:center !important;
  }
}