/* style_view_transactions.css — UI sobre, pills clairs #BAA883 */

:root{
  --em-primary:#BAA883;
  --em-text:#0f172a;
  --em-muted:#6b7280;
  --em-border:#e5e7eb;
  --ring:0 0 0 .2rem rgba(204,192,166,.25);

  --pill-bg:#fff;                 /* fond normal */
  --pill-bg-hover:#F7F3EB;        /* hover clair (teinte marque) */
  --pill-active:#F7F3EB;          /* actif plein */
  --pill-text:#2b2b2b;
  --pill-text-active:#111111;

  --green:#0E7E3C;
  --red:#D11A2A;

  --shadow:0 8px 20px rgba(15,23,42,.06);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--em-text);font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}

/* Layout */
.tx-container{max-width:1200px;margin:24px auto;padding:0 16px}
.tx-header.card{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.tx-title{margin:0;font-size:1.6rem;font-weight:700}
.tx-sub{margin:.35rem 0 0;color:var(--em-muted)}

.tx-wrapper{display:grid;grid-template-columns:260px 1fr;gap:16px}
@media (max-width: 900px){ .tx-wrapper{grid-template-columns:1fr} }

/* Cards */
.card{background:#fff;border-radius:1rem;box-shadow:var(--shadow);padding:1rem}

/* Sidebar */
.tx-sidebar .aside-title{font-size:1rem;margin:0 0 .5rem;font-weight:700;display:flex;align-items:center;gap:.5rem}
.account-list{display:flex;flex-direction:column;gap:.5rem}

/* Boutons pill (clair, #BAA883) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:1px solid transparent;cursor:pointer;
  font-weight:600;text-decoration:none;transition:transform .15s ease, background .2s ease, border-color .2s ease, color .2s ease}
.btn:focus{outline:none;box-shadow:var(--ring)}

.btn-pill{
  padding:.65rem .95rem;
  border-radius:9999px;
  background:var(--pill-bg);
  border-color:var(--em-primary);
  color:var(--pill-text);
  text-align:left;
  justify-content:flex-start;
}
.btn-pill:hover{background:var(--pill-bg-hover)}
.btn-pill.active{
  background:var(--pill-active);
  border-color:var(--pill-active);
  color:var(--pill-text-active);
}

/* Content header */
.card-head{display:flex;align-items:center;gap:.75rem;padding-bottom:.75rem;border-bottom:1px solid var(--em-border);margin-bottom:.75rem}
.card-head h3{margin:0;font-size:1.1rem}
.card-head .muted{margin:0;color:var(--em-muted);font-size:.9rem}
.head-icon{
  width:38px;height:38px;border-radius:999px;
  background:rgba(186,168,131,.14);     /* halo clair de la marque */
  color:#6b5e43;                        /* texte/icone plus doux */
  display:flex;align-items:center;justify-content:center;
}

/* Tables */
.table-wrap{overflow:auto}
.ops-table{width:100%;border-collapse:separate;border-spacing:0}
.ops-table thead th{
  position:sticky;top:0;background:#fff;z-index:1;
  text-align:left;padding:.8rem;border-bottom:1px solid var(--em-border);font-weight:700;color:#374151
}
.ops-table tbody td{padding:.75rem;border-bottom:1px solid var(--em-border);vertical-align:middle}
.ops-table .amount{text-align:right;font-variant-numeric:tabular-nums}

/* Montants */
.credit{color:var(--green);font-weight:700}
.debit{color:var(--red);font-weight:700}

/* Panes */
.account-content{display:none}
.account-content.is-active{display:block}

/* Helpers */
.me-2{margin-right:.5rem}
.muted{color:var(--em-muted)}