/**
 * assets/css/tokupicks-pcbuilder.css
 * 自作PCシミュレーター 専用スタイル
 * 既存 tokupicks.css の CSS変数・ユーティリティを継承。
 */

/* ================================================================
 *  スコープ変数
 * ================================================================ */
#tokupicks-pcbuilder {
  --tp-bg-main:   #f8fafc;
  --tp-bg-card:   #ffffff;
  --tp-bg-input:  #f1f5f9;
  --tp-border:    #e2e8f0;
  --tp-text-main: #0f172a;
  --tp-text-sub:  #64748b;
  --tp-orange:    #ff6b00;
  --tp-cyan:      #00c8b5;
  --tp-red:       #ef4444;
  --tp-green:     #059669;
  --tp-purple:    #7c3aed;
  --tp-radius:    12px;
  --tp-shadow:    0 2px 12px rgba(0,0,0,.07);
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic", sans-serif;
  color: var(--tp-text-main);
  padding: 8px 0;
  box-sizing: border-box;
  width: 100%;
}
#tokupicks-pcbuilder *, #tokupicks-pcbuilder *::before, #tokupicks-pcbuilder *::after {
  box-sizing: border-box;
}

/* ================================================================
 *  ① ヘッダーブロック削除により上マージン調整
 * ================================================================ */
#tokupicks-pcbuilder > .tp-card:first-child {
  margin-top: 0;
}

/* ================================================================
 *  オプションバー
 * ================================================================ */
.tp-pcb-options {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px 18px;
}

/* ================================================================
 *  パーツ一覧カード
 * ================================================================ */
.tp-pcb-parts-card {
  padding: 0;
  overflow: hidden;
}

.tp-pcb-part-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--tp-border);
  transition: background 0.15s;
}
.tp-pcb-part-row:last-child { border-bottom: none; }
.tp-pcb-part-row:hover { background: #f8fafc; }

/* ③ カテゴリ列 */
.tp-pcb-part-cat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  flex-shrink: 0;
  width: 60px;
}
/* ③ アイコン画像 */
.tp-pcb-part-icon-img {
  width: 36px;
  height: 36px;
  object-fit: contain;
  display: block;
}
/* ③ 絵文字フォールバック */
.tp-pcb-part-icon {
  font-size: 20px;
  line-height: 1;
}
.tp-pcb-part-cat-label {
  font-size: 10px;
  font-weight: 700;
  color: var(--tp-text-sub);
  text-align: center;
  white-space: nowrap;
}

/* 選択済み列 */
.tp-pcb-part-selected { flex: 1; min-width: 0; }
.tp-pcb-part-none     { flex: 1; font-size: 12px; color: #b0bec5; font-style: italic; }

/* ② 製品名リンク */
.tp-pcb-selected-name {
  font-size: 12px;
  font-weight: 700;
  color: var(--tp-text-main);
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-height: 1.4;
  margin-bottom: 3px;
}
.tp-pcb-selected-name-link {
  color: var(--tp-text-main);
  text-decoration: underline;
  text-decoration-color: #cbd5e1;
  text-underline-offset: 2px;
  transition: color 0.15s;
}
.tp-pcb-selected-name-link:hover { color: var(--tp-cyan); text-decoration-color: var(--tp-cyan); }

.tp-pcb-selected-store {
  font-size: 10px;
  color: var(--tp-text-sub);
  margin-bottom: 3px;
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
}
.tp-pcb-bonus-badge {
  font-size: 9px;
  background: #fff7ed;
  color: #ea580c;
  border: 1px solid #fdba74;
  border-radius: 3px;
  padding: 1px 5px;
  font-weight: 700;
  white-space: nowrap;
}

.tp-pcb-selected-price {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}
.tp-pcb-selected-eff {
  font-size: 14px;
  font-weight: 900;
  font-style: italic;
  color: var(--tp-cyan);
}
.tp-pcb-eff-suffix {
  font-size: 10px;
  font-weight: 400;
  color: var(--tp-text-sub);
  margin-left: 2px;
  font-style: normal;
}
.tp-pcb-selected-orig { font-size: 11px; color: var(--tp-text-sub); text-decoration: line-through; }
.tp-pcb-selected-pt   { font-size: 10px; color: var(--tp-text-sub); }

/* ボタン群 */
.tp-pcb-part-btns { display: flex; flex-direction: column; gap: 5px; flex-shrink: 0; }
.tp-pcb-btn-change {
  padding: 7px 14px; font-size: 11px; font-weight: 700;
  background: var(--tp-bg-input); border: 1px solid var(--tp-border);
  border-radius: 6px; color: var(--tp-text-main); cursor: pointer; white-space: nowrap;
  transition: background 0.15s;
}
.tp-pcb-btn-change:hover { background: #e2e8f0; }
.tp-pcb-btn-select {
  padding: 7px 14px; font-size: 11px; font-weight: 700;
  background: var(--tp-cyan); color: #fff; border: none;
  border-radius: 6px; cursor: pointer; white-space: nowrap;
  transition: background 0.15s;
}
.tp-pcb-btn-select:hover { background: #00a89a; }
.tp-pcb-btn-remove {
  padding: 5px 10px; font-size: 10px;
  background: #fff5f5; border: 1px solid #fca5a5;
  border-radius: 6px; color: #dc2626; cursor: pointer;
  transition: background 0.15s;
}
.tp-pcb-btn-remove:hover { background: #fee2e2; }

/* ================================================================
 *  構成合計カード
 * ================================================================ */
.tp-pcb-summary-card { padding: 18px 20px; }
.tp-pcb-summary-title {
  font-size: 14px; font-weight: 900; color: var(--tp-text-main);
  margin-bottom: 14px; padding-bottom: 10px;
  border-bottom: 2px solid var(--tp-border);
}
.tp-pcb-summary-body { display: flex; flex-direction: column; }

.tp-pcb-sum-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 0; border-bottom: 1px dashed #f1f5f9; font-size: 13px;
}
.tp-pcb-sum-row:last-of-type { border-bottom: none; }
.tp-pcb-sum-label { color: var(--tp-text-sub); font-size: 12px; }
.tp-pcb-sum-val   { font-weight: 700; color: var(--tp-text-main); font-size: 13px; }
.tp-pcb-sum-pt .tp-pcb-sum-val,
.tp-pcb-val-pt { color: var(--tp-red); }

/* ポイント内訳 */
.tp-pcb-pt-breakdown {
  background: #f8fafc; border-radius: 8px;
  padding: 10px 14px; margin: 6px 0 8px;
  display: flex; flex-direction: column; gap: 4px;
}
.tp-pcb-pt-section-title {
  font-size: 10px; font-weight: 700; color: var(--tp-text-sub);
  margin-bottom: 4px; text-transform: uppercase; letter-spacing: .05em;
}
.tp-pcb-pt-row {
  display: flex; justify-content: space-between;
  align-items: center; font-size: 11px; color: var(--tp-text-sub);
}
.tp-pcb-pt-row-val     { font-weight: 700; }
.tp-pcb-pt-row-val.tp-pcb-pt-green  { color: #059669; }
.tp-pcb-pt-row-val.tp-pcb-pt-red    { color: #cc0000; }
.tp-pcb-pt-row-val.tp-pcb-pt-orange { color: #ea580c; }
.tp-pcb-pt-row-val.tp-pcb-pt-purple { color: var(--tp-purple); }
.tp-pcb-pt-row.tp-pcb-pt-muted      { opacity: 0.38; }
.tp-pcb-pt-cap-note {
  font-size: 9px; color: #94a3b8;
  margin-top: 4px; padding-top: 4px;
  border-top: 1px dashed #e2e8f0;
}

.tp-pcb-sum-divider { height: 1px; background: var(--tp-border); margin: 10px 0; }

.tp-pcb-sum-eff { padding: 10px 0 4px; }
.tp-pcb-eff-price { font-size: 26px; font-weight: 900; font-style: italic; color: var(--tp-orange); }

/* パーツ別内訳 */
.tp-pcb-parts-breakdown { margin-top: 12px; border-top: 1px solid var(--tp-border); padding-top: 10px; }
.tp-pcb-parts-breakdown-title {
  font-size: 10px; font-weight: 700; color: var(--tp-text-sub);
  margin-bottom: 6px; text-transform: uppercase; letter-spacing: .05em;
}
.tp-pcb-part-sum-row {
  display: flex; align-items: center;
  justify-content: space-between; font-size: 11px;
  padding: 3px 0; color: var(--tp-text-sub);
  border-bottom: 1px dashed #f1f5f9; gap: 4px;
}
.tp-pcb-part-sum-row:last-child { border-bottom: none; }
.tp-pcb-part-sum-icon { flex-shrink: 0; line-height: 1; }
.tp-pcb-part-sum-icon .tp-pcb-part-icon-img { width: 16px; height: 16px; }
.tp-pcb-part-sum-icon .tp-pcb-part-icon     { font-size: 14px; }
.tp-pcb-part-sum-name  { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--tp-text-main); }
.tp-pcb-part-sum-store { color: var(--tp-text-sub); font-size: 10px; white-space: nowrap; margin: 0 4px; }
.tp-pcb-part-sum-price { font-weight: 700; color: var(--tp-text-main); white-space: nowrap; }

/* ================================================================
 *  モーダル
 * ================================================================ */
.tp-pcb-modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.55);
  z-index: 10000; display: flex; align-items: center;
  justify-content: center; padding: 16px;
}
.tp-pcb-modal {
  background: #fff; border-radius: 14px; width: 100%;
  max-width: 680px; max-height: 85vh;
  display: flex; flex-direction: column;
  box-shadow: 0 20px 60px rgba(0,0,0,0.25); overflow: hidden;
}
.tp-pcb-modal-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid var(--tp-border); flex-shrink: 0;
}
.tp-pcb-modal-title {
  font-size: 14px; font-weight: 900; color: var(--tp-text-main);
  display: flex; align-items: center; gap: 8px;
}
/* ③ モーダルタイトルのアイコン画像サイズ */
.tp-pcb-modal-title .tp-pcb-part-icon-img { width: 24px; height: 24px; }
.tp-pcb-modal-title .tp-pcb-part-icon     { font-size: 18px; }

.tp-pcb-modal-close {
  background: var(--tp-bg-input); border: 1px solid var(--tp-border);
  border-radius: 6px; padding: 5px 10px; font-size: 13px;
  cursor: pointer; color: var(--tp-text-sub); transition: background 0.15s;
}
.tp-pcb-modal-close:hover { background: #e2e8f0; }
.tp-pcb-modal-search {
  padding: 12px 16px; border-bottom: 1px solid var(--tp-border); flex-shrink: 0;
}
.tp-pcb-modal-input { width: 100%; }
.tp-pcb-modal-items { flex: 1; overflow-y: auto; padding: 8px 0; }

/* モーダル内アイテム行 */
.tp-pcb-modal-item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 16px; border-bottom: 1px solid #f8fafc;
  cursor: pointer; transition: background 0.12s;
}
.tp-pcb-modal-item:hover  { background: #f0fdf9; }
.tp-pcb-modal-item:last-child { border-bottom: none; }
.tp-pcb-modal-item-img {
  width: 48px; height: 48px; object-fit: contain;
  border-radius: 6px; border: 1px solid var(--tp-border);
  background: var(--tp-bg-input); flex-shrink: 0;
}
.tp-pcb-modal-item-img-placeholder {
  width: 48px; height: 48px; flex-shrink: 0;
  background: var(--tp-bg-input); border-radius: 6px;
}
.tp-pcb-modal-item-body { flex: 1; min-width: 0; }

/* ② モーダル内製品名リンク */
.tp-pcb-modal-item-name {
  font-size: 12px; font-weight: 700; color: var(--tp-text-main);
  line-height: 1.4; overflow: hidden; display: -webkit-box;
  -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom: 2px;
}
.tp-pcb-modal-item-name-link {
  color: var(--tp-text-main);
  text-decoration: underline;
  text-decoration-color: #cbd5e1;
  text-underline-offset: 2px;
  transition: color 0.15s;
}
.tp-pcb-modal-item-name-link:hover { color: var(--tp-cyan); text-decoration-color: var(--tp-cyan); }

.tp-pcb-modal-item-store {
  font-size: 10px; color: var(--tp-text-sub); margin-bottom: 3px;
  display: flex; align-items: center; gap: 5px; flex-wrap: wrap;
}
.tp-pcb-modal-item-price {
  display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap;
}
.tp-pcb-modal-item-eff   { font-size: 14px; font-weight: 900; font-style: italic; color: var(--tp-cyan); }
.tp-pcb-modal-item-orig  { font-size: 10px; color: var(--tp-text-sub); text-decoration: line-through; }
.tp-pcb-modal-item-pt    { font-size: 10px; color: #059669; }
.tp-pcb-modal-item-bonus {
  font-size: 9px; padding: 2px 6px; border-radius: 4px; font-weight: 700;
  background: #fff7ed; color: #ea580c; border: 1px solid #fdba74; white-space: nowrap;
}
.tp-pcb-modal-item-select-btn {
  flex-shrink: 0; padding: 7px 14px; background: #00c8b5 !important;
  color: #fff; border: none; border-radius: 6px; font-size: 11px;
  font-weight: 700; cursor: pointer; white-space: nowrap; transition: background 0.15s;
}
.tp-pcb-modal-item-select-btn:hover { background: #00a89a; }
.tp-pcb-modal-item-select-btn.tp-pcb-selected-btn {
  background: #e2e8f0 !important; color: !important; cursor: default;
}
.tp-pcb-modal-empty {
  text-align: center; padding: 40px 20px;
  color: var(--tp-text-sub); font-size: 13px;
}

/* ================================================================
 *  Toast ラッパー
 * ================================================================ */
#tp-pcb-toast-wrap {
  position: fixed; bottom: 20px; right: 20px; z-index: 10001;
  display: flex; flex-direction: column; gap: 8px; pointer-events: none;
}

/* ================================================================
 *  レスポンシブ
 * ================================================================ */
@media (max-width: 560px) {
  .tp-pcb-part-row   { padding: 10px 12px; gap: 8px; }
  .tp-pcb-part-cat   { width: 44px; }
  .tp-pcb-part-icon-img { width: 28px; height: 28px; }
  .tp-pcb-eff-price  { font-size: 20px; }
  .tp-pcb-modal      { max-height: 92vh; }
  .tp-pcb-modal-item { gap: 8px; padding: 8px 12px; }
  .tp-pcb-modal-item-img { width: 40px; height: 40px; }
  .tp-pcb-btn-change,
  .tp-pcb-btn-select { padding: 6px 10px; font-size: 10px; }
}

/* ================================================================
 *  LYPトグルON時ハイライト（tokupicks.cssの:has()が適用されない
 *  環境でも確実に動作するよう #tokupicks-pcbuilder スコープで再定義）
 * ================================================================ */
#tokupicks-pcbuilder .tp-option-lyp:has(input:checked) {
  background: #fef2f2;
  border-color: #ef4444;
  border-left: 4px solid #ef4444;
  padding-left: 13px;
}
#tokupicks-pcbuilder .tp-option-lyp:has(input:checked) .tp-opt-title {
  color: #dc2626;
}
#tokupicks-pcbuilder .tp-option-lyp:has(input:checked) .tp-opt-sub {
  color: #b91c1c;
}

/* ================================================================
 *  モーダル内フィルターエリア
 * ================================================================ */
.tp-pcb-modal-filters {
  padding: 10px 16px;
  border-bottom: 1px solid var(--tp-border);
  flex-shrink: 0;
  background: var(--tp-bg-main);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: flex-start;
}
.tp-pcb-modal-filter-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
}
.tp-pcb-modal-filter-label {
  font-size: 10px;
  font-weight: 700;
  color: var(--tp-text-sub);
  white-space: nowrap;
  flex-shrink: 0;
}
.tp-pcb-modal-filter-select {
  font-size: 11px;
  padding: 4px 22px 4px 8px;
  border: 1px solid var(--tp-border);
  border-radius: 6px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2364748b'/%3E%3C/svg%3E") no-repeat right 7px center;
  background-size: 8px;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  color: var(--tp-text-main);
  max-width: 180px;
}
.tp-pcb-modal-filter-select:focus {
  outline: none;
  border-color: var(--tp-cyan);
}

/* チェックボックスドロップダウン（モーダル内） */
.tp-pcb-cbdd-wrap {
  position: relative;
}
.tp-pcb-cbdd-btn {
  font-size: 11px;
  padding: 4px 8px;
  border: 1px solid var(--tp-border);
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--tp-text-main);
  white-space: nowrap;
  user-select: none;
}
.tp-pcb-cbdd-btn.tp-pcb-cbdd-active {
  border-color: var(--tp-cyan);
  background: #f0fdf9;
}
.tp-pcb-cbdd-badge {
  font-size: 9px;
  background: var(--tp-cyan);
  color: #fff;
  border-radius: 10px;
  padding: 1px 5px;
  font-weight: 700;
}
.tp-pcb-cbdd-panel {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 100;
  background: #fff;
  border: 1px solid var(--tp-border);
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.12);
  padding: 8px 0;
  min-width: 150px;
  max-height: 220px;
  overflow-y: auto;
}
.tp-pcb-cbdd-panel.tp-pcb-cbdd-open { display: block; }
.tp-pcb-cbdd-item {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 12px;
  font-size: 11px;
  cursor: pointer;
  color: var(--tp-text-main);
}
.tp-pcb-cbdd-item:hover { background: #f0fdf9; }
.tp-pcb-cbdd-item input[type="checkbox"] { flex-shrink: 0; cursor: pointer; }

/* ================================================================
 *  モーダル内ページネーション
 * ================================================================ */
.tp-pcb-modal-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 16px;
  border-top: 1px solid var(--tp-border);
  flex-shrink: 0;
  background: var(--tp-bg-main);
  gap: 8px;
}
.tp-pcb-modal-page-info {
  font-size: 10px;
  color: var(--tp-text-sub);
  white-space: nowrap;
}
.tp-pcb-modal-page-btns {
  display: flex;
  gap: 4px;
  align-items: center;
  flex-wrap: wrap;
}
.tp-pcb-modal-page-btn {
  padding: 3px 9px;
  font-size: 11px;
  border: 1px solid var(--tp-border);
  border-radius: 5px;
  background: #fff;
  cursor: pointer;
  color: var(--tp-text-main);
  transition: background 0.12s;
  white-space: nowrap;
}
.tp-pcb-modal-page-btn:hover:not(:disabled) { background: #f0fdf9; border-color: var(--tp-cyan); }
.tp-pcb-modal-page-btn.tp-pcb-page-current  { background: var(--tp-cyan); color: #fff; border-color: var(--tp-cyan); font-weight: 700; }
.tp-pcb-modal-page-btn:disabled             { opacity: 0.4; cursor: default; }
.tp-pcb-modal-page-dots                     { font-size: 11px; color: var(--tp-text-sub); padding: 0 2px; }

/* ================================================================
 *  テーマ干渉防止
 * ================================================================ */
#tokupicks-pcbuilder button { font-family: inherit; line-height: 1.4; }
#tokupicks-pcbuilder a      { text-decoration: none; }
#tokupicks-pcbuilder a.tp-pcb-selected-name-link,
#tokupicks-pcbuilder a.tp-pcb-modal-item-name-link { text-decoration: underline; }

/* Cocoonテーマのボタンスタイル競合を明示的に上書き */
#tokupicks-pcbuilder .tp-pcb-btn-change {
  background: var(--tp-bg-input) !important;
  color: var(--tp-text-main) !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 6px !important;
}
#tokupicks-pcbuilder .tp-pcb-btn-change:hover {
  background: #e2e8f0 !important;
}
#tokupicks-pcbuilder .tp-pcb-btn-select {
  background: var(--tp-cyan) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
}
#tokupicks-pcbuilder .tp-pcb-btn-select:hover {
  background: #00a89a !important;
}
#tokupicks-pcbuilder .tp-pcb-btn-remove {
  background: #fff5f5 !important;
  color: #dc2626 !important;
  border: 1px solid #fca5a5 !important;
  border-radius: 6px !important;
}
#tokupicks-pcbuilder .tp-pcb-btn-remove:hover {
  background: #fee2e2 !important;
}
#tokupicks-pcbuilder .tp-pcb-modal-item-select-btn {
  background: var(--tp-cyan) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
}
#tokupicks-pcbuilder .tp-pcb-modal-item-select-btn:hover {
  background: #00a89a !important;
}
#tokupicks-pcbuilder .tp-pcb-modal-item-select-btn.tp-pcb-selected-btn {
  background: #e2e8f0 !important;
  color: var(--tp-text-sub) !important;
  cursor: default !important;
}
#tokupicks-pcbuilder .tp-pcb-modal-close {
  background: var(--tp-bg-input) !important;
  color: var(--tp-text-sub) !important;
  border: 1px solid var(--tp-border) !important;
}
#tokupicks-pcbuilder .tp-pcb-modal-close:hover {
  background: #e2e8f0 !important;
}
#tokupicks-pcbuilder .tp-pcb-modal-page-btn {
  background: #fff !important;
  color: var(--tp-text-main) !important;
  border: 1px solid var(--tp-border) !important;
}
#tokupicks-pcbuilder .tp-pcb-modal-page-btn:hover:not(:disabled) {
  background: #f0fdf9 !important;
  border-color: var(--tp-cyan) !important;
}
#tokupicks-pcbuilder .tp-pcb-modal-page-btn.tp-pcb-page-current {
  background: var(--tp-cyan) !important;
  color: #fff !important;
  border-color: var(--tp-cyan) !important;
}
#tokupicks-pcbuilder .tp-pcb-modal-page-btn:disabled {
  opacity: 0.4 !important;
  background: #f3f4f6 !important;
  color: var(--tp-text-sub) !important;
}
#tokupicks-pcbuilder .tp-pcb-cbdd-btn {
  background: #fff !important;
  color: var(--tp-text-main) !important;
  border: 1px solid var(--tp-border) !important;
}
#tokupicks-pcbuilder .tp-btn-primary {
  background: var(--tp-orange) !important;
  color: #fff !important;
  border: none !important;
}
#tokupicks-pcbuilder .tp-btn-primary:hover {
  background: #e05e00 !important;
}
#tokupicks-pcbuilder .tp-btn-secondary {
  background: var(--tp-bg-input) !important;
  color: var(--tp-text-sub) !important;
  border: 1px solid var(--tp-border) !important;
}
#tokupicks-pcbuilder .tp-toggle-slider {
  background: #cbd5e1 !important;
}
#tokupicks-pcbuilder input:checked + .tp-toggle-slider {
  background: var(--tp-lyp-red) !important;
}
