/* BOLTON RFQ — My Account portal. Theme-friendly, dark/light aware, responsive, accessible.
   Status is never conveyed by colour alone (each badge carries its text label + a dot). */

.bolton-rfq-portal {
  --brfq-bg: #ffffff;
  --brfq-fg: #1a1f26;
  --brfq-muted: #5b6470;
  --brfq-line: #e4e8ee;
  --brfq-card: #f7f9fc;
  --brfq-accent: #b8860b;            /* BOLTON gold */
  --brfq-accent-fg: #1a1f26;
  --brfq-radius: 10px;
  color: var(--brfq-fg);
  font-size: 15px;
  line-height: 1.5;
}
@media (prefers-color-scheme: dark) {
  .bolton-rfq-portal {
    --brfq-bg: #11151b;
    --brfq-fg: #e7ecf3;
    --brfq-muted: #9aa6b3;
    --brfq-line: #2a323d;
    --brfq-card: #161c24;
    --brfq-accent: #d8a93a;
    --brfq-accent-fg: #11151b;
  }
}

.bolton-rfq-h { margin: 0 0 .75rem; font-weight: 700; letter-spacing: .2px; }
.bolton-rfq-portal a { color: var(--brfq-accent); }
.bolton-rfq-sub { color: var(--brfq-muted); font-size: .85em; }
.bolton-rfq-hint { color: var(--brfq-muted); font-size: .85em; margin: .35rem 0 0; }

/* Table (desktop) */
.bolton-rfq-table { width: 100%; border-collapse: collapse; margin: .5rem 0 1rem; }
.bolton-rfq-table th, .bolton-rfq-table td { text-align: left; padding: .6rem .65rem; border-bottom: 1px solid var(--brfq-line); vertical-align: top; }
.bolton-rfq-table thead th { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--brfq-muted); }

/* Status badge — colour + dot + text (not colour alone) */
.bolton-rfq-badge { display: inline-flex; align-items: center; gap: .4em; padding: .2em .6em; border-radius: 999px; font-size: .8rem; font-weight: 600; border: 1px solid var(--brfq-line); background: var(--brfq-card); white-space: nowrap; }
.bolton-rfq-badge-dot { width: .55em; height: .55em; border-radius: 50%; background: var(--brfq-muted); flex: 0 0 auto; }
.bolton-rfq-badge--submitted .bolton-rfq-badge-dot,
.bolton-rfq-badge--under_review .bolton-rfq-badge-dot { background: #3b82f6; }
.bolton-rfq-badge--clarification_required .bolton-rfq-badge-dot { background: #f59e0b; }
.bolton-rfq-badge--sourcing_pricing .bolton-rfq-badge-dot { background: #8b5cf6; }
.bolton-rfq-badge--quotation_issued .bolton-rfq-badge-dot,
.bolton-rfq-badge--customer_review .bolton-rfq-badge-dot { background: #0ea5e9; }
.bolton-rfq-badge--accepted .bolton-rfq-badge-dot,
.bolton-rfq-badge--converted_to_order .bolton-rfq-badge-dot { background: #22c55e; }
.bolton-rfq-badge--closed .bolton-rfq-badge-dot { background: #64748b; }
.bolton-rfq-badge--declined .bolton-rfq-badge-dot,
.bolton-rfq-badge--unable_to_quote .bolton-rfq-badge-dot,
.bolton-rfq-badge--cancelled .bolton-rfq-badge-dot,
.bolton-rfq-badge--expired .bolton-rfq-badge-dot { background: #ef4444; }

.bolton-rfq-pill { display: inline-block; padding: .12em .5em; border-radius: 6px; font-size: .72rem; font-weight: 600; background: var(--brfq-card); border: 1px solid var(--brfq-line); color: var(--brfq-muted); }
.bolton-rfq-pill--quote { color: var(--brfq-accent); border-color: var(--brfq-accent); }

/* Buttons */
.bolton-rfq-btn { display: inline-block; background: var(--brfq-accent); color: var(--brfq-accent-fg); border: 1px solid var(--brfq-accent); padding: .5rem .9rem; border-radius: 8px; font-weight: 600; text-decoration: none; cursor: pointer; }
.bolton-rfq-btn--sm { padding: .3rem .65rem; font-size: .85rem; }
.bolton-rfq-btn--ghost { background: transparent; color: var(--brfq-fg); border-color: var(--brfq-line); }
.bolton-rfq-btn:hover { filter: brightness(.96); }

/* Detail */
.bolton-rfq-detail-head { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin-bottom: .5rem; }
.bolton-rfq-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .5rem 1rem; margin: 0 0 1rem; }
.bolton-rfq-meta dt { font-size: .75rem; text-transform: uppercase; color: var(--brfq-muted); }
.bolton-rfq-meta dd { margin: 0; font-weight: 600; }
.bolton-rfq-section { margin: 1.25rem 0; padding-top: 1rem; border-top: 1px solid var(--brfq-line); }
.bolton-rfq-section h3 { margin: 0 0 .5rem; font-size: 1.05rem; }

/* Files + timeline */
.bolton-rfq-files { list-style: none; margin: 0; padding: 0; }
.bolton-rfq-files li { padding: .4rem 0; border-bottom: 1px dashed var(--brfq-line); }
.bolton-rfq-timeline { list-style: none; margin: 0; padding: 0; }
.bolton-rfq-event { position: relative; padding: .55rem 0 .55rem 1.1rem; border-left: 2px solid var(--brfq-line); margin-left: .35rem; }
.bolton-rfq-event::before { content: ""; position: absolute; left: -.42rem; top: .8rem; width: .7rem; height: .7rem; border-radius: 50%; background: var(--brfq-accent); }
.bolton-rfq-event-meta { display: block; font-size: .78rem; color: var(--brfq-muted); }
.bolton-rfq-event-body { display: block; }

/* Forms */
.bolton-rfq-reply textarea, .bolton-rfq-claim-form input[type=text], .bolton-rfq-reply input[type=file] { width: 100%; max-width: 520px; padding: .5rem; border: 1px solid var(--brfq-line); border-radius: 8px; background: var(--brfq-bg); color: var(--brfq-fg); }
.bolton-rfq-reply label, .bolton-rfq-claim-form label { display: block; font-weight: 600; margin: .35rem 0 .25rem; }
.bolton-rfq-claim { margin: .5rem 0 1rem; padding: .5rem .75rem; background: var(--brfq-card); border: 1px solid var(--brfq-line); border-radius: var(--brfq-radius); }
.bolton-rfq-claim summary { cursor: pointer; font-weight: 600; }
.bolton-rfq-actions { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: 1rem; }
.bolton-rfq-inline-form { display: inline-flex; align-items: center; gap: .5rem; flex-wrap: wrap; }

/* Empty / pager */
.bolton-rfq-empty { padding: 1.25rem; background: var(--brfq-card); border: 1px solid var(--brfq-line); border-radius: var(--brfq-radius); text-align: center; }
.bolton-rfq-pager { display: flex; gap: .35rem; flex-wrap: wrap; }
.bolton-rfq-page { display: inline-block; padding: .3rem .6rem; border: 1px solid var(--brfq-line); border-radius: 6px; text-decoration: none; }
.bolton-rfq-page[aria-current=page] { background: var(--brfq-accent); color: var(--brfq-accent-fg); border-color: var(--brfq-accent); }

/* Focus visibility */
.bolton-rfq-portal a:focus-visible, .bolton-rfq-portal button:focus-visible, .bolton-rfq-portal summary:focus-visible, .bolton-rfq-portal input:focus-visible, .bolton-rfq-portal textarea:focus-visible { outline: 3px solid var(--brfq-accent); outline-offset: 2px; }

/* Mobile: table → cards (uses data-label set in markup) */
@media (max-width: 600px) {
  .bolton-rfq-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .bolton-rfq-table, .bolton-rfq-table tbody, .bolton-rfq-table tr, .bolton-rfq-table td { display: block; width: 100%; }
  .bolton-rfq-table tr { margin: 0 0 .85rem; border: 1px solid var(--brfq-line); border-radius: var(--brfq-radius); padding: .35rem .6rem; background: var(--brfq-card); }
  .bolton-rfq-table td { border: 0; padding: .35rem 0; display: flex; justify-content: space-between; gap: 1rem; }
  .bolton-rfq-table td::before { content: attr(data-label); font-weight: 600; color: var(--brfq-muted); }
  .bolton-rfq-table td a, .bolton-rfq-table td .bolton-rfq-badge { text-align: right; }
}

@media (prefers-reduced-motion: reduce) {
  .bolton-rfq-portal * { transition: none !important; animation: none !important; }
}