/* Nova Flora mobile 1.0.16. Presentation only; desktop rules stay unchanged. */
@media (max-width: 767.98px) {
  main { padding-top: 14px; }
  #content { min-width: 0; }
  #content h1 { font-size: 25px; overflow-wrap: anywhere; }
  #content h2, #content legend { font-size: 21px; }
  #content input, #content select, #content textarea { font-size: 16px; }

  /* Compact header with every action still reachable. */
  header .nf-header-main { padding: 12px 0; }
  header .nf-header-row { gap: 10px; }
  header .nf-header-main .header-logo { width: 190px; max-width: 65%; min-width: 0; margin: 0; }
  header .nf-header-main .header-logo img { width: 100%; height: auto; max-height: 65px; }
  header .nf-header-row > .header-interface { width: 100%; padding: 5px 6px; position: relative; }
  header .header-interface-list { display: grid !important; grid-template-columns: 44px 44px 44px minmax(0,1fr); gap: 2px; width: 100%; }
  header .header-interface-list > li { min-width: 0; margin: 0 !important; }
  header .header-interface .btn-header { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; font-size: 19px; }
  header #cart.nf-header-cart, header #cart.nf-header-cart > .dropdown { width: 100%; min-width: 0; }
  header #cart.nf-header-cart > .dropdown { position: static; }
  header #cart.nf-header-cart > .dropdown > button { width: 100% !important; min-height: 44px; padding: 4px; font-size: 12px; line-height: 1.35; white-space: normal; overflow-wrap: anywhere; }
  header .nf-header-menu { padding-top: 5px; padding-bottom: 5px; }
  header .nf-header-menu > .container { padding-left: 0; padding-right: 0; }
  header #menu { padding: 4px 0 !important; }
  header #menu .navbar-toggler { min-width: 44px; min-height: 40px; padding: 5px 9px; }
  header #menu .header-menu-title { font-size: 16px; }
  header #menu .navbar-nav { gap: 0; margin-bottom: 4px !important; }
  header #menu .navbar-nav > li { width: 100%; }
  header #menu .nav-link { min-height: 44px; padding: 10px 12px; font-size: 14px; line-height: 1.5; white-space: normal; }

  /* The mini cart keeps native forms and actions, but avoids narrow text columns. */
  header #cart.nf-header-cart .dropdown-menu { width: 100% !important; max-width: 100% !important; min-width: 0; inset: calc(100% + 6px) 0 auto auto !important; transform: none !important; max-height: 65vh; max-height: 65dvh; overflow: auto; padding: 10px !important; border-radius: 8px; }
  header #cart.nf-header-cart .dropdown-menu > li { min-width: 0; }
  header #cart.nf-header-cart .table-striped, header #cart.nf-header-cart .table-striped tbody { display: block; width: 100%; }
  header #cart.nf-header-cart .table-striped tr { display: grid; grid-template-columns: 64px minmax(0,1fr) 44px; gap: 5px 8px; padding: 10px 0; border-bottom: 1px solid #dfe7df; }
  header #cart.nf-header-cart .table-striped td { min-width: 0; width: auto !important; padding: 0; border: 0; box-shadow: none; background: transparent; font-size: 14px; line-height: 1.45; text-align: left !important; overflow-wrap: anywhere; }
  header #cart.nf-header-cart .table-striped td:nth-child(1) { grid-column: 1; grid-row: 1 / span 3; }
  header #cart.nf-header-cart .table-striped td:nth-child(2) { grid-column: 2; grid-row: 1; }
  header #cart.nf-header-cart .table-striped td:nth-child(3) { grid-column: 2; grid-row: 2; }
  header #cart.nf-header-cart .table-striped td:nth-child(4) { grid-column: 2; grid-row: 3; font-weight: 600; }
  header #cart.nf-header-cart .table-striped td:nth-child(5) { grid-column: 3; grid-row: 1 / span 3; }
  header #cart.nf-header-cart .table-striped img { width: 64px; min-width: 0; max-width: 64px; height: 64px; object-fit: contain; }
  header #cart.nf-header-cart .table-striped small { font-size: 12px; }
  header #cart.nf-header-cart .table-striped .btn { min-width: 44px; min-height: 44px; padding: 8px; }
  header #cart.nf-header-cart .table-sm { font-size: 14px; }
  header #cart.nf-header-cart .dropdown-menu p.text-end { display: flex; flex-direction: column; gap: 5px; margin: 6px 0 0; font-size: 0; }
  header #cart.nf-header-cart .dropdown-menu p.text-end a { display: block; text-align: center; padding: 10px 6px; min-height: 44px; background: #eff3e8; border-radius: 5px; font-size: 14px; }

  /* Breadcrumb chevrons from core CSS collide when the line wraps. */
  ul.breadcrumb { gap: 4px 8px; padding: 10px 12px; margin: 10px 0 16px; font-size: 13px; }
  ul.breadcrumb li { position: static; padding: 0 !important; margin: 0 !important; min-width: 0; white-space: normal; overflow-wrap: anywhere; }
  ul.breadcrumb li::before, ul.breadcrumb li::after { display: none !important; }
  ul.breadcrumb li + li::before { display: inline !important; content: '/' !important; padding: 0 6px 0 0; margin: 0; border: 0; position: static; transform: none; color: #68766b; float: none; }

  /* One column for mobile login, without changing inputs or handlers. */
  #account-login #content > .row { flex-direction: column; }
  #account-login #content > .row > .col { flex: 0 0 auto; width: 100%; min-width: 0; }
  #account-login #content > .row > .col .h-100 { height: auto !important; }

  /* Main cart: a card per product, with visible quantity and both amounts. */
  #checkout-cart #output-cart { overflow: visible; }
  #checkout-cart #output-cart > table, #checkout-cart #output-cart > table > tbody { display: block; width: 100%; }
  #checkout-cart #output-cart > table > thead { display: none; }
  #checkout-cart #output-cart > table > tbody > tr { display: grid; grid-template-columns: 72px minmax(0,1fr); gap: 12px; padding: 14px; margin-bottom: 14px; border: 1px solid #dfe7df; border-radius: 8px; }
  #checkout-cart #output-cart > table > tbody > tr > td { min-width: 0; padding: 0; width: auto; border: 0; box-shadow: none; background: transparent; overflow-wrap: anywhere; }
  #checkout-cart #output-cart > table > tbody > tr > td:nth-child(1) { grid-column: 1; grid-row: 1; }
  #checkout-cart #output-cart > table > tbody > tr > td:nth-child(2) { grid-column: 2; grid-row: 1; font-size: 15px; line-height: 1.5; }
  #checkout-cart #output-cart > table > tbody > tr > td:nth-child(1) img { width: 72px; height: 72px; object-fit: contain; }
  #checkout-cart #output-cart > table > tbody > tr > td:nth-child(n+3) { grid-column: 1 / -1; }
  #checkout-cart #output-cart > table > tbody > tr > td:nth-child(n+4) { display: flex; justify-content: space-between; gap: 12px; font-weight: 600; text-align: right; }
  #checkout-cart #output-cart > table > tbody > tr > td[data-nf-label]::before { content: attr(data-nf-label); text-align: left; font-size: 13px; font-weight: 400; color: #68766b; }
  #checkout-cart #output-cart > table > tbody > tr > td:nth-child(3)::before { display: block; margin-bottom: 6px; }
  #checkout-cart #output-cart .input-group { flex-wrap: nowrap; width: 100%; max-width: 230px; }
  #checkout-cart #output-cart .input-group input[name=quantity] { flex: 1 1 0; width: 0; min-width: 56px; min-height: 44px; text-align: center; }
  #checkout-cart #output-cart .input-group .btn { flex: 0 0 44px; min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 8px; }
  #checkout-cart #output-cart tfoot { display: block; padding: 10px 0; }
  #checkout-cart #output-cart tfoot tr { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; }
  #checkout-cart #output-cart tfoot td { min-width: 0; padding: 7px; border: 0; overflow-wrap: anywhere; }
  #checkout-cart #shopping-cart > .row { gap: 10px; }
  #checkout-cart #shopping-cart > .row > .col { flex: 0 0 auto; width: 100%; }
  #checkout-cart #shopping-cart > .row > .col .btn { width: 100%; white-space: normal; }

  /* Readonly native method inputs stay in place; display text can wrap. */
  #checkout-checkout :is(#checkout-shipping-method,#checkout-payment-method) .input-group { display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 0; }
  #checkout-checkout :is(#checkout-shipping-method,#checkout-payment-method) .input-group > .input-group-text { border-radius: 5px 0 0 0; justify-content: center; padding: 8px; }
  #checkout-checkout :is(#checkout-shipping-method,#checkout-payment-method) .input-group > button { grid-column: 1 / -1; min-height: 44px; width: 100%; border-radius: 0 0 5px 5px !important; margin: -1px 0 0; }
  #checkout-checkout .nf-method-display { width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px; background: #fff; border: 1px solid #ced4da; border-left: 0; border-radius: 0 5px 0 0; font-size: 15px; line-height: 1.5; overflow-wrap: anywhere; }
  #checkout-checkout :is(#input-shipping-method,#input-payment-method).nf-method-decorated { display: none; }
  #checkout-checkout #checkout-confirm table { table-layout: fixed; width: 100%; }
  #checkout-checkout #checkout-confirm table th:first-child, #checkout-checkout #checkout-confirm table td:first-child { width: 70%; overflow-wrap: anywhere; }
  #checkout-checkout #checkout-confirm table th:last-child, #checkout-checkout #checkout-confirm table td:last-child { width: 30%; overflow-wrap: anywhere; }
  #checkout-checkout #checkout-confirm table :is(th,td) { padding: 8px; font-size: 14px; }
  #checkout-checkout #checkout-payment .btn { width: 100%; min-height: 44px; white-space: normal; }
  #checkout-checkout .form-check { min-height: 44px; }
  .modal-dialog { margin: 12px; max-width: calc(100% - 24px); }
  .modal-body .form-check { padding-top: 8px; padding-bottom: 8px; }
  .modal-body .form-check-label { white-space: normal; overflow-wrap: anywhere; }

  /* Filters remain collapsed by default; readable options in one column. */
  .nf-filters .nf-filters-grid { grid-template-columns: minmax(0,1fr) !important; gap: 18px; }
  .nf-filters .nf-filters-options { max-height: 220px; }
  .nf-filters label { min-height: 32px; align-items: flex-start; }
  .nf-filters label > span { min-width: 0; overflow-wrap: anywhere; }
  .nf-filters summary span { display: block; margin: 4px 0 0; }
  .nf-filters .nf-filters-actions { gap: 10px; }
  .nf-filters .nf-filters-actions :is(button,a) { min-height: 44px; display: inline-flex; align-items: center; }

  /* Product controls line up instead of stepping down inside an input group. */
  :is(#product-info,#product-product) #product .input-group { flex-wrap: nowrap; }
  :is(#product-info,#product-product) #input-quantity { width: 0; min-width: 48px; }
  :is(#product-info,#product-product) #button-cart { margin-top: 0 !important; min-height: 44px; padding: 8px 14px; }
  :is(#product-info,#product-product) .nav-tabs { gap: 4px; }
  :is(#product-info,#product-product) .nav-tabs .nav-link { padding: 9px 10px; margin-right: 0; font-size: 13px; min-height: 44px; }

  /* Toasts no longer cover the price and product options in the middle. */
  #alert { top: auto; bottom: max(12px,env(safe-area-inset-bottom)); left: 12px; right: 12px; width: auto; margin-left: 0; pointer-events: none; max-height: 40vh; overflow-y: auto; }
  #alert .alert { margin: 6px 0; padding: 12px 44px 12px 12px; line-height: 1.5; font-size: 14px; pointer-events: auto; box-shadow: 0 2px 12px #284c3720; }
  #alert .btn-close { top: 5px; right: 5px; width: 20px; height: 20px; padding: 10px; }

  .nf-home .nf-home-intro { padding: 22px 20px; }
  .nf-home h1 { font-size: 28px; }
  .nf-home .nf-home-lead { font-size: 16px; line-height: 1.65; }
  .nf-home .nf-home-actions { gap: 12px; }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  header .nf-header-row { gap: 12px; }
  header .nf-header-main { padding: 14px 0; }
  header .nf-header-main .header-logo { margin: 0; }
  header .header-interface-list { flex-wrap: nowrap; }
  header #menu .navbar-nav { gap: 0; }
}
@media (min-width: 768px) {
  .nf-method-display { display: none; }
}


/* Nova Flora 1.0.17 — desktop mini cart stays inside its dropdown. */
@media (min-width: 768px) {
  header #cart.nf-header-cart .dropdown-menu { width: 560px !important; max-width: calc(100vw - 32px) !important; min-width: 0; padding: 10px !important; max-height: 75vh; overflow: auto; }
  header #cart.nf-header-cart .dropdown-menu li { min-width: 0; }
  header #cart.nf-header-cart .dropdown-menu > li { width: 100%; }
  header #cart.nf-header-cart .table-striped, header #cart.nf-header-cart .table-striped tbody { display: block; width: 100%; }
  header #cart.nf-header-cart .table-striped tr { display: grid; grid-template-columns: 72px minmax(0,1fr) 44px 96px 36px; gap: 10px; padding: 10px 0; border-bottom: 1px solid #dfe7df; }
  header #cart.nf-header-cart .table-striped td { width: auto !important; min-width: 0; padding: 0; border: 0; box-shadow: none; background: transparent; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
  header #cart.nf-header-cart .table-striped td:nth-child(2) { text-align: left; }
  header #cart.nf-header-cart .table-striped td:nth-child(3), header #cart.nf-header-cart .table-striped td:nth-child(4) { text-align: right; }
  header #cart.nf-header-cart .table-striped td:nth-child(4) { font-weight: 600; }
  header #cart.nf-header-cart .table-striped img { width: 72px; min-width: 0; max-width: 72px; height: 72px; object-fit: contain; }
  header #cart.nf-header-cart .table-striped small { font-size: 12px; }
  header #cart.nf-header-cart .table-striped .btn { min-width: 36px; min-height: 36px; padding: 7px; }
  header #cart.nf-header-cart .table-sm { width: 100%; table-layout: fixed; font-size: 14px; }
  header #cart.nf-header-cart .table-sm td { overflow-wrap: anywhere; }
  header #cart.nf-header-cart .dropdown-menu p.text-end { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px 16px; margin: 10px 0 0; font-size: 0; }
  header #cart.nf-header-cart .dropdown-menu p.text-end a { display: inline-flex; align-items: center; min-height: 36px; font-size: 14px; }
}