.ukc-addons-modern { background:#fff; border:1px solid var(--ukc-line); border-radius:6px; overflow:hidden; }
.ukc-addons-hero { align-items:flex-start; background:#f4f8fc; border-bottom:1px solid var(--ukc-line); display:flex; gap:24px; justify-content:space-between; padding:26px 28px; }
.ukc-addons-hero h3,.ukc-addons-hero p,.ukc-addons-list h4,.ukc-addon-item h5 { letter-spacing:0; margin:0; }
.ukc-addons-hero h3 { color:var(--ukc-ink); font-size:27px; line-height:1.15; }
.ukc-addons-hero > div > p:last-child { color:var(--ukc-muted); font-size:14px; line-height:1.55; margin-top:8px; max-width:680px; }
.ukc-addons-status { flex:0 0 auto; }
.ukc-addons-summary,.ukc-addons-facts { border-bottom:1px solid var(--ukc-line); display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.ukc-addons-summary > div,.ukc-addons-facts > div { align-items:flex-start; display:flex; gap:11px; min-width:0; padding:16px 18px; }
.ukc-addons-summary > div + div,.ukc-addons-facts > div + div { border-left:1px solid var(--ukc-line); }
.ukc-addons-summary i,.ukc-addons-facts i { color:var(--ukc-blue-dark); font-size:16px; margin-top:3px; text-align:center; width:18px; }
.ukc-addons-summary span,.ukc-addons-summary strong,.ukc-addons-summary small,.ukc-addons-facts span,.ukc-addons-facts strong,.ukc-addons-facts small { display:block; }
.ukc-addons-summary strong,.ukc-addons-facts strong { color:var(--ukc-ink); font-size:13px; }
.ukc-addons-summary small,.ukc-addons-facts small { color:var(--ukc-muted); font-size:12px; line-height:1.45; margin-top:2px; }
.ukc-addons-notice { align-items:flex-start; background:#f8fafc; border-bottom:1px solid var(--ukc-line); color:var(--ukc-muted); display:flex; font-size:13px; gap:10px; line-height:1.55; padding:14px 28px; }
.ukc-addons-notice i { color:var(--ukc-blue); margin-top:3px; }
.ukc-addons-notice strong { color:var(--ukc-ink); }
.ukc-addons-list { padding:24px 28px 28px; }
.ukc-addon-item { align-items:center; border:1px solid var(--ukc-line); border-radius:6px; display:grid; gap:16px; grid-template-columns:48px minmax(0,1fr) minmax(190px,auto); margin-top:16px; padding:18px; }
.ukc-addon-item.is-active { border-color:#b7dfc8; }
.ukc-addon-icon { align-items:center; background:#edf6fc; border-radius:50%; color:var(--ukc-blue-dark); display:flex; font-size:19px; height:44px; justify-content:center; width:44px; }
.ukc-addon-item.is-active .ukc-addon-icon { background:#e9f7ef; color:var(--ukc-green); }
.ukc-addon-copy { min-width:0; }
.ukc-addon-title-row { align-items:center; display:flex; gap:10px; justify-content:flex-start; }
.ukc-addon-title-row h5 { color:var(--ukc-ink); font-size:16px; }
.ukc-addon-state { border-radius:999px; display:inline-flex; flex:0 0 auto; font-size:10px; font-weight:700; gap:5px; padding:4px 8px; }
.ukc-addon-state.is-available { background:#edf6fc; color:var(--ukc-blue-dark); }
.ukc-addon-state.is-active { background:#e9f7ef; color:var(--ukc-green); }
.ukc-addon-copy > p { color:var(--ukc-muted); font-size:13px; line-height:1.5; margin:6px 0 0; }
.ukc-addon-meta { display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:9px; }
.ukc-addon-meta span { color:#6d7d90; font-size:11px; }
.ukc-addon-meta i { color:var(--ukc-blue-dark); margin-right:5px; }
.ukc-addon-action { align-items:flex-end; display:flex; flex-direction:column; gap:8px; margin:0; min-width:190px; }
.ukc-addon-price { color:var(--ukc-ink); font-size:13px; font-weight:700; }
.ukc-addon-primary,.ukc-addon-secondary,.ukc-addon-disable { align-items:center; border-radius:4px; display:inline-flex; font-size:13px; font-weight:700; gap:7px; justify-content:center; min-height:40px; padding:8px 13px; white-space:nowrap; }
.ukc-addon-primary { background:var(--ukc-blue); border:1px solid var(--ukc-blue); color:#fff; }
.ukc-addon-primary:hover,.ukc-addon-primary:focus { background:var(--ukc-blue-dark); border-color:var(--ukc-blue-dark); color:#fff; }
.ukc-addon-secondary { background:#fff; border:1px solid #9ebcd4; color:var(--ukc-blue-dark); }
.ukc-addon-secondary:hover,.ukc-addon-secondary:focus { background:#f4f8fc; border-color:var(--ukc-blue); color:var(--ukc-blue-dark); }
.ukc-addon-disable { background:#fff; border:1px solid #d59a98; color:#9d2f2c; }
.ukc-addon-disable:hover,.ukc-addon-disable:focus { background:#fff5f5; border-color:var(--ukc-red); color:#8f2926; }
.ukc-addons-empty { align-items:center; background:#f8fafc; border:1px solid var(--ukc-line); display:flex; gap:12px; margin-top:16px; padding:18px; }
.ukc-addons-empty > i { color:var(--ukc-green); font-size:20px; }
.ukc-addons-empty span,.ukc-addons-empty strong,.ukc-addons-empty small { display:block; }
.ukc-addons-empty strong { color:var(--ukc-ink); font-size:14px; }
.ukc-addons-empty small { color:var(--ukc-muted); font-size:12px; margin-top:3px; }
.ukc-addons-facts { border-bottom:0; border-top:1px solid var(--ukc-line); }
@media (max-width:767px) {
  .ukc-addons-hero { display:block; padding:21px 18px; }
  .ukc-addons-status { margin-top:14px; }
  .ukc-addons-summary,.ukc-addons-facts { grid-template-columns:1fr; }
  .ukc-addons-summary > div + div,.ukc-addons-facts > div + div { border-left:0; border-top:1px solid var(--ukc-line); }
  .ukc-addons-notice { padding:14px 18px; }
  .ukc-addons-list { padding:21px 18px 24px; }
  .ukc-addon-item { align-items:start; grid-template-columns:40px minmax(0,1fr); padding:15px; }
  .ukc-addon-icon { font-size:17px; height:38px; width:38px; }
  .ukc-addon-action { align-items:stretch; border-top:1px solid var(--ukc-line); grid-column:1 / -1; min-width:0; padding-top:14px; }
  .ukc-addon-price { text-align:left; }
  .ukc-addon-primary,.ukc-addon-secondary,.ukc-addon-disable { min-height:44px; width:100%; }
}