.fcd-list { display: grid; gap: 20px; }
.fcd-coupon { display: flex; gap: 20px; border: 2px solid #e5e5e5; padding: 20px; background: #fff !important; color: #222 !important; align-items: flex-start; box-sizing: border-box; width: 100%; }
.fcd-discount { min-width: 110px; flex-shrink: 0; text-align: center; font-size: 28px; font-weight: 700; color: #d63638; }
.fcd-discount span { display: block; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: #666; }
.fcd-main { flex: 1; min-width: 0; }
.fcd-title { margin: 0 0 8px; font-size: 20px; color: #222; }
.fcd-title a { text-decoration: none; color: #222 !important; }
.fcd-desc { color: #444 !important; margin-bottom: 12px; }
.fcd-image img { max-width: 100%; height: auto; }
.fcd-copy-btn { position: relative; border: 2px dashed #d63638; background: #fff5f5 !important; color: #222 !important; padding: 12px 18px; font-size: 18px; font-weight: 700; cursor: pointer; }
.fcd-code-text { color: #222 !important; }
.fcd-template-3 .fcd-copy-btn, .fcd-template-9 .fcd-copy-btn { background: #fff !important; color: #222 !important; }
.fcd-template-3 .fcd-code-text, .fcd-template-9 .fcd-code-text { color: #222 !important; }
.fcd-deal-btn, .fcd-print-btn { display: inline-block; background: #2271b1; color: #fff; padding: 12px 20px; text-decoration: none; font-weight: 700; border: 0; cursor: pointer; }
.fcd-tooltip { display: block; font-size: 11px; font-weight: 400; color: #666; }
.fcd-meta { margin-top: 12px; font-size: 13px; color: #666; display: flex; flex-wrap: wrap; gap: 12px; }
.fcd-expired { color: #d63638; font-weight: 700; }
.fcd-countdown { font-weight: 700; color: #2271b1; }
.fcd-vote, .fcd-share { margin-top: 10px; display: flex; gap: 8px; flex-wrap: wrap; }
.fcd-vote-btn { cursor: pointer; background: #f6f7f7; border: 1px solid #ddd; padding: 6px 10px; }
.fcd-share a { font-size: 13px; color: #2271b1 !important; }
.fcd-vote-btn { color: #222 !important; }
.fcd-stat { color: #666 !important; }
.fcd-template-2 { border-style: dashed; }
.fcd-template-2 .fcd-discount { color: #2271b1; }
.fcd-template-3 { background: #1d2327; color: #fff; }
.fcd-template-3 .fcd-title a, .fcd-template-3 .fcd-desc, .fcd-template-3 .fcd-meta { color: #ddd; }
.fcd-template-4 { border-radius: 16px; box-shadow: 0 8px 24px rgba(0,0,0,.08); border-color: #eee; }
.fcd-filter { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 20px; }
.fcd-pagination a { display: inline-block; padding: 6px 12px; border: 1px solid #ddd; margin-right: 4px; text-decoration: none; }
.fcd-pagination a.current { background: #2271b1; color: #fff; }
.fcd-submit-form { max-width: 640px; }
.fcd-notice { background: #e6f4ea; border: 1px solid #a3d9a5; padding: 12px; }
@media (max-width: 600px) {
  .fcd-coupon { flex-direction: column; }
  .fcd-discount { text-align: left; }
}

.fcd-template-5 { background: #fff7ed; border-color: #f59e0b; }
.fcd-template-5 .fcd-discount { color: #b45309; }
.fcd-template-6 .fcd-discount { background: #2271b1; color: #fff; border-radius: 50%; width: 110px; height: 110px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.fcd-template-6 .fcd-discount span { color: #fff; }
.fcd-powered { font-size: 12px; color: #999; margin-top: 8px; }
.fcd-code-only { font-size: 16px; }

#fcd-live-preview { border: 2px dashed #999; padding: 10px; }
.fcd-vote-msg { font-size: 13px; color: #2271b1; margin-left: 8px; }

.fcd-template-7 { border: 2px solid #9b59b6; }
.fcd-template-7 .fcd-discount { border-radius: 12px 12px 12px 0; padding: 12px; }
.fcd-template-7 .fcd-desc { border-top: 2px dashed #ccc; border-bottom: 2px dashed #ccc; padding: 10px 0; }
.fcd-template-7 .fcd-copy-btn, .fcd-template-7 .fcd-deal-btn { clip-path: polygon(0 0, 100% 0, 94% 100%, 0 100%); padding-right: 30px; }
.fcd-template-8 { border: 2px solid #1abc9c; }
.fcd-template-8 .fcd-discount { background: #1abc9c; color: #fff; padding: 12px; border-radius: 8px; }
.fcd-template-9 { background: #2c3e50; color: #fff; }
.fcd-template-9 .fcd-title a, .fcd-template-9 .fcd-desc, .fcd-template-9 .fcd-meta { color: #ddd; }

/* Template 7 - preview style */
.fcd-7 { background: #fff !important; color: #222 !important; border: 2px solid #9b59b6; padding: 20px; gap: 24px; }
.fcd-7-left { width: 170px; flex-shrink: 0; }
.fcd-7-discount { position: relative; text-align: center; font-size: 28px; font-weight: 800; padding: 14px 10px 18px; border-radius: 12px; margin-bottom: 14px; }
.fcd-7-discount::after { content: ""; position: absolute; left: 50%; bottom: -8px; width: 18px; height: 18px; background: inherit; transform: translateX(-50%) rotate(45deg); }
.fcd-7-left .fcd-7-discount { background: #9b59b6; color: #fff; }
.fcd-7-image img { width: 100%; height: auto; display: block; box-shadow: 0 4px 10px rgba(0,0,0,.2); }
.fcd-7-placeholder { width: 100%; aspect-ratio: 1 / 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; box-shadow: 0 4px 10px rgba(0,0,0,.2); }
.fcd-7-middle { flex: 1; min-width: 0; }
.fcd-7-middle .fcd-title { font-size: 24px; line-height: 1.3; color: #222; }
.fcd-7-middle .fcd-title a { color: #222 !important; }
.fcd-7-middle .fcd-desc { color: #444 !important; font-size: 16px; line-height: 1.5; }
.fcd-7-dashed { border-top: 2px dashed #333; margin: 14px 0; }
.fcd-7-right { width: 230px; flex-shrink: 0; padding-top: 8px; }
.fcd-7-codebox { display: flex; align-items: stretch; height: 56px; background: repeating-linear-gradient(45deg, #eee 0 10px, #f9f9f9 10px 20px); border: 1px solid #ddd; overflow: hidden; }
.fcd-7-codebox .fcd-7-btn { flex: 1; border: 0 !important; border-radius: 0; clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%); padding-right: 28px; font-size: 15px; letter-spacing: 1px; }
.fcd-7-codebox .fcd-7-btn .fcd-code-text { color: inherit !important; }
.fcd-7-peek { width: 58px; display: flex; align-items: center; justify-content: center; font-weight: 700; color: #222; overflow: hidden; white-space: nowrap; }
.fcd-7 .fcd-deal-btn.fcd-7-btn { width: 100%; text-align: center; clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%); }
@media (max-width: 700px) {
  .fcd-7 { flex-direction: column; }
  .fcd-7-left, .fcd-7-right { width: 100%; }
}
