/* ================================================================
   Collection d'isolateurs — Theme
   ================================================================ */

:root {
    --ins-primary:      #4ABFB0;
    --ins-dark:         #1A2E2C;
    --ins-accent:       #E8C547;
    --ins-surface:      #F4FBFA;
    --ins-border:       #B2DDD8;
    --ins-deep:         #0F6E56;
    --ins-text-on-dark: #9FD4CF;

    /* Remap base variables to teal/light palette */
    --bg:            #F0FAF9;
    --surface:       #F4FBFA;
    --card:          #F4FBFA;
    --card-hover:    #E8F5F3;
    --border:        #B2DDD8;
    --amber:         #4ABFB0;
    --amber-light:   #5DCAA5;
    --amber-dark:    #3AADA0;
    --amber-subtle:  rgba(74, 191, 176, 0.12);
    --text:          #1A2E2C;
    --text-muted:    #3D6B65;
    --text-dim:      #7AADA8;
    --danger:        #d94040;
    --danger-bg:     #fff5f5;
    --danger-border: #f5c0c0;
    --success:       #0F6E56;
    --star-empty:    #B2DDD8;
    --radius:        8px;
    --radius-lg:     10px;
}

/* ===== Base ===== */
body {
    background: #F0FAF9;
    color: #1A2E2C;
}

a { color: #0F6E56; }
a:hover { color: #4ABFB0; }

*:focus-visible {
    outline: 2px solid #4ABFB0;
    outline-offset: 2px;
}

/* ===== Navbar ===== */
.site-nav {
    background: #1A2E2C;
    border-bottom: 1px solid #0d2220;
}

.nav-brand {
    color: #4ABFB0 !important;
    font-family: 'DM Sans', sans-serif;
    font-weight: 600;
    font-size: 1.1rem;
    letter-spacing: 0.01em;
    gap: 0.55rem;
}
.nav-brand:hover { color: #5DCAA5 !important; }

.nav-link { color: #9FD4CF; }
.nav-link:hover { color: #ffffff; }
.nav-link.active { color: #E8C547; border-bottom: 2px solid #E8C547; }

/* ===== Buttons ===== */
.btn-primary {
    background: #4ABFB0;
    color: #0A1F1E;
    border: none;
}
.btn-primary:hover { background: #5DCAA5; color: #0A1F1E; }

.btn-outline,
.btn-outline-primary {
    background: transparent;
    color: #4ABFB0;
    border: 1px solid #4ABFB0;
}
.btn-outline:hover,
.btn-outline-primary:hover {
    background: rgba(74, 191, 176, 0.1);
    color: #3AADA0;
}

.btn-amber {
    background: rgba(74, 191, 176, 0.1);
    color: #4ABFB0;
    border-color: #B2DDD8;
}
.btn-amber:hover { background: rgba(74, 191, 176, 0.2); }

.btn-ghost {
    color: #3D6B65;
    border-color: #B2DDD8;
}
.btn-ghost:hover { color: #1A2E2C; border-color: #4ABFB0; }

.btn-danger {
    background: rgba(217, 64, 64, 0.1);
    color: #c03030;
    border-color: #f5c0c0;
}
.btn-danger:hover { background: rgba(217, 64, 64, 0.18); }

/* ===== Cards ===== */
.record-card {
    background: #F4FBFA;
    border: 0.5px solid #B2DDD8;
    border-radius: 10px;
}
.record-card:hover { border-color: #4ABFB0; box-shadow: 0 2px 12px rgba(74,191,176,0.12); }

.form-card {
    background: #F4FBFA;
    border: 0.5px solid #B2DDD8;
    border-radius: 10px;
}

.stat-card {
    background: #F4FBFA;
    border: 0.5px solid #B2DDD8;
    border-radius: 10px;
}
.stat-danger { border-color: #f5c0c0; }

/* ===== Typography in cards ===== */
.page-title          { color: #1A2E2C; }
.record-title        { color: #1A2E2C; }
.record-artist       { color: #3D6B65; }
.record-meta         { color: #7AADA8; }
.stat-value          { color: #4ABFB0; }
.stat-label          { color: #3D6B65; }
.stat-danger .stat-value { color: #d94040; }
.stat-mint .stat-value   { color: #0F6E56; }
.form-label          { color: #3D6B65; }
.form-hint           { color: #7AADA8; }
.form-error          { color: #c03030; }

/* ===== Forms ===== */
.form-control {
    background: #ffffff;
    border-color: #B2DDD8;
    color: #1A2E2C;
}
.form-control::placeholder { color: #7AADA8; }
.form-control:focus {
    border-color: #4ABFB0;
    box-shadow: 0 0 0 3px rgba(74, 191, 176, 0.15);
}
select.form-control option { background: #ffffff; color: #1A2E2C; }

.search-input {
    background: #ffffff;
    border-color: #B2DDD8;
    color: #1A2E2C;
}
.search-input::placeholder { color: #7AADA8; }
.search-input:focus { border-color: #4ABFB0; box-shadow: 0 0 0 3px rgba(74,191,176,0.15); }

/* ===== Flash / Alerts ===== */
.flash-success {
    background: rgba(15, 110, 86, 0.08);
    border: 1px solid rgba(15, 110, 86, 0.25);
    color: #0F6E56;
}
.alert-errors {
    background: #fff5f5;
    border-color: #f5c0c0;
    color: #c03030;
}
.alert-errors strong { color: #a02020; }

/* Duplicate alert */
.duplicate-alert {
    background: #fff8f8;
    border-color: #f5c0c0;
}
.duplicate-alert-header { color: #d94040; }

/* ===== Record art placeholder ===== */
.record-art {
    background: #E0F4F2;
}
.art-placeholder { color: #4ABFB0; }
.empty-icon { color: #4ABFB0; }

/* ===== Chips / Filter pills ===== */
.chip {
    background: #ffffff;
    border-color: #B2DDD8;
    color: #3D6B65;
}
.chip:hover { border-color: #4ABFB0; color: #4ABFB0; }
.chip-active {
    background: #4ABFB0;
    border-color: #4ABFB0;
    color: #0A1F1E;
}
.chip-active:hover { background: #5DCAA5; color: #0A1F1E; }

/* ===== Stars ===== */
.star         { color: #B2DDD8; }
.star.filled  { color: #4ABFB0; }

/* ===== Badges ===== */
.badge-good  { background: rgba(74,191,176,0.15); color: #0F6E56; }
.badge-mint  { background: rgba(15,110,86,0.12);  color: #0F6E56; }
.badge-new   { background: rgba(74,191,176,0.2);  color: #3AADA0; }
.badge-vg    { background: rgba(90,190,130,0.15); color: #2A7A50; }
.badge-fair  { background: rgba(232,197,71,0.15); color: #9A7A00; }
.badge-poor  { background: rgba(217,64,64,0.1);   color: #c03030; }

/* ===== Pagination ===== */
.pagination-wrap ul li > a,
.pagination-wrap ul li > span {
    background: #F4FBFA;
    border-color: #B2DDD8;
    color: #3D6B65;
}
.pagination-wrap ul li > a:hover {
    border-color: #4ABFB0;
    color: #4ABFB0;
}
.pagination-wrap ul li.active > span,
.pagination-wrap ul li > span[aria-current="page"] {
    background: #4ABFB0;
    border-color: #4ABFB0;
    color: #0A1F1E;
}

/* ===== Image preview ===== */
.image-preview {
    background: #E0F4F2;
    border-color: #B2DDD8;
}

/* ===== Duplicate items ===== */
.dup-artist { color: #1A2E2C; }
.dup-title  { color: #3D6B65; }
.dup-sep    { color: #7AADA8; }
.dup-action { color: #d94040; }