/* ATLAS – page « Marché en direct » (thème sombre) */

body.pm {
  background: #0A1420;
  color: #E6EDF5;
  --pm-panel: #11223A;
  --pm-panel-2: #0E1B2E;
  --pm-line: #22385A;
  --pm-muted: #8FA3B8;
  --pm-up: #34D399;
  --pm-down: #FF6B7A;
  --pm-amber: #F59E0B;
  --pm-blue: #6EA8FF;
}

/* ---------- En-tête de page ---------- */
.pm-head { background: #0D1B2A; border-bottom: 1px solid var(--pm-line); background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 39px, rgba(255, 255, 255, .05) 39px, rgba(255, 255, 255, .05) 40px); }
.pm-head-inner { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px 48px; padding-top: 48px; padding-bottom: 40px; }
.pm-title { display: flex; flex-direction: column; gap: 12px; max-width: 640px; }
.pm-title h1 { font-weight: 800; font-size: clamp(32px, 4vw, 48px); color: #FFFFFF; }
.pm-sub { color: var(--soft); font-size: 15px; }
.pm-live { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.pm-live .status { background: #11223A; border-color: var(--pm-line); color: #FFFFFF; }
.pm-updated { font-size: 12px; color: var(--pm-muted); }
.pm-live-actions { display: flex; gap: 10px; align-items: center; }
.pm-live-actions .btn-sm { margin-left: 0; }

.pm-body { padding-top: 32px; padding-bottom: 80px; display: flex; flex-direction: column; gap: 20px; }

/* ---------- Panneaux ---------- */
.pm-panel { background: var(--pm-panel); border: 1px solid var(--pm-line); border-radius: 14px; }

/* Résumé */
.pm-summary { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.pm-card { background: var(--pm-panel); border: 1px solid var(--pm-line); border-radius: 14px; padding: 18px 20px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.pm-card-t { font: 600 11px var(--mono); letter-spacing: 1.5px; text-transform: uppercase; color: var(--pm-muted); }
.pm-card-n { font-weight: 800; font-size: 38px; line-height: 1; font-variant-numeric: tabular-nums; }
.pm-card-n.sm { font-size: 22px; line-height: 1.5; color: #FFFFFF; word-break: break-all; }
.pm-card-n.up, .pm-top .up span { color: var(--pm-up); }
.pm-card-n.down, .pm-top .down span { color: var(--pm-down); }
.pm-card-s { font-size: 12px; color: var(--pm-muted); }
.pm-top { display: flex; flex-direction: column; gap: 6px; font-variant-numeric: tabular-nums; }
.pm-top li { display: flex; justify-content: space-between; font-size: 14px; }
.pm-top .flat span { color: var(--pm-muted); }

/* Barre d'outils */
.pm-toolbar { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 14px; padding: 20px; }
.pm-search { position: relative; display: flex; align-items: center; }
.pm-search svg { position: absolute; left: 14px; color: var(--pm-muted); pointer-events: none; }
.pm-search input { padding-left: 42px; }
.pm-toolbar input, .pm-select, .pm-input {
  width: 100%; padding: 12px 14px; font: 400 14px var(--font); color: #E6EDF5;
  background: var(--pm-panel-2); border: 1px solid var(--pm-line); border-radius: 10px;
}
.pm-toolbar input::placeholder, .pm-input::placeholder { color: var(--pm-muted); }
.pm-select { appearance: none; -webkit-appearance: none; padding-right: 38px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%238FA3B8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; }
.pm-select option { background: #0E1B2E; color: #E6EDF5; }
.pm-select-sm { padding: 9px 36px 9px 12px; font-size: 13px; width: auto; }
.pm-toolbar input:focus, .pm-select:focus, .pm-input:focus { outline: 3px solid var(--accent); outline-offset: 0; border-color: var(--accent); box-shadow: none; }
.pm-toolbar-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 10px; }

.pm-btn {
  display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px; border-radius: 10px; cursor: pointer;
  font: 600 14px var(--font); color: #E6EDF5; background: var(--pm-panel-2); border: 1px solid var(--pm-line);
  transition: background .2s ease, border-color .2s ease, transform .15s ease;
}
.pm-btn:hover { border-color: #3A5A8A; transform: translateY(-1px); }
.pm-btn[aria-pressed="true"] { background: rgba(245, 158, 11, .15); border-color: var(--pm-amber); color: #FCD34D; }
.pm-btn-primary { background: var(--accent); border-color: var(--accent); color: var(--ink); font-weight: 800; }
.pm-btn-primary:hover { background: #FF8350; border-color: #FF8350; }

/* Légende */
.pm-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 14px 20px; }
.legend-chip { display: inline-flex; align-items: center; gap: 10px; padding: 7px 14px 7px 8px; border-radius: 10px; cursor: pointer; font: 500 14px var(--font); color: #E6EDF5; background: transparent; border: 1px solid transparent; transition: opacity .2s ease, background .2s ease; }
.legend-chip:hover { background: rgba(255, 255, 255, .05); }
.legend-chip[aria-pressed="false"] { opacity: .4; }
.legend-chip em { font: 600 12px var(--mono); font-style: normal; color: var(--pm-muted); }
.pm-count { margin-left: auto; font-size: 12px; color: var(--pm-muted); }

.badge { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; padding: 3px 8px; border-radius: 6px; font: 700 12px var(--mono); }
.badge.T { background: rgba(16, 185, 129, .2); color: var(--pm-up); }
.badge.NT { background: rgba(245, 158, 11, .2); color: var(--pm-amber); }
.badge.S { background: rgba(255, 107, 122, .2); color: var(--pm-down); }

/* ---------- Tableau ---------- */
.pm-table-wrap { max-height: 72vh; overflow: auto; background: var(--pm-panel-2); border: 1px solid var(--pm-line); border-radius: 14px; }
.pm-table { width: 100%; min-width: 1060px; border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; }
.pm-table th, .pm-table td { padding: 0 14px; border-bottom: 1px solid #1B2F4D; border-right: 1px solid #16294A; white-space: nowrap; }
.pm-table th:last-child, .pm-table td:last-child { border-right: 0; }
.pm-table .num { text-align: right; }

.pm-table thead th { position: sticky; z-index: 3; background: linear-gradient(#1D3A64, #152B4C); color: #FFFFFF; font: 700 11px var(--font); letter-spacing: .8px; text-transform: uppercase; border-bottom: 1px solid #2A4670; }
.pm-table .hr1 th { top: 0; height: 42px; }
.pm-table .hr2 th { top: 42px; height: 36px; }
.pm-table .hr3 th { top: 78px; height: 34px; }
.pm-table .hr1 th[rowspan] { top: 0; vertical-align: middle; }
.pm-table th.grp { background: #34495F; color: var(--pm-amber); border-top: 3px solid var(--pm-amber); text-align: center; }
.pm-table th.sell { background: #4B3548; color: #FF9BA6; text-align: center; }
.pm-table .hr3 th.sell { text-align: right; background: #1B2C4F; }
.pm-table th.buy { background: #1F4A52; color: #5EE6B8; text-align: center; }
.pm-table .hr3 th.buy { text-align: right; background: #1B2C4F; }
.pm-table th.c-star { width: 52px; text-align: center; color: var(--pm-amber); font-size: 15px; }
.pm-table th.c-exp { width: 52px; }
.pm-table th.c-ins { text-align: left; min-width: 190px; }
.pm-table th.c-st { text-align: center; width: 84px; }
.pm-table th button { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; }
.pm-table th button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.sort-i { width: 10px; height: 14px; position: relative; opacity: .55; }
.sort-i::before, .sort-i::after { content: ""; position: absolute; left: 1px; border: 4px solid transparent; }
.sort-i::before { top: -1px; border-bottom-color: currentColor; }
.sort-i::after { bottom: -1px; border-top-color: currentColor; }
th[aria-sort="ascending"] .sort-i, th[aria-sort="descending"] .sort-i { opacity: 1; color: var(--accent); }
th[aria-sort="ascending"] .sort-i::after, th[aria-sort="descending"] .sort-i::before { opacity: .2; }

.pm-table tbody td { height: 52px; font-size: 14px; background: #10203A; transition: background .2s ease; }
.pm-table tbody tr.pm-row:hover td { background: #152A49; }
.pm-table td.sell { background: rgba(255, 107, 122, .07); color: #FF8791; }
.pm-table td.sell.p { color: var(--pm-down); font-weight: 600; }
.pm-table td.buy { background: rgba(16, 185, 129, .07); color: #5EE6B8; }
.pm-table td.buy.p { color: var(--pm-up); font-weight: 600; }
.pm-table td.last { color: #FFFFFF; font-weight: 800; }
.pm-table td.muted, .muted { color: var(--pm-muted); }
.pm-row.up td.var { color: var(--pm-up); font-weight: 600; }
.pm-row.down td.var { color: var(--pm-down); font-weight: 600; }
.pm-row.flat td.var { color: var(--pm-muted); }
.pm-table td.c-star, .pm-table td.c-exp, .pm-table td.c-st { text-align: center; padding: 0 8px; }
.c-ins b { display: block; color: var(--pm-blue); font-weight: 800; font-size: 15px; letter-spacing: .5px; }
.c-ins small { display: block; max-width: 220px; overflow: hidden; text-overflow: ellipsis; color: var(--pm-muted); font-size: 11px; }

.star { all: unset; cursor: pointer; font-size: 20px; line-height: 1; color: var(--pm-muted); padding: 6px; border-radius: 8px; transition: color .2s ease, transform .2s cubic-bezier(.3, 1.6, .5, 1); }
.star:hover { color: var(--pm-amber); transform: scale(1.2); }
.star.on { color: var(--pm-amber); }
.chev { all: unset; cursor: pointer; display: inline-flex; padding: 7px; border-radius: 8px; background: rgba(110, 168, 255, .14); color: var(--pm-blue); transition: transform .25s ease, background .2s ease; }
.chev:hover { background: rgba(110, 168, 255, .28); }
.chev[aria-expanded="true"] { transform: rotate(180deg); }
.star:focus-visible, .chev:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.pm-table td.flash-up { animation: pm-up 1.1s ease; }
.pm-table td.flash-down { animation: pm-down 1.1s ease; }
@keyframes pm-up { 0% { background: rgba(52, 211, 153, .45); } 100% { background: #10203A; } }
@keyframes pm-down { 0% { background: rgba(255, 107, 122, .45); } 100% { background: #10203A; } }

/* Ligne de détails */
.pm-detail td { padding: 0; background: #0D1A2F !important; }
.pm-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px 28px; padding: 22px 28px; animation: pm-open .3s ease; white-space: normal; }
@keyframes pm-open { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.pm-detail-grid span { display: block; font: 600 10px var(--mono); letter-spacing: 1.5px; text-transform: uppercase; color: var(--pm-muted); margin-bottom: 4px; }
.pm-detail-grid b { font-size: 15px; color: #FFFFFF; font-weight: 600; }
.pm-detail.up .v { color: var(--pm-up); }
.pm-detail.down .v { color: var(--pm-down); }
.pm-detail-spark { grid-column: span 2; }
.pm-detail-spark .spark { width: 200px; height: 44px; }
.pm-detail.up .spark polyline { stroke: var(--pm-up); }
.pm-detail.down .spark polyline { stroke: var(--pm-down); }
.pm-detail.flat .spark polyline { stroke: var(--pm-muted); }
.pm-detail-actions { grid-column: span 2; display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.pm-empty { text-align: center; padding: 48px !important; color: var(--pm-muted); }
.pm-note { color: var(--pm-muted) !important; }

/* ---------- Outils ---------- */
.pm-tools { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.pm-tool { padding: 28px; display: flex; flex-direction: column; gap: 16px; }
.pm-tool h2 { font-weight: 800; font-size: 22px; color: #FFFFFF; }
.pm-tool-sub { font-size: 14px; color: var(--pm-muted); }
.pm-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pm-form-alert { grid-template-columns: 1fr 1fr; }
.pm-form-alert .pm-field:first-child { grid-column: 1 / -1; }
.pm-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pm-field label { font-size: 12px; font-weight: 600; color: var(--pm-muted); }
.pm-tool .pm-btn { align-self: flex-start; }
.pm-result { margin: 4px 0 0; display: flex; flex-direction: column; gap: 10px; padding: 18px; background: var(--pm-panel-2); border: 1px solid var(--pm-line); border-radius: 12px; }
.pm-result div { display: flex; justify-content: space-between; gap: 16px; align-items: baseline; }
.pm-result dt { font-size: 13px; color: var(--pm-muted); }
.pm-result dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.pm-result .big dd { font-size: 20px; font-weight: 800; }
.pm-result .up { color: var(--pm-up); }
.pm-result .down { color: var(--pm-down); }

.pm-alerts { display: flex; flex-direction: column; gap: 8px; }
.pm-alerts li { display: flex; align-items: center; gap: 14px; padding: 12px 14px; background: var(--pm-panel-2); border: 1px solid var(--pm-line); border-left: 4px solid var(--pm-amber); border-radius: 10px; font-size: 14px; }
.pm-alerts li.done { border-left-color: var(--pm-up); }
.pm-alerts li span { flex: 1; font-variant-numeric: tabular-nums; }
.pm-alerts li em { font: 500 12px var(--mono); font-style: normal; color: var(--pm-muted); }
.pm-alerts .pm-empty-li { border-left-color: var(--pm-line); color: var(--pm-muted); }
.pm-x { all: unset; cursor: pointer; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; border-radius: 8px; font-size: 20px; color: var(--pm-muted); }
.pm-x:hover { background: rgba(255, 107, 122, .2); color: var(--pm-down); }
.pm-x:focus-visible { outline: 2px solid var(--accent); }

/* ---------- Notifications ---------- */
.pm-toasts { position: fixed; left: 24px; bottom: 24px; z-index: 80; display: flex; flex-direction: column; gap: 10px; max-width: min(420px, calc(100vw - 48px)); }
.pm-toast { padding: 14px 18px; background: #11223A; color: #FFFFFF; border: 1px solid var(--pm-line); border-left: 4px solid var(--accent); border-radius: 10px; font-size: 14px; box-shadow: 0 12px 32px rgba(0, 0, 0, .45); animation: pm-toast-in .4s cubic-bezier(.2, .8, .2, 1); transition: opacity .4s ease, transform .4s ease; }
.pm-toast.strong { border-left-color: var(--pm-up); font-weight: 600; }
.pm-toast.out { opacity: 0; transform: translateX(-20px); }
@keyframes pm-toast-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .pm-summary { grid-template-columns: repeat(3, 1fr); }
  .pm-toolbar { grid-template-columns: 1fr 1fr; }
  .pm-search { grid-column: 1 / -1; }
  .pm-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .pm-tools { grid-template-columns: 1fr; }
  .pm-live { align-items: flex-start; }
}
@media (max-width: 640px) {
  .pm-summary { grid-template-columns: 1fr 1fr; }
  .pm-toolbar { grid-template-columns: 1fr; }
  .pm-form, .pm-form-alert { grid-template-columns: 1fr; }
  .pm-tool { padding: 20px; }
  .pm-toasts { left: 12px; bottom: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .pm-table td.flash-up, .pm-table td.flash-down, .pm-detail-grid, .pm-toast { animation: none; }
  .chev, .star, .pm-btn { transition: none; }
}

/* Corrections : en-tête clair conservé, icône de recherche */
body.pm .site-header { color: var(--ink); }
body.pm .site-footer { color: var(--soft); }
.pm-toolbar .pm-search input { padding-left: 44px; }
.pm-card-n.sm { word-break: normal; white-space: nowrap; }
@media (max-width: 640px) { .pm-card-n.sm { font-size: 17px; } .pm-card { padding: 16px; } }
