/** Shopify CDN: Minification failed

Line 97:16 Unexpected "{"
Line 97:25 Expected ":"

**/

/* --- 1. NEW SECTION HEADINGS STYLING --- */
.comp-section-header {
  text-align: center;
  margin-bottom: 40px;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

/* The Pill Tag (Technology Comparison) */
.comp-tag {
  display: inline-block;
  border: 1px solid var(--hightlight-border);
  color: var(--hightlight-color);
  background-color: var(--hightlight-bg);
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.5px;
  margin-bottom: 12px;
}

/* Main Title */
.comp-title {
  font-size: 28px;
  font-weight: 700;
  color: #333;
  margin: 0 0 10px 0;
  line-height: 1.2;
}

/* Subtitle */
.comp-subtitle {
  font-size: 15px;
  color: #666;
  margin: 0;
  line-height: 1.5;
}

/* --- 2. CONTAINER STYLING --- */
.comp-styled-section { margin: 60px auto; }

.shadow-container {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.06);
  border: 1px solid rgba(0,0,0,0.15);
  overflow: hidden;
}

/* --- 3. THEME RESET --- */
.comp-styled-section table.styled-table {
  width: 100%;
  min-width: 900px;
  border-collapse: separate !important; 
  border-spacing: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0;
}

.comp-styled-section .styled-table th,
.comp-styled-section .styled-table td {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 15px 8px;
  vertical-align: middle;
}

/* --- 4. LAYOUT --- */
.table-scroll { 
  overflow-x: auto; 
}

/* Headers */
.comp-styled-section .styled-table th { 
  vertical-align: bottom; 
  position: relative; 
  text-align: center; 
  padding-bottom: 20px;
  background-color: #FAFAFA;
  text-transform: none;
  width: 40px;
}
.styled-table th.col-feature-head { background-color: #fff; }

.compare-table-{{ section.id }} .th-icon img { width: auto; height: var(--icon-height);; object-fit: contain; margin-bottom: 8px; display: inline-block; }
.th-icon-placeholder { font-size: 24px; margin-bottom: 8px; }
.th-title { font-size: 15px; font-weight: 700; color: #333; margin: 0; line-height: 1.2; }
.th-subtitle { font-size: 12px; color: #777; margin: 4px 0 0; font-weight: 400; }

/* Feature Column */
.comp-styled-section .styled-table td.feature-cell { 
  text-align: left; 
  padding-left: 12px;
  border-bottom: 1px solid #f0f0f0; 
}
.feat-title { font-weight: 600; font-size: 14px; margin-bottom: 2px; color: #222; }
.feat-sub { font-size: 12px; color: #888; }

/* Standard Cells */
.comp-styled-section .styled-table td.value-cell { text-align: center; }
.comp-styled-section .styled-table td:not(.is-highlighted):not(.feature-cell) {
  border-bottom: 1px solid #f0f0f0;
}

/* --- 5. HIGHLIGHT LOGIC --- */
.comp-styled-section .styled-table th.is-highlighted,
.comp-styled-section .styled-table td.is-highlighted {
  background-color: var(--hightlight-bg) !important; 
  z-index: 1; 
}

.comp-styled-section .styled-table th.is-highlighted,
.comp-styled-section .styled-table td.is-highlighted {
  border-left: 2px solid var(--hightlight-border) !important; 
  border-right: 2px solid var(--hightlight-border) !important;
  border-bottom: none !important; 
}

.comp-styled-section .styled-table th.is-highlighted {
  border-top: 2px solid var(--hightlight-border) !important;
  border-radius: 12px 12px 0 0;
  padding-top: 36px; 
}

.comp-styled-section .styled-table tr:last-child td.is-highlighted {
  border-bottom: 2px solid var(--hightlight-border) !important;
  border-radius: 0 0 12px 12px;
}

th.is-highlighted .th-title {
  color: var(--hightlight-color);
}

/* Badge */
.best-choice-badge {
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  background-color: var(--hightlight-color);
  color: white;
  padding: 6px 14px;
  border-radius: 50px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  z-index: 5;
}
