/*Мобильные стили*/

@media (max-width: 680px) {
  /*Layout*/
  .all{
    width: 100%;
  }
  .content {
    float: none;
    width: 100%;
    /*padding: 5px;*/
    padding: 0;
  }
  .box{
    /*	padding: 5px;*/
  }
  #sidebar {
    float: none;
    width: 100%;
  }
  .page-title {
    margin: 10px 8px 28px !important;
    padding: 6px 0 0 !important;
    line-height: 1.2;
  }

  /* mobile catalog spacing */
  .content.box {
    padding: 10px 8px 16px !important;
    margin-top: 8px !important;
  }
  .content.box .page-title.center-title {
    margin-bottom: 28px !important;
  }
  .content table {
    margin-top: 12px !important;
    border-top: none !important;
  }
  .card.m-b-25 {
    margin-top: 10px;
  }
  table{
    width: 100% !important;
  }
  /*General*/
  .actions{
    display: none;
  }
  .bbcrumb,
  .bbcrumb--bar {
    display: block;
    padding: 8px 10px 4px;
    font-size: 15px;
  }
  .wpcf7 input, .wpcf7 textarea {
    width: auto;
  }
  iframe{
    width: 100%;
    height: 220px;
  }


  /*Header*/
  .header{
    height: auto;
  }
  .header .logo{
    float: none;
    text-align: center;
    height: auto;
    width: auto;
    margin: 10px;
  }
  .header .logo img{
    width: 333px;
  }
  .header br{
    display: none;
  }
  h1{
    font-size: 20pt;
    padding-left: 5px;
  }
  h1.description, div.description {
    float: none;
    width: auto;
    text-align: center;
    font-size: 16pt;
    margin-left: 0;
  }
  div.dostavka {
    float: none;
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    width: fit-content;
    max-width: 94%;
    margin: 12px auto !important;
    padding: 10px 10px 10px 66px;
    text-align: left;
    background-position: 6px center;
    background-size: 54px auto;
    min-height: 56px;
    font-size: 18px;
    line-height: 1.2;
    box-sizing: border-box;
  }
  div.dostavka .dostavka__line {
    display: inline-flex !important;
    align-items: center;
    float: none;
    width: auto;
    font-size: 18px !important;
    line-height: 1 !important;
    gap: 6px;
    margin: 0;
    padding: 0;
  }
  div.dostavka img,
  div.dostavka img.bm-flag {
    float: none !important;
    position: static !important;
    left: auto !important;
    top: auto !important;
    display: block !important;
    width: 22px !important;
    height: 15px !important;
    margin: 0 !important;
    vertical-align: middle !important;
    flex-shrink: 0;
    object-fit: cover;
    transform: translateY(1px);
  }
  .header .contact{
    width: auto;
    height: auto;
    float: none;
    text-align: center;
  }
  .header .button {
    display: inline-block;
    width: 260px;
    margin-top: 20px;
  }
  .content table tr td:nth-child(2) {
    width: 93px !important;
  }
  .content table tr td:nth-child(5) {
    display: none;
  }
  /*Footer*/
  .footer .widget_nav_menu {
    display: none;
  }
  .footer .widget_text{
    float: none;
    width: auto;
    padding-left: 10px;
    margin: 0;
  }
  .footer .widget:last-child {
    float: none;
    width: 325px;
  }
  #text-6 .textwidget {
    width: 325px;
  }


  /*Меню*/
  button#responsive-menu-button {
    display: inline-block;
  }
  button#responsive-menu-button {
    top: 20px !important;
    right: 3% !important;
    border-radius: 5px !important;
    background: #307f9a !important;
  }
  .primary-menu{
    display: none;
  }
  #responsive-menu-container #responsive-menu li.responsive-menu-item .responsive-menu-item-link {
    font-size: 20px !important;
  }
  #responsive-menu-container #responsive-menu li.responsive-menu-item a {
    background-color: #307f9a !important;
    border: none !important;
  }
  #responsive-menu-container #responsive-menu li.responsive-menu-item a .responsive-menu-subarrow {
    border-left: 1px solid #307f9a !important;
    background-color: #307f9a !important;
  }


  /*Пагинация — только снизу, компакт на mobile */
  .content .navigation,
  .navigation {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    float: none !important;
    text-align: center !important;
    margin: 12px 0 20px !important;
  }
  .bm-pagination--mobile {
    display: flex !important;
    gap: 6px !important;
  }
  .bm-pagination--desktop {
    display: none !important;
  }
  .bm-page {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    flex: 0 0 42px !important;
    font-size: 16px !important;
  }
  .content table td img {
    padding: 5px;
  }
  .content .entry-title {
    font-size: 24pt;
    line-height: 107%;
    margin-bottom: 15px;
  }
  #vk_comments {
    float: none;
    width: auto !important;
  }
  .content table a {
    text-decoration: none;
    font-size: 20px;
  }
  .filtr input {
    width: 193px;
  }
  .archive-meta p{
    padding-left: 5px;
  }
  /* product gallery mobile rules live in base.css @media (max-width: 900px) */


  .card,
  .card.first,
  .card.second,
  .card.last {
    width: 46%;
    margin-left: 2%;
    margin-right: 2%;
  }


  .visible-tablet {
    display: block;
  }

  .visible-mobile {
    display: none;
  }

  .visible-desktop {
    display: none;
  }
  
}
@media (max-width: 360px){
  #sidebar {
    float: none;
    width: 100%;
  }
  .footer .widget:last-child {
    float: none;
    width: 250px;
  }
  #text-6 .textwidget {
    width: 250px;
  }
  .content table {
    /*width: 98%;*/
  }
  aside{
    display: none;
  }
  #youtube{
    display: none;
  }

  .card,
  .card.first,
  .card.second,
  .card.last {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
  }


  .visible-tablet {
    display: none;
  }

  .visible-mobile {
    display: block;
  }

  .visible-desktop {
    display: none;
  }

}

@media (max-width: 680px) {
  /* relateds mobile — compact tiles like desktop (~160px), 2 per row */
  .content .relateds,
  .relateds {
    display: flex !important;
    flex-wrap: wrap !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 0 16px !important;
    overflow: hidden !important;
    gap: 0 !important;
  }
  .content .related,
  .related,
  .related:first-child,
  .related:last-child,
  .related:only-child {
    float: none !important;
    width: 47% !important;
    max-width: 160px !important;
    box-sizing: border-box !important;
    margin: 0 1.5% 14px 0 !important;
    padding: 0 !important;
  }
  .related .thumbnail {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin-bottom: 8px !important;
    overflow: hidden !important;
    aspect-ratio: 4 / 3 !important;
  }
  .related .thumbnail img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
  }
  .related > a.title {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 0 6px !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    word-break: break-word;
    overflow: visible !important;
  }
  .related .thumbnail a {
    height: 100% !important;
    display: block !important;
  }
  .related .price {
    display: block !important;
    clear: both !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
    position: static !important;
  }
}
@media (max-width: 600px) {
  /* Product CTA buttons: stacked, same width, centered */
  .bk-product-actions {
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin: 14px 0 6px;
  }
  .bk-product-actions a.single-button,
  .bk-product-actions .single-button {
    width: min(280px, 100%) !important;
    height: 40px !important;
    min-height: 40px !important;
    line-height: 40px !important;
    font-size: 16pt !important;
    padding: 0 16px !important;
  }
}
