/* Hornbill Publishing — front-end components */
.hb-form-wrap { max-width: 640px; margin: 0 auto; }
.hb-alert { padding: 14px 18px; border-radius: 8px; margin-bottom: 20px; font-size: 15px; }
.hb-alert-success { background: #e6f9ee; color: #0a6b3d; border: 1px solid #b6ecce; }
.hb-alert-error { background: #fdeaea; color: #a3221f; border: 1px solid #f5bcbc; }
.hb-alert-info { background: #eef3ff; color: #1e3a8a; border: 1px solid #c7d7fe; }

.hb-field { margin-bottom: 18px; }
.hb-field label { display: block; font-weight: 600; margin-bottom: 6px; }
.hb-field input[type="text"],
.hb-field input[type="email"],
.hb-field input[type="file"],
.hb-field textarea {
    width: 100%; padding: 10px 12px; border: 1px solid #d8dce3; border-radius: 8px;
    font-size: 15px; box-sizing: border-box;
}

.hb-btn {
    display: inline-block; padding: 12px 26px; border-radius: 999px; font-weight: 700;
    text-decoration: none; border: none; cursor: pointer; font-size: 15px;
    transition: transform .15s ease, box-shadow .15s ease;
}
.hb-btn-primary { background: linear-gradient(135deg,#ff6b35,#f7931e); color: #fff; }
.hb-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(247,147,30,.35); color:#fff; }
.hb-btn-small { padding: 8px 16px; font-size: 13px; }

.hb-dashboard-wrap { max-width: 960px; margin: 0 auto; }
.hb-dashboard-table { width: 100%; border-collapse: collapse; margin-top: 20px; }
.hb-dashboard-table th, .hb-dashboard-table td { text-align: left; padding: 12px 14px; border-bottom: 1px solid #eceef1; }
.hb-dashboard-table th { color: #6b7280; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; }

.hb-status { padding: 4px 12px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.hb-status-submitted { background:#eef3ff; color:#1e3a8a; }
.hb-status-in_review { background:#fff7e6; color:#8a5a00; }
.hb-status-changes_requested { background:#fdeaea; color:#a3221f; }
.hb-status-accepted { background:#e6f9ee; color:#0a6b3d; }
.hb-status-in_production { background:#f3e8ff; color:#6b21a8; }
.hb-status-published { background:#0a6b3d; color:#fff; }
.hb-status-rejected { background:#f3f4f6; color:#6b7280; }

.hb-books-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 28px;
}
.hb-book-card { text-align: center; }
.hb-book-cover img { width: 100%; border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.12); aspect-ratio: 2/3; object-fit: cover; }
.hb-book-card h3 { font-size: 16px; margin: 12px 0 4px; }
.hb-book-author { color: #6b7280; font-size: 13px; margin: 0 0 6px; }
.hb-book-price { font-weight: 700; margin: 0 0 10px; }

.hb-stats-bar {
    display: flex; justify-content: center; gap: 60px; padding: 40px 0; flex-wrap: wrap;
}
.hb-stat { text-align: center; }
.hb-stat-num { display: block; font-size: 40px; font-weight: 800; background: linear-gradient(135deg,#ff6b35,#f7931e); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hb-stat-label { color: #6b7280; font-size: 14px; }

@media (max-width: 640px) {
    .hb-stats-bar { gap: 32px; }
    .hb-stat-num { font-size: 30px; }
}

/* ---- Wizard ---- */
.hb-wizard-progress { display: flex; gap: 10px; margin-bottom: 28px; flex-wrap: wrap; }
.hb-wizard-dot { padding: 6px 14px; border-radius: 999px; background: #f1f2f5; color: #9aa0ab; font-size: 13px; font-weight: 700; }
.hb-wizard-dot.active { background: linear-gradient(135deg,#ff6b35,#f7931e); color: #fff; }
.hb-wizard-step { display: none; }

/* ---- Packages ---- */
.hb-packages-grid, .hb-distribution-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap: 24px; margin: 30px 0; }
.hb-package-card, .hb-distribution-card {
    background: #fff; border: 1px solid #eceef1; border-radius: 14px; padding: 28px; text-align: center;
}
.hb-package-tagline { color: #6b7280; font-size: 14px; min-height: 40px; }
.hb-package-price { font-size: 30px; font-weight: 800; margin: 10px 0 18px; }
.hb-package-features { list-style: none; padding: 0; margin: 0 0 22px; text-align: left; }
.hb-package-features li { padding: 6px 0 6px 22px; position: relative; font-size: 14px; color: #374151; }
.hb-package-features li::before { content: "✓"; position: absolute; left: 0; color: #0a6b3d; font-weight: 700; }

.hb-package-picker { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap: 14px; margin: 14px 0 24px; }
.hb-package-option {
    display: flex; flex-direction: column; gap: 6px; border: 2px solid #eceef1; border-radius: 12px; padding: 16px;
    cursor: pointer;
}
.hb-package-option input { margin-bottom: 6px; }
.hb-package-option-name { font-weight: 700; }
.hb-package-option-price { color: #6b7280; font-size: 14px; }

/* ---- Earnings calculator ---- */
#hb-earnings-calculator { max-width: 480px; margin: 0 auto; background: #fff; border: 1px solid #eceef1; border-radius: 14px; padding: 28px; }
.hb-calc-results { margin-top: 18px; border-top: 1px solid #eceef1; padding-top: 14px; }
.hb-calc-row { display: flex; justify-content: space-between; padding: 8px 0; font-size: 15px; }
.hb-calc-note { color: #9aa0ab; font-size: 12px; margin-top: 12px; }

/* ---- Share row ---- */
.hb-share-row { margin-top: 24px; display: flex; gap: 14px; align-items: center; font-size: 14px; }
.hb-share-row a { text-decoration: none; font-weight: 600; }

/* ---- KDP badge ---- */
.hb-kdp-badge { background: #eef3ff; color: #1e3a8a; padding: 10px 16px; border-radius: 8px; font-size: 14px; display: inline-block; margin-top: 16px; }

/* ---- Sales report ---- */
.hb-sales-report { max-width: 760px; margin: 0 auto; }

/* ---- Author copies (buy at cost) ---- */
.hb-author-copies { max-width: 480px; margin: 30px 0; }

/* ---- Package price row (paperback/hardcover) ---- */
.hb-package-price-row { display: flex; justify-content: center; gap: 24px; margin: 10px 0 18px; }
.hb-package-price-row div { display: flex; flex-direction: column; align-items: center; }
.hb-package-price-row span { font-size: 12px; color: #9aa0ab; text-transform: uppercase; letter-spacing: .03em; }
.hb-package-price-row strong { font-size: 22px; }

/* ---- Payment details / payout ---- */
.hb-payment-details, .hb-payout-request { max-width: 480px; margin: 30px 0; }
.hb-payout-fields { margin-top: 4px; }