/* Product page — Description + Specifications
   • Spec-table restyle (muted): every screen size
   • 60/40 side-by-side, equal-height columns: desktop (>=992px) only */

/* One consistent font for the description + spec output — overrides the mixed
   inline font-family (Akrobat etc.) baked into pasted product descriptions */
.tabs-container.product_tabs .tab-content,
.tabs-container.product_tabs .tab-content *{
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif !important;
}

/* Spec table — soft, muted, easy to scan */
#tab-specification .table-responsive { border: 0; margin: 0; }
#tab-specification table.table{
  width:100%; margin:0;
  border-collapse:separate; border-spacing:0;
  border:1px solid #e6e9ec; border-radius:10px; overflow:hidden;
  background:#fff; font-size:14px; line-height:1.45;
}
/* the attribute-group name row (e.g. "Мощност") duplicates a real spec row — hide it */
#tab-specification table.table thead{ display:none; }
#tab-specification table.table thead td,
#tab-specification table.table thead th{
  background:#eef1f4; color:#46525b;
  font-weight:600; font-size:12.5px; letter-spacing:.4px; text-transform:uppercase;
  padding:11px 14px; border:0; border-bottom:1px solid #e1e5e9;
}
#tab-specification table.table thead:not(:first-child) td{ border-top:4px solid #fff; }
#tab-specification table.table tbody td{
  padding:11px 14px; border:0; border-top:1px solid #edeff2; vertical-align:middle;
}
#tab-specification table.table tbody tr:first-child td{ border-top:0; }
#tab-specification table.table tbody td:first-child{
  width:1%; white-space:nowrap;
  background:#f7f8fa; color:#1c2228; font-weight:600;
  border-right:1px solid #dde2e6; padding-right:16px;
}
#tab-specification table.table tbody td:last-child{ color:#3d474f; font-weight:500; padding-left:16px; }

/* Both sections always open — no tab bar / dropdowns — each with its heading, at
   EVERY width. Desktop lays them side-by-side (below); phone/tablet stacks them. */
.tabs-container.product_tabs > .nav-tabs{ display:none !important; }
.tabs-container.product_tabs > .tab-content > .tab-pane{ display:block !important; opacity:1; float:none; }
.tabs-container.product_tabs .j-pane-heading{
  display:block; margin:0 0 14px; padding-bottom:10px;
  border-bottom:2px solid #e3e6e9; font-size:19px; font-weight:600; color:#3f4a52;
}
/* phones: never truncate or show a "Покажи повече" button — keep both fully open */
.tabs-container.product_tabs .expand-content{ max-height:none !important; overflow:visible !important; }
.tabs-container.product_tabs .block-expand-overlay,
.tabs-container.product_tabs .block-expand{ display:none !important; }
/* phone/tablet: stack the two sections with breathing room between them */
@media (max-width:991px){
  .tabs-container.product_tabs > .tab-content > .tab-pane + .tab-pane{ margin-top:28px; }
}

@media (min-width:992px){
  /* desktop: lay the two always-open panes side by side, equal height */
  .tabs-container.product_tabs > .tab-content{
    display:flex; flex-wrap:wrap; align-items:stretch; gap:30px;
  }
  /* Описание — left ~60% */
  .tabs-container.product_tabs > .tab-content > .tab-pane:not(:has(#tab-specification)){
    flex:1 1 0; min-width:0; order:1;
  }
  /* Спецификации — right ~40%; the table fills the column so both sides end level */
  .tabs-container.product_tabs > .tab-content > .tab-pane:has(#tab-specification):not(:only-child){
    flex:0 0 40%; max-width:40%; min-width:300px; order:2;
    display:flex !important; flex-direction:column;
  }
  .tabs-container.product_tabs > .tab-content > .tab-pane:has(#tab-specification) .j-pane-heading{ flex:0 0 auto; }
  .tabs-container.product_tabs > .tab-content > .tab-pane:has(#tab-specification) #tab-specification{
    flex:1 1 auto; min-height:0; display:flex; flex-direction:column;
  }
  .tabs-container.product_tabs > .tab-content > .tab-pane:has(#tab-specification) .table-responsive{
    flex:1 1 auto; width:100%;
  }
  .tabs-container.product_tabs > .tab-content > .tab-pane:has(#tab-specification) table.table{ height:100%; }
  /* keep group headers compact; let the data rows absorb the extra height evenly */
  .tabs-container.product_tabs > .tab-content > .tab-pane:has(#tab-specification) table.table thead td{ height:1px; }
}

/* ── Phone: Описание / Спецификации permanently open ────────────────────────
   On phones these render as a collapsible accordion (.product_accordion). Force
   BOTH panels open, kill the collapse toggle, and drop the +/caret affordance so
   they read as plain always-visible sections (the accordion only shows on phone,
   so these rules can't affect the desktop side-by-side layout above). */
.product_accordion .panel-collapse,
.product_accordion .panel-collapse.collapse{
  display:block !important;
  height:auto !important;
  visibility:visible !important;
  overflow:visible !important;
}
.product_accordion .panel-heading .accordion-toggle{
  cursor:default !important;
  pointer-events:none !important;   /* taps no longer fire the collapse JS */
}
.product_accordion .panel-heading .accordion-toggle .fa,
.product_accordion .panel-heading .accordion-toggle i{
  display:none !important;          /* hide the caret icon */
}
.product_accordion .panel-heading .accordion-toggle::after,
.product_accordion .panel-heading .accordion-toggle::before{
  content:none !important;          /* hide any skin-drawn +/- indicator */
  display:none !important;
}

/* ── Phone: spec table as a list, label above its value (owner 2026-11-12, canvas SpecType-B: "I like this just make
   upper text a bit more black and bold and big so it's more readable than down text"). Ubuntu instead of the narrow
   Akrobat the accordion inherited; the label never squeezes the value any more. Only the phone accordion. */
.product_accordion #tab-specification table.table,
.product_accordion #tab-specification table.table tbody,
.product_accordion #tab-specification table.table tbody tr,
.product_accordion #tab-specification table.table tbody td{ display:block; width:auto; }
.product_accordion #tab-specification table.table{ border:0; border-radius:0; }
.product_accordion #tab-specification table.table tbody tr{ padding:10px 14px 11px; border-top:1px solid #e6e9ec; }
.product_accordion #tab-specification table.table tbody tr:first-child{ border-top:0; }
.product_accordion #tab-specification table.table tbody td{
  font-family:Ubuntu, sans-serif !important; border:0; background:none; padding:0 !important;
}
.product_accordion #tab-specification table.table tbody td:first-child{
  width:auto; white-space:normal; border:0; background:none;
  font-size:14px; line-height:19px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:#1d2125;
}
.product_accordion #tab-specification table.table tbody td:last-child{
  font-size:16px; line-height:23px; font-weight:400; letter-spacing:0; color:#3d474f; padding-top:2px !important;
}

/* ── Phone: Описание and Спецификации as one flow (owner 2026-11-12, flow draft A: "I like this one, implement").
   Both titles in the look of the other section titles of the page (bold, a rule under them, no red/grey accordion
   colours); the description in Ubuntu like the spec list instead of the narrow Akrobat; red bullet dots.
   Only the phone accordion. */
.product_accordion .panel-body,
.product_accordion .panel-body *{ font-family:Ubuntu, sans-serif !important; }
.product_accordion .panel-body{ padding-bottom:0 !important; }
.product_accordion .panel-body p,
.product_accordion .panel-body li{ font-size:16px; line-height:24px; color:#3d474f; letter-spacing:0; }
.product_accordion .panel-body p{ margin:0 0 10px; }
.product_accordion .panel-body strong,
.product_accordion .panel-body b{ font-weight:700; color:#1d2125; }
.product_accordion .panel-heading{ border:0 !important; margin:0 0 14px; }
.product_accordion .panel-title a.accordion-toggle{
  display:block; font:700 18px/26px Ubuntu, sans-serif; text-transform:none; letter-spacing:0;
  color:#1d2125 !important; padding:0 0 8px !important; border-bottom:2px solid #e3e6e9;
}
.product_accordion .panel + .panel{ margin-top:30px; }
.product_accordion .panel-body ul{ margin:0; padding:0 0 0 20px; }
.product_accordion .panel-body li{ margin:0 0 6px; padding-left:2px; }
.product_accordion .panel-body li::marker{ color:#de202a; }