:root {
    --green-950: #103c35;
    --green-900: #155246;
    --green-800: #176a58;
    --green-700: #198364;
    --green-600: #1b9c73;
    --green-500: #28b982;
    --green-300: #8fe2bd;
    --green-100: #e8f8f0;

    --blue-700: #2074a7;
    --blue-100: #e9f6fd;

    --orange-700: #c96d32;
    --orange-100: #fff0e5;

    --purple-700: #7650ae;
    --purple-100: #f2ebfc;

    --ink: #17332e;
    --text: #4d665f;
    --muted: #7b918b;
    --border: rgba(24, 84, 70, 0.10);
    --white: #ffffff;

    --shadow-sm: 0 10px 30px rgba(24, 75, 61, 0.08);
    --shadow-md: 0 22px 60px rgba(24, 75, 61, 0.13);
    --shadow-lg: 0 35px 90px rgba(24, 75, 61, 0.18);

    --radius-sm: 16px;
    --radius-md: 24px;
    --radius-lg: 34px;

    --container: 1180px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-width: 320px;
    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
    color: var(--ink);
    background: #f8fcfa;
    -webkit-font-smoothing: antialiased;
}

button,
a {
    font: inherit;
}

a {
    color: inherit;
}

.site-container {
    width: min(calc(100% - 40px), var(--container));
    margin-inline: auto;
}

/* HEADER */

.site-header {
    position: relative;
    z-index: 20;
    padding: 22px 0;
    background:
        linear-gradient(
            90deg,
            rgba(241, 251, 246, 0.96),
            rgba(239, 250, 248, 0.96)
        );
    border-bottom: 1px solid rgba(29, 108, 84, 0.06);
}

.site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}

.brand__icon {
    display: grid;
    place-items: center;
    width: 49px;
    height: 49px;
    border-radius: 16px;
    color: white;
    background:
        linear-gradient(145deg, var(--green-500), var(--green-800));
    box-shadow: 0 10px 24px rgba(29, 132, 99, 0.25);
}

.brand__icon svg {
    width: 31px;
    height: 31px;
    fill: none;
    stroke: currentColor;
    stroke-width: 3.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.brand__text {
    display: flex;
    flex-direction: column;
}

.brand__text strong {
    font-size: 18px;
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.brand__text small {
    margin-top: 4px;
    color: var(--muted);
    font-size: 12px;
}

.site-header__actions {
    display: flex;
    align-items: center;
    gap: 11px;
}

.header-link {
    padding: 10px 12px;
    color: var(--text);
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
}

/* BUTTONS */

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 44px;
    padding: 10px 18px;
    border-radius: 13px;
    border: 1px solid transparent;
    text-decoration: none;
    font-weight: 800;
    font-size: 14px;
    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        background 180ms ease;
}

.button:hover {
    transform: translateY(-2px);
}

.button--primary {
    color: #fff;
    background:
        linear-gradient(135deg, var(--green-500), var(--green-800));
    box-shadow: 0 10px 25px rgba(29, 132, 99, 0.22);
}

.button--primary:hover {
    box-shadow: 0 15px 30px rgba(29, 132, 99, 0.30);
}

.button--ghost {
    color: var(--green-800);
    background: rgba(255, 255, 255, 0.76);
    border-color: rgba(29, 132, 99, 0.13);
}

.button--white {
    color: var(--green-900);
    background: rgba(255, 255, 255, 0.96);
    border-color: rgba(29, 132, 99, 0.08);
    box-shadow: var(--shadow-sm);
}

.button--large {
    min-height: 54px;
    padding: 14px 24px;
    border-radius: 16px;
}

/* HERO */

.hero {
    position: relative;
    overflow: hidden;
    padding: 88px 0 105px;
    background:
        radial-gradient(circle at 80% 10%, rgba(64, 198, 155, 0.20), transparent 30%),
        radial-gradient(circle at 10% 70%, rgba(71, 179, 201, 0.12), transparent 26%),
        linear-gradient(135deg, #f4fcf7 0%, #eefaf6 43%, #eef9fb 100%);
}

.hero__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
    pointer-events: none;
}

.hero__orb--one {
    width: 310px;
    height: 310px;
    right: -120px;
    top: 30px;
    background: rgba(83, 210, 160, 0.10);
}

.hero__orb--two {
    width: 210px;
    height: 210px;
    left: -110px;
    bottom: 20px;
    background: rgba(65, 170, 197, 0.08);
}

.hero__grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(480px, 1.05fr);
    gap: 74px;
    align-items: center;
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 22px;
    padding: 8px 13px;
    border-radius: 999px;
    color: var(--green-800);
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(32, 138, 104, 0.10);
    font-size: 13px;
    font-weight: 800;
}

.eyebrow__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--green-500);
    box-shadow: 0 0 0 5px rgba(40, 185, 130, 0.12);
}

.hero h1 {
    max-width: 620px;
    margin: 0;
    font-size: clamp(44px, 5vw, 69px);
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.hero h1 span {
    display: block;
    margin-top: 11px;
    color: transparent;
    background:
        linear-gradient(90deg, var(--green-700), #25a99c, #2e8fb8);
    background-clip: text;
    -webkit-background-clip: text;
}

.hero__intro {
    max-width: 590px;
    margin: 28px 0 0;
    color: var(--text);
    font-size: 18px;
    line-height: 1.75;
}

.hero__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
    margin-top: 31px;
}

.hero__reassurance {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 25px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.hero__reassurance span {
    display: inline-flex;
    gap: 7px;
    align-items: center;
}

.hero__reassurance strong {
    display: grid;
    place-items: center;
    width: 19px;
    height: 19px;
    border-radius: 50%;
    color: white;
    background: var(--green-500);
    font-size: 11px;
}

/* DASHBOARD PREVIEW */

.hero-dashboard {
    position: relative;
    min-height: 520px;
    display: grid;
    place-items: center;
}

.dashboard-window {
    position: relative;
    width: min(100%, 550px);
    padding: 28px;
    border-radius: 31px;
    background: rgba(255, 255, 255, 0.91);
    border: 1px solid rgba(255, 255, 255, 0.94);
    box-shadow: var(--shadow-lg);
    backdrop-filter: blur(16px);
}

.dashboard-window::before {
    content: "";
    position: absolute;
    inset: -1px;
    z-index: -1;
    border-radius: inherit;
    background:
        linear-gradient(
            135deg,
            rgba(59, 193, 143, 0.20),
            rgba(59, 154, 197, 0.06)
        );
}

.dashboard-window__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.mini-label {
    display: block;
    margin-bottom: 5px;
    color: var(--green-700);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    font-weight: 900;
}

.dashboard-window__top h2 {
    margin: 0;
    font-size: 26px;
    letter-spacing: -0.035em;
}

.dashboard-window__top p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 13px;
}

.quick-add {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 43px;
    padding: 8px 14px;
    border: 0;
    border-radius: 13px;
    color: #fff;
    background:
        linear-gradient(135deg, var(--green-500), var(--green-800));
    font-weight: 800;
    box-shadow: 0 9px 22px rgba(32, 144, 104, 0.18);
}

.quick-add span {
    font-size: 20px;
    line-height: 1;
}

.dashboard-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
    margin-top: 25px;
}

.summary-card {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 83px;
    padding: 14px;
    border-radius: 19px;
}

.summary-card--green {
    background: linear-gradient(135deg, #e8f8ef, #f4fcf7);
}

.summary-card--orange {
    background: linear-gradient(135deg, #fff0e5, #fff8f2);
}

.summary-card--blue {
    background: linear-gradient(135deg, #e7f5fc, #f4fbfe);
}

.summary-card--purple {
    background: linear-gradient(135deg, #f1eafa, #faf7fe);
}

.summary-card__icon {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 43px;
    height: 43px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.78);
    font-size: 20px;
}

.summary-card strong {
    display: block;
    font-size: 21px;
    line-height: 1.1;
}

.summary-card span {
    display: block;
    margin-top: 4px;
    color: var(--text);
    font-size: 12px;
}

.dashboard-next {
    margin-top: 17px;
    padding: 19px;
    border-radius: 21px;
    background: #f7faf9;
    border: 1px solid rgba(24, 84, 70, 0.07);
}

.dashboard-next__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 11px;
}

.dashboard-next__header strong {
    font-size: 15px;
}

.dashboard-next__date {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.task-row {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 11px 0;
    border-top: 1px solid rgba(24, 84, 70, 0.07);
}

.task-row__icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    font-size: 17px;
}

.task-row__icon--green {
    background: var(--green-100);
}

.task-row__icon--blue {
    background: var(--blue-100);
}

.task-row__content {
    flex: 1;
    min-width: 0;
}

.task-row__content strong,
.task-row__content span {
    display: block;
}

.task-row__content strong {
    font-size: 13px;
}

.task-row__content span {
    margin-top: 3px;
    color: var(--muted);
    font-size: 11px;
}

.task-row__time {
    color: var(--text);
    font-size: 12px;
    font-weight: 800;
}

.floating-card {
    position: absolute;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 155px;
    padding: 13px 16px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: var(--shadow-md);
}

.floating-card__icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: var(--green-100);
}

.floating-card small,
.floating-card strong {
    display: block;
}

.floating-card small {
    color: var(--muted);
    font-size: 10px;
}

.floating-card strong {
    margin-top: 3px;
    font-size: 13px;
}

.floating-card--stock {
    top: -48px;
    right: 24px;
}

.floating-card--payment {
    bottom: -22px;
    left: 28px;
}

.floating-card--payment .floating-card__icon {
    color: white;
    background: linear-gradient(135deg, var(--green-500), var(--green-700));
}

/* SECTION HEADINGS */

.section-heading {
    max-width: 690px;
    margin: 0 auto 46px;
    text-align: center;
}

.section-heading--left {
    margin-left: 0;
    text-align: left;
}

.section-heading__eyebrow {
    display: inline-block;
    margin-bottom: 12px;
    color: var(--green-700);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.section-heading h2 {
    margin: 0;
    font-size: clamp(30px, 4vw, 46px);
    line-height: 1.08;
    letter-spacing: -0.045em;
}

.section-heading p {
    margin: 17px auto 0;
    color: var(--text);
    font-size: 16px;
    line-height: 1.7;
}

/* PROFILES */

.profiles {
    padding: 100px 0;
    background: #fff;
}

.profile-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.profile-card {
    overflow: hidden;
    border-radius: 28px;
    background: white;
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    transition:
        transform 180ms ease,
        box-shadow 180ms ease;
}

.profile-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
}

.profile-card__visual {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    height: 150px;
    font-size: 53px;
}

.profile-card--culture .profile-card__visual {
    background:
        radial-gradient(circle at 72% 23%, rgba(255,255,255,.55), transparent 25%),
        linear-gradient(135deg, #dff6e7, #aee6bf);
}

.profile-card--breeding .profile-card__visual {
    background:
        radial-gradient(circle at 72% 23%, rgba(255,255,255,.55), transparent 25%),
        linear-gradient(135deg, #fff0dc, #f6c58e);
}

.profile-card--mixed .profile-card__visual {
    background:
        radial-gradient(circle at 72% 23%, rgba(255,255,255,.55), transparent 25%),
        linear-gradient(135deg, #dff5ef, #b7e0da 55%, #f5d8aa);
}

.profile-card__body {
    padding: 27px 28px 30px;
}

.profile-card__tag {
    display: inline-flex;
    padding: 6px 10px;
    border-radius: 999px;
    color: var(--green-800);
    background: var(--green-100);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.profile-card--breeding .profile-card__tag {
    color: var(--orange-700);
    background: var(--orange-100);
}

.profile-card__body h3 {
    margin: 15px 0 8px;
    font-size: 23px;
    letter-spacing: -0.03em;
}

.profile-card__body p {
    min-height: 67px;
    margin: 0;
    color: var(--text);
    line-height: 1.6;
    font-size: 14px;
}

.profile-card__body ul {
    display: grid;
    gap: 8px;
    margin: 20px 0 0;
    padding: 18px 0 0;
    list-style: none;
    border-top: 1px solid var(--border);
}

.profile-card__body li {
    position: relative;
    padding-left: 21px;
    color: var(--text);
    font-size: 13px;
}

.profile-card__body li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--green-600);
    font-weight: 900;
}

/* FEATURES */

.features {
    padding: 100px 0;
    background:
        linear-gradient(180deg, #f5fbf8 0%, #eef9f6 100%);
}

.features-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}

.feature {
    min-height: 190px;
    padding: 25px;
    border-radius: 24px;
    background: rgba(255,255,255,.82);
    border: 1px solid rgba(24, 84, 70, 0.07);
}

.feature__icon {
    display: grid;
    place-items: center;
    width: 47px;
    height: 47px;
    border-radius: 14px;
    font-size: 21px;
}

.feature__icon--green {
    background: var(--green-100);
}

.feature__icon--orange {
    background: var(--orange-100);
}

.feature__icon--blue {
    background: var(--blue-100);
}

.feature__icon--purple {
    background: var(--purple-100);
}

.feature h3 {
    margin: 18px 0 8px;
    font-size: 18px;
}

.feature p {
    margin: 0;
    color: var(--text);
    font-size: 13px;
    line-height: 1.6;
}

.workflow {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 37px;
    padding: 23px;
    border-radius: 24px;
    color: var(--green-900);
    background: rgba(255,255,255,.76);
    border: 1px solid rgba(24, 84, 70, 0.07);
    font-size: 14px;
    font-weight: 800;
}

.workflow span {
    padding: 8px 12px;
    border-radius: 11px;
    background: #fff;
}

.workflow b {
    color: var(--green-400, #53b995);
}

/* CTA */

.cta-section {
    padding: 90px 0;
    background: #fff;
}

.cta-card {
    position: relative;
    overflow: hidden;
    min-height: 360px;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    align-items: center;
    border-radius: 36px;
    color: #fff;
    background:
        radial-gradient(circle at 80% 30%, rgba(93, 221, 177, 0.32), transparent 29%),
        linear-gradient(135deg, #176953 0%, #18846b 52%, #218aa3 100%);
    box-shadow: var(--shadow-md);
}

.cta-card__content {
    position: relative;
    z-index: 3;
    padding: 55px 58px;
}

.section-heading__eyebrow--light {
    color: #bdf0d9;
}

.cta-card h2 {
    max-width: 560px;
    margin: 0;
    font-size: clamp(32px, 4vw, 49px);
    line-height: 1.05;
    letter-spacing: -0.045em;
}

.cta-card p {
    max-width: 570px;
    margin: 18px 0 25px;
    color: rgba(255,255,255,.83);
    line-height: 1.7;
}

.cta-card__illustration {
    position: relative;
    align-self: stretch;
    min-height: 360px;
}

.cta-sun {
    position: absolute;
    width: 86px;
    height: 86px;
    right: 100px;
    top: 69px;
    border-radius: 50%;
    background: rgba(255, 229, 150, 0.95);
    box-shadow: 0 0 55px rgba(255, 229, 150, 0.20);
}

.cta-hill {
    position: absolute;
    right: -80px;
    bottom: -115px;
    border-radius: 50%;
}

.cta-hill--one {
    width: 430px;
    height: 250px;
    background: rgba(119, 209, 157, 0.52);
}

.cta-hill--two {
    right: 140px;
    bottom: -150px;
    width: 390px;
    height: 250px;
    background: rgba(72, 174, 130, 0.52);
}

.cta-plant {
    position: absolute;
    z-index: 4;
    right: 130px;
    bottom: 75px;
    font-size: 74px;
    filter: drop-shadow(0 15px 18px rgba(9, 73, 53, 0.18));
}

/* FOOTER */

.site-footer {
    padding: 35px 0 45px;
    background: #f5faf7;
}

.site-footer__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 25px;
}

.brand--footer .brand__icon {
    width: 41px;
    height: 41px;
    border-radius: 13px;
}

.brand--footer .brand__icon svg {
    width: 25px;
    height: 25px;
}

.site-footer p {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
}

/* RESPONSIVE */

@media (max-width: 1050px) {
    .hero__grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .hero__content {
        max-width: 720px;
        text-align: center;
        margin: auto;
    }

    .hero__intro {
        margin-inline: auto;
    }

    .hero__buttons,
    .hero__reassurance {
        justify-content: center;
    }

    .hero-dashboard {
        width: min(100%, 650px);
        margin: auto;
    }

    .profile-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .profile-card:last-child {
        grid-column: 1 / -1;
        width: calc(50% - 10px);
        margin-inline: auto;
    }

    .features-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .site-container {
        width: min(calc(100% - 28px), var(--container));
    }

    .site-header {
        padding: 14px 0;
    }

    .brand__text small,
    .header-link {
        display: none;
    }

    .site-header__actions {
        gap: 7px;
    }

    .site-header__actions .button {
        padding-inline: 12px;
        font-size: 12px;
    }

    .site-header__actions .button--ghost {
        display: none;
    }

    .hero {
        padding: 58px 0 70px;
    }

    .hero h1 {
        font-size: clamp(40px, 12vw, 56px);
    }

    .hero__intro {
        font-size: 16px;
    }

    .hero__buttons {
        display: grid;
    }

    .hero__buttons .button {
        width: 100%;
    }

    .hero-dashboard {
        min-height: 0;
        padding-top: 8px;
    }

    .dashboard-window {
        padding: 20px;
        border-radius: 25px;
    }

    .floating-card {
        display: none;
    }

    .profiles,
    .features,
    .cta-section {
        padding: 70px 0;
    }

    .profile-grid,
    .features-grid {
        grid-template-columns: 1fr;
    }

    .profile-card:last-child {
        grid-column: auto;
        width: auto;
    }

    .profile-card__body p {
        min-height: auto;
    }

    .cta-card {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .cta-card__content {
        padding: 38px 27px;
    }

    .cta-card__illustration {
        display: none;
    }

    .site-footer__inner {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 500px) {
    .brand__icon {
        width: 43px;
        height: 43px;
        border-radius: 14px;
    }

    .brand__icon svg {
        width: 27px;
        height: 27px;
    }

    .brand__text strong {
        font-size: 16px;
    }

    .hero h1 {
        font-size: 42px;
    }

    .eyebrow {
        font-size: 11px;
    }

    .dashboard-window__top {
        align-items: center;
    }

    .dashboard-window__top h2 {
        font-size: 22px;
    }

    .quick-add {
        padding-inline: 11px;
        font-size: 12px;
    }

    .dashboard-summary {
        grid-template-columns: 1fr;
    }

    .summary-card {
        min-height: 70px;
    }

    .workflow {
        justify-content: flex-start;
    }

    .workflow b {
        transform: rotate(90deg);
    }
}

/* ==========================================================
   AUTHENTIFICATION
   ========================================================== */

.auth-page {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    padding: 34px 0 65px;
    background:
        radial-gradient(circle at 10% 15%, rgba(64, 198, 155, 0.20), transparent 28%),
        radial-gradient(circle at 90% 80%, rgba(48, 157, 188, 0.16), transparent 29%),
        linear-gradient(135deg, #f3fcf7 0%, #edf9f5 48%, #edf9fb 100%);
}

.auth-background {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.auth-background--one {
    width: 430px;
    height: 430px;
    top: -230px;
    right: -160px;
    background: rgba(58, 200, 151, 0.10);
}

.auth-background--two {
    width: 390px;
    height: 390px;
    bottom: -250px;
    left: -120px;
    background: rgba(52, 153, 188, 0.08);
}

.auth-brand {
    position: relative;
    z-index: 3;
    width: min(calc(100% - 40px), 1160px);
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}

.auth-layout {
    position: relative;
    z-index: 2;
    width: min(calc(100% - 40px), 1080px);
    min-height: calc(100vh - 150px);
    margin: 45px auto 0;
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(440px, 0.72fr);
    gap: 85px;
    align-items: center;
}

.auth-layout--login {
    max-width: 1000px;
}

.auth-kicker {
    display: inline-flex;
    align-items: center;
    padding: 8px 13px;
    margin-bottom: 21px;
    border-radius: 999px;
    color: var(--green-800);
    background: rgba(255, 255, 255, 0.75);
    border: 1px solid rgba(29, 132, 99, 0.10);
    font-size: 12px;
    font-weight: 900;
}

.auth-intro h1 {
    max-width: 550px;
    margin: 0;
    font-size: clamp(43px, 5vw, 66px);
    line-height: 1;
    letter-spacing: -0.055em;
}

.auth-intro h1 span {
    display: block;
    margin-top: 8px;
    color: transparent;
    background: linear-gradient(
        90deg,
        var(--green-700),
        #25a99c,
        #2e8fb8
    );
    background-clip: text;
    -webkit-background-clip: text;
}

.auth-intro > p {
    max-width: 570px;
    margin: 25px 0 0;
    color: var(--text);
    font-size: 16px;
    line-height: 1.75;
}

.auth-steps {
    display: grid;
    gap: 11px;
    max-width: 430px;
    margin-top: 32px;
}

.auth-step {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 13px 15px;
    border-radius: 17px;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.55);
    border: 1px solid rgba(24, 84, 70, 0.06);
}

.auth-step > strong {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 11px;
    color: var(--green-800);
    background: var(--green-100);
    font-size: 13px;
}

.auth-step span,
.auth-step b,
.auth-step small {
    display: block;
}

.auth-step b {
    color: var(--text);
    font-size: 13px;
}

.auth-step small {
    margin-top: 2px;
    font-size: 11px;
}

.auth-step--active {
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(28, 147, 108, 0.14);
    box-shadow: var(--shadow-sm);
}

.auth-step--active > strong {
    color: white;
    background: linear-gradient(
        135deg,
        var(--green-500),
        var(--green-800)
    );
}

.auth-card {
    padding: 34px;
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.93);
    border: 1px solid rgba(255, 255, 255, 0.95);
    box-shadow: var(--shadow-lg);
    backdrop-filter: blur(18px);
}

.auth-card__heading {
    margin-bottom: 24px;
}

.auth-card__heading > span {
    color: var(--green-700);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.09em;
}

.auth-card__heading h2 {
    margin: 7px 0 5px;
    font-size: 30px;
    line-height: 1.05;
    letter-spacing: -0.04em;
}

.auth-card__heading p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
}

.auth-form {
    display: grid;
    gap: 17px;
}

.auth-form__two-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 13px;
}

.auth-field label {
    display: block;
    margin-bottom: 7px;
    color: var(--text);
    font-size: 12px;
    font-weight: 800;
}

.auth-field input {
    width: 100%;
    min-height: 49px;
    padding: 11px 14px;
    border: 1px solid rgba(29, 93, 76, 0.13);
    border-radius: 13px;
    outline: none;
    color: var(--ink);
    background: #fbfdfc;
    transition:
        border-color 160ms ease,
        box-shadow 160ms ease,
        background 160ms ease;
}

.auth-field input::placeholder {
    color: #a2b1ad;
}

.auth-field input:focus {
    border-color: rgba(28, 157, 115, 0.55);
    background: white;
    box-shadow: 0 0 0 4px rgba(36, 179, 128, 0.10);
}

.auth-field ul {
    margin: 6px 0 0;
    padding: 0;
    list-style: none;
}

.auth-field li {
    color: #b34d4d;
    font-size: 11px;
}

.auth-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    margin-top: 4px;
    padding: 12px 18px;
    border: 0;
    border-radius: 14px;
    cursor: pointer;
    color: white;
    background:
        linear-gradient(135deg, var(--green-500), var(--green-800));
    box-shadow: 0 12px 28px rgba(29, 132, 99, 0.24);
    font-weight: 900;
    transition:
        transform 160ms ease,
        box-shadow 160ms ease;
}

.auth-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 17px 34px rgba(29, 132, 99, 0.31);
}

.auth-card__footer {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
    color: var(--muted);
    text-align: center;
    font-size: 12px;
}

.auth-card__footer a {
    color: var(--green-700);
    font-weight: 900;
}

.auth-alert {
    margin-bottom: 18px;
    padding: 12px 14px;
    border-radius: 13px;
    font-size: 12px;
    line-height: 1.5;
}

.auth-alert--success {
    color: #176749;
    background: #e8f8ef;
    border: 1px solid rgba(28, 149, 102, 0.13);
}

.auth-alert--error {
    color: #934646;
    background: #fff0ef;
    border: 1px solid rgba(185, 80, 80, 0.12);
}

.login-preview {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 180px));
    gap: 12px;
    margin-top: 33px;
}

.login-preview > div {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 65px;
    padding: 12px 14px;
    border-radius: 17px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(24, 84, 70, 0.06);
}

.login-preview span {
    display: grid;
    place-items: center;
    width: 37px;
    height: 37px;
    border-radius: 11px;
    background: var(--green-100);
    font-size: 17px;
}

.login-preview strong {
    font-size: 12px;
}

@media (max-width: 920px) {
    .auth-layout {
        grid-template-columns: 1fr;
        gap: 42px;
        max-width: 650px;
    }

    .auth-intro {
        text-align: center;
    }

    .auth-intro h1,
    .auth-intro > p,
    .auth-steps {
        margin-left: auto;
        margin-right: auto;
    }

    .login-preview {
        justify-content: center;
        margin-inline: auto;
    }
}

@media (max-width: 560px) {
    .auth-page {
        padding-top: 20px;
    }

    .auth-brand {
        width: calc(100% - 28px);
    }

    .auth-layout {
        width: calc(100% - 28px);
        margin-top: 34px;
    }

    .auth-intro h1 {
        font-size: 42px;
    }

    .auth-intro > p {
        font-size: 14px;
    }

    .auth-steps {
        display: none;
    }

    .auth-card {
        padding: 25px 20px;
        border-radius: 24px;
    }

    .auth-form__two-columns {
        grid-template-columns: 1fr;
    }

    .login-preview {
        grid-template-columns: 1fr 1fr;
    }
}

/* ===== ONBOARDING EXPLOITATION ===== */

.onboarding-layout {
    align-items: center;
}

.onboarding-card {
    max-width: 610px;
}

.farm-form {
    display: grid;
    gap: 22px;
}

.farm-form__row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.farm-label-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.farm-label-line > span {
    font-size: 0.72rem;
    font-weight: 700;
    color: #78948a;
    background: #eff8f5;
    border-radius: 999px;
    padding: 5px 9px;
}

.farm-help {
    display: block;
    margin-top: 7px;
    color: #78948a;
    font-size: 0.75rem;
}

.farm-activity {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.farm-activity legend {
    margin-bottom: 4px;
    color: #31594e;
    font-size: 0.82rem;
    font-weight: 800;
}

.farm-activity__intro {
    margin: 0 0 13px;
    color: #78948a;
    font-size: 0.77rem;
}

.farm-activity__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 11px;
}

.farm-activity-card {
    position: relative;
    display: flex;
    min-height: 164px;
    flex-direction: column;
    align-items: flex-start;
    cursor: pointer;
    border: 1.5px solid #dceae5;
    border-radius: 20px;
    background: #fbfefd;
    padding: 16px;
    transition:
        transform 0.18s ease,
        border-color 0.18s ease,
        box-shadow 0.18s ease,
        background 0.18s ease;
}

.farm-activity-card:hover {
    transform: translateY(-2px);
    border-color: #5ec1a6;
    box-shadow: 0 12px 28px rgba(21, 105, 82, 0.10);
}

.farm-activity-card__input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.farm-activity-card__visual {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.farm-activity-card__icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    background: linear-gradient(135deg, #e7f8ef, #e9f8f7);
    font-size: 1.45rem;
}

.farm-activity-card__check {
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border: 1.5px solid #cfe2dc;
    border-radius: 50%;
    color: transparent;
    font-size: 0.78rem;
    font-weight: 900;
    transition: 0.18s ease;
}

.farm-activity-card strong {
    margin-bottom: 7px;
    color: #163f35;
    font-size: 0.88rem;
    line-height: 1.25;
}

.farm-activity-card small {
    color: #708b82;
    font-size: 0.72rem;
    line-height: 1.45;
}

.farm-activity-card:has(
    .farm-activity-card__input:checked
) {
    border-color: #1e9f7d;
    background:
        linear-gradient(
            145deg,
            #f4fffa,
            #effbf9
        );
    box-shadow:
        0 12px 30px rgba(24, 135, 105, 0.13);
}

.farm-activity-card:has(
    .farm-activity-card__input:checked
) .farm-activity-card__check {
    border-color: #1f9f7e;
    background: #1f9f7e;
    color: white;
}

.farm-activity-card:has(
    .farm-activity-card__input:focus-visible
) {
    outline: 3px solid rgba(31, 159, 126, 0.20);
    outline-offset: 3px;
}

.farm-submit {
    margin-top: 2px;
}

.farm-security {
    margin: 16px 0 0;
    color: #81978f;
    text-align: center;
    font-size: 0.72rem;
}

.farm-form ul,
.farm-activity ul {
    margin: 7px 0 0;
    padding: 0;
    list-style: none;
    color: #b14e48;
    font-size: 0.75rem;
}

.onboarding-success {
    display: flex;
    gap: 15px;
    align-items: flex-start;
    margin: 20px 0;
    border-radius: 19px;
    background:
        linear-gradient(
            135deg,
            #e8f8ef,
            #edf9f7
        );
    padding: 18px;
}

.onboarding-success__icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border-radius: 12px;
    background: #1f9f7e;
    color: white;
    font-weight: 900;
}

.onboarding-success strong {
    color: #176749;
}

.onboarding-success p {
    margin: 5px 0 0;
    color: #58776d;
    font-size: 0.82rem;
    line-height: 1.55;
}

.tools-preview {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
}

.tools-preview > div {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #e0ece8;
    border-radius: 16px;
    background: #fbfefd;
    padding: 14px;
}

.tools-preview span {
    font-size: 1.25rem;
}

.tools-preview strong {
    color: #204d40;
    font-size: 0.82rem;
}

.tools-coming {
    margin: 18px 0 0;
    color: #78948a;
    text-align: center;
    font-size: 0.77rem;
    line-height: 1.5;
}

@media (max-width: 900px) {
    .farm-activity__grid {
        grid-template-columns: 1fr;
    }

    .farm-activity-card {
        min-height: auto;
    }
}

@media (max-width: 620px) {
    .farm-form__row {
        grid-template-columns: 1fr;
    }

    .tools-preview {
        grid-template-columns: 1fr;
    }
}

/* ===== FIN ONBOARDING EXPLOITATION ===== */


/* ===== ONBOARDING MODULES ===== */

.onboarding-card--tools {
    max-width: 690px;
}

.module-form {
    display: grid;
    gap: 20px;
}

.module-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.module-section-heading > div {
    display: grid;
    gap: 3px;
}

.module-section-heading strong {
    color: #254f43;
    font-size: 0.86rem;
}

.module-section-heading small {
    color: #78948a;
    font-size: 0.74rem;
}

.module-recommended-badge {
    flex: 0 0 auto;
    border-radius: 999px;
    background: #e7f7f0;
    padding: 7px 11px;
    color: #198363;
    font-size: 0.68rem;
    font-weight: 800;
}

.module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.module-card {
    position: relative;
    display: flex;
    min-height: 132px;
    cursor: pointer;
    flex-direction: column;
    align-items: flex-start;
    border: 1.5px solid #dceae5;
    border-radius: 18px;
    background: #fbfefd;
    padding: 13px;
    transition:
        transform 0.18s ease,
        border-color 0.18s ease,
        background 0.18s ease,
        box-shadow 0.18s ease;
}

.module-card:hover {
    transform: translateY(-2px);
    border-color: #5ec1a6;
    box-shadow: 0 10px 24px rgba(21, 105, 82, 0.09);
}

.module-card__input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.module-card__top {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.module-card__icon {
    display: grid;
    width: 39px;
    height: 39px;
    place-items: center;
    border-radius: 12px;
    background: linear-gradient(135deg, #e8f8ef, #e9f8f7);
    font-size: 1.18rem;
}

.module-card__check {
    display: grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border: 1.5px solid #cfe2dc;
    border-radius: 50%;
    color: transparent;
    font-size: 0.72rem;
    font-weight: 900;
}

.module-card strong {
    margin-bottom: 5px;
    color: #163f35;
    font-size: 0.8rem;
}

.module-card small {
    color: #718d84;
    font-size: 0.67rem;
    line-height: 1.4;
}

.module-card:has(.module-card__input:checked) {
    border-color: #1e9f7d;
    background: linear-gradient(145deg, #f3fff9, #eefbf8);
    box-shadow: 0 8px 22px rgba(24, 135, 105, 0.10);
}

.module-card:has(.module-card__input:checked)
.module-card__check {
    border-color: #1f9f7e;
    background: #1f9f7e;
    color: #fff;
}

.module-card:has(.module-card__input:focus-visible) {
    outline: 3px solid rgba(31, 159, 126, 0.20);
    outline-offset: 3px;
}

.module-more {
    overflow: hidden;
    border: 1px solid #dfece7;
    border-radius: 18px;
    background: rgba(250, 254, 252, 0.8);
}

.module-more summary {
    display: flex;
    cursor: pointer;
    list-style: none;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 15px 17px;
}

.module-more summary::-webkit-details-marker {
    display: none;
}

.module-more summary > span:first-child {
    display: grid;
    gap: 2px;
}

.module-more summary strong {
    color: #285247;
    font-size: 0.8rem;
}

.module-more summary small {
    color: #81978f;
    font-size: 0.69rem;
}

.module-more__arrow {
    display: grid;
    width: 29px;
    height: 29px;
    place-items: center;
    border-radius: 50%;
    background: #e9f7f2;
    color: #1b8b69;
    transition: transform 0.18s ease;
}

.module-more[open] .module-more__arrow {
    transform: rotate(180deg);
}

.module-grid--optional {
    padding: 0 14px 14px;
}

.module-card--optional {
    background: #fff;
}

.module-submit {
    margin-top: 2px;
}

/* ===== DASHBOARD ===== */

.farm-dashboard {
    min-height: 100vh;
    color: #173f35;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(160, 240, 209, 0.38),
            transparent 28%
        ),
        radial-gradient(
            circle at 100% 20%,
            rgba(121, 212, 224, 0.22),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #f4fbf7 0%,
            #eff9f6 52%,
            #eef8f9 100%
        );
}

.farm-dashboard__header {
    display: flex;
    max-width: 1380px;
    margin: 0 auto;
    padding: 24px 34px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.farm-dashboard__brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: inherit;
    text-decoration: none;
}

.farm-dashboard__brand .brand__icon {
    position: static;
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    flex: 0 0 48px;
    border-radius: 15px;
    background:
        linear-gradient(
            145deg,
            #26b987,
            #137b67
        );
    box-shadow:
        0 10px 26px rgba(20, 127, 99, 0.22);
}

.farm-dashboard__brand .brand__icon svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: #fff;
    stroke-width: 2.3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.farm-dashboard__brand .brand__text {
    display: grid;
}

.farm-dashboard__brand .brand__text strong {
    color: #123d32;
    font-size: 1rem;
}

.farm-dashboard__brand .brand__text small {
    margin-top: 2px;
    color: #6e8d83;
    font-size: 0.71rem;
}

.farm-dashboard__header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.dashboard-header-button {
    display: inline-flex;
    min-height: 43px;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(28, 112, 87, 0.13);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.88);
    padding: 0 16px;
    color: #22624f;
    box-shadow:
        0 8px 22px rgba(30, 95, 76, 0.055);
    font-size: 0.76rem;
    font-weight: 800;
    text-decoration: none;
    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease;
}

.dashboard-header-button:hover {
    transform: translateY(-1px);
    box-shadow:
        0 11px 25px rgba(30, 95, 76, 0.10);
}

.dashboard-header-button--logout {
    color: #556f67;
}

.farm-dashboard__content {
    width: min(1320px, calc(100% - 48px));
    margin: 22px auto 0;
}

.dashboard-message {
    display: flex;
    max-width: 600px;
    margin-bottom: 18px;
    align-items: center;
    gap: 9px;
    border: 1px solid rgba(21, 153, 109, 0.18);
    border-radius: 14px;
    background: #e9f8f1;
    padding: 12px 15px;
    color: #176d54;
    font-size: 0.78rem;
    font-weight: 700;
}

.dashboard-message > span {
    display: grid;
    width: 23px;
    height: 23px;
    place-items: center;
    border-radius: 50%;
    background: #1c9e79;
    color: #fff;
}


/* HERO */

.dashboard-hero {
    position: relative;
    display: grid;
    overflow: hidden;
    grid-template-columns: minmax(0, 1.65fr) minmax(260px, 0.65fr);
    gap: 36px;
    min-height: 350px;
    border-radius: 34px;
    background:
        linear-gradient(
            125deg,
            #0f6f5c 0%,
            #149778 48%,
            #22aaa0 100%
        );
    padding: clamp(34px, 5vw, 64px);
    box-shadow:
        0 24px 60px rgba(14, 93, 74, 0.18);
}

.dashboard-hero__decor {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.dashboard-hero__decor--one {
    top: -110px;
    right: 20%;
    width: 320px;
    height: 320px;
    background: rgba(255, 255, 255, 0.08);
}

.dashboard-hero__decor--two {
    right: -100px;
    bottom: -170px;
    width: 390px;
    height: 390px;
    background: rgba(255, 255, 255, 0.07);
}

.dashboard-hero__content {
    position: relative;
    z-index: 2;
}

.dashboard-hero__badge {
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.13);
    padding: 8px 13px;
    color: #eafff6;
    font-size: 0.73rem;
    font-weight: 800;
    backdrop-filter: blur(8px);
}

.dashboard-hero h1 {
    margin: 19px 0 11px;
    color: #fff;
    font-size: clamp(2.6rem, 5vw, 4.6rem);
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.dashboard-hero h1 span {
    display: inline-block;
    font-size: 0.75em;
}

.dashboard-hero__content > p {
    max-width: 650px;
    margin: 0;
    color: rgba(242, 255, 250, 0.84);
    font-size: 0.96rem;
    line-height: 1.7;
}

.dashboard-hero__content > p strong {
    color: #fff;
}

.dashboard-hero__identity {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
    margin-top: 28px;
}

.dashboard-hero__identity > div {
    display: grid;
    min-width: 155px;
    gap: 3px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.10);
    padding: 11px 14px;
    backdrop-filter: blur(8px);
}

.dashboard-hero__identity span {
    color: rgba(239, 255, 248, 0.67);
    font-size: 0.63rem;
}

.dashboard-hero__identity strong {
    color: #fff;
    font-size: 0.79rem;
}

.dashboard-hero__summary {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 13px;
}

.dashboard-summary-card {
    display: flex;
    align-items: center;
    gap: 15px;
    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.94);
    padding: 20px;
    box-shadow:
        0 15px 34px rgba(6, 75, 59, 0.15);
}

.dashboard-summary-card__icon {
    display: grid;
    width: 50px;
    height: 50px;
    place-items: center;
    flex: 0 0 50px;
    border-radius: 15px;
    background:
        linear-gradient(
            145deg,
            #e2f8ef,
            #dff5f5
        );
    font-size: 1.35rem;
}

.dashboard-summary-card > div {
    display: flex;
    align-items: baseline;
    gap: 7px;
}

.dashboard-summary-card strong {
    color: #13755c;
    font-size: 2rem;
    line-height: 1;
}

.dashboard-summary-card span:last-child {
    color: #587a70;
    font-size: 0.76rem;
    font-weight: 700;
}

.dashboard-customize {
    display: flex;
    min-height: 50px;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 16px;
    background: rgba(0, 66, 52, 0.22);
    padding: 0 17px;
    color: #fff;
    font-size: 0.77rem;
    font-weight: 800;
    text-decoration: none;
    backdrop-filter: blur(8px);
}

.dashboard-customize span {
    font-size: 1rem;
}


/* OUTILS */

.dashboard-tools {
    padding: 48px 2px 10px;
}

.dashboard-tools__heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 22px;
}

.dashboard-eyebrow {
    display: block;
    margin-bottom: 5px;
    color: #168160;
    font-size: 0.67rem;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.dashboard-tools__heading h2 {
    margin: 0;
    color: #153f34;
    font-size: clamp(1.8rem, 3vw, 2.5rem);
    letter-spacing: -0.04em;
}

.dashboard-tools__heading p {
    margin: 5px 0 0;
    color: #718c83;
    font-size: 0.82rem;
}

.dashboard-tools__settings {
    color: #187c60;
    font-size: 0.75rem;
    font-weight: 800;
    text-decoration: none;
}

.dashboard-tools__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.dashboard-tool {
    --tool-accent: #1d9a77;
    --tool-soft: #e7f7f0;

    position: relative;
    display: flex;
    overflow: hidden;
    min-height: 210px;
    flex-direction: column;
    border: 1px solid rgba(32, 109, 87, 0.10);
    border-radius: 24px;
    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f9fdfb
        );
    padding: 19px;
    box-shadow:
        0 13px 35px rgba(23, 89, 70, 0.07);
    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease;
}

.dashboard-tool::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--tool-accent);
    content: "";
}

.dashboard-tool:hover {
    transform: translateY(-4px);
    box-shadow:
        0 20px 42px rgba(23, 89, 70, 0.13);
}

.dashboard-tool--production {
    --tool-accent: #1aa873;
    --tool-soft: #e2f8ec;
}

.dashboard-tool--elevage {
    --tool-accent: #d79145;
    --tool-soft: #fff0df;
}

.dashboard-tool--gestion {
    --tool-accent: #278fa4;
    --tool-soft: #e4f5f7;
}

.dashboard-tool--irrigation {
    --tool-accent: #318ec7;
    --tool-soft: #e5f3fc;
}

.dashboard-tool--recoltes {
    --tool-accent: #c58a3a;
    --tool-soft: #fff2df;
}

.dashboard-tool--materiel {
    --tool-accent: #677c9d;
    --tool-soft: #edf1f7;
}

.dashboard-tool--livraisons {
    --tool-accent: #d47c3e;
    --tool-soft: #fff0e4;
}

.dashboard-tool--gestion {
    --tool-accent: #845eb7;
    --tool-soft: #f0eafa;
}

.dashboard-tool__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.dashboard-tool__icon {
    display: grid;
    width: 50px;
    height: 50px;
    place-items: center;
    border-radius: 15px;
    background: var(--tool-soft);
    font-size: 1.4rem;
}

.dashboard-tool__status {
    border-radius: 999px;
    background: var(--tool-soft);
    padding: 6px 9px;
    color: var(--tool-accent);
    font-size: 0.61rem;
    font-weight: 900;
    text-transform: uppercase;
}

.dashboard-tool__content {
    margin-top: 17px;
}

.dashboard-tool__content strong {
    color: #173f35;
    font-size: 0.94rem;
}

.dashboard-tool__content p {
    margin: 6px 0 0;
    color: #718c83;
    font-size: 0.73rem;
    line-height: 1.55;
}

.dashboard-tool__footer {
    display: flex;
    margin-top: auto;
    padding-top: 17px;
    align-items: center;
    justify-content: space-between;
    color: var(--tool-accent);
    font-size: 0.72rem;
    font-weight: 800;
}

.dashboard-tool__arrow {
    display: grid;
    width: 29px;
    height: 29px;
    place-items: center;
    border-radius: 50%;
    background: var(--tool-soft);
}

.farm-dashboard__footer {
    display: flex;
    margin-top: 40px;
    padding: 23px 3px 32px;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(32, 109, 87, 0.09);
    color: #829a92;
    font-size: 0.69rem;
}

.farm-dashboard__footer span:first-child {
    color: #31735f;
    font-weight: 800;
}


/* RESPONSIVE */

@media (max-width: 980px) {

    .dashboard-hero {
        grid-template-columns: 1fr;
    }

    .dashboard-hero__summary {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .dashboard-tools__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 680px) {

    .farm-dashboard__header {
        padding: 18px;
    }

    .farm-dashboard__header-actions {
        gap: 6px;
    }

    .dashboard-header-button {
        padding: 0 11px;
    }

    .dashboard-header-button--logout span {
        display: none;
    }

    .farm-dashboard__content {
        width: min(100% - 28px, 1320px);
        margin-top: 12px;
    }

    .dashboard-hero {
        min-height: auto;
        border-radius: 25px;
        padding: 29px 22px;
    }

    .dashboard-hero__identity {
        display: grid;
        grid-template-columns: 1fr;
    }

    .dashboard-hero__identity > div {
        min-width: 0;
    }

    .dashboard-hero__summary {
        grid-template-columns: 1fr;
    }

    .dashboard-tools {
        padding-top: 35px;
    }

    .dashboard-tools__heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-tools__grid {
        grid-template-columns: 1fr;
    }

    .dashboard-tool {
        min-height: 185px;
    }

    .farm-dashboard__footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

}

/* ===== FIN ONBOARDING MODULES ===== */



/* ===== FINITIONS TABLEAU DE BORD ===== */

/*
 * Chaque outil possède sa propre identité visuelle.
 * Ces règles sont placées après les couleurs de catégories
 * pour prendre la priorité.
 */

.dashboard-tool--cultures {
    --tool-accent: #199c69;
    --tool-soft: #e2f8ec;
}

.dashboard-tool--parcelles {
    --tool-accent: #23977b;
    --tool-soft: #e2f6ef;
}

.dashboard-tool--irrigation {
    --tool-accent: #258fc5;
    --tool-soft: #e2f3fc;
}

.dashboard-tool--recoltes {
    --tool-accent: #d28a32;
    --tool-soft: #fff0dc;
}

.dashboard-tool--planning {
    --tool-accent: #596ec7;
    --tool-soft: #e9edfc;
}

.dashboard-tool--stocks {
    --tool-accent: #a87142;
    --tool-soft: #f8ecdf;
}

.dashboard-tool--materiel {
    --tool-accent: #497a8a;
    --tool-soft: #e4f0f2;
}

.dashboard-tool--livraisons {
    --tool-accent: #dc7545;
    --tool-soft: #ffebe2;
}

.dashboard-tool--gestion {
    --tool-accent: #855eb7;
    --tool-soft: #f0e8fa;
}

.dashboard-tool--animaux {
    --tool-accent: #c37949;
    --tool-soft: #faeadf;
}

.dashboard-tool--soins {
    --tool-accent: #d15b6f;
    --tool-soft: #fce7eb;
}

.dashboard-tool--reproduction {
    --tool-accent: #b56c9d;
    --tool-soft: #f7e8f3;
}

.dashboard-tool--alimentation {
    --tool-accent: #a78428;
    --tool-soft: #faf2d9;
}


/* Carte légèrement plus vivante */

.dashboard-tool {
    border-color:
        color-mix(
            in srgb,
            var(--tool-accent) 17%,
            transparent
        );

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            color-mix(
                in srgb,
                var(--tool-soft) 34%,
                #ffffff
            ) 100%
        );
}

.dashboard-tool__icon {
    box-shadow:
        inset 0 0 0 1px
        color-mix(
            in srgb,
            var(--tool-accent) 9%,
            transparent
        );
}

.dashboard-tool__status {
    border:
        1px solid
        color-mix(
            in srgb,
            var(--tool-accent) 13%,
            transparent
        );
}


/* Boutons du haut */

.dashboard-header-button {
    min-height: 46px;
    border-color: rgba(23, 121, 91, 0.15);
    background: rgba(255, 255, 255, 0.95);
    padding-inline: 18px;
    box-shadow:
        0 8px 24px rgba(23, 94, 74, 0.08);
}

.dashboard-header-button:first-child {
    color: #126e54;
}

.dashboard-header-button:first-child span {
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border-radius: 8px;
    background: #e7f7f0;
}

.dashboard-header-button--logout {
    border-color: rgba(76, 103, 95, 0.14);
    color: #4f6e65;
}

.dashboard-header-button:hover {
    border-color: rgba(24, 144, 108, 0.24);
}


/* Titre des outils */

.dashboard-tools__heading {
    padding-inline: 3px;
}

.dashboard-tools__settings {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    border: 1px solid rgba(27, 126, 96, 0.13);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.64);
    padding: 0 13px;
}

.dashboard-tools__settings:hover {
    background: #ffffff;
}


/* Pied de page plus lisible */

.farm-dashboard__footer {
    margin-top: 48px;
    border-top: 1px solid rgba(26, 119, 91, 0.12);
    color: #708c82;
}

.farm-dashboard__footer span:first-child {
    color: #16795c;
    font-weight: 900;
}


/* Petit renforcement du hero */

.dashboard-hero {
    box-shadow:
        0 28px 65px rgba(12, 99, 77, 0.20);
}

.dashboard-summary-card {
    border-color: rgba(255, 255, 255, 0.30);
}

.dashboard-customize {
    transition:
        background 0.18s ease,
        transform 0.18s ease;
}

.dashboard-customize:hover {
    transform: translateY(-1px);
    background: rgba(0, 61, 48, 0.31);
}


/* Mobile */

@media (max-width: 680px) {

    .dashboard-header-button {
        min-height: 42px;
        padding-inline: 11px;
    }

    .dashboard-tools__settings {
        min-height: 40px;
    }

}

/* ===== FIN FINITIONS TABLEAU DE BORD ===== */


/* ===== IDENTITÉ COULEUR DÉFINITIVE DES OUTILS ===== */

.dashboard-tool {
    background:
        linear-gradient(
            145deg,
            #ffffff 20%,
            var(--tool-soft) 135%
        );

    border-color:
        color-mix(
            in srgb,
            var(--tool-accent) 24%,
            transparent
        );
}

.dashboard-tool::before {
    height: 4px;
    background: var(--tool-accent);
}

.dashboard-tool__icon {
    background: var(--tool-soft);
}

.dashboard-tool__status {
    border-color:
        color-mix(
            in srgb,
            var(--tool-accent) 16%,
            transparent
        );

    background: var(--tool-soft);
    color: var(--tool-accent);
}

.dashboard-tool__footer,
.dashboard-tool__footer span {
    color: var(--tool-accent);
}

.dashboard-tool__arrow {
    background: var(--tool-soft);
    color: var(--tool-accent);
}

/* ===== FIN IDENTITÉ COULEUR OUTILS ===== */


/* ==========================================================
   MODULE PARCELLES
   ========================================================== */

.farm-module-page {
    min-height: 100vh;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(163, 241, 210, 0.34),
            transparent 27%
        ),
        radial-gradient(
            circle at 100% 25%,
            rgba(117, 211, 220, 0.18),
            transparent 31%
        ),
        linear-gradient(
            145deg,
            #f4fbf7 0%,
            #eff9f6 52%,
            #eef8f9 100%
        );
}

.farm-module-page__content {
    width: min(1320px, calc(100% - 48px));
    margin: 20px auto 0;
}


/* HERO */

.parcel-hero {
    display: grid;
    grid-template-columns:
        minmax(0, 1.7fr)
        minmax(300px, 0.7fr);
    gap: 30px;
    overflow: hidden;
    border-radius: 30px;
    background:
        linear-gradient(
            125deg,
            #11765d,
            #159d7b 54%,
            #29aba2
        );
    padding: clamp(34px, 5vw, 56px);
    box-shadow:
        0 24px 55px rgba(13, 98, 75, 0.17);
}

.parcel-hero__badge {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.13);
    padding: 7px 11px;
    color: #eafff6;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.05em;
}

.parcel-hero h1 {
    margin: 16px 0 8px;
    color: #fff;
    font-size: clamp(2.3rem, 4vw, 4rem);
    letter-spacing: -0.055em;
}

.parcel-hero__content > p {
    max-width: 650px;
    margin: 0;
    color: rgba(242, 255, 250, 0.82);
    font-size: 0.9rem;
    line-height: 1.65;
}

.parcel-hero__stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    align-content: center;
}

.parcel-hero__stats > div {
    display: grid;
    gap: 6px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.94);
    padding: 19px;
}

.parcel-hero__stats span {
    color: #6e8c82;
    font-size: 0.68rem;
    font-weight: 700;
}

.parcel-hero__stats strong {
    color: #15775d;
    font-size: 1.55rem;
}


/* SECTION */

.parcel-section {
    padding: 44px 2px 60px;
}

.parcel-section__heading {
    display: flex;
    margin-bottom: 20px;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
}

.parcel-section__heading span {
    color: #168160;
    font-size: 0.65rem;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.parcel-section__heading h2 {
    margin: 4px 0 0;
    color: #173f35;
    font-size: 1.8rem;
}

.parcel-add-button,
.parcel-primary-button {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    border: 0;
    border-radius: 14px;
    background:
        linear-gradient(
            110deg,
            #24b682,
            #137c68
        );
    padding: 0 17px;
    color: #fff;
    box-shadow:
        0 11px 26px rgba(20, 130, 99, 0.16);
    cursor: pointer;
    font: inherit;
    font-size: 0.75rem;
    font-weight: 900;
    text-decoration: none;
}

.parcel-header-add {
    color: #14755a;
}


/* GRILLE */

.parcel-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.parcel-card {
    display: flex;
    min-height: 280px;
    flex-direction: column;
    border:
        1px solid rgba(30, 137, 103, 0.14);
    border-radius: 24px;
    background:
        linear-gradient(
            145deg,
            #fff,
            #f4fcf8
        );
    padding: 19px;
    box-shadow:
        0 13px 34px rgba(23, 89, 70, 0.065);
}

.parcel-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.parcel-card__icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    background: #dff6ed;
    font-size: 1.35rem;
}

.parcel-card__status {
    border-radius: 999px;
    background: #e2f8ed;
    padding: 6px 9px;
    color: #198160;
    font-size: 0.6rem;
    font-weight: 900;
    text-transform: uppercase;
}

.parcel-card__body {
    margin-top: 18px;
}

.parcel-card__reference {
    color: #1b956f;
    font-size: 0.65rem;
    font-weight: 900;
    text-transform: uppercase;
}

.parcel-card h3 {
    margin: 5px 0 7px;
    color: #173f35;
    font-size: 1.15rem;
}

.parcel-card__body p {
    margin: 0;
    color: #718c83;
    font-size: 0.74rem;
}

.parcel-card__surface {
    display: grid;
    gap: 3px;
    margin-top: 20px;
    border-radius: 15px;
    background: #eff9f5;
    padding: 13px;
}

.parcel-card__surface span {
    color: #759087;
    font-size: 0.65rem;
}

.parcel-card__surface strong {
    color: #14765a;
    font-size: 1.15rem;
}

.parcel-card__footer {
    display: flex;
    margin-top: auto;
    padding-top: 18px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: #859a93;
    font-size: 0.67rem;
}

.parcel-card__footer a {
    color: #18805f;
    font-weight: 900;
    text-decoration: none;
}


/* ÉTAT VIDE */

.parcel-empty {
    display: grid;
    min-height: 360px;
    place-items: center;
    align-content: center;
    border:
        1px dashed rgba(27, 132, 100, 0.28);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.65);
    padding: 40px;
    text-align: center;
}

.parcel-empty__icon {
    display: grid;
    width: 70px;
    height: 70px;
    place-items: center;
    border-radius: 22px;
    background: #e3f7ef;
    font-size: 2rem;
}

.parcel-empty h3 {
    margin: 17px 0 7px;
    color: #173f35;
    font-size: 1.4rem;
}

.parcel-empty p {
    max-width: 420px;
    margin: 0 0 20px;
    color: #718c83;
    font-size: 0.8rem;
    line-height: 1.55;
}


/* FORMULAIRE */

.parcel-form-layout {
    display: grid;
    width: min(1180px, calc(100% - 48px));
    margin: 60px auto;
    grid-template-columns:
        minmax(0, 0.9fr)
        minmax(450px, 1.1fr);
    gap: clamp(40px, 7vw, 90px);
    align-items: center;
}

.parcel-form-intro .parcel-hero__badge {
    background: #e3f7ef;
    color: #168060;
}

.parcel-form-intro h1 {
    margin: 18px 0 13px;
    color: #163e34;
    font-size: clamp(2.6rem, 5vw, 4.6rem);
    line-height: 1;
    letter-spacing: -0.055em;
}

.parcel-form-intro > p {
    max-width: 530px;
    color: #57766c;
    font-size: 0.92rem;
    line-height: 1.7;
}

.parcel-form-tip {
    display: flex;
    max-width: 470px;
    margin-top: 28px;
    gap: 14px;
    border:
        1px solid rgba(31, 139, 105, 0.13);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.65);
    padding: 17px;
}

.parcel-form-tip > span {
    font-size: 1.35rem;
}

.parcel-form-tip strong {
    color: #176f55;
}

.parcel-form-tip p {
    margin: 4px 0 0;
    color: #718b82;
    font-size: 0.75rem;
    line-height: 1.5;
}

.parcel-form-card {
    border:
        1px solid rgba(26, 111, 86, 0.10);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.94);
    padding: clamp(27px, 4vw, 42px);
    box-shadow:
        0 24px 60px rgba(19, 87, 67, 0.11);
}

.parcel-form-card__heading {
    margin-bottom: 25px;
}

.parcel-form-card__heading > span {
    color: #178060;
    font-size: 0.67rem;
    font-weight: 900;
    text-transform: uppercase;
}

.parcel-form-card__heading h2 {
    margin: 5px 0;
    color: #163f35;
    font-size: 1.55rem;
}

.parcel-form-card__heading p {
    margin: 0;
    color: #80978f;
    font-size: 0.73rem;
}

.parcel-form {
    display: grid;
    gap: 20px;
}

.parcel-form__row {
    display: grid;
    grid-template-columns: 0.7fr 1.3fr;
    gap: 14px;
}

.parcel-form__surface {
    display: grid;
    grid-template-columns: 1.25fr 0.75fr;
    gap: 14px;
}

.parcel-form select {
    width: 100%;
    min-height: 49px;
    border: 1px solid #d8e6e1;
    border-radius: 14px;
    background: #fbfefd;
    padding: 0 13px;
    color: #254f43;
    outline: none;
}

.parcel-form select:focus {
    border-color: #38ae8c;
    box-shadow:
        0 0 0 3px rgba(42, 167, 132, 0.10);
}

.parcel-form__actions {
    display: flex;
    margin-top: 6px;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.parcel-secondary-button {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    border:
        1px solid rgba(34, 111, 89, 0.15);
    border-radius: 14px;
    background: #fff;
    padding: 0 17px;
    color: #55766b;
    font-size: 0.75rem;
    font-weight: 800;
    text-decoration: none;
}

.dashboard-tool__open {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    color: var(--tool-accent);
    text-decoration: none;
}


/* RESPONSIVE */

@media (max-width: 900px) {

    .parcel-hero,
    .parcel-form-layout {
        grid-template-columns: 1fr;
    }

    .parcel-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 640px) {

    .farm-module-page__content,
    .parcel-form-layout {
        width: min(100% - 28px, 1180px);
    }

    .parcel-hero {
        border-radius: 24px;
        padding: 28px 22px;
    }

    .parcel-hero__stats {
        grid-template-columns: 1fr;
    }

    .parcel-section__heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .parcel-grid {
        grid-template-columns: 1fr;
    }

    .parcel-form-layout {
        margin-top: 35px;
    }

    .parcel-form__row,
    .parcel-form__surface {
        grid-template-columns: 1fr;
    }

    .parcel-form__actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .parcel-primary-button,
    .parcel-secondary-button {
        width: 100%;
    }

}

/* ===== FIN MODULE PARCELLES ===== */


/* ==========================================================
   CULTURES & CAMPAGNES CULTURALES
   ========================================================== */

.culture-header-add {
    color: #14755a;
}

.culture-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.7fr);
    gap: 30px;
    overflow: hidden;
    border-radius: 30px;
    background:
        linear-gradient(
            125deg,
            #146f4c,
            #20a16f 55%,
            #54b77e
        );
    padding: clamp(34px, 5vw, 56px);
    box-shadow:
        0 24px 55px rgba(13, 98, 75, 0.17);
}

.culture-hero h1 {
    margin: 16px 0 8px;
    color: #fff;
    font-size: clamp(2.3rem, 4vw, 4rem);
    letter-spacing: -0.055em;
}

.culture-hero > div:first-child > p {
    max-width: 650px;
    margin: 0;
    color: rgba(245, 255, 249, 0.84);
    font-size: 0.9rem;
    line-height: 1.65;
}

.culture-hero__stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    align-content: center;
}

.culture-hero__stats > div {
    display: grid;
    gap: 5px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.95);
    padding: 19px;
}

.culture-hero__stats span {
    color: #708c82;
    font-size: 0.67rem;
    font-weight: 700;
}

.culture-hero__stats strong {
    color: #177451;
    font-size: 1.6rem;
}

.culture-section,
.culture-catalog {
    padding: 44px 2px 12px;
}

.culture-catalog {
    padding-bottom: 65px;
}

.culture-section__heading {
    display: flex;
    margin-bottom: 20px;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
}

.culture-section__heading span {
    color: #168160;
    font-size: 0.65rem;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.culture-section__heading h2 {
    margin: 4px 0 0;
    color: #173f35;
    font-size: 1.8rem;
}

.culture-secondary-action {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    border: 1px solid rgba(27, 126, 96, 0.15);
    border-radius: 13px;
    background: #fff;
    padding: 0 14px;
    color: #187c60;
    font-size: 0.73rem;
    font-weight: 900;
    text-decoration: none;
}

.culture-campaign-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.culture-campaign-card {
    min-height: 265px;
    border: 1px solid rgba(29, 147, 100, 0.16);
    border-radius: 24px;
    background:
        linear-gradient(
            145deg,
            #fff,
            #f4fcf7
        );
    padding: 19px;
    box-shadow:
        0 13px 34px rgba(23, 89, 70, 0.065);
}

.culture-campaign-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.culture-campaign-card__icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    background: #e2f7e9;
    font-size: 1.4rem;
}

.culture-status {
    border-radius: 999px;
    padding: 6px 9px;
    font-size: 0.6rem;
    font-weight: 900;
    text-transform: uppercase;
}

.culture-status--planned {
    background: #eef1fb;
    color: #5d6fb1;
}

.culture-status--in_progress {
    background: #e2f8ed;
    color: #198160;
}

.culture-status--harvested {
    background: #fff0dc;
    color: #b87522;
}

.culture-status--cancelled {
    background: #fae8e8;
    color: #a65252;
}

.culture-campaign-card__parcel {
    display: block;
    margin-top: 17px;
    color: #198260;
    font-size: 0.67rem;
    font-weight: 900;
}

.culture-campaign-card h3 {
    margin: 6px 0 3px;
    color: #173f35;
    font-size: 1.2rem;
}

.culture-variety {
    margin: 0;
    color: #718c83;
    font-size: 0.73rem;
}

.culture-dates {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin-top: 20px;
}

.culture-dates > div {
    display: grid;
    gap: 4px;
    border-radius: 14px;
    background: #eff9f4;
    padding: 11px;
}

.culture-dates span {
    color: #80978f;
    font-size: 0.61rem;
}

.culture-dates strong {
    color: #26634f;
    font-size: 0.75rem;
}

.culture-catalog-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.culture-catalog-card {
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid rgba(27, 126, 96, 0.12);
    border-radius: 17px;
    background: rgba(255, 255, 255, 0.82);
    padding: 14px;
}

.culture-catalog-card > span {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    background: #e5f7ed;
}

.culture-catalog-card > div {
    display: grid;
    gap: 2px;
}

.culture-catalog-card strong {
    color: #1b493c;
    font-size: 0.8rem;
}

.culture-catalog-card small {
    color: #7b938b;
    font-size: 0.66rem;
}

.culture-form-layout {
    display: grid;
    width: min(1180px, calc(100% - 48px));
    margin: 60px auto;
    grid-template-columns:
        minmax(0, 0.9fr)
        minmax(450px, 1.1fr);
    gap: clamp(40px, 7vw, 90px);
    align-items: center;
}

.culture-form-badge {
    display: inline-flex;
    border-radius: 999px;
    background: #e3f7eb;
    padding: 7px 11px;
    color: #177b58;
    font-size: 0.68rem;
    font-weight: 900;
}

.culture-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.parcel-form textarea {
    width: 100%;
    resize: vertical;
    border: 1px solid #d8e6e1;
    border-radius: 14px;
    background: #fbfefd;
    padding: 13px;
    color: #254f43;
    font: inherit;
    outline: none;
}

.parcel-form textarea:focus {
    border-color: #38ae8c;
    box-shadow: 0 0 0 3px rgba(42, 167, 132, 0.10);
}

@media (max-width: 950px) {

    .culture-hero,
    .culture-form-layout {
        grid-template-columns: 1fr;
    }

    .culture-campaign-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .culture-catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 640px) {

    .culture-hero__stats,
    .culture-form__row,
    .culture-campaign-grid,
    .culture-catalog-grid {
        grid-template-columns: 1fr;
    }

    .culture-form-layout {
        width: min(100% - 28px, 1180px);
        margin-top: 35px;
    }

    .culture-section__heading {
        align-items: flex-start;
        flex-direction: column;
    }

}

/* ===== FIN CULTURES & CAMPAGNES ===== */


/* ===== MODIFICATION CULTURES / CAMPAGNES ===== */

.culture-card-actions {
    display: flex;
    margin-top: 18px;
    padding-top: 14px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid rgba(27, 126, 96, 0.09);
}

.culture-card-actions > span {
    color: #839990;
    font-size: 0.65rem;
}

.culture-card-actions a {
    color: #16805e;
    font-size: 0.69rem;
    font-weight: 900;
    text-decoration: none;
}

.culture-catalog-card__content {
    display: flex;
    min-width: 0;
    flex: 1;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.culture-catalog-card__content > div {
    display: grid;
    gap: 2px;
}

.culture-catalog-card__content a {
    flex: 0 0 auto;
    border-radius: 9px;
    background: #edf8f3;
    padding: 6px 8px;
    color: #16805e;
    font-size: 0.62rem;
    font-weight: 900;
    text-decoration: none;
}

.culture-catalog-card__content a:hover,
.culture-card-actions a:hover {
    text-decoration: underline;
}

/* ===== FIN MODIFICATION CULTURES / CAMPAGNES ===== */


/* ==========================================================
   IRRIGATION
   ========================================================== */

.irrigation-page {
    background:
        radial-gradient(
            circle at 0 0,
            rgba(150, 226, 239, 0.27),
            transparent 28%
        ),
        radial-gradient(
            circle at 100% 20%,
            rgba(122, 221, 201, 0.18),
            transparent 31%
        ),
        linear-gradient(
            145deg,
            #f4fbfa,
            #eff9f8 52%,
            #eef8fb
        );
}

.irrigation-header-add {
    color: #247fa2;
}

.irrigation-hero {
    display: grid;
    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(390px, 0.8fr);
    gap: 30px;
    overflow: hidden;
    border-radius: 30px;
    background:
        linear-gradient(
            125deg,
            #197b8e,
            #229ca8 52%,
            #35b49c
        );
    padding: clamp(34px, 5vw, 56px);
    box-shadow:
        0 24px 55px rgba(25, 112, 127, 0.17);
}

.irrigation-badge,
.irrigation-form-badge {
    display: inline-flex;
    width: fit-content;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    padding: 7px 11px;
    color: #f0fdff;
    font-size: 0.67rem;
    font-weight: 900;
    letter-spacing: 0.05em;
}

.irrigation-hero h1 {
    margin: 16px 0 8px;
    color: #fff;
    font-size: clamp(2.4rem, 4vw, 4rem);
    letter-spacing: -0.055em;
}

.irrigation-hero__content > p {
    max-width: 640px;
    margin: 0;
    color: rgba(241, 254, 255, 0.85);
    font-size: 0.9rem;
    line-height: 1.65;
}

.irrigation-hero__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    align-content: center;
}

.irrigation-hero__stats > div {
    display: grid;
    min-width: 0;
    gap: 5px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.95);
    padding: 17px;
}

.irrigation-hero__stats span {
    color: #6b8c91;
    font-size: 0.63rem;
    font-weight: 700;
}

.irrigation-hero__stats strong {
    color: #237f8e;
    font-size: 1.35rem;
}

.irrigation-section {
    padding: 44px 2px 65px;
}

.irrigation-primary-button {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 14px;
    background:
        linear-gradient(
            110deg,
            #28a9c0,
            #168276
        );
    padding: 0 17px;
    color: #fff;
    box-shadow:
        0 11px 26px rgba(28, 130, 144, 0.17);
    cursor: pointer;
    font: inherit;
    font-size: 0.74rem;
    font-weight: 900;
    text-decoration: none;
}

.irrigation-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.irrigation-card {
    display: flex;
    min-height: 315px;
    flex-direction: column;
    border: 1px solid rgba(39, 143, 162, 0.17);
    border-radius: 24px;
    background:
        linear-gradient(
            145deg,
            #fff,
            #f2fbfc
        );
    padding: 19px;
    box-shadow:
        0 13px 34px rgba(25, 101, 115, 0.07);
}

.irrigation-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.irrigation-card__icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    background: #e0f4fa;
    font-size: 1.4rem;
}

.irrigation-card__date {
    border-radius: 999px;
    background: #e6f6f8;
    padding: 6px 9px;
    color: #238395;
    font-size: 0.62rem;
    font-weight: 900;
}

.irrigation-card__parcel {
    display: block;
    margin-top: 17px;
    color: #218498;
    font-size: 0.67rem;
    font-weight: 900;
}

.irrigation-card h3 {
    margin: 6px 0 3px;
    color: #153f43;
    font-size: 1.15rem;
}

.irrigation-variety {
    margin: 0;
    color: #718c8e;
    font-size: 0.72rem;
}

.irrigation-card__details {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 18px;
}

.irrigation-card__details > div {
    display: grid;
    min-width: 0;
    gap: 4px;
    border-radius: 13px;
    background: #edf8f9;
    padding: 10px;
}

.irrigation-card__details span {
    color: #80969a;
    font-size: 0.59rem;
}

.irrigation-card__details strong {
    color: #246a74;
    font-size: 0.74rem;
}

.irrigation-method {
    display: inline-flex;
    width: fit-content;
    margin-top: 14px;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    background: #e9f7f5;
    padding: 7px 10px;
    color: #277a77;
    font-size: 0.65rem;
    font-weight: 800;
}

.irrigation-form-layout {
    display: grid;
    width: min(1180px, calc(100% - 48px));
    margin: 60px auto;
    grid-template-columns:
        minmax(0, 0.9fr)
        minmax(480px, 1.1fr);
    gap: clamp(40px, 7vw, 90px);
    align-items: center;
}

.irrigation-form-badge {
    background: #e2f5f8;
    color: #237e91;
}

.irrigation-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.irrigation-form__volume {
    display: grid;
    grid-template-columns: 1.3fr 0.7fr;
    gap: 14px;
}

.irrigation-tip {
    border-color: rgba(40, 145, 163, 0.15);
}

.irrigation-form-card {
    box-shadow:
        0 24px 60px rgba(20, 102, 115, 0.11);
}

@media (max-width: 1000px) {

    .irrigation-hero,
    .irrigation-form-layout {
        grid-template-columns: 1fr;
    }

    .irrigation-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 700px) {

    .irrigation-hero__stats,
    .irrigation-grid,
    .irrigation-form__row,
    .irrigation-form__volume {
        grid-template-columns: 1fr;
    }

    .irrigation-form-layout {
        width: min(100% - 28px, 1180px);
        margin-top: 35px;
    }

    .irrigation-card__details {
        grid-template-columns: 1fr;
    }

}

/* ===== FIN IRRIGATION ===== */


/* ==========================================================
   RÉCOLTES
   ========================================================== */

.harvest-page {
    background:
        radial-gradient(
            circle at 0 0,
            rgba(245, 207, 135, 0.23),
            transparent 28%
        ),
        radial-gradient(
            circle at 100% 20%,
            rgba(116, 215, 177, 0.18),
            transparent 31%
        ),
        linear-gradient(
            145deg,
            #fbfaf4,
            #f6faf5 50%,
            #eff9f6
        );
}

.harvest-header-add {
    color: #a66824;
}

.harvest-hero {
    display: grid;
    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(390px, 0.8fr);
    gap: 30px;
    overflow: hidden;
    border-radius: 30px;
    background:
        linear-gradient(
            125deg,
            #a66724,
            #d28a32 50%,
            #dba64b 100%
        );
    padding: clamp(34px, 5vw, 56px);
    box-shadow:
        0 24px 55px rgba(160, 103, 34, 0.18);
}

.harvest-badge,
.harvest-form-badge {
    display: inline-flex;
    width: fit-content;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    padding: 7px 11px;
    color: #fffdf5;
    font-size: 0.67rem;
    font-weight: 900;
    letter-spacing: 0.05em;
}

.harvest-hero h1 {
    margin: 16px 0 8px;
    color: #fff;
    font-size: clamp(2.4rem, 4vw, 4rem);
    letter-spacing: -0.055em;
}

.harvest-hero__content > p {
    max-width: 640px;
    margin: 0;
    color: rgba(255, 252, 242, 0.88);
    font-size: 0.9rem;
    line-height: 1.65;
}

.harvest-hero__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    align-content: center;
}

.harvest-hero__stats > div {
    display: grid;
    min-width: 0;
    gap: 5px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.95);
    padding: 17px;
}

.harvest-hero__stats span {
    color: #8c806b;
    font-size: 0.62rem;
    font-weight: 700;
}

.harvest-hero__stats strong {
    color: #a66b25;
    font-size: 1.35rem;
}

.harvest-section {
    padding: 44px 2px 65px;
}

.harvest-primary-button {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 14px;
    background:
        linear-gradient(
            110deg,
            #e19a3d,
            #b66f24
        );
    padding: 0 17px;
    color: #fff;
    box-shadow:
        0 11px 26px rgba(183, 111, 36, 0.18);
    cursor: pointer;
    font: inherit;
    font-size: 0.74rem;
    font-weight: 900;
    text-decoration: none;
}

.harvest-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.harvest-card {
    display: flex;
    min-height: 345px;
    flex-direction: column;
    border: 1px solid rgba(192, 127, 44, 0.18);
    border-radius: 24px;
    background:
        linear-gradient(
            145deg,
            #fff,
            #fffaf1
        );
    padding: 19px;
    box-shadow:
        0 13px 34px rgba(122, 83, 31, 0.07);
}

.harvest-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.harvest-card__icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    background: #fff0d9;
    font-size: 1.4rem;
}

.harvest-card__date {
    border-radius: 999px;
    background: #fff1dc;
    padding: 6px 9px;
    color: #b57425;
    font-size: 0.62rem;
    font-weight: 900;
}

.harvest-card__parcel {
    display: block;
    margin-top: 17px;
    color: #9b6b2d;
    font-size: 0.67rem;
    font-weight: 900;
}

.harvest-card h3 {
    margin: 6px 0 3px;
    color: #4a3824;
    font-size: 1.15rem;
}

.harvest-variety {
    margin: 0;
    color: #8c8173;
    font-size: 0.72rem;
}

.harvest-quantity {
    display: grid;
    gap: 4px;
    margin-top: 18px;
    border-radius: 15px;
    background: #fff4e3;
    padding: 13px;
}

.harvest-quantity span {
    color: #94826b;
    font-size: 0.62rem;
}

.harvest-quantity strong {
    color: #a96b22;
    font-size: 1.2rem;
}

.harvest-yield {
    display: grid;
    gap: 3px;
    margin-top: 9px;
    border-radius: 14px;
    background: #edf8f1;
    padding: 11px 13px;
}

.harvest-yield span {
    color: #769083;
    font-size: 0.61rem;
}

.harvest-yield strong {
    color: #267656;
    font-size: 0.78rem;
}

.harvest-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 12px;
}

.harvest-meta span {
    border-radius: 999px;
    background: #f6f3eb;
    padding: 6px 9px;
    color: #756d60;
    font-size: 0.62rem;
    font-weight: 700;
}

.harvest-form-layout {
    display: grid;
    width: min(1180px, calc(100% - 48px));
    margin: 60px auto;
    grid-template-columns:
        minmax(0, 0.9fr)
        minmax(480px, 1.1fr);
    gap: clamp(40px, 7vw, 90px);
    align-items: center;
}

.harvest-form-badge {
    background: #fff0d9;
    color: #aa6d25;
}

.harvest-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.harvest-form__quantity {
    display: grid;
    grid-template-columns: 1.3fr 0.7fr;
    gap: 14px;
}

.harvest-tip {
    border-color: rgba(192, 127, 44, 0.16);
}

.harvest-form-card {
    box-shadow:
        0 24px 60px rgba(132, 88, 34, 0.11);
}

@media (max-width: 1000px) {

    .harvest-hero,
    .harvest-form-layout {
        grid-template-columns: 1fr;
    }

    .harvest-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 700px) {

    .harvest-hero__stats,
    .harvest-grid,
    .harvest-form__row,
    .harvest-form__quantity {
        grid-template-columns: 1fr;
    }

    .harvest-form-layout {
        width: min(100% - 28px, 1180px);
        margin-top: 35px;
    }

}

/* ===== FIN RÉCOLTES ===== */


/* ==========================================================
   STOCKS
   ========================================================== */

.stock-page {
    background:
        radial-gradient(
            circle at 0 0,
            rgba(221, 185, 141, 0.18),
            transparent 28%
        ),
        radial-gradient(
            circle at 100% 20%,
            rgba(121, 216, 190, 0.18),
            transparent 31%
        ),
        linear-gradient(
            145deg,
            #faf9f5,
            #f3faf7 52%,
            #eff8f7
        );
}

.stock-header-action {
    color: #8b6543;
}

.stock-hero {
    display: grid;
    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(390px, 0.8fr);
    gap: 30px;
    overflow: hidden;
    border-radius: 30px;
    background:
        linear-gradient(
            125deg,
            #765237,
            #a9744d 48%,
            #b79068
        );
    padding: clamp(34px, 5vw, 56px);
    box-shadow:
        0 24px 55px rgba(102, 72, 47, 0.17);
}

.stock-badge,
.stock-form-badge {
    display: inline-flex;
    width: fit-content;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.15);
    padding: 7px 11px;
    color: #fffdf9;
    font-size: 0.67rem;
    font-weight: 900;
    letter-spacing: 0.05em;
}

.stock-hero h1 {
    margin: 16px 0 8px;
    color: #fff;
    font-size: clamp(2.4rem, 4vw, 4rem);
    letter-spacing: -0.055em;
}

.stock-hero > div:first-child > p {
    max-width: 640px;
    margin: 0;
    color: rgba(255, 252, 248, 0.85);
    font-size: 0.9rem;
    line-height: 1.65;
}

.stock-hero__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    align-content: center;
}

.stock-hero__stats > div {
    display: grid;
    min-width: 0;
    gap: 5px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.95);
    padding: 17px;
}

.stock-hero__stats span {
    color: #8b8077;
    font-size: 0.62rem;
    font-weight: 700;
}

.stock-hero__stats strong {
    color: #806044;
    font-size: 1.35rem;
}

.stock-section {
    padding: 44px 2px 28px;
}

.stock-primary-button {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 14px;
    background:
        linear-gradient(
            110deg,
            #a87b52,
            #72513a
        );
    padding: 0 17px;
    color: #fff;
    box-shadow:
        0 11px 26px rgba(115, 80, 54, 0.17);
    cursor: pointer;
    font: inherit;
    font-size: 0.74rem;
    font-weight: 900;
    text-decoration: none;
}

.stock-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.stock-card {
    display: flex;
    min-height: 335px;
    flex-direction: column;
    border: 1px solid rgba(125, 91, 59, 0.16);
    border-radius: 24px;
    background:
        linear-gradient(
            145deg,
            #fff,
            #faf7f2
        );
    padding: 19px;
    box-shadow:
        0 13px 34px rgba(87, 65, 44, 0.065);
}

.stock-card--alert {
    border-color: rgba(205, 111, 68, 0.34);
    background:
        linear-gradient(
            145deg,
            #fff,
            #fff4ef
        );
}

.stock-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.stock-card__icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    background: #f2e8dc;
    font-size: 1.35rem;
}

.stock-ok-badge,
.stock-alert-badge {
    border-radius: 999px;
    padding: 6px 9px;
    font-size: 0.59rem;
    font-weight: 900;
    text-transform: uppercase;
}

.stock-ok-badge {
    background: #e3f7ec;
    color: #19805f;
}

.stock-alert-badge {
    background: #fde9df;
    color: #b25b3e;
}

.stock-reference {
    display: block;
    margin-top: 17px;
    color: #8f6745;
    font-size: 0.65rem;
    font-weight: 900;
    text-transform: uppercase;
}

.stock-card h3 {
    margin: 5px 0 0;
    color: #443529;
    font-size: 1.15rem;
}

.stock-balance {
    display: grid;
    gap: 4px;
    margin-top: 19px;
    border-radius: 15px;
    background: #f5eee6;
    padding: 13px;
}

.stock-balance span {
    color: #8d8175;
    font-size: 0.62rem;
}

.stock-balance strong {
    color: #785738;
    font-size: 1.25rem;
}

.stock-threshold {
    margin: 8px 0 0;
    color: #917c69;
    font-size: 0.65rem;
}

.stock-card__quick-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 17px;
}

.stock-card__quick-actions a {
    display: flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(121, 89, 59, 0.13);
    border-radius: 11px;
    background: #fff;
    color: #72543b;
    font-size: 0.68rem;
    font-weight: 900;
    text-decoration: none;
}

.stock-history {
    padding: 20px 2px 65px;
}

.stock-history-list {
    overflow: hidden;
    border: 1px solid rgba(111, 82, 55, 0.12);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.82);
}

.stock-history-item {
    display: grid;
    grid-template-columns:
        auto minmax(0, 1fr) auto auto;
    gap: 13px;
    align-items: center;
    padding: 14px 17px;
    border-bottom: 1px solid rgba(111, 82, 55, 0.08);
}

.stock-history-item:last-child {
    border-bottom: 0;
}

.stock-history-item__type {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 11px;
    font-size: 1rem;
    font-weight: 900;
}

.stock-history-item__type--entry {
    background: #e4f7ed;
    color: #16805e;
}

.stock-history-item__type--exit {
    background: #fdebe3;
    color: #bc6141;
}

.stock-history-item__content {
    display: grid;
    gap: 2px;
}

.stock-history-item__content strong {
    color: #43372e;
    font-size: 0.78rem;
}

.stock-history-item__content small {
    color: #8a8179;
    font-size: 0.65rem;
}

.stock-history-item__quantity {
    font-size: 0.75rem;
}

.stock-history-item__quantity--entry {
    color: #16805e;
}

.stock-history-item__quantity--exit {
    color: #bc6141;
}

.stock-history-item > a {
    color: #806045;
    font-size: 0.66rem;
    font-weight: 900;
    text-decoration: none;
}

.stock-form-layout {
    display: grid;
    width: min(1180px, calc(100% - 48px));
    margin: 60px auto;
    grid-template-columns:
        minmax(0, 0.9fr)
        minmax(480px, 1.1fr);
    gap: clamp(40px, 7vw, 90px);
    align-items: center;
}

.stock-form-badge {
    background: #f3e8dc;
    color: #806044;
}

.stock-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.stock-movement-type {
    margin: 0;
    padding: 0;
    border: 0;
}

.stock-movement-type legend {
    margin-bottom: 8px;
    color: #31594e;
    font-size: 0.78rem;
    font-weight: 800;
}

.stock-movement-type__choices {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.stock-movement-choice {
    position: relative;
    cursor: pointer;
}

.stock-movement-choice input {
    position: absolute;
    opacity: 0;
}

.stock-movement-choice > span {
    display: grid;
    min-height: 72px;
    align-content: center;
    gap: 3px;
    border: 1.5px solid #dce8e2;
    border-radius: 15px;
    background: #fbfefd;
    padding: 12px;
}

.stock-movement-choice b {
    color: #315749;
    font-size: 0.78rem;
}

.stock-movement-choice small {
    color: #82958e;
    font-size: 0.65rem;
}

.stock-movement-choice:has(input:checked) > span {
    border-color: #238a69;
    background: #eef9f4;
    box-shadow:
        0 0 0 3px rgba(35, 138, 105, 0.08);
}

@media (max-width: 1000px) {

    .stock-hero,
    .stock-form-layout {
        grid-template-columns: 1fr;
    }

    .stock-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 700px) {

    .stock-hero__stats,
    .stock-grid,
    .stock-form__row,
    .stock-movement-type__choices {
        grid-template-columns: 1fr;
    }

    .stock-form-layout {
        width: min(100% - 28px, 1180px);
        margin-top: 35px;
    }

    .stock-history-item {
        grid-template-columns: auto 1fr;
    }

    .stock-history-item__quantity,
    .stock-history-item > a {
        grid-column: 2;
    }

}

/* ===== FIN STOCKS ===== */


/* ==========================================================
   SYNCHRONISATION RÉCOLTE -> STOCK
   ========================================================== */

.harvest-stock-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 13px;
    align-items: center;
    border: 1px solid rgba(34, 137, 99, 0.14);
    border-radius: 17px;
    background:
        linear-gradient(
            135deg,
            #f5fcf8,
            #f2faf7
        );
    padding: 14px;
}

.harvest-stock-field__icon {
    display: grid;
    width: 45px;
    height: 45px;
    place-items: center;
    border-radius: 14px;
    background: #e2f5ea;
    font-size: 1.25rem;
}

.harvest-stock-help {
    display: block;
    margin-top: 6px;
    color: #718c82;
    font-size: 0.66rem;
    line-height: 1.45;
}

.harvest-stock-status {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    margin-top: 11px;
    border: 1px solid rgba(28, 137, 98, 0.13);
    border-radius: 14px;
    background: #edf8f2;
    padding: 10px 12px;
}

.harvest-stock-status > span:first-child {
    font-size: 1rem;
}

.harvest-stock-status > div {
    display: grid;
    gap: 1px;
}

.harvest-stock-status small {
    color: #789087;
    font-size: 0.58rem;
}

.harvest-stock-status strong {
    color: #237355;
    font-size: 0.7rem;
}

.harvest-stock-status__check {
    display: grid;
    width: 23px;
    height: 23px;
    place-items: center;
    border-radius: 50%;
    background: #1e966d;
    color: #fff;
    font-size: 0.67rem;
    font-weight: 900;
}

.stock-auto-link {
    color: #18805f !important;
}

/* ===== FIN SYNCHRONISATION RÉCOLTE -> STOCK ===== */


/* ==========================================================
   LIVRAISONS
   ========================================================== */

.delivery-page {
    background:
        radial-gradient(
            circle at 0 0,
            rgba(245, 144, 109, 0.14),
            transparent 29%
        ),
        radial-gradient(
            circle at 100% 18%,
            rgba(102, 207, 181, 0.17),
            transparent 31%
        ),
        linear-gradient(
            145deg,
            #fcfaf8,
            #f4faf7 53%,
            #eff9f7
        );
}

.delivery-header-add {
    color: #b05e46;
}

.delivery-hero {
    display: grid;
    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(390px, 0.8fr);
    gap: 30px;
    overflow: hidden;
    border-radius: 30px;
    background:
        linear-gradient(
            125deg,
            #b95740,
            #db7657 48%,
            #e59672
        );
    padding: clamp(34px, 5vw, 56px);
    box-shadow:
        0 24px 55px rgba(177, 83, 61, 0.17);
}

.delivery-badge,
.delivery-form-badge {
    display: inline-flex;
    width: fit-content;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    padding: 7px 11px;
    color: #fff;
    font-size: 0.67rem;
    font-weight: 900;
    letter-spacing: 0.05em;
}

.delivery-hero h1 {
    margin: 16px 0 8px;
    color: #fff;
    font-size: clamp(2.4rem, 4vw, 4rem);
    letter-spacing: -0.055em;
}

.delivery-hero > div:first-child > p {
    max-width: 640px;
    margin: 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.9rem;
    line-height: 1.65;
}

.delivery-hero__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    align-content: center;
}

.delivery-hero__stats > div {
    display: grid;
    min-width: 0;
    gap: 5px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.95);
    padding: 17px;
}

.delivery-hero__stats span {
    color: #918078;
    font-size: 0.62rem;
    font-weight: 700;
}

.delivery-hero__stats strong {
    color: #b95c44;
    font-size: 1.35rem;
}

.delivery-section {
    padding: 44px 2px 65px;
}

.delivery-primary-button {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 14px;
    background:
        linear-gradient(
            110deg,
            #df795b,
            #b5543e
        );
    padding: 0 17px;
    color: #fff;
    box-shadow:
        0 11px 26px rgba(180, 82, 61, 0.18);
    cursor: pointer;
    font: inherit;
    font-size: 0.74rem;
    font-weight: 900;
    text-decoration: none;
}

.delivery-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.delivery-card {
    display: flex;
    min-height: 385px;
    flex-direction: column;
    border: 1px solid rgba(194, 104, 78, 0.16);
    border-radius: 24px;
    background:
        linear-gradient(
            145deg,
            #fff,
            #fff8f5
        );
    padding: 19px;
    box-shadow:
        0 13px 34px rgba(121, 68, 53, 0.065);
}

.delivery-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.delivery-card__icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    background: #ffebe4;
    font-size: 1.35rem;
}

.delivery-status {
    border-radius: 999px;
    padding: 6px 9px;
    font-size: 0.59rem;
    font-weight: 900;
    text-transform: uppercase;
}

.delivery-status--planned {
    background: #edf1ff;
    color: #586aa4;
}

.delivery-status--prepared {
    background: #fff1d9;
    color: #ae7427;
}

.delivery-status--delivered {
    background: #e1f6ea;
    color: #17805d;
}

.delivery-status--cancelled {
    background: #f2eeec;
    color: #7b706b;
}

.delivery-reference {
    margin-top: 17px;
    color: #b06049;
    font-size: 0.63rem;
    font-weight: 900;
    text-transform: uppercase;
}

.delivery-card h3 {
    margin: 7px 0 3px;
    color: #48362f;
    font-size: 1.15rem;
}

.delivery-product {
    margin: 0;
    color: #8a756d;
    font-size: 0.7rem;
}

.delivery-quantity {
    display: grid;
    gap: 4px;
    margin-top: 17px;
    border-radius: 15px;
    background: #fff0e9;
    padding: 13px;
}

.delivery-quantity span {
    color: #997d73;
    font-size: 0.62rem;
}

.delivery-quantity strong {
    color: #b35b43;
    font-size: 1.2rem;
}

.delivery-dates {
    display: grid;
    gap: 5px;
    margin-top: 12px;
    color: #7f776f;
    font-size: 0.65rem;
}

.delivery-location {
    margin: 10px 0 0;
    color: #82766f;
    font-size: 0.66rem;
}

.delivery-stock-sync {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    margin-top: 12px;
    border-radius: 14px;
    background: #eaf8f0;
    padding: 10px 12px;
}

.delivery-stock-sync > div {
    display: grid;
    gap: 1px;
}

.delivery-stock-sync small {
    color: #769087;
    font-size: 0.58rem;
}

.delivery-stock-sync strong {
    color: #217657;
    font-size: 0.67rem;
}

.delivery-stock-sync b {
    display: grid;
    width: 23px;
    height: 23px;
    place-items: center;
    border-radius: 50%;
    background: #20946c;
    color: #fff;
    font-size: 0.66rem;
}

.delivery-form-layout {
    display: grid;
    width: min(1180px, calc(100% - 48px));
    margin: 60px auto;
    grid-template-columns:
        minmax(0, 0.9fr)
        minmax(480px, 1.1fr);
    gap: clamp(40px, 7vw, 90px);
    align-items: center;
}

.delivery-form-badge {
    background: #ffe9e2;
    color: #ae5a43;
}

.delivery-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.delivery-status-field {
    margin: 0;
    padding: 0;
    border: 0;
}

.delivery-status-field legend {
    margin-bottom: 8px;
    color: #31594e;
    font-size: 0.78rem;
    font-weight: 800;
}

.delivery-status-choices {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 9px;
}

.delivery-status-choice {
    position: relative;
    cursor: pointer;
}

.delivery-status-choice input {
    position: absolute;
    opacity: 0;
}

.delivery-status-choice > span {
    display: grid;
    min-height: 68px;
    align-content: center;
    gap: 2px;
    border: 1.5px solid #e4e9e6;
    border-radius: 14px;
    background: #fbfdfc;
    padding: 11px;
}

.delivery-status-choice b {
    color: #425b52;
    font-size: 0.73rem;
}

.delivery-status-choice small {
    color: #87958f;
    font-size: 0.61rem;
}

.delivery-status-choice:has(input:checked) > span {
    border-color: #d66e52;
    background: #fff3ee;
    box-shadow:
        0 0 0 3px rgba(214, 110, 82, 0.07);
}

.delivery-tip {
    border-color: rgba(208, 104, 76, 0.13);
}

@media (max-width: 1000px) {

    .delivery-hero,
    .delivery-form-layout {
        grid-template-columns: 1fr;
    }

    .delivery-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 700px) {

    .delivery-hero__stats,
    .delivery-grid,
    .delivery-form__row,
    .delivery-status-choices {
        grid-template-columns: 1fr;
    }

    .delivery-form-layout {
        width: min(100% - 28px, 1180px);
        margin-top: 35px;
    }

}

/* ===== FIN LIVRAISONS ===== */


/* ==========================================================
   CLIENTS / DESTINATAIRES + NUMÉROTATION BL
   ========================================================== */

.delivery-client-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: end;
}

.delivery-new-client {
    display: inline-flex;
    min-height: 43px;
    align-items: center;
    justify-content: center;
    margin-bottom: 1px;
    border: 1px solid rgba(32, 137, 101, 0.18);
    border-radius: 13px;
    background: #f2fbf7;
    padding: 0 14px;
    color: #187757;
    font-size: 0.68rem;
    font-weight: 900;
    text-decoration: none;
    white-space: nowrap;
}

.delivery-client-help {
    display: block;
    margin-top: 6px;
    color: #778b84;
    font-size: 0.63rem;
}

.delivery-reference-preview {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 11px;
    align-items: center;
    width: min(100%, 370px);
    margin-top: 22px;
    border: 1px solid rgba(208, 104, 76, 0.15);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.72);
    padding: 13px 15px;
}

.delivery-reference-preview > span {
    font-size: 1.25rem;
}

.delivery-reference-preview > div {
    display: grid;
    gap: 2px;
}

.delivery-reference-preview small {
    color: #8b7b74;
    font-size: 0.61rem;
}

.delivery-reference-preview strong {
    color: #a9533f;
    font-size: 0.78rem;
}

.client-page {
    background:
        radial-gradient(
            circle at 0 0,
            rgba(91, 194, 160, 0.16),
            transparent 29%
        ),
        linear-gradient(
            145deg,
            #fafbf8,
            #f2faf6 55%,
            #eef9f7
        );
}

.client-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 30px;
    align-items: center;
    border-radius: 30px;
    background:
        linear-gradient(
            125deg,
            #176d59,
            #259174 52%,
            #58b69c
        );
    padding: clamp(34px, 5vw, 55px);
    box-shadow:
        0 24px 55px rgba(25, 114, 89, 0.15);
}

.client-badge,
.client-form-badge {
    display: inline-flex;
    width: fit-content;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    padding: 7px 11px;
    color: #fff;
    font-size: 0.67rem;
    font-weight: 900;
}

.client-hero h1 {
    margin: 15px 0 8px;
    color: #fff;
    font-size: clamp(2.1rem, 4vw, 3.5rem);
    letter-spacing: -0.05em;
}

.client-hero p {
    max-width: 650px;
    margin: 0;
    color: rgba(255, 255, 255, 0.86);
    line-height: 1.6;
}

.client-hero__stat {
    display: grid;
    min-width: 180px;
    gap: 5px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.95);
    padding: 20px;
}

.client-hero__stat span {
    color: #75877f;
    font-size: 0.64rem;
}

.client-hero__stat strong {
    color: #1a7c61;
    font-size: 1.6rem;
}

.client-section {
    padding: 44px 2px 65px;
}

.client-primary-button {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 14px;
    background:
        linear-gradient(
            110deg,
            #2b9b7a,
            #176d58
        );
    padding: 0 17px;
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-size: 0.72rem;
    font-weight: 900;
    text-decoration: none;
}

.client-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.client-card {
    display: flex;
    min-height: 280px;
    flex-direction: column;
    border: 1px solid rgba(35, 129, 100, 0.13);
    border-radius: 23px;
    background: rgba(255, 255, 255, 0.92);
    padding: 19px;
    box-shadow:
        0 13px 34px rgba(44, 96, 78, 0.06);
}

.client-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.client-card__top > span {
    display: grid;
    width: 45px;
    height: 45px;
    place-items: center;
    border-radius: 14px;
    background: #e7f7f0;
    font-size: 1.2rem;
}

.client-card__top small {
    border-radius: 999px;
    background: #eef8f4;
    padding: 6px 9px;
    color: #26775e;
    font-size: 0.58rem;
    font-weight: 900;
}

.client-card h3 {
    margin: 17px 0 10px;
    color: #244a3e;
    font-size: 1.05rem;
}

.client-card p {
    margin: 3px 0;
    color: #71837c;
    font-size: 0.68rem;
}

.client-card .culture-card-actions {
    margin-top: auto;
}

.client-form-badge {
    background: #e5f6ef;
    color: #1b775c;
}

@media (max-width: 850px) {

    .delivery-client-field,
    .client-hero {
        grid-template-columns: 1fr;
    }

    .client-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 650px) {

    .client-grid {
        grid-template-columns: 1fr;
    }

}

/* ===== FIN CLIENTS / DESTINATAIRES ===== */


/* ==========================================================
   RÉCEPTION CLIENT + QR CODE
   ========================================================== */

.delivery-client-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: stretch;
}

.delivery-client-row > input,
.delivery-client-row .delivery-new-client {
    min-height: 48px;
}

.delivery-client-row .delivery-new-client {
    margin: 0;
    padding: 0 18px;
    border-radius: 14px;
}

.delivery-qr-mini {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin-top: 12px;
    border: 1px solid rgba(30, 143, 103, 0.12);
    border-radius: 16px;
    background: #edf9f3;
    padding: 10px;
}

.delivery-qr-mini img {
    width: 82px;
    height: 82px;
    border-radius: 9px;
    background: #fff;
}

.delivery-qr-mini > div {
    display: grid;
    gap: 3px;
}

.delivery-qr-mini small {
    color: #71877f;
    font-size: 0.58rem;
}

.delivery-qr-mini strong {
    color: #187456;
    font-size: 0.7rem;
}

.delivery-qr-mini a {
    margin-top: 4px;
    color: #177b5b;
    font-size: 0.63rem;
    font-weight: 900;
    text-decoration: none;
}

.delivery-reception-status {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin-top: 12px;
    border-radius: 15px;
    background: #e7f8ef;
    padding: 12px;
}

.delivery-reception-status > span {
    display: grid;
    width: 29px;
    height: 29px;
    place-items: center;
    border-radius: 50%;
    background: #1d956c;
    color: #fff;
    font-weight: 900;
}

.delivery-reception-status > div {
    display: grid;
    gap: 2px;
}

.delivery-reception-status small {
    color: #748b82;
    font-size: 0.58rem;
}

.delivery-reception-status strong {
    color: #167153;
    font-size: 0.68rem;
}

.delivery-reception-status--issue {
    background: #fff4dc;
}

.delivery-reception-status--issue > span {
    background: #d58d25;
}

.delivery-reception-status--issue strong {
    color: #9d6519;
}

.delivery-card__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid rgba(176, 93, 67, 0.11);
}

.delivery-card__actions a {
    color: #087553;
    font-size: 0.67rem;
    font-weight: 900;
    text-decoration: none;
}

.delivery-bl-link {
    color: #a75b45 !important;
}


/* PUBLIC RECEPTION */

.public-reception-page {
    min-height: 100vh;
    background:
        radial-gradient(
            circle at top left,
            rgba(54, 184, 143, 0.16),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #f7fbf8,
            #eef8f5
        );
    padding: 30px 16px;
}

.public-reception-card {
    width: min(100%, 620px);
    margin: 0 auto;
    border: 1px solid rgba(30, 119, 89, 0.11);
    border-radius: 28px;
    background: #fff;
    padding: clamp(22px, 5vw, 38px);
    box-shadow:
        0 22px 55px rgba(34, 91, 72, 0.1);
}

.public-reception-brand {
    display: flex;
    align-items: center;
    gap: 10px;
}

.public-reception-brand > span {
    display: grid;
    width: 45px;
    height: 45px;
    place-items: center;
    border-radius: 14px;
    background: #138364;
}

.public-reception-brand > div {
    display: grid;
}

.public-reception-brand strong {
    color: #124f3f;
}

.public-reception-brand small {
    color: #81908a;
}

.public-reception-heading {
    margin-top: 30px;
}

.public-reception-heading > span {
    color: #15805f;
    font-size: 0.65rem;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.public-reception-heading h1 {
    margin: 6px 0 4px;
    color: #173f35;
    font-size: clamp(1.9rem, 6vw, 2.8rem);
}

.public-reception-heading p {
    margin: 0;
    color: #7b8c85;
}

.public-reception-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 25px;
}

.public-reception-summary > div {
    display: grid;
    gap: 4px;
    border-radius: 15px;
    background: #f4f9f6;
    padding: 13px;
}

.public-reception-summary span {
    color: #7a8e86;
    font-size: 0.62rem;
}

.public-reception-summary strong {
    color: #285246;
    font-size: 0.8rem;
}

.public-reception-form {
    display: grid;
    gap: 18px;
    margin-top: 28px;
}

.public-reception-form fieldset {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    border: 0;
}

.public-reception-form legend {
    margin-bottom: 7px;
    color: #254c41;
    font-weight: 900;
}

.public-reception-choice {
    position: relative;
    cursor: pointer;
}

.public-reception-choice > input {
    position: absolute;
    opacity: 0;
}

.public-reception-choice > span {
    display: grid;
    gap: 3px;
    border: 1.5px solid #dfeae5;
    border-radius: 16px;
    padding: 15px;
}

.public-reception-choice b {
    color: #31584d;
}

.public-reception-choice small {
    color: #7f9089;
}

.public-reception-choice:has(input:checked) > span {
    border-color: #1e8b68;
    background: #effaf5;
    box-shadow:
        0 0 0 3px rgba(30, 139, 104, 0.07);
}

.public-reception-form label:not(.public-reception-choice):not(.public-reception-confirm) {
    display: grid;
    gap: 6px;
}

.public-reception-form label > span {
    color: #315448;
    font-size: 0.72rem;
    font-weight: 800;
}

.public-reception-form input[type="text"],
.public-reception-form input[type="number"],
.public-reception-form select,
.public-reception-form textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #dce8e3;
    border-radius: 13px;
    background: #fbfdfc;
    padding: 12px 13px;
    color: #264d42;
    font: inherit;
}

.public-reception-return {
    display: grid;
    gap: 14px;
    border: 1px solid #f0d7aa;
    border-radius: 17px;
    background: #fffaf0;
    padding: 15px;
}

.public-reception-return[hidden] {
    display: none;
}

.public-reception-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.public-reception-confirm {
    display: flex;
    gap: 9px;
    align-items: flex-start;
    border-radius: 14px;
    background: #f3f8f5;
    padding: 12px;
}

.public-reception-confirm input {
    margin-top: 3px;
}

.public-reception-submit {
    display: flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 15px;
    background:
        linear-gradient(
            110deg,
            #269977,
            #146d55
        );
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-weight: 900;
}

.public-reception-errors {
    margin-top: 20px;
    border-radius: 15px;
    background: #fff0e9;
    padding: 11px 14px;
}

.public-reception-errors p {
    margin: 4px 0;
    color: #a64e3a;
    font-size: 0.72rem;
}

.public-reception-result,
.public-reception-waiting {
    margin-top: 28px;
    border-radius: 20px;
    background: #eaf8f1;
    padding: 22px;
}

.public-reception-result--issue {
    background: #fff4dc;
}

.public-reception-result__icon {
    display: grid;
    width: 45px;
    height: 45px;
    place-items: center;
    border-radius: 50%;
    background: #20966e;
    color: #fff;
    font-size: 1.2rem;
    font-weight: 900;
}

.public-reception-result--issue
.public-reception-result__icon {
    background: #d38b24;
}

.public-reception-result h2 {
    margin: 13px 0 5px;
    color: #215444;
}

.public-reception-result p {
    margin: 0;
    color: #71867e;
}

.public-reception-result__numbers {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin: 18px 0;
}

.public-reception-result__numbers > div {
    display: grid;
    gap: 3px;
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.72);
    padding: 11px;
}

.public-reception-result__numbers span {
    color: #788a84;
    font-size: 0.6rem;
}

.public-reception-result__numbers strong {
    color: #215848;
}

.public-reception-result > small {
    color: #6e837b;
}


/* BON DE LIVRAISON */

.delivery-note-page {
    min-height: 100vh;
    background: #eef5f2;
    padding: 25px;
}

.delivery-note-toolbar {
    display: flex;
    width: min(920px, 100%);
    margin: 0 auto 14px;
    justify-content: space-between;
}

.delivery-note-toolbar a,
.delivery-note-toolbar button {
    border: 1px solid #d5e4de;
    border-radius: 11px;
    background: #fff;
    padding: 10px 14px;
    color: #196e55;
    cursor: pointer;
    font: inherit;
    font-size: 0.7rem;
    font-weight: 900;
    text-decoration: none;
}

.delivery-note {
    width: min(920px, 100%);
    box-sizing: border-box;
    margin: 0 auto;
    background: #fff;
    padding: clamp(28px, 6vw, 55px);
    box-shadow:
        0 18px 45px rgba(42, 84, 69, 0.1);
}

.delivery-note__header,
.delivery-note__parties,
.delivery-note__reception {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

.delivery-note__header {
    align-items: start;
    padding-bottom: 26px;
    border-bottom: 2px solid #1a8263;
}

.delivery-note__header > div {
    display: grid;
    gap: 6px;
}

.delivery-note__header > div:last-child {
    text-align: right;
}

.delivery-note__brand {
    color: #16805f;
    font-weight: 900;
}

.delivery-note__header small {
    color: #81928c;
    font-weight: 900;
}

.delivery-note__header h1 {
    margin: 0;
    color: #17493b;
}

.delivery-note__parties {
    margin-top: 30px;
}

.delivery-note__parties > div {
    display: grid;
    gap: 5px;
    border-radius: 14px;
    background: #f5f8f6;
    padding: 15px;
}

.delivery-note__parties span,
.delivery-note__notes span,
.delivery-note__reception > div:first-child > span {
    color: #758a82;
    font-size: 0.61rem;
    font-weight: 900;
    letter-spacing: 0.06em;
}

.delivery-note__parties p {
    margin: 0;
    color: #72847e;
}

.delivery-note__table {
    margin-top: 30px;
    overflow: hidden;
    border: 1px solid #dce7e2;
    border-radius: 14px;
}

.delivery-note__table-head,
.delivery-note__table-row {
    display: grid;
    grid-template-columns: 1fr 180px;
    gap: 20px;
    padding: 13px 16px;
}

.delivery-note__table-head {
    background: #edf7f2;
    color: #608076;
    font-size: 0.65rem;
    font-weight: 900;
}

.delivery-note__table-row {
    color: #244d41;
}

.delivery-note__notes {
    margin-top: 25px;
}

.delivery-note__notes p {
    color: #60786f;
}

.delivery-note__reception {
    align-items: center;
    margin-top: 35px;
    border-radius: 18px;
    background: #f0f8f4;
    padding: 22px;
}

.delivery-note__reception h2 {
    margin: 7px 0;
    color: #17523f;
}

.delivery-note__reception p {
    color: #678078;
}

.delivery-note__qr {
    display: grid;
    justify-items: center;
}

.delivery-note__qr img {
    width: 190px;
    height: 190px;
    background: #fff;
}

.delivery-note__qr small {
    margin-top: 5px;
    color: #70877f;
}

.delivery-note-test-link {
    color: #16805f;
    font-size: 0.68rem;
    font-weight: 900;
    text-decoration: none;
}

.delivery-note__confirmed {
    display: flex;
    margin-top: 20px;
    justify-content: space-between;
    gap: 15px;
    border-radius: 13px;
    background: #e7f7ef;
    padding: 13px 15px;
    color: #1a7357;
}

@media (max-width: 700px) {

    .delivery-client-row,
    .public-reception-summary,
    .public-reception-row,
    .public-reception-result__numbers,
    .delivery-note__header,
    .delivery-note__parties,
    .delivery-note__reception {
        grid-template-columns: 1fr;
    }

    .delivery-client-row .delivery-new-client {
        width: 100%;
    }

    .delivery-note-page {
        padding: 10px;
    }

    .delivery-note__header > div:last-child {
        text-align: left;
    }

}

@media print {

    .delivery-note-toolbar {
        display: none;
    }

    .delivery-note-page {
        background: #fff;
        padding: 0;
    }

    .delivery-note {
        width: 100%;
        box-shadow: none;
        padding: 20mm;
    }

    .delivery-note-test-link {
        display: none;
    }

}

/* ===== FIN RÉCEPTION + QR ===== */


/* ==========================================================
   TRAITEMENT DES RETOURS DE LIVRAISON
   ========================================================== */

.delivery-return-panel {
    display: grid;
    gap: 10px;
    margin-top: 13px;
    border: 1px solid rgba(207, 143, 39, 0.18);
    border-radius: 16px;
    background:
        linear-gradient(
            145deg,
            #fffaf0,
            #fff6e4
        );
    padding: 13px;
}

.delivery-return-panel__heading {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 9px;
    align-items: center;
}

.delivery-return-panel__heading > span {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 11px;
    background: #ffebc1;
    color: #a56c16;
    font-weight: 900;
}

.delivery-return-panel__heading > div {
    display: grid;
    gap: 1px;
}

.delivery-return-panel__heading small {
    color: #9c8968;
    font-size: 0.58rem;
}

.delivery-return-panel__heading strong {
    color: #976219;
    font-size: 0.71rem;
}

.delivery-return-reason {
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.66);
    padding: 8px 10px;
    color: #8b7350;
    font-size: 0.64rem;
    font-weight: 800;
}

.delivery-return-actions {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 7px;
}

.delivery-return-button {
    min-height: 39px;
    border: 1px solid transparent;
    border-radius: 10px;
    cursor: pointer;
    font: inherit;
    font-size: 0.59rem;
    font-weight: 900;
}

.delivery-return-button--control {
    border-color: #e5c77d;
    background: #fff7df;
    color: #91671d;
}

.delivery-return-button--stock {
    border-color: #b9e3d1;
    background: #eaf8f1;
    color: #177558;
}

.delivery-return-button--loss {
    border-color: #ecc5b7;
    background: #fff0e9;
    color: #a8513c;
}

.delivery-return-control,
.delivery-return-final {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 9px;
    align-items: center;
    border-radius: 12px;
    padding: 10px;
}

.delivery-return-control {
    background: #fff3d6;
}

.delivery-return-final--stock {
    background: #e6f7ef;
}

.delivery-return-final--loss {
    background: #f9ece7;
}

.delivery-return-control > div,
.delivery-return-final > div {
    display: grid;
    gap: 2px;
}

.delivery-return-control strong {
    color: #93691f;
    font-size: 0.67rem;
}

.delivery-return-final--stock strong {
    color: #177456;
    font-size: 0.67rem;
}

.delivery-return-final--loss strong {
    color: #a0523d;
    font-size: 0.67rem;
}

.delivery-return-control small,
.delivery-return-final small {
    color: #7e8179;
    font-size: 0.58rem;
}

@media (max-width: 650px) {

    .delivery-return-actions {
        grid-template-columns: 1fr;
    }

}

/* ===== FIN TRAITEMENT RETOURS ===== */


/* ===== DESIGN CONDITIONS COMMERCIALES LIVRAISON ===== */

/*
 * Le formulaire Livraison possède maintenant une hiérarchie
 * plus claire et une carte commerciale dédiée.
 */

.delivery-form-layout {
    width: min(1120px, calc(100% - 40px));
    margin-inline: auto;
    grid-template-columns:
        minmax(270px, 0.8fr)
        minmax(520px, 1.2fr);
    gap: clamp(38px, 6vw, 80px);
    align-items: start;
}

.delivery-form-card {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
}

.delivery-form-section-title {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin: 22px 0 12px;
}

.delivery-form-section-title:first-of-type {
    margin-top: 8px;
}

.delivery-form-section-title > span {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 10px;
    background: #edf8f3;
    color: #168160;
    font-size: 0.62rem;
    font-weight: 900;
}

.delivery-form-section-title > div {
    position: relative;
    display: grid;
    gap: 1px;
}

.delivery-form-section-title > div::after {
    position: absolute;
    top: 50%;
    right: 0;
    left: 175px;
    height: 1px;
    background: #e6eeea;
    content: "";
}

.delivery-form-section-title strong {
    color: #174e3e;
    font-size: 0.72rem;
    font-weight: 900;
}

.delivery-form-section-title small {
    color: #83958e;
    font-size: 0.56rem;
}


/* Carte conditions de vente */

.delivery-commercial-panel {
    display: grid;
    gap: 18px;
    border: 1px solid #d8ebe3;
    border-radius: 20px;
    background:
        linear-gradient(
            145deg,
            #f5fbf8 0%,
            #eef8f4 100%
        );
    padding: 18px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.delivery-commercial-panel__header {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 11px;
    align-items: center;
}

.delivery-commercial-panel__icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
    background:
        linear-gradient(
            145deg,
            #25a37c,
            #147558
        );
    color: #fff;
    font-size: 1rem;
    font-weight: 900;
    box-shadow:
        0 8px 18px rgba(25, 126, 94, 0.18);
}

.delivery-commercial-panel__header > div {
    display: grid;
    gap: 2px;
}

.delivery-commercial-panel__header strong {
    color: #164f3e;
    font-size: 0.76rem;
}

.delivery-commercial-panel__header small {
    color: #789087;
    font-size: 0.58rem;
    line-height: 1.45;
}


/* Grille des champs */

.delivery-commercial-grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.delivery-commercial-field {
    min-width: 0;
}

.delivery-commercial-field > label {
    display: block;
    margin-bottom: 6px;
    color: #315f51;
    font-size: 0.61rem;
    font-weight: 900;
}

.delivery-commercial-field > small {
    display: block;
    margin-top: 5px;
    color: #82938d;
    font-size: 0.52rem;
    line-height: 1.35;
}

.delivery-commercial-control,
.delivery-commercial-field > select {
    width: 100%;
    min-height: 44px;
    box-sizing: border-box;
    border: 1px solid #cfe1da;
    border-radius: 11px;
    outline: none;
    background: #fff;
    padding: 0 12px;
    color: #244f41;
    font: inherit;
    font-size: 0.67rem;
    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

.delivery-commercial-control:focus,
.delivery-commercial-field > select:focus {
    border-color: #55ad91;
    box-shadow:
        0 0 0 3px rgba(35, 155, 116, 0.10);
}

.delivery-money-input,
.delivery-days-input,
.delivery-vat-input {
    position: relative;
}

.delivery-money-input input {
    padding-right: 72px;
}

.delivery-days-input input {
    padding-right: 54px;
}

.delivery-vat-input input {
    padding-right: 36px;
}

.delivery-money-input > span,
.delivery-days-input > span,
.delivery-vat-input > span {
    position: absolute;
    top: 50%;
    right: 11px;
    transform: translateY(-50%);
    color: #6f8a80;
    font-size: 0.58rem;
    font-weight: 900;
    pointer-events: none;
}


/* Aperçu montant */

.delivery-commercial-preview {
    display: grid;
    gap: 14px;
    border: 1px solid rgba(24, 127, 94, 0.10);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.82);
    padding: 14px;
}

.delivery-commercial-preview__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.delivery-commercial-preview__heading > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.delivery-commercial-preview__heading > div > div {
    display: grid;
    gap: 1px;
}

.delivery-commercial-preview__heading strong {
    color: #255b49;
    font-size: 0.67rem;
}

.delivery-commercial-preview__heading small {
    color: #82958e;
    font-size: 0.53rem;
}

.delivery-commercial-preview__badge {
    border-radius: 999px;
    background: #e4f6ed;
    padding: 6px 9px;
    color: #167557;
    font-size: 0.52rem;
    font-weight: 900;
    white-space: nowrap;
}

.delivery-commercial-preview__calculation {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid #e1ebe7;
    border-radius: 13px;
    background: #fff;
}

.delivery-commercial-preview__calculation > div {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 11px;
    border-right: 1px solid #e7efeb;
}

.delivery-commercial-preview__calculation > div:last-child {
    border-right: 0;
}

.delivery-commercial-preview__calculation span {
    color: #84968f;
    font-size: 0.50rem;
}

.delivery-commercial-preview__calculation strong {
    overflow: hidden;
    color: #315e50;
    font-size: 0.65rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.delivery-commercial-preview__total {
    background:
        linear-gradient(
            145deg,
            #e9f8f1,
            #dcf3e9
        );
}

.delivery-commercial-preview__total strong {
    color: #117052;
}


/* Notes et actions */

.delivery-notes-field textarea {
    min-height: 88px;
}

.delivery-form-actions {
    margin-top: 22px;
    padding-top: 17px;
    border-top: 1px solid #e5ede9;
}


/* Responsive */

@media (max-width: 900px) {

    .delivery-form-layout {
        width: min(680px, calc(100% - 28px));
        grid-template-columns: 1fr;
        gap: 28px;
    }

}

@media (max-width: 620px) {

    .delivery-commercial-grid,
    .delivery-commercial-preview__calculation {
        grid-template-columns: 1fr;
    }

    .delivery-commercial-preview__calculation > div {
        border-right: 0;
        border-bottom: 1px solid #e7efeb;
    }

    .delivery-commercial-preview__calculation > div:last-child {
        border-bottom: 0;
    }

    .delivery-commercial-preview__heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .delivery-form-section-title > div::after {
        display: none;
    }

}


/* ===== DESIGN CONDITIONS COMMERCIALES LIVRAISON ===== */


/* ==========================================================
   FORMULAIRE LIVRAISON - TOUCHES DE COULEUR
   ========================================================== */

/* 01 - Client & produit */

.delivery-form-section-title--client > span {
    background: #e2f6ed;
    color: #14795b;
}

.delivery-form-section-title--client strong {
    color: #126b51;
}

.delivery-form-section-title--client > div::after {
    background:
        linear-gradient(
            90deg,
            #bfe6d7,
            #edf5f2
        );
}


/* 02 - Livraison */

.delivery-form-section-title--delivery > span {
    background: #fff0e8;
    color: #d46245;
}

.delivery-form-section-title--delivery strong {
    color: #c6543a;
}

.delivery-form-section-title--delivery > div::after {
    background:
        linear-gradient(
            90deg,
            #f3c7b9,
            #f6efec
        );
}


/* 03 - Conditions de vente */

.delivery-form-section-title--commercial > span {
    background: #fff3cf;
    color: #b67812;
}

.delivery-form-section-title--commercial strong {
    color: #a8680c;
}

.delivery-form-section-title--commercial > div::after {
    background:
        linear-gradient(
            90deg,
            #ecd28a,
            #f6f1e5
        );
}


/* 04 - Notes */

.delivery-form-section-title--notes > span {
    background: #e2f6f5;
    color: #148178;
}

.delivery-form-section-title--notes strong {
    color: #116e67;
}

.delivery-form-section-title--notes > div::after {
    background:
        linear-gradient(
            90deg,
            #b7e4df,
            #edf5f3
        );
}


/* Carte commerciale légèrement plus chaleureuse */

.delivery-commercial-panel {
    border-color: #cfe7dc;
    background:
        linear-gradient(
            145deg,
            #f3fbf7 0%,
            #fdf8eb 100%
        );
}

.delivery-commercial-panel__icon {
    background:
        linear-gradient(
            145deg,
            #1da97c,
            #0f7b5c
        );
}


/* Champs commerciaux */

.delivery-commercial-field:nth-child(1)
.delivery-commercial-control {
    border-color: #d9c47f;
    background: #fffdf6;
}

.delivery-commercial-field:nth-child(2)
.delivery-commercial-control {
    border-color: #b7ddd1;
}

.delivery-commercial-field:nth-child(3)
.delivery-commercial-control {
    border-color: #efc8bb;
    background: #fffaf8;
}

.delivery-commercial-field:nth-child(4)
.delivery-commercial-control {
    border-color: #b9dfdc;
    background: #faffff;
}


/* Aperçu financier */

.delivery-commercial-preview {
    border-color: #d9e8e1;
    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f8fcfa 100%
        );
}

.delivery-commercial-preview__heading > div > span {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 9px;
    background: #fff0dc;
}

.delivery-commercial-preview__badge {
    background:
        linear-gradient(
            135deg,
            #daf5e8,
            #ccefe0
        );
    color: #0d7553;
}


/* Montants avec des nuances légères */

.delivery-commercial-preview__calculation > div:nth-child(1) {
    background: #fbfdfc;
}

.delivery-commercial-preview__calculation > div:nth-child(2) {
    background: #fffaf1;
}

.delivery-commercial-preview__calculation > div:nth-child(3) {
    background: #fff6f2;
}

.delivery-commercial-preview__calculation > div:nth-child(2) strong {
    color: #a66c12;
}

.delivery-commercial-preview__calculation > div:nth-child(3) strong {
    color: #c15c43;
}


/* TTC = information principale */

.delivery-commercial-preview__total {
    background:
        linear-gradient(
            135deg,
            #d8f3e6,
            #c4ead8
        );
}

.delivery-commercial-preview__total strong {
    color: #087151;
    font-size: 0.74rem;
    font-weight: 950;
}


/* Bouton principal légèrement plus vivant */

.delivery-form-actions
.delivery-primary-button {
    background:
        linear-gradient(
            110deg,
            #e77959,
            #cf563a
        );
    box-shadow:
        0 10px 22px
        rgba(205, 85, 57, 0.18);
}


/* Quelques champs de livraison un peu plus lumineux */

.delivery-form-card input:focus,
.delivery-form-card select:focus,
.delivery-form-card textarea:focus {
    border-color: #43a98a;
    box-shadow:
        0 0 0 3px
        rgba(33, 151, 114, 0.09);
}


/* ===== FIN TOUCHES DE COULEUR ===== */


/* ==========================================================
   FORMULAIRE LIVRAISON - LISIBILITÉ PARTIE BASSE
   ========================================================== */

/* Titres des sections */

.delivery-form-section-title strong {
    font-size: 0.82rem;
}

.delivery-form-section-title small {
    font-size: 0.64rem;
    line-height: 1.4;
}


/* En-tête Conditions commerciales */

.delivery-commercial-panel__header strong {
    font-size: 0.84rem;
}

.delivery-commercial-panel__header small {
    font-size: 0.64rem;
    line-height: 1.45;
}


/* Libellés des champs */

.delivery-commercial-field > label {
    font-size: 0.69rem;
}

.delivery-commercial-field > small {
    font-size: 0.59rem;
    line-height: 1.45;
}


/* Valeurs saisies */

.delivery-commercial-control,
.delivery-commercial-field > select {
    font-size: 0.74rem;
}


/* €/kg, jours et % */

.delivery-money-input > span,
.delivery-days-input > span,
.delivery-vat-input > span {
    font-size: 0.64rem;
}


/* Aperçu du montant */

.delivery-commercial-preview__heading strong {
    font-size: 0.75rem;
}

.delivery-commercial-preview__heading small {
    font-size: 0.60rem;
    line-height: 1.4;
}

.delivery-commercial-preview__badge {
    font-size: 0.59rem;
}


/* Libellés et valeurs du calcul */

.delivery-commercial-preview__calculation span {
    font-size: 0.58rem;
}

.delivery-commercial-preview__calculation strong {
    font-size: 0.72rem;
}

.delivery-commercial-preview__total strong {
    font-size: 0.82rem;
}


/* Notes */

.delivery-notes-field textarea {
    font-size: 0.78rem;
    line-height: 1.5;
}


/* Boutons du bas */

.delivery-form-actions
.parcel-secondary-button,
.delivery-form-actions
.delivery-primary-button {
    font-size: 0.72rem;
}


/* Mobile : conserver une bonne lisibilité */

@media (max-width: 620px) {

    .delivery-commercial-field > label {
        font-size: 0.72rem;
    }

    .delivery-commercial-control,
    .delivery-commercial-field > select,
    .delivery-notes-field textarea {
        font-size: 0.78rem;
    }

    .delivery-commercial-preview__calculation span {
        font-size: 0.61rem;
    }

    .delivery-commercial-preview__calculation strong {
        font-size: 0.76rem;
    }

}

/* ===== FIN LISIBILITÉ PARTIE BASSE ===== */


/* ==========================================================
   LIVRAISON - FOND DE PAGE PLUS COLORÉ
   ========================================================== */

.delivery-page {
    position: relative;
    isolation: isolate;
    min-height: 100vh;

    background:
        radial-gradient(
            circle at 8% 18%,
            rgba(69, 181, 147, 0.20) 0%,
            rgba(69, 181, 147, 0.08) 17%,
            rgba(69, 181, 147, 0) 36%
        ),
        radial-gradient(
            circle at 91% 15%,
            rgba(228, 118, 82, 0.17) 0%,
            rgba(228, 118, 82, 0.06) 20%,
            rgba(228, 118, 82, 0) 38%
        ),
        radial-gradient(
            circle at 83% 84%,
            rgba(240, 183, 102, 0.17) 0%,
            rgba(240, 183, 102, 0.05) 18%,
            rgba(240, 183, 102, 0) 34%
        ),
        linear-gradient(
            135deg,
            #eaf7f2 0%,
            #f4faf7 42%,
            #fff8f1 72%,
            #fdf0e9 100%
        );
}


/* Halos décoratifs très doux */

.delivery-page::before,
.delivery-page::after {
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    content: "";
    pointer-events: none;
    filter: blur(2px);
}

.delivery-page::before {
    top: 170px;
    left: 3%;
    width: 330px;
    height: 330px;

    background:
        radial-gradient(
            circle,
            rgba(39, 164, 126, 0.12),
            rgba(39, 164, 126, 0)
        );
}

.delivery-page::after {
    right: 3%;
    bottom: 60px;
    width: 380px;
    height: 380px;

    background:
        radial-gradient(
            circle,
            rgba(221, 108, 72, 0.10),
            rgba(221, 108, 72, 0)
        );
}


/* Colonne gauche légèrement mieux détachée du fond */

.delivery-page .parcel-form-intro {
    position: relative;
}

.delivery-page .parcel-form-intro::before {
    position: absolute;
    z-index: -1;
    top: -30px;
    right: -30px;
    bottom: -30px;
    left: -30px;

    border-radius: 40px;

    background:
        radial-gradient(
            circle at 35% 35%,
            rgba(255, 255, 255, 0.46),
            rgba(255, 255, 255, 0)
        );

    content: "";
}


/* Carte principale plus lumineuse et mieux détachée */

.delivery-page .delivery-form-card {
    border:
        1px solid
        rgba(125, 176, 158, 0.22);

    background:
        linear-gradient(
            160deg,
            rgba(255, 255, 255, 0.97),
            rgba(252, 255, 253, 0.94)
        );

    box-shadow:
        0 24px 55px rgba(31, 103, 80, 0.11),
        0 8px 20px rgba(197, 105, 73, 0.05);
}


/* Petit halo vert derrière l'en-tête du formulaire */

.delivery-page
.delivery-form-card
.parcel-form-card__heading {
    position: relative;
}

.delivery-page
.delivery-form-card
.parcel-form-card__heading::before {
    position: absolute;
    z-index: -1;
    top: -18px;
    right: -18px;
    bottom: -15px;
    left: -18px;

    border-radius: 18px;

    background:
        linear-gradient(
            115deg,
            rgba(218, 244, 234, 0.48),
            rgba(255, 244, 237, 0.25)
        );

    content: "";
}


/* Les petites cartes de gauche gagnent également en couleur */

.delivery-page .delivery-reference-preview {
    border-color:
        rgba(223, 110, 74, 0.22);

    background:
        linear-gradient(
            135deg,
            rgba(255, 250, 247, 0.95),
            rgba(255, 239, 231, 0.72)
        );

    box-shadow:
        0 8px 22px
        rgba(198, 92, 58, 0.05);
}

.delivery-page .delivery-tip {
    border-color:
        rgba(53, 158, 124, 0.20);

    background:
        linear-gradient(
            135deg,
            rgba(242, 252, 248, 0.96),
            rgba(230, 247, 239, 0.75)
        );

    box-shadow:
        0 8px 22px
        rgba(32, 128, 98, 0.05);
}


/* Sur petit écran, fond légèrement plus calme */

@media (max-width: 700px) {

    .delivery-page {
        background:
            radial-gradient(
                circle at 10% 10%,
                rgba(66, 177, 143, 0.15),
                rgba(66, 177, 143, 0) 34%
            ),
            radial-gradient(
                circle at 95% 80%,
                rgba(223, 115, 79, 0.12),
                rgba(223, 115, 79, 0) 34%
            ),
            linear-gradient(
                160deg,
                #edf8f4,
                #fff8f2
            );
    }

    .delivery-page::before,
    .delivery-page::after {
        display: none;
    }

}

/* ===== FIN FOND COLORÉ LIVRAISON ===== */


/* ==========================================================
   PARAMÈTRES DE FACTURATION
   ========================================================== */

.billing-settings-page {
    min-height: 100vh;
    background:
        radial-gradient(
            circle at 8% 18%,
            rgba(48, 174, 134, 0.19),
            transparent 33%
        ),
        radial-gradient(
            circle at 92% 15%,
            rgba(231, 119, 82, 0.15),
            transparent 34%
        ),
        linear-gradient(
            135deg,
            #eaf7f2,
            #f8fbf9 48%,
            #fff5ee
        );
}

.billing-settings-layout {
    display: grid;
    width: min(1120px, calc(100% - 40px));
    margin: 44px auto 70px;
    grid-template-columns:
        minmax(260px, 0.75fr)
        minmax(560px, 1.25fr);
    gap: clamp(40px, 6vw, 80px);
    align-items: start;
}

.billing-settings-intro {
    padding-top: 32px;
}

.billing-settings-badge {
    display: inline-flex;
    border-radius: 999px;
    background: #e1f5ec;
    padding: 7px 11px;
    color: #14785a;
    font-size: 0.65rem;
    font-weight: 900;
}

.billing-settings-intro h1 {
    margin: 18px 0 10px;
    color: #174c3d;
    font-size: clamp(1.7rem, 3vw, 2.5rem);
}

.billing-settings-intro > p {
    max-width: 430px;
    color: #71867e;
    line-height: 1.7;
}

.billing-identity-card,
.billing-settings-tip {
    margin-top: 24px;
    border: 1px solid rgba(39, 144, 111, 0.15);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.76);
    padding: 17px;
    box-shadow:
        0 12px 28px rgba(34, 93, 76, 0.06);
}

.billing-identity-card {
    display: grid;
    gap: 5px;
}

.billing-identity-card small {
    color: #7b938a;
    font-size: 0.58rem;
    font-weight: 900;
}

.billing-identity-card strong {
    color: #175a45;
    font-size: 1rem;
}

.billing-identity-card span {
    color: #6f827b;
    font-size: 0.7rem;
}

.billing-settings-tip {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 10px;
}

.billing-settings-tip p {
    margin: 4px 0 0;
    color: #74877f;
    font-size: 0.68rem;
    line-height: 1.55;
}

.billing-settings-card {
    border: 1px solid rgba(112, 168, 149, 0.18);
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.96);
    padding: clamp(24px, 4vw, 38px);
    box-shadow:
        0 24px 55px rgba(31, 103, 80, 0.11);
}

.billing-settings-card__heading > span {
    color: #1c8b68;
    font-size: 0.62rem;
    font-weight: 900;
    text-transform: uppercase;
}

.billing-settings-card__heading h2 {
    margin: 6px 0;
    color: #194f3f;
}

.billing-settings-card__heading p {
    margin: 0;
    color: #81928c;
    font-size: 0.72rem;
}

.billing-settings-section {
    margin-top: 28px;
}

.billing-settings-section__title {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin-bottom: 15px;
}

.billing-settings-section__title > span {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 10px;
    font-size: 0.63rem;
    font-weight: 900;
}

.billing-settings-section__title > div {
    display: grid;
    gap: 2px;
}

.billing-settings-section__title strong {
    font-size: 0.8rem;
}

.billing-settings-section__title small {
    color: #84958f;
    font-size: 0.62rem;
}

.billing-settings-section--identity
.billing-settings-section__title > span {
    background: #e1f5ec;
    color: #14775a;
}

.billing-settings-section--identity
.billing-settings-section__title strong {
    color: #126d53;
}

.billing-settings-section--conditions
.billing-settings-section__title > span {
    background: #fff1d2;
    color: #ae7415;
}

.billing-settings-section--conditions
.billing-settings-section__title strong {
    color: #9e6710;
}

.billing-settings-section--platform
.billing-settings-section__title > span {
    background: #ffebe4;
    color: #c75c3f;
}

.billing-settings-section--platform
.billing-settings-section__title strong {
    color: #b65037;
}

.billing-settings-grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.billing-settings-field {
    min-width: 0;
}

.billing-settings-field--wide {
    grid-column: 1 / -1;
}

.billing-settings-field label {
    display: block;
    margin-bottom: 6px;
    color: #315d50;
    font-size: 0.69rem;
    font-weight: 900;
}

.billing-settings-field input,
.billing-settings-field select,
.billing-readonly-value {
    width: 100%;
    min-height: 46px;
    box-sizing: border-box;
    border: 1px solid #d2e2dc;
    border-radius: 11px;
    background: #fff;
    padding: 0 12px;
    color: #294f43;
    font: inherit;
    font-size: 0.76rem;
}

.billing-readonly-value {
    display: flex;
    align-items: center;
    background: #f4f8f6;
    color: #74877f;
}

.billing-settings-field input:focus,
.billing-settings-field select:focus {
    outline: none;
    border-color: #4cab8b;
    box-shadow:
        0 0 0 3px rgba(31, 151, 113, 0.09);
}

.billing-unit-field {
    position: relative;
}

.billing-unit-field input {
    padding-right: 55px;
}

.billing-unit-field span {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    color: #728880;
    font-size: 0.66rem;
    font-weight: 900;
    pointer-events: none;
}

.billing-platform-placeholder {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 11px;
    margin-bottom: 15px;
    border: 1px solid #f0d9cd;
    border-radius: 15px;
    background:
        linear-gradient(
            135deg,
            #fff9f5,
            #fff2eb
        );
    padding: 14px;
}

.billing-platform-placeholder > span {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    background: #ffe4d8;
}

.billing-platform-placeholder strong {
    color: #ad5038;
    font-size: 0.72rem;
}

.billing-platform-placeholder p {
    margin: 4px 0 0;
    color: #8b776f;
    font-size: 0.63rem;
    line-height: 1.5;
}

.billing-settings-actions {
    display: flex;
    margin-top: 30px;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 18px;
    border-top: 1px solid #e5ede9;
}

@media (max-width: 900px) {

    .billing-settings-layout {
        width: min(700px, calc(100% - 28px));
        grid-template-columns: 1fr;
        gap: 20px;
    }

}

@media (max-width: 620px) {

    .billing-settings-grid {
        grid-template-columns: 1fr;
    }

    .billing-settings-field--wide {
        grid-column: auto;
    }

    .billing-settings-actions {
        flex-direction: column-reverse;
    }

    .billing-settings-actions a,
    .billing-settings-actions button {
        width: 100%;
    }

}

/* ===== FIN PARAMÈTRES FACTURATION ===== */


/* ==========================================================
   MESSAGES PARAMÈTRES FACTURATION
   ========================================================== */

.billing-settings-flashes {
    width: min(1120px, calc(100% - 40px));
    margin: 18px auto -18px;
}

.billing-settings-flash {
    display: flex;
    min-height: 48px;
    box-sizing: border-box;
    align-items: center;
    gap: 10px;
    border-radius: 14px;
    padding: 11px 15px;
    box-shadow:
        0 10px 25px rgba(38, 92, 75, 0.06);
}

.billing-settings-flash > span {
    display: grid;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    place-items: center;
    border-radius: 50%;
    font-weight: 900;
}

.billing-settings-flash strong {
    font-size: 0.74rem;
}

.billing-settings-flash--success {
    border: 1px solid #b9e4d3;
    background: #e9f8f1;
    color: #126f52;
}

.billing-settings-flash--success > span {
    background: #21a277;
    color: #fff;
}

.billing-settings-flash--warning {
    border: 1px solid #efdaa1;
    background: #fff7df;
    color: #966815;
}

.billing-settings-flash--warning > span {
    background: #dfa332;
    color: #fff;
}

.billing-settings-flash--error {
    border: 1px solid #efc2b5;
    background: #fff0ea;
    color: #a34c38;
}

.billing-settings-flash--error > span {
    background: #d26045;
    color: #fff;
}

@media (max-width: 900px) {

    .billing-settings-flashes {
        width: min(700px, calc(100% - 28px));
    }

}

/* ===== FIN MESSAGES FACTURATION ===== */


/* ==========================================================
   CLIENTS - PRÉPARATION FACTURATION
   ========================================================== */

.client-billing-page {
    min-height: 100vh;
    background:
        radial-gradient(
            circle at 8% 18%,
            rgba(48, 174, 134, 0.17),
            transparent 33%
        ),
        radial-gradient(
            circle at 92% 18%,
            rgba(229, 116, 80, 0.13),
            transparent 34%
        ),
        linear-gradient(
            135deg,
            #ecf8f3,
            #f8fbf9 50%,
            #fff5ef
        );
}

.client-form-card {
    box-shadow:
        0 24px 55px rgba(31, 103, 80, 0.10);
}


/* État de facturation à gauche */

.client-billing-readiness {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 11px;
    margin-top: 24px;
    border-radius: 17px;
    padding: 15px;
}

.client-billing-readiness > span {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    font-weight: 900;
}

.client-billing-readiness > div {
    display: grid;
    gap: 4px;
}

.client-billing-readiness small {
    font-size: 0.57rem;
    font-weight: 900;
}

.client-billing-readiness strong {
    font-size: 0.79rem;
}

.client-billing-readiness p {
    margin: 0;
    font-size: 0.64rem;
    line-height: 1.45;
}

.client-billing-readiness ul {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin: 3px 0 0;
    padding: 0;
    list-style: none;
}

.client-billing-readiness li {
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.70);
    padding: 4px 7px;
    font-size: 0.57rem;
    font-weight: 800;
}

.client-billing-readiness--ready {
    border: 1px solid #bce4d4;
    background: #e8f8f1;
    color: #176f54;
}

.client-billing-readiness--ready > span {
    background: #21a176;
}

.client-billing-readiness--warning {
    border: 1px solid #efdaa2;
    background: #fff7df;
    color: #936716;
}

.client-billing-readiness--warning > span {
    background: #dda02c;
}


/* Sections du formulaire */

.client-form-section {
    margin-top: 25px;
}

.client-form-section__title {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin-bottom: 13px;
}

.client-form-section__title > span {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 10px;
    font-size: 0.62rem;
    font-weight: 900;
}

.client-form-section__title > div {
    display: grid;
    gap: 1px;
}

.client-form-section__title strong {
    font-size: 0.79rem;
}

.client-form-section__title small {
    color: #84968f;
    font-size: 0.61rem;
}

.client-form-section--identity
.client-form-section__title > span {
    background: #e2f5ed;
    color: #15785b;
}

.client-form-section--identity
.client-form-section__title strong {
    color: #136c52;
}

.client-form-section--address
.client-form-section__title > span {
    background: #fff0e7;
    color: #cc6244;
}

.client-form-section--address
.client-form-section__title strong {
    color: #bb573d;
}

.client-form-section--contact
.client-form-section__title > span {
    background: #fff3d4;
    color: #ad7518;
}

.client-form-section--contact
.client-form-section__title strong {
    color: #9b6814;
}

.client-form-section--notes
.client-form-section__title > span {
    background: #e4f4f3;
    color: #167d75;
}

.client-form-section--notes
.client-form-section__title strong {
    color: #146f68;
}

.client-field-help {
    display: block;
    margin-top: 5px;
    color: #83958e;
    font-size: 0.59rem;
}


/* État de facturation sur les cartes */

.client-billing-status {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    margin-top: 13px;
    border-radius: 12px;
    padding: 9px 10px;
}

.client-billing-status > span {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    font-size: 0.66rem;
    font-weight: 900;
}

.client-billing-status > div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.client-billing-status strong {
    font-size: 0.64rem;
}

.client-billing-status small {
    color: inherit;
    opacity: 0.78;
    font-size: 0.55rem;
    line-height: 1.35;
}

.client-billing-status--ready {
    background: #e7f7ef;
    color: #176f53;
}

.client-billing-status--ready > span {
    background: #21a177;
}

.client-billing-status--warning {
    background: #fff4dc;
    color: #99691b;
}

.client-billing-status--warning > span {
    background: #dc9b27;
}


/* Mobile */

@media (max-width: 620px) {

    .client-billing-readiness ul {
        flex-direction: column;
        align-items: flex-start;
    }

}

/* ===== FIN CLIENTS FACTURATION ===== */


/* ==========================================================
   FACTURES
   ========================================================== */

.invoice-page,
.invoice-show-page {
    min-height: 100vh;
    background:
        radial-gradient(
            circle at 8% 15%,
            rgba(42, 171, 131, 0.18),
            transparent 34%
        ),
        radial-gradient(
            circle at 92% 12%,
            rgba(231, 119, 82, 0.15),
            transparent 34%
        ),
        linear-gradient(
            135deg,
            #eaf7f2,
            #f8fbf9 50%,
            #fff5ee
        );
}

.invoice-hero {
    display: flex;
    min-height: 210px;
    box-sizing: border-box;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    border-radius: 28px;
    background:
        linear-gradient(
            115deg,
            #176f58,
            #2c9b79,
            #55b89d
        );
    padding: 42px;
    color: #fff;
}

.invoice-badge {
    display: inline-flex;
    border-radius: 999px;
    background: rgba(255,255,255,.13);
    padding: 7px 11px;
    font-size: .62rem;
    font-weight: 900;
}

.invoice-hero h1 {
    margin: 18px 0 8px;
    font-size: clamp(2rem, 5vw, 3.2rem);
}

.invoice-hero p {
    max-width: 580px;
    margin: 0;
    line-height: 1.6;
}

.invoice-hero__stats {
    display: grid;
    grid-template-columns: repeat(2, 120px);
    gap: 10px;
}

.invoice-hero__stats > div {
    display: grid;
    gap: 5px;
    border-radius: 17px;
    background: rgba(255,255,255,.94);
    padding: 16px;
    color: #235746;
}

.invoice-hero__stats span {
    font-size: .62rem;
}

.invoice-hero__stats strong {
    font-size: 1.25rem;
}

.invoice-section {
    margin-top: 42px;
}

.invoice-candidate-grid {
    display: grid;
    grid-template-columns:
        repeat(auto-fit, minmax(280px, 1fr));
    gap: 18px;
}

.invoice-candidate-card {
    border: 1px solid #dbe9e3;
    border-radius: 20px;
    background: rgba(255,255,255,.94);
    padding: 18px;
    box-shadow:
        0 16px 34px rgba(36,95,76,.07);
}

.invoice-candidate-card__top {
    display: flex;
    justify-content: space-between;
    gap: 15px;
}

.invoice-candidate-card__top small {
    color: #d26345;
    font-weight: 900;
}

.invoice-candidate-card__top h3 {
    margin: 5px 0;
    color: #1c5140;
}

.invoice-candidate-card__top > span {
    align-self: flex-start;
    border-radius: 999px;
    background: #e5f7ef;
    padding: 7px 9px;
    color: #167455;
    font-size: .62rem;
    font-weight: 900;
}

.invoice-ready,
.invoice-blocked {
    margin-top: 14px;
    border-radius: 13px;
    padding: 11px;
}

.invoice-ready {
    display: grid;
    grid-template-columns: 30px 1fr;
    gap: 8px;
    background: #e8f8f1;
    color: #176f53;
}

.invoice-ready > span {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 50%;
    background: #20a077;
    color: #fff;
}

.invoice-ready div {
    display: grid;
    gap: 2px;
}

.invoice-ready small {
    font-size: .6rem;
}

.invoice-blocked {
    background: #fff4dc;
    color: #95681b;
}

.invoice-blocked ul {
    margin: 7px 0 0;
    padding-left: 18px;
    font-size: .65rem;
    line-height: 1.5;
}

.invoice-create-button {
    width: 100%;
    min-height: 43px;
    margin-top: 12px;
    border: 0;
    border-radius: 11px;
    background:
        linear-gradient(
            110deg,
            #1b9670,
            #147055
        );
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-size: .68rem;
    font-weight: 900;
}

.invoice-list {
    display: grid;
    gap: 10px;
}

.invoice-list-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border: 1px solid #dbe8e3;
    border-radius: 15px;
    background: rgba(255,255,255,.94);
    padding: 14px 16px;
    color: inherit;
    text-decoration: none;
}

.invoice-list-card > div {
    display: grid;
    gap: 3px;
}

.invoice-list-card > div:last-child {
    text-align: right;
}

.invoice-list-card small,
.invoice-list-card span {
    color: #7d9088;
    font-size: .61rem;
}

.invoice-list-card strong {
    color: #225746;
}

.invoice-message {
    margin-bottom: 18px;
    border-radius: 13px;
    padding: 12px 15px;
    font-size: .7rem;
    font-weight: 800;
}

.invoice-message--success {
    background: #e7f8ef;
    color: #176f53;
}

.invoice-message--warning {
    background: #fff4dc;
    color: #96681b;
}


/* DOCUMENT FACTURE */

.invoice-show-page {
    padding: 24px;
}

.invoice-show-toolbar,
.invoice-document {
    width: min(980px, 100%);
    box-sizing: border-box;
    margin-inline: auto;
}

.invoice-show-toolbar {
    display: flex;
    margin-bottom: 14px;
    justify-content: space-between;
}

.invoice-show-toolbar a {
    color: #177355;
    font-weight: 900;
    text-decoration: none;
}

.invoice-document {
    background: #fff;
    padding: clamp(28px, 5vw, 55px);
    box-shadow:
        0 25px 60px rgba(34,84,69,.12);
}

.invoice-document__header {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    padding-bottom: 25px;
    border-bottom: 2px solid #1e8c68;
}

.invoice-document__header > div {
    display: grid;
    gap: 5px;
}

.invoice-document__header > div:last-child {
    text-align: right;
}

.invoice-document__brand {
    color: #188161;
    font-weight: 900;
}

.invoice-document__header h1 {
    margin: 0;
    color: #194d3e;
}

.invoice-parties {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    margin-top: 28px;
}

.invoice-parties > div {
    border-radius: 15px;
    background: #f6f9f7;
    padding: 16px;
}

.invoice-parties small,
.invoice-source > span:first-child {
    color: #7b8f87;
    font-size: .61rem;
    font-weight: 900;
}

.invoice-parties strong {
    display: block;
    margin: 5px 0;
    color: #205442;
}

.invoice-parties p {
    margin: 5px 0;
    color: #667d74;
}

.invoice-source {
    display: flex;
    margin-top: 20px;
    align-items: center;
    gap: 12px;
    border-radius: 12px;
    background: #fff5ea;
    padding: 11px 14px;
}

.invoice-source strong {
    color: #ba6343;
}

.invoice-source span:last-child {
    margin-left: auto;
    color: #85766f;
    font-size: .65rem;
}

.invoice-lines {
    margin-top: 27px;
    overflow: hidden;
    border: 1px solid #dce7e2;
    border-radius: 14px;
}

.invoice-lines__head,
.invoice-lines__row {
    display: grid;
    grid-template-columns:
        minmax(180px, 2fr)
        110px
        110px
        90px
        120px;
    gap: 10px;
    padding: 12px 14px;
}

.invoice-lines__head {
    background: #eaf6f1;
    color: #617e73;
    font-size: .61rem;
    font-weight: 900;
}

.invoice-lines__row {
    align-items: center;
    color: #315c4d;
    font-size: .71rem;
}

.invoice-summary {
    display: grid;
    grid-template-columns: 1fr 330px;
    gap: 30px;
    margin-top: 28px;
}

.invoice-payment-info {
    display: grid;
    align-content: start;
    gap: 5px;
    color: #647b72;
}

.invoice-payment-info > span {
    color: #82938c;
    font-size: .62rem;
    font-weight: 900;
}

.invoice-payment-info strong {
    color: #225743;
}

.invoice-totals {
    overflow: hidden;
    border: 1px solid #dae7e1;
    border-radius: 14px;
}

.invoice-totals > div {
    display: flex;
    justify-content: space-between;
    padding: 10px 13px;
    border-bottom: 1px solid #e3ece8;
}

.invoice-totals > div:last-child {
    border-bottom: 0;
}

.invoice-totals span {
    color: #72877f;
}

.invoice-total-ttc {
    background:
        linear-gradient(
            135deg,
            #dff5e9,
            #caecd9
        );
}

.invoice-total-ttc strong {
    color: #0e7352;
    font-size: 1rem;
}

.invoice-transmission {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-top: 35px;
}

.invoice-transmission > div {
    display: grid;
    justify-items: center;
    gap: 4px;
    border-radius: 13px;
    background: #f5f8f7;
    padding: 13px;
    text-align: center;
}

.invoice-transmission small {
    color: #82948d;
}

.invoice-transmission strong {
    color: #47695e;
    font-size: .67rem;
}

@media (max-width: 760px) {

    .invoice-hero,
    .invoice-document__header {
        align-items: flex-start;
        flex-direction: column;
    }

    .invoice-hero__stats {
        width: 100%;
        grid-template-columns: 1fr 1fr;
    }

    .invoice-document__header > div:last-child {
        text-align: left;
    }

    .invoice-parties,
    .invoice-summary {
        grid-template-columns: 1fr;
    }

    .invoice-lines {
        overflow-x: auto;
    }

    .invoice-lines__head,
    .invoice-lines__row {
        min-width: 700px;
    }

    .invoice-transmission {
        grid-template-columns: 1fr 1fr;
    }

}

/* ===== FIN FACTURES ===== */


/* ==========================================================
   FACTURE - PDF
   ========================================================== */

.invoice-show-toolbar__actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.invoice-pdf-button {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    border: 1px solid #c9e1d7;
    border-radius: 10px;
    background: #e9f7f1;
    padding: 0 12px;
    color: #147154;
    font-size: 0.67rem;
    font-weight: 900;
    text-decoration: none;
}

.invoice-pdf-button:hover {
    background: #def3e9;
}

@media (max-width: 620px) {

    .invoice-show-toolbar {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .invoice-show-toolbar__actions {
        width: 100%;
        align-items: flex-start;
        flex-direction: column;
    }

}

/* ===== FIN FACTURE PDF ===== */


/* ==========================================================
   FACTURES - APERÇU EMAIL
   ========================================================== */

.invoice-status-link {
    margin-top: 3px;
    color: #187456;
    font-size: 0.58rem;
    font-weight: 900;
    text-decoration: none;
}

.invoice-email-preview-page {
    min-height: 100vh;
    padding: 24px;
    background:
        radial-gradient(
            circle at 8% 15%,
            rgba(43, 170, 131, .17),
            transparent 34%
        ),
        radial-gradient(
            circle at 92% 12%,
            rgba(231, 119, 82, .14),
            transparent 34%
        ),
        linear-gradient(
            135deg,
            #eaf7f2,
            #f8fbf9 50%,
            #fff5ee
        );
}

.invoice-email-preview-toolbar,
.invoice-email-preview-layout {
    width: min(1180px, 100%);
    margin-inline: auto;
}

.invoice-email-preview-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}

.invoice-email-preview-toolbar a {
    color: #147154;
    font-weight: 900;
    text-decoration: none;
}

.invoice-email-preview-layout {
    display: grid;
    grid-template-columns:
        minmax(260px, 0.65fr)
        minmax(580px, 1.35fr);
    gap: 25px;
    align-items: start;
}

.invoice-email-preview-info,
.invoice-email-frame {
    border: 1px solid #d7e7e0;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    box-shadow:
        0 20px 45px rgba(31, 91, 72, .08);
}

.invoice-email-preview-info {
    padding: 24px;
}

.invoice-email-preview-badge {
    display: inline-flex;
    border-radius: 999px;
    background: #e4f6ee;
    padding: 6px 9px;
    color: #157255;
    font-size: .61rem;
    font-weight: 900;
}

.invoice-email-preview-info h1 {
    margin: 15px 0 7px;
    color: #194e3e;
}

.invoice-email-preview-info > p {
    color: #71867e;
    line-height: 1.55;
}

.invoice-email-meta {
    display: grid;
    gap: 10px;
    margin-top: 22px;
}

.invoice-email-meta > div {
    display: grid;
    gap: 4px;
    border-radius: 12px;
    background: #f5f8f7;
    padding: 11px;
}

.invoice-email-meta small {
    color: #81928c;
    font-size: .57rem;
    font-weight: 900;
}

.invoice-email-meta strong {
    overflow-wrap: anywhere;
    color: #285848;
    font-size: .68rem;
}

.invoice-email-mode {
    display: grid;
    grid-template-columns: 35px 1fr;
    gap: 9px;
    margin-top: 20px;
    border-radius: 13px;
    padding: 12px;
}

.invoice-email-mode > span {
    display: grid;
    width: 33px;
    height: 33px;
    place-items: center;
    border-radius: 50%;
}

.invoice-email-mode > div {
    display: grid;
    gap: 2px;
}

.invoice-email-mode small {
    font-size: .59rem;
    line-height: 1.4;
}

.invoice-email-mode--local {
    background: #fff4dc;
    color: #95691c;
}

.invoice-email-mode--local > span {
    background: #f3d895;
}

.invoice-email-mode--active {
    background: #e7f8ef;
    color: #176e53;
}

.invoice-email-mode--active > span {
    background: #23a078;
    color: #fff;
}

.invoice-email-send-button {
    width: 100%;
    min-height: 44px;
    margin-top: 12px;
    border: 0;
    border-radius: 11px;
    background:
        linear-gradient(
            110deg,
            #1d9973,
            #147154
        );
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-size: .68rem;
    font-weight: 900;
}

.invoice-email-send-button--disabled {
    background: #dfe6e3;
    color: #85938e;
    cursor: not-allowed;
}

.invoice-email-frame {
    overflow: hidden;
}

.invoice-email-frame__bar {
    display: grid;
    gap: 4px;
    border-bottom: 1px solid #e1eae6;
    background: #f5f8f7;
    padding: 14px 18px;
}

.invoice-email-frame__bar span {
    color: #7b8f87;
    font-size: .61rem;
}

.invoice-email-frame__bar strong {
    margin-top: 3px;
    color: #285848;
    font-size: .73rem;
}

.invoice-email-frame__content {
    overflow: auto;
    background: #fff;
}

@media (max-width: 900px) {

    .invoice-email-preview-layout {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 620px) {

    .invoice-email-preview-page {
        padding: 14px;
    }

}

/* ===== FIN APERÇU EMAIL ===== */


/* ==========================================================
   NAVIGATION MODULES - MOBILE
   ========================================================== */

@media (max-width: 680px) {

    .farm-module-page .farm-dashboard__header {
        align-items: stretch;
        flex-direction: column;
        gap: 12px;
        padding: 16px 18px;
    }

    .farm-module-page .farm-dashboard__brand {
        width: max-content;
        max-width: 100%;
    }

    .farm-module-page .farm-dashboard__brand .brand__text strong {
        white-space: nowrap;
    }

    .farm-module-page .farm-dashboard__header-actions {
        display: grid;
        width: 100%;
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .farm-module-page .dashboard-header-button {
        width: 100%;
        min-width: 0;
        min-height: 44px;
        justify-content: center;
        padding: 7px 9px;
        text-align: center;
        line-height: 1.2;
        white-space: normal;
    }

}

/* ===== FIN NAVIGATION MODULES MOBILE ===== */


/* ==========================================================
   TABLEAU DE BORD - HEADER MOBILE
   ========================================================== */

@media (max-width: 680px) {

    .farm-dashboard > .farm-dashboard__header {
        align-items: stretch;
        flex-direction: column;
        gap: 13px;
        padding: 16px 18px;
    }

    .farm-dashboard > .farm-dashboard__header
    .farm-dashboard__brand {
        width: 100%;
        min-width: 0;
    }

    .farm-dashboard > .farm-dashboard__header
    .farm-dashboard__brand .brand__text {
        min-width: 0;
    }

    .farm-dashboard > .farm-dashboard__header
    .farm-dashboard__brand .brand__text strong {
        white-space: nowrap;
    }

    .farm-dashboard > .farm-dashboard__header
    .farm-dashboard__brand .brand__text small {
        white-space: nowrap;
    }

    .farm-dashboard > .farm-dashboard__header
    .farm-dashboard__header-actions {
        display: grid;
        width: 100%;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }

    .farm-dashboard > .farm-dashboard__header
    .dashboard-header-button {
        width: 100%;
        min-width: 0;
        min-height: 44px;
        justify-content: center;
        padding: 0 10px;
        white-space: nowrap;
    }

    .farm-dashboard > .farm-dashboard__header
    .dashboard-header-button--logout span {
        display: inline;
    }

}

/* ===== FIN HEADER TABLEAU DE BORD MOBILE ===== */

@media (max-width: 680px) {

    .farm-dashboard > .farm-dashboard__header {
        padding-top: 24px;
    }

}


/* ==========================================================
   FACTURE - ENCAISSEMENTS
   ========================================================== */

.invoice-payment-panel {
    margin-top: 34px;
    border: 1px solid #d8e7e0;
    border-radius: 18px;
    background:
        linear-gradient(
            135deg,
            #f7fcf9,
            #f3faf7
        );
    padding: 22px;
}

.invoice-payment-panel__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.invoice-payment-panel__heading > div:first-child {
    display: grid;
    gap: 4px;
}

.invoice-payment-panel__heading > div:first-child > span {
    color: #238568;
    font-size: .6rem;
    font-weight: 900;
    letter-spacing: .08em;
}

.invoice-payment-panel__heading h2 {
    margin: 0;
    color: #214f40;
    font-size: 1.08rem;
}

.invoice-payment-state {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    border-radius: 999px;
    background: #fff0d9;
    padding: 0 12px;
    color: #94651c;
    font-size: .63rem;
    font-weight: 900;
}

.invoice-payment-state--partial {
    background: #e9f4ff;
    color: #27658e;
}

.invoice-payment-state--paid {
    background: #dff5e9;
    color: #167052;
}

.invoice-payment-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 20px;
}

.invoice-payment-summary > div {
    display: grid;
    gap: 5px;
    border: 1px solid #e0ebe6;
    border-radius: 13px;
    background: #fff;
    padding: 14px;
}

.invoice-payment-summary small {
    color: #71867e;
    font-size: .61rem;
    font-weight: 800;
}

.invoice-payment-summary strong {
    color: #285848;
    font-size: .96rem;
}

.invoice-payment-summary__remaining {
    background: #e8f8f0 !important;
}

.invoice-payment-summary__remaining strong {
    color: #117151;
}

.invoice-payment-history {
    display: grid;
    gap: 8px;
    margin-top: 20px;
}

.invoice-payment-history h3 {
    margin: 0 0 3px;
    color: #315c4d;
    font-size: .72rem;
}

.invoice-payment-history__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    border-radius: 11px;
    background: #fff;
    padding: 11px 13px;
}

.invoice-payment-history__row > div {
    display: grid;
    gap: 2px;
}

.invoice-payment-history__row > div:last-child {
    text-align: right;
}

.invoice-payment-history strong {
    color: #176e52;
}

.invoice-payment-history span,
.invoice-payment-history small {
    color: #71867e;
    font-size: .62rem;
}

.invoice-payment-form {
    display: grid;
    gap: 13px;
    margin-top: 22px;
    border-top: 1px solid #dce9e3;
    padding-top: 20px;
}

.invoice-payment-form__grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.invoice-payment-form label {
    display: grid;
    gap: 6px;
}

.invoice-payment-form label > span {
    color: #527166;
    font-size: .62rem;
    font-weight: 900;
}

.invoice-payment-form input,
.invoice-payment-form select,
.invoice-payment-form textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #d4e3dc;
    border-radius: 10px;
    background: #fff;
    padding: 10px 11px;
    color: #284f42;
    font: inherit;
    font-size: .7rem;
}

.invoice-payment-amount {
    position: relative;
}

.invoice-payment-amount input {
    padding-right: 34px;
}

.invoice-payment-amount b {
    position: absolute;
    top: 50%;
    right: 13px;
    transform: translateY(-50%);
    color: #527166;
}

.invoice-payment-submit {
    min-height: 43px;
    border: 0;
    border-radius: 11px;
    background:
        linear-gradient(
            110deg,
            #1e9b74,
            #147154
        );
    padding: 0 18px;
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-size: .68rem;
    font-weight: 900;
}

.invoice-payment-complete {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 11px;
    margin-top: 20px;
    border-radius: 13px;
    background: #e1f6eb;
    padding: 14px;
    color: #176d52;
}

.invoice-payment-complete > span {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 50%;
    background: #22a178;
    color: #fff;
    font-weight: 900;
}

.invoice-payment-complete > div {
    display: grid;
    gap: 3px;
}

.invoice-payment-complete small {
    color: #5c8174;
}


@media (max-width: 680px) {

    .invoice-payment-panel__heading {
        flex-direction: column;
    }

    .invoice-payment-summary,
    .invoice-payment-form__grid {
        grid-template-columns: 1fr;
    }

    .invoice-payment-history__row {
        align-items: flex-start;
        flex-direction: column;
    }

    .invoice-payment-history__row > div:last-child {
        text-align: left;
    }

}

/* ===== FIN FACTURE ENCAISSEMENTS ===== */


/* ==========================================================
   FACTURATION - PILOTAGE DES ENCAISSEMENTS
   ========================================================== */

.invoice-payment-overview {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 22px;
}

.invoice-payment-overview article {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 13px;
    border: 1px solid #d9e8e1;
    border-radius: 18px;
    background: rgba(255,255,255,.94);
    padding: 17px;
    box-shadow:
        0 14px 30px rgba(36,95,76,.06);
}

.invoice-payment-overview article > span {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 13px;
    background: #e7f7f0;
    color: #177255;
    font-weight: 900;
}

.invoice-payment-overview article > div {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.invoice-payment-overview small {
    color: #758980;
    font-size: .58rem;
    font-weight: 900;
    letter-spacing: .04em;
}

.invoice-payment-overview strong {
    color: #205543;
    font-size: 1.1rem;
}

.invoice-payment-overview--late > span {
    background: #fff0db !important;
    color: #a66b19 !important;
}

.invoice-payment-overview--late strong {
    color: #9b6519;
}

.invoice-payment-overview--paid > span {
    background: #dff5e9 !important;
    color: #147153 !important;
}

.invoice-payment-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 15px;
}

.invoice-payment-filters a {
    display: inline-flex;
    min-height: 34px;
    box-sizing: border-box;
    align-items: center;
    border: 1px solid #d4e5dd;
    border-radius: 999px;
    background: rgba(255,255,255,.9);
    padding: 0 13px;
    color: #577269;
    font-size: .62rem;
    font-weight: 900;
    text-decoration: none;
}

.invoice-payment-filters a:hover,
.invoice-payment-filters a.is-active {
    border-color: #2b9a78;
    background: #e4f6ee;
    color: #147154;
}

.invoice-list-card__financial {
    align-items: end;
}

.invoice-payment-chip {
    display: inline-flex;
    width: max-content;
    margin-top: 4px;
    margin-left: auto;
    align-items: center;
    border-radius: 999px;
    background: #fff0d9;
    padding: 5px 8px;
    color: #96671c !important;
    font-size: .56rem !important;
    font-weight: 900;
}

.invoice-payment-chip--partial {
    background: #e7f3ff;
    color: #27678f !important;
}

.invoice-payment-chip--overdue {
    background: #ffe9df;
    color: #b15336 !important;
}

.invoice-payment-chip--paid {
    background: #dff5e9;
    color: #147154 !important;
}

.invoice-list-card__balance {
    margin-top: 2px;
    font-weight: 800;
}


@media (max-width: 680px) {

    .invoice-payment-overview {
        gap: 7px;
    }

    .invoice-payment-overview article {
        display: grid;
        gap: 7px;
        padding: 11px 9px;
    }

    .invoice-payment-overview article > span {
        width: 30px;
        height: 30px;
        font-size: .7rem;
    }

    .invoice-payment-overview small {
        font-size: .5rem;
    }

    .invoice-payment-overview strong {
        font-size: .82rem;
    }

    .invoice-payment-filters {
        gap: 6px;
    }

}


@media (max-width: 480px) {

    .invoice-list-card {
        align-items: flex-start;
        flex-direction: column;
    }

    .invoice-list-card__financial {
        width: 100%;
        align-items: start;
        text-align: left !important;
    }

    .invoice-payment-chip {
        margin-left: 0;
    }

}

/* ===== FIN PILOTAGE ENCAISSEMENTS ===== */


/* Message de confirmation sur la fiche facture */

.invoice-show-message {
    width: min(980px, 100%);
    box-sizing: border-box;
    margin: 0 auto 14px;
}

/* ===== FIN MESSAGE FICHE FACTURE ===== */

/* ===== LISIBILITE CARTES STOCK ===== */

.stock-reference {
    font-size: .72rem;
}

.stock-card h3 {
    font-size: 1.08rem;
}

.stock-balance span {
    font-size: .72rem;
}

.stock-balance strong {
    font-size: 1.35rem;
}

.stock-threshold {
    font-size: .72rem;
    line-height: 1.5;
}

.stock-card .culture-card-actions {
    font-size: .7rem;
}

.stock-card__quick-actions a {
    font-size: .72rem;
}

/* ===== FIN LISIBILITE CARTES STOCK ===== */

/* ==========================================================
   PILOTE VISUEL - PAGE STOCK
   ========================================================== */

.stock-page {
    background:
        radial-gradient(
            circle at 12% 8%,
            rgba(172, 211, 170, .28),
            transparent 32%
        ),
        radial-gradient(
            circle at 88% 18%,
            rgba(224, 187, 101, .16),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #f1f6ef 0%,
            #f7f3e9 52%,
            #eef5f0 100%
        );
}

.stock-page .farm-module-page__content {
    color: #26382f;
}

.stock-page p,
.stock-page small {
    color: #52655b;
}

.stock-hero {
    border: 1px solid rgba(61, 112, 78, .14);
    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.96),
            rgba(239,248,241,.94)
        );
    box-shadow:
        0 22px 55px rgba(40, 91, 62, .09);
}

.stock-hero h1 {
    color: #183d2b;
}

.stock-hero p {
    color: #52665b;
    font-size: .82rem;
    line-height: 1.65;
}

.stock-card {
    border-color: rgba(51, 106, 69, .16);
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.98),
            rgba(247,251,247,.96)
        );
    box-shadow:
        0 16px 38px rgba(41, 82, 57, .08);
}

.stock-card h3 {
    color: #173c2a;
}

.stock-reference,
.stock-threshold {
    color: #53665b;
}

.stock-history {
    border-radius: 22px;
    background: rgba(255,255,255,.48);
    padding: 18px;
}

.stock-history-item {
    background: rgba(255,255,255,.92);
    box-shadow:
        0 9px 25px rgba(42, 85, 59, .06);
}

/* ===== FIN PILOTE VISUEL STOCK ===== */

/* ==========================================================
   PILOTE VISUEL STOCK V2 - CONTRASTE ET TYPOGRAPHIE
   ========================================================== */

.stock-page {
    background:
        radial-gradient(
            circle at 8% 4%,
            rgba(109, 160, 105, .24),
            transparent 28%
        ),
        radial-gradient(
            circle at 92% 35%,
            rgba(196, 133, 73, .15),
            transparent 32%
        ),
        linear-gradient(
            145deg,
            #eaf2e7 0%,
            #f5efe2 52%,
            #e8f1ea 100%
        );
}

/* Texte général plus lisible */
.stock-page {
    color: #20352a;
}

.stock-page p,
.stock-page small,
.stock-page span {
    font-weight: 500;
}

/* Hero */
.stock-hero {
    background:
        linear-gradient(
            125deg,
            rgba(255,255,255,.98) 0%,
            rgba(230,244,233,.98) 100%
        );

    border: 1px solid rgba(48, 103, 66, .22);

    box-shadow:
        0 22px 55px rgba(32, 74, 49, .12);
}

.stock-hero h1 {
    color: #123b27;
    font-weight: 800;
}

.stock-hero p {
    color: #40594b;
    font-size: .94rem;
    font-weight: 500;
}

/* Titres de sections */
.stock-page .section-eyebrow,
.stock-page .farm-module-page__eyebrow {
    color: #177547;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.stock-page h2 {
    color: #123b27;
    font-weight: 800;
}

/* Cartes */
.stock-card {
    background: rgba(255,255,255,.97);

    border: 1px solid rgba(46, 101, 65, .22);

    box-shadow:
        0 16px 36px rgba(41, 78, 54, .11);
}

.stock-card h3 {
    color: #163c29;
    font-size: 1.15rem;
    font-weight: 800;
}

.stock-reference {
    color: #765036;
    font-size: .78rem;
    font-weight: 800;
}

/* Valeur principale */
.stock-balance {
    background:
        linear-gradient(
            135deg,
            #f5eee3,
            #f3e9dd
        );
}

.stock-balance span {
    color: #526157;
    font-size: .82rem;
}

.stock-balance strong {
    color: #75451f;
    font-size: 1.48rem;
    font-weight: 800;
}

/* Informations secondaires */
.stock-threshold {
    color: #40564a;
    font-size: .82rem;
    font-weight: 500;
}

/* Historique */
.stock-history {
    background: rgba(255,255,255,.64);

    border: 1px solid rgba(47, 100, 65, .10);

    box-shadow:
        0 10px 30px rgba(40, 79, 53, .06);
}

.stock-history-item {
    background: rgba(255,255,255,.97);
}

/* Boutons légèrement plus présents */
.stock-page a,
.stock-page button {
    font-weight: 700;
}

/* ===== FIN PILOTE VISUEL STOCK V2 ===== */


/* ==========================================================
   PILOTE ARTICLE IMAGE V3
   ========================================================== */

.stock-form-layout--article {
    align-items: center;
}


/* TEXTE GAUCHE */

.stock-form-layout--article
.parcel-form-intro > p {
    color: #344f41;
    font-size: 1rem;
    line-height: 1.7;
    font-weight: 500;
}


/* ILLUSTRATION */

.stock-form-layout--article
.stock-form-visual {
    width: 100%;
    max-width: 470px;

    margin-top: 1.4rem;
    margin-bottom: 1.4rem;

    overflow: hidden;

    border-radius: 26px;

    border:
        1px solid
        rgba(37, 99, 61, .20);

    background: #eef5e9;

    box-shadow:
        0 20px 50px
        rgba(30, 71, 46, .15);
}

.stock-form-layout--article
.stock-form-visual svg {
    display: block;

    width: 100%;
    height: auto;
}


/* CONSEIL */

.stock-form-layout--article
.parcel-form-tip strong {
    color: #15442f;
    font-size: 1rem;
    font-weight: 800;
}

.stock-form-layout--article
.parcel-form-tip p {
    color: #40594c;
    font-size: .88rem;
    line-height: 1.55;
    font-weight: 500;
}


/* FORMULAIRE */

.stock-form-layout--article
.parcel-form-card__heading p {
    color: #4b6255;
    font-size: .9rem;
    font-weight: 500;
}

.stock-form-layout--article
.auth-field label {
    color: #243e30;
    font-size: .88rem;
    font-weight: 750;
}

.stock-form-layout--article
.auth-field input,

.stock-form-layout--article
.auth-field select {
    min-height: 48px;

    color: #203a2c;

    font-size: .96rem;
    font-weight: 500;
}


/* MOBILE */

@media (max-width: 900px) {

    .stock-form-layout--article {
        align-items: stretch;
    }

    .stock-form-layout--article
    .stock-form-visual {
        max-width: none;
    }
}

/* FIN PILOTE ARTICLE IMAGE V3 */


/* VISUEL ARTICLE MODERNE */

.stock-form-layout--article .stock-form-visual {
    background: #f7f2e7;
    border: 1px solid rgba(37, 92, 57, .18);
    border-radius: 26px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(30, 71, 46, .14);
}

.stock-form-layout--article .stock-form-visual img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center;
}

@media (max-width: 900px) {
    .stock-form-layout--article .stock-form-visual img {
        aspect-ratio: 16 / 9;
    }
}

/* FIN VISUEL ARTICLE MODERNE */


/* ===== IMAGES VALIDÉES MA FERME PEI V1 ===== */

/* ACCUEIL */
.hero--farm-image {
    position: relative;
    overflow: hidden;
    background-image:
        linear-gradient(
            90deg,
            rgba(247, 251, 246, .72) 0%,
            rgba(247, 251, 246, .58) 38%,
            rgba(247, 251, 246, .32) 62%,
            rgba(247, 251, 246, .08) 100%
        ),
        var(--hero-image);
    background-size: cover;
    background-position: center;
}

.hero--farm-image .hero__grid {
    position: relative;
    z-index: 2;
}


/* EXPLOITATION */
.onboarding-intro--farm-image {
    position: relative;
    overflow: hidden;
    padding: clamp(28px, 4vw, 48px);
    border-radius: 30px;
    background-image:
        linear-gradient(
            rgba(246, 251, 247, .82),
            rgba(246, 251, 247, .88)
        ),
        var(--hero-image);
    background-size: cover;
    background-position: center;
    box-shadow: 0 20px 50px rgba(25, 77, 54, .13);
}


/* PARCELLES */
.parcel-hero--farm-image {
    position: relative;
    overflow: hidden;
    background-image:
        linear-gradient(
            90deg,
            rgba(246, 251, 247, .96) 0%,
            rgba(246, 251, 247, .86) 48%,
            rgba(246, 251, 247, .48) 72%,
            rgba(246, 251, 247, .20) 100%
        ),
        var(--hero-image);
    background-size: cover;
    background-position: center;
}


/* MOBILE */
@media (max-width: 760px) {

    .hero--farm-image {
        background-image:
            linear-gradient(
                rgba(247, 251, 246, .92),
                rgba(247, 251, 246, .86)
            ),
            var(--hero-image);
        background-position: center;
    }

    .onboarding-intro--farm-image {
        padding: 24px;
    }

    .parcel-hero--farm-image {
        background-image:
            linear-gradient(
                rgba(246, 251, 247, .90),
                rgba(246, 251, 247, .82)
            ),
            var(--hero-image);
    }
}

/* ===== FIN IMAGES VALIDÉES MA FERME PEI V1 ===== */




/* ===== LISIBILITE CIBLEE HERO ACCUEIL ===== */

.hero--farm-image .hero__content {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.hero--farm-image .hero__intro {
    width: fit-content;
    max-width: 100%;
    padding: 10px 14px;
    border-radius: 14px;
    color: #214538;
    font-weight: 600;
    background: rgba(255,255,255,.68);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.hero--farm-image .hero__reassurance {
    width: fit-content;
    max-width: 100%;
    padding: 7px 10px;
    border-radius: 12px;
    color: #274b3d;
    font-weight: 700;
    background: rgba(255,255,255,.62);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* ===== FIN LISIBILITE CIBLEE HERO ACCUEIL ===== */

/* ===== PARCELLES - HERO PLUS VIVANT ===== */

.parcel-hero--farm-image {
    background-image:
        linear-gradient(
            90deg,
            rgba(245,250,246,.22) 0%,
            rgba(245,250,246,.10) 50%,
            rgba(245,250,246,.04) 100%
        ),
        var(--hero-image);
    background-position: center;
}

.parcel-hero--farm-image .parcel-hero__content {
    padding: 22px 26px;
    border-radius: 22px;
    background: rgba(255,255,255,.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: 0 12px 35px rgba(16,70,45,.12);
}

.parcel-hero--farm-image .parcel-hero__badge {
    color: #087a57;
}

.parcel-hero--farm-image h1 {
    color: #073f2d;
}

.parcel-hero--farm-image .parcel-hero__content p {
    color: #315448;
    font-weight: 600;
}

.parcel-hero--farm-image .parcel-hero__stats > div {
    background: rgba(255,255,255,.90);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: 0 12px 30px rgba(15,65,43,.14);
}

@media (max-width: 760px) {
    .parcel-hero--farm-image {
        background-image:
            linear-gradient(
                rgba(245,250,246,.18),
                rgba(245,250,246,.12)
            ),
            var(--hero-image);
    }

    .parcel-hero--farm-image .parcel-hero__content {
        background: rgba(255,255,255,.80);
    }
}

/* ===== FIN PARCELLES HERO PLUS VIVANT ===== */

/* ===== PARCELLES - FOND DE PAGE PLUS VIVANT ===== */

.parcel-page {
    min-height: 100vh;
    background:
        radial-gradient(
            circle at 8% 42%,
            rgba(41, 182, 126, .13),
            transparent 28%
        ),
        radial-gradient(
            circle at 92% 68%,
            rgba(67, 166, 191, .11),
            transparent 30%
        ),
        radial-gradient(
            circle at 48% 92%,
            rgba(217, 190, 91, .08),
            transparent 26%
        ),
        linear-gradient(
            180deg,
            #eef9f5 0%,
            #f8fbf9 48%,
            #edf7f3 100%
        );
}

.parcel-page .parcel-section {
    position: relative;
}

.parcel-page .parcel-card {
    box-shadow:
        0 16px 38px rgba(22, 91, 67, .09);
}

/* ===== FIN FOND PARCELLES ===== */


/* ===== HERO CULTURES IMAGE ===== */

.culture-hero--farm-image {
    position: relative;
    overflow: hidden;
    background-image:
        linear-gradient(
            90deg,
            rgba(245,250,246,.14) 0%,
            rgba(245,250,246,.06) 55%,
            rgba(245,250,246,.02) 100%
        ),
        var(--hero-image);
    background-size: cover;
    background-position: center;
}

.culture-hero--farm-image > div:first-child {
    padding: 20px 24px;
    border-radius: 20px;
    background: rgba(255,255,255,.76);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    box-shadow: 0 12px 32px rgba(16,70,45,.12);
}

.culture-hero--farm-image h1 {
    color: #073f2d;
}

.culture-hero--farm-image > div:first-child p {
    color: #315448;
    font-weight: 600;
}

.culture-hero--farm-image .culture-hero__stats > div {
    background: rgba(255,255,255,.90);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    box-shadow: 0 12px 30px rgba(15,65,43,.14);
}

@media (max-width: 760px) {
    .culture-hero--farm-image > div:first-child {
        background: rgba(255,255,255,.84);
    }
}

/* ===== FIN HERO CULTURES IMAGE ===== */


/* ===== HERO RECOLTES IMAGE ===== */

.harvest-hero--farm-image {
    position: relative;
    overflow: hidden;
    background-image:
        linear-gradient(
            90deg,
            rgba(245,250,246,.10),
            rgba(245,250,246,.03)
        ),
        var(--hero-image);
    background-size: cover;
    background-position: center;
}

.harvest-hero--farm-image .harvest-hero__content {
    padding: 20px 24px;
    border-radius: 20px;
    background: rgba(255,255,255,.76);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    box-shadow: 0 12px 32px rgba(16,70,45,.12);
}

.harvest-hero--farm-image .harvest-hero__content h1 {
    color: #073f2d;
}

.harvest-hero--farm-image .harvest-hero__content p {
    color: #315448;
    font-weight: 600;
}

.harvest-hero--farm-image .harvest-hero__stats > div {
    background: rgba(255,255,255,.90);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    box-shadow: 0 12px 30px rgba(15,65,43,.14);
}

@media (max-width: 760px) {
    .harvest-hero--farm-image .harvest-hero__content {
        background: rgba(255,255,255,.84);
    }
}

/* ===== FIN HERO RECOLTES IMAGE ===== */


/* ===== HERO IRRIGATION IMAGE ===== */

.irrigation-hero--farm-image {
    position: relative;
    overflow: hidden;
    background-image:
        linear-gradient(
            90deg,
            rgba(245,250,246,.10),
            rgba(245,250,246,.03)
        ),
        var(--hero-image);
    background-size: cover;
    background-position: center;
}

.irrigation-hero--farm-image .irrigation-hero__content {
    padding: 20px 24px;
    border-radius: 20px;
    background: rgba(255,255,255,.76);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    box-shadow: 0 12px 32px rgba(16,70,45,.12);
}

.irrigation-hero--farm-image .irrigation-hero__content h1 {
    color: #073f2d;
}

.irrigation-hero--farm-image .irrigation-hero__content p {
    color: #315448;
    font-weight: 600;
}

.irrigation-hero--farm-image .irrigation-hero__stats > div {
    background: rgba(255,255,255,.90);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    box-shadow: 0 12px 30px rgba(15,65,43,.14);
}

@media (max-width: 760px) {
    .irrigation-hero--farm-image .irrigation-hero__content {
        background: rgba(255,255,255,.84);
    }
}

/* ===== FIN HERO IRRIGATION IMAGE ===== */


/* ===== HERO LIVRAISONS IMAGE ===== */

.delivery-hero--farm-image {
    position: relative;
    overflow: hidden;
    background-image:
        linear-gradient(
            90deg,
            rgba(245,250,246,.10),
            rgba(245,250,246,.03)
        ),
        var(--hero-image);
    background-size: cover;
    background-position: center;
}

.delivery-hero--farm-image > div:first-child {
    padding: 20px 24px;
    border-radius: 20px;
    background: rgba(255,255,255,.76);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    box-shadow: 0 12px 32px rgba(16,70,45,.12);
}

.delivery-hero--farm-image h1 {
    color: #073f2d;
}

.delivery-hero--farm-image > div:first-child p {
    color: #315448;
    font-weight: 600;
}

.delivery-hero--farm-image .delivery-hero__stats > div {
    background: rgba(255,255,255,.90);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    box-shadow: 0 12px 30px rgba(15,65,43,.14);
}

@media (max-width: 760px) {
    .delivery-hero--farm-image > div:first-child {
        background: rgba(255,255,255,.84);
    }
}

/* ===== FIN HERO LIVRAISONS IMAGE ===== */


/* ===== HERO FACTURATION IMAGE ===== */

.invoice-hero--farm-image {
    position: relative;
    overflow: hidden;
    background-image:
        linear-gradient(
            90deg,
            rgba(245,250,246,.10),
            rgba(245,250,246,.03)
        ),
        var(--hero-image);
    background-size: cover;
    background-position: center;
}

.invoice-hero--farm-image > div:first-child {
    padding: 20px 24px;
    border-radius: 20px;
    background: rgba(255,255,255,.78);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    box-shadow: 0 12px 32px rgba(16,70,45,.12);
}

.invoice-hero--farm-image h1 {
    color: #073f2d;
}

.invoice-hero--farm-image > div:first-child p {
    color: #315448;
    font-weight: 600;
}

.invoice-hero--farm-image .invoice-hero__stats > div {
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    box-shadow: 0 12px 30px rgba(15,65,43,.14);
}

@media (max-width: 760px) {
    .invoice-hero--farm-image > div:first-child {
        background: rgba(255,255,255,.86);
    }
}

/* ===== FIN HERO FACTURATION IMAGE ===== */


/* ===== AUTH IMAGE FERME PEI ===== */

.auth-page--farm-image {
    position: relative;
    min-height: 100vh;
    background-image:
        linear-gradient(
            90deg,
            rgba(241,248,242,.28) 0%,
            rgba(241,248,242,.12) 45%,
            rgba(241,248,242,.06) 100%
        ),
        var(--auth-image);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

/* On retire les anciens halos décoratifs sur cette version */
.auth-page--farm-image .auth-background {
    display: none;
}

/* Logo bien lisible */
.auth-page--farm-image .auth-brand {
    padding: 8px 14px 8px 8px;
    border-radius: 18px;
    background: rgba(255,255,255,.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: 0 10px 28px rgba(20,65,43,.12);
}

/* Texte de présentation uniquement */
.auth-page--farm-image .auth-intro {
    padding: 28px;
    border-radius: 26px;
    background: rgba(255,255,255,.68);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    box-shadow: 0 18px 45px rgba(20,65,43,.13);
}

/* Le formulaire reste clair */
.auth-page--farm-image .auth-card {
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
    box-shadow: 0 22px 55px rgba(18,67,45,.16);
}

@media (max-width: 760px) {
    .auth-page--farm-image {
        background-attachment: scroll;
        background-position: center;
    }

    .auth-page--farm-image .auth-intro {
        padding: 22px;
        background: rgba(255,255,255,.82);
    }

    .auth-page--farm-image .auth-card {
        background: rgba(255,255,255,.96);
    }
}

/* ===== FIN AUTH IMAGE FERME PEI ===== */









/* ==========================================================
   RECOLTE - VERSION IMMERSIVE VALIDATION V4
   ========================================================== */

.harvest-form-layout--immersive {
    position: relative;
    isolation: isolate;
    width: 100%;
    max-width: none;
    min-height: 680px;
    margin: 24px 0 50px;
    padding:
        38px
        max(34px, calc((100vw - 1260px) / 2));

    display: grid;
    grid-template-columns:
        minmax(400px, 1fr)
        minmax(520px, 610px);
    gap: 44px;
    align-items: stretch;

    overflow: hidden;

    background:
        linear-gradient(
            90deg,
            #f7f0df 0%,
            #f5f4e9 44%,
            #f1f8f3 66%,
            #eef8f4 100%
        );
}

/* PHOTO DIRECTEMENT DANS LE FOND DE PAGE */
.harvest-form-layout--immersive::before {
    content: "";
    position: absolute;
    z-index: -2;

    inset: 0 auto 0 0;
    width: 61%;

    background-image: var(--hero-image);
    background-size: cover;

    /* Le récolteur est repoussé vers la droite */
    background-position: 66% center;
    background-repeat: no-repeat;

    -webkit-mask-image:
        linear-gradient(
            90deg,
            #000 0%,
            #000 72%,
            rgba(0,0,0,.72) 84%,
            transparent 100%
        );

    mask-image:
        linear-gradient(
            90deg,
            #000 0%,
            #000 72%,
            rgba(0,0,0,.72) 84%,
            transparent 100%
        );
}

/* Petite lumière douce uniquement pour faciliter la lecture */
.harvest-form-layout--immersive::after {
    content: "";
    position: absolute;
    z-index: -1;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(251,247,230,.44) 0%,
            rgba(251,247,230,.17) 27%,
            transparent 45%,
            rgba(239,248,243,.50) 58%,
            rgba(239,248,243,.96) 73%
        );

    pointer-events: none;
}


/* ==========================
   PARTIE GAUCHE
   ========================== */

.harvest-form-layout--immersive
.harvest-form-intro--farm-image {
    min-height: 610px;
    height: 100%;
    padding: 38px 12px 28px 6px;

    display: flex;
    flex-direction: column;

    border: 0;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
}


/* Badge */
.harvest-form-layout--immersive
.harvest-form-badge {
    width: fit-content;
    padding: 7px 13px;

    border-radius: 999px;
    background: rgba(255,255,255,.82);

    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);

    box-shadow:
        0 8px 20px rgba(25,70,45,.08);
}


/* TITRE : plus de grand rectangle blanc */
.harvest-form-layout--immersive
.harvest-form-intro--farm-image > h1 {
    width: 390px;
    max-width: 72%;

    margin: 34px 0 12px;
    padding: 0;

    color: #073f2d;

    font-size: clamp(3.2rem, 4.5vw, 5.1rem);
    line-height: .94;
    letter-spacing: -.055em;

    background: transparent !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;

    text-shadow:
        0 2px 2px rgba(255,255,255,.95),
        0 0 22px rgba(255,255,255,.82);
}


/* Texte */
.harvest-form-layout--immersive
.harvest-form-intro--farm-image > p {
    width: 390px;
    max-width: 72%;

    margin: 4px 0 0;
    padding: 0;

    color: #25483b;
    font-weight: 650;
    line-height: 1.6;

    background: transparent !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;

    text-shadow:
        0 1px 1px rgba(255,255,255,.95),
        0 0 14px rgba(255,255,255,.92);
}


/* Bloc conseil en bas */
.harvest-form-layout--immersive
.harvest-tip {
    width: 390px;
    max-width: 76%;

    margin-top: auto;
    margin-bottom: 10px;

    padding: 16px 18px;

    border: 1px solid rgba(255,255,255,.72);
    border-radius: 18px;

    background: rgba(255,255,255,.87);

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    box-shadow:
        0 14px 30px rgba(20,65,43,.12);
}


/* ==========================
   FORMULAIRE DROITE
   ========================== */

.harvest-form-layout--immersive
.harvest-form-card {
    position: relative;

    height: 100%;
    align-self: stretch;

    border-radius: 28px;

    background: rgba(255,255,255,.94);

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    box-shadow:
        0 22px 55px rgba(20,65,43,.13);
}


/* ==========================
   RESPONSIVE
   ========================== */

@media (max-width: 1050px) {

    .harvest-form-layout--immersive {
        grid-template-columns: 1fr;
        padding: 28px;
    }

    .harvest-form-layout--immersive::before {
        width: 100%;
        height: 580px;

        -webkit-mask-image:
            linear-gradient(
                180deg,
                #000 0%,
                #000 68%,
                transparent 100%
            );

        mask-image:
            linear-gradient(
                180deg,
                #000 0%,
                #000 68%,
                transparent 100%
            );
    }

    .harvest-form-layout--immersive::after {
        background:
            linear-gradient(
                180deg,
                rgba(255,255,255,.10) 0%,
                rgba(255,255,255,.16) 52%,
                #eff8f3 75%
            );
    }

    .harvest-form-layout--immersive
    .harvest-form-intro--farm-image {
        min-height: 510px;
    }
}

@media (max-width: 680px) {

    .harvest-form-layout--immersive {
        padding: 20px;
        gap: 22px;
    }

    .harvest-form-layout--immersive
    .harvest-form-intro--farm-image > h1,
    .harvest-form-layout--immersive
    .harvest-form-intro--farm-image > p,
    .harvest-form-layout--immersive
    .harvest-tip {
        width: 100%;
        max-width: 100%;
    }
}

/* ===== FIN RECOLTE IMMERSIVE V4 ===== */

/* ==========================================================
   NOUVELLE RECOLTE - VERSION MAQUETTE V5
   ========================================================== */

.harvest-form-layout--immersive {
    width: 100%;
    min-height: calc(100vh - 98px);
    margin: 0;
    padding: 28px 34px 34px;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(560px, .95fr);

    gap: 26px;
    align-items: stretch;

    border-radius: 0;

    background:
        linear-gradient(
            90deg,
            #eef7f1 0%,
            #f4f7f1 52%,
            #f2faf6 100%
        );
}


/* PHOTO : GRANDE MOITIE GAUCHE */
.harvest-form-layout--immersive::before {
    inset: 0 auto 0 0;
    width: 57%;
    height: 100%;

    background-size: cover;
    background-position: center center;

    -webkit-mask-image:
        linear-gradient(
            90deg,
            #000 0%,
            #000 84%,
            rgba(0,0,0,.55) 94%,
            transparent 100%
        );

    mask-image:
        linear-gradient(
            90deg,
            #000 0%,
            #000 84%,
            rgba(0,0,0,.55) 94%,
            transparent 100%
        );
}


/* FONDU PLUS DISCRET */
.harvest-form-layout--immersive::after {
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.12) 0%,
            rgba(255,255,255,.04) 43%,
            rgba(240,248,243,.25) 52%,
            rgba(240,248,243,.95) 61%,
            #f2faf6 72%
        );
}


/* =========================
   COLONNE GAUCHE
   ========================= */

.harvest-form-layout--immersive
.harvest-form-intro--farm-image {
    min-height: calc(100vh - 160px);

    padding:
        34px
        26px
        28px
        20px;

    justify-content: flex-start;
}


/* TITRE EN HAUT A GAUCHE */
.harvest-form-layout--immersive
.harvest-form-intro--farm-image > h1 {
    width: 360px;
    max-width: 48%;

    margin: 28px 0 14px;

    font-size: clamp(3rem, 4vw, 4.8rem);
    line-height: .95;

    color: #073f2d;

    text-shadow:
        0 1px 2px rgba(255,255,255,1),
        0 0 18px rgba(255,255,255,.95);
}


/* DESCRIPTION */
.harvest-form-layout--immersive
.harvest-form-intro--farm-image > p {
    width: 340px;
    max-width: 47%;

    color: #173f31;
    font-size: 1rem;
    line-height: 1.55;

    text-shadow:
        0 1px 2px rgba(255,255,255,1),
        0 0 15px rgba(255,255,255,.95);
}


/* BLOC CONSEIL EN BAS GAUCHE */
.harvest-form-layout--immersive
.harvest-tip {
    width: 380px;
    max-width: 48%;

    margin-top: auto;
    margin-bottom: 18px;

    background: rgba(255,255,255,.90);
}


/* =========================
   FORMULAIRE DROITE
   ========================= */

.harvest-form-layout--immersive
.harvest-form-card {
    width: 100%;
    max-width: 700px;

    justify-self: center;
    align-self: stretch;

    margin: 0;

    border-radius: 28px;

    background: rgba(255,255,255,.96);

    box-shadow:
        0 20px 48px rgba(20,65,43,.10);
}


/* TABLETTE */
@media (max-width: 1050px) {

    .harvest-form-layout--immersive {
        grid-template-columns: 1fr;
        padding: 24px;
    }

    .harvest-form-layout--immersive::before {
        width: 100%;
        height: 570px;
    }

    .harvest-form-layout--immersive
    .harvest-form-intro--farm-image {
        min-height: 520px;
    }

    .harvest-form-layout--immersive
    .harvest-form-intro--farm-image > h1,
    .harvest-form-layout--immersive
    .harvest-form-intro--farm-image > p,
    .harvest-form-layout--immersive
    .harvest-tip {
        max-width: 70%;
    }
}

/* ===== FIN NOUVELLE RECOLTE V5 ===== */

/* ==========================================================
   NOUVELLE RECOLTE - COMPOSITION MAQUETTE V6
   ========================================================== */

.harvest-form-page {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    overflow: hidden;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            transparent 46%,
            rgba(240,248,244,.72) 52%,
            #f4faf7 59%,
            #f4faf7 100%
        );
}

/* La photo commence TOUT EN HAUT */
.harvest-form-page::before {
    content: "";
    position: absolute;
    z-index: -2;

    left: 0;
    top: 0;
    bottom: 0;

    width: 53%;

    background-image: var(--hero-image);
    background-size: cover;
    background-position: 58% center;
    background-repeat: no-repeat;
}

/* Fondu doux entre photo et formulaire */
.harvest-form-page::after {
    content: "";
    position: absolute;
    z-index: -1;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(236,248,246,.12) 0%,
            rgba(236,248,246,.08) 40%,
            rgba(241,249,245,.30) 48%,
            rgba(244,250,247,.92) 56%,
            #f4faf7 64%
        );

    pointer-events: none;
}


/* HEADER INTEGRE A LA COMPOSITION */
.harvest-form-page > .farm-dashboard__header {
    position: relative;
    z-index: 5;

    max-width: 1380px;
    margin: 0 auto;
    padding: 24px 34px 10px;

    background: transparent;
}

/* Logo directement au-dessus de la photo */
.harvest-form-page .farm-dashboard__brand {
    background: transparent;
    box-shadow: none;
}

/* Bouton Récoltes conservé à droite */
.harvest-form-page > .farm-dashboard__header
.dashboard-header-button {
    background: rgba(255,255,255,.90);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}


/* CONTENU PRINCIPAL */
.harvest-form-page
.harvest-form-layout--immersive {
    position: relative;

    width: min(calc(100% - 68px), 1380px);
    min-height: calc(100vh - 100px);

    margin: 0 auto;
    padding: 16px 0 32px;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(540px, .98fr);

    gap: 42px;
    align-items: stretch;

    background: transparent;
}


/* On désactive l'ancien fond photo du layout */
.harvest-form-layout--immersive::before,
.harvest-form-layout--immersive::after {
    display: none;
}


/* GAUCHE : aucun cadre */
.harvest-form-page
.harvest-form-intro--farm-image {
    min-height: 620px;

    padding: 28px 20px 30px 0;

    display: flex;
    flex-direction: column;

    border: 0;
    border-radius: 0;

    background: transparent !important;
    box-shadow: none !important;
}


/* Le texte reste à gauche du récolteur */
.harvest-form-page
.harvest-form-intro--farm-image > h1 {
    width: 340px;
    max-width: 52%;

    margin: 26px 0 12px;
    padding: 0;

    color: #073f2d;
    font-size: clamp(3rem, 4vw, 4.5rem);
    line-height: .96;

    background: transparent !important;

    text-shadow:
        0 2px 2px rgba(255,255,255,.98),
        0 0 20px rgba(255,255,255,.90);
}

.harvest-form-page
.harvest-form-intro--farm-image > p {
    width: 340px;
    max-width: 52%;

    margin: 0;
    padding: 0;

    color: #173f31;
    font-weight: 650;
    line-height: 1.55;

    background: transparent !important;

    text-shadow:
        0 1px 2px #fff,
        0 0 15px rgba(255,255,255,.95);
}


/* Conseil en bas à gauche */
.harvest-form-page .harvest-tip {
    width: 390px;
    max-width: 56%;

    margin-top: auto;
    margin-bottom: 18px;

    background: rgba(255,255,255,.90);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);

    box-shadow: 0 12px 28px rgba(20,65,43,.12);
}


/* FORMULAIRE DROIT */
.harvest-form-page .harvest-form-card {
    width: 100%;
    max-width: 670px;

    justify-self: end;
    align-self: stretch;

    background: rgba(255,255,255,.96);

    border-radius: 26px;

    box-shadow:
        0 18px 45px rgba(20,65,43,.10);
}


/* MOBILE / TABLETTE */
@media (max-width: 1050px) {

    .harvest-form-page::before {
        width: 100%;
        height: 560px;
        bottom: auto;
    }

    .harvest-form-page::after {
        background:
            linear-gradient(
                180deg,
                rgba(255,255,255,.06) 0%,
                rgba(244,250,247,.20) 45%,
                #f4faf7 62%
            );
    }

    .harvest-form-page
    .harvest-form-layout--immersive {
        grid-template-columns: 1fr;
        width: min(calc(100% - 36px), 900px);
    }

    .harvest-form-page
    .harvest-form-intro--farm-image {
        min-height: 500px;
    }

    .harvest-form-page .harvest-form-card {
        max-width: none;
    }
}

/* ===== FIN VERSION MAQUETTE V6 ===== */

/* ==========================================================
   NOUVELLE RECOLTE - FOND GLOBAL COMME MAQUETTE V7
   ========================================================== */

.harvest-form-page {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    overflow: hidden;
    background: #f4faf7;
}

/* L'IMAGE COUVRE TOUTE LA PAGE :
   logo + contenu + bouton Récoltes */
.harvest-form-page::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0;

    width: 100%;
    height: 100%;

    background-image: var(--hero-image);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

/* Fondu uniquement vers la droite derrière le formulaire */
.harvest-form-page::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(246,250,244,.08) 0%,
            rgba(246,250,244,.08) 43%,
            rgba(246,250,244,.22) 50%,
            rgba(246,250,244,.68) 60%,
            rgba(246,250,244,.94) 72%,
            rgba(246,250,244,.97) 100%
        );

    pointer-events: none;
}

/* Header et contenu passent DEVANT l'image */
.harvest-form-page > .farm-dashboard__header,
.harvest-form-page > .harvest-form-layout--immersive {
    position: relative;
    z-index: 2;
}


/* HEADER SUR L'IMAGE */
.harvest-form-page > .farm-dashboard__header {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 18px 28px 10px;
    background: transparent;
}

.harvest-form-page .farm-dashboard__brand {
    padding: 7px 11px 7px 7px;
    border-radius: 16px;
    background: rgba(255,255,255,.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: 0 8px 24px rgba(20,65,43,.10);
}

.harvest-form-page
.farm-dashboard__header .dashboard-header-button {
    background: rgba(255,255,255,.88);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}


/* CONTENU */
.harvest-form-page
.harvest-form-layout--immersive {
    width: 100%;
    max-width: none;

    min-height: calc(100vh - 78px);

    margin: 0;
    padding: 10px 28px 28px;

    display: grid;
    grid-template-columns: 50% 50%;
    gap: 0;

    background: transparent !important;
}

/* Désactivation définitive des anciens fonds internes */
.harvest-form-layout--immersive::before,
.harvest-form-layout--immersive::after {
    display: none !important;
}


/* GAUCHE */
.harvest-form-page
.harvest-form-intro--farm-image {
    min-height: calc(100vh - 120px);
    padding: 30px 36px 32px 0;

    display: flex;
    flex-direction: column;

    background: transparent !important;
    border: 0;
    border-radius: 0;
    box-shadow: none !important;
}

.harvest-form-page
.harvest-form-intro--farm-image > h1 {
    width: 330px;
    max-width: 48%;

    margin: 24px 0 10px;
    padding: 0;

    color: #073f2d;
    font-size: clamp(3rem, 4vw, 4.6rem);
    line-height: .95;

    background: transparent !important;

    text-shadow:
        0 1px 2px rgba(255,255,255,1),
        0 0 20px rgba(255,255,255,.96);
}

.harvest-form-page
.harvest-form-intro--farm-image > p {
    width: 330px;
    max-width: 48%;
    padding: 0;

    color: #173f31;
    font-weight: 650;

    background: transparent !important;

    text-shadow:
        0 1px 2px #fff,
        0 0 14px rgba(255,255,255,.95);
}


/* CONSEIL EN BAS */
.harvest-form-page .harvest-tip {
    width: 390px;
    max-width: 54%;

    margin-top: auto;
    margin-bottom: 20px;

    background: rgba(255,255,255,.90);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}


/* FORMULAIRE DROITE */
.harvest-form-page .harvest-form-card {
    width: calc(100% - 40px);
    max-width: 680px;

    margin: 8px auto 0;
    justify-self: center;
    align-self: stretch;

    background: rgba(255,255,255,.95);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    border-radius: 26px;

    box-shadow:
        0 18px 44px rgba(20,65,43,.11);
}

@media (max-width: 1000px) {

    .harvest-form-page
    .harvest-form-layout--immersive {
        grid-template-columns: 1fr;
    }

    .harvest-form-page::after {
        background:
            linear-gradient(
                180deg,
                rgba(255,255,255,.08) 0%,
                rgba(244,250,247,.22) 48%,
                #f4faf7 67%
            );
    }

    .harvest-form-page
    .harvest-form-intro--farm-image {
        min-height: 520px;
    }

    .harvest-form-page .harvest-form-card {
        width: 100%;
        max-width: none;
    }
}

/* ===== FIN FOND GLOBAL RECOLTE V7 ===== */

/* ==========================================================
   RECOLTE - RETOUR VERSION 2
   ========================================================== */

.harvest-form-layout {
    width: min(calc(100% - 48px), 1320px) !important;
    margin: 34px auto 55px !important;
    padding: 0 !important;

    display: grid !important;
    grid-template-columns:
        minmax(0, .92fr)
        minmax(500px, 1.08fr) !important;

    gap: 30px !important;
    align-items: stretch !important;

    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.harvest-form-layout .harvest-form-intro--farm-image {
    min-height: 650px !important;
    height: 100% !important;

    padding: 34px 32px !important;

    display: flex !important;
    flex-direction: column !important;

    border-radius: 28px !important;

    background-image:
        linear-gradient(
            180deg,
            rgba(255,255,255,.08),
            rgba(255,255,255,.02)
        ),
        var(--hero-image) !important;

    background-size: cover !important;
    background-position: center !important;

    box-shadow:
        0 22px 50px rgba(20,65,43,.15) !important;
}

.harvest-form-intro--farm-image .harvest-form-badge {
    width: fit-content;
    padding: 8px 13px;
    border-radius: 999px;
    background: rgba(255,255,255,.88);
}

.harvest-form-intro--farm-image > h1 {
    width: fit-content !important;
    max-width: 90% !important;

    margin-top: 24px !important;
    padding: 12px 16px !important;

    font-size: clamp(2.6rem, 4vw, 4.6rem) !important;
    line-height: .98 !important;

    color: #073f2d !important;

    border-radius: 18px !important;
    background: rgba(255,255,255,.78) !important;
    backdrop-filter: blur(7px);
}

.harvest-form-intro--farm-image > p {
    width: min(92%, 460px) !important;
    max-width: 92% !important;

    margin-top: 14px !important;
    padding: 12px 15px !important;

    color: #315448 !important;
    font-weight: 600 !important;

    border-radius: 15px !important;
    background: rgba(255,255,255,.80) !important;
}

.harvest-form-intro--farm-image .harvest-tip {
    width: min(92%, 440px) !important;
    max-width: 92% !important;

    margin-top: auto !important;
    margin-bottom: 0 !important;

    background: rgba(255,255,255,.91) !important;

    box-shadow:
        0 12px 28px rgba(20,65,43,.12) !important;
}

.harvest-form-layout .harvest-form-card {
    height: 100% !important;
    width: auto !important;
    max-width: none !important;

    margin: 0 !important;
    justify-self: stretch !important;
    align-self: stretch !important;
}

@media (max-width: 980px) {

    .harvest-form-layout {
        grid-template-columns: 1fr !important;
    }

    .harvest-form-layout .harvest-form-intro--farm-image {
        min-height: 560px !important;
    }
}

/* ===== FIN RETOUR VERSION 2 ===== */

/* ==========================================================
   RECOLTE - AJUSTEMENT FIN IMAGE GAUCHE
   Objectif : se rapprocher de la maquette
   ========================================================== */

.harvest-form-layout {
    grid-template-columns:
        minmax(460px, 0.98fr)
        minmax(560px, 1.02fr) !important;
    gap: 22px !important;
}

.harvest-form-layout .harvest-form-intro--farm-image {
    min-height: 690px !important;
    padding: 30px 26px !important;

    /* on agrandit l’image dans son panneau */
    background-size: 122% auto !important;

    /* on pousse un peu le personnage vers le centre */
    background-position: 66% center !important;

    border-radius: 26px !important;
}

/* titre et texte un peu plus contenus à gauche */
.harvest-form-intro--farm-image > h1 {
    max-width: 58% !important;
    margin-top: 18px !important;
}

.harvest-form-intro--farm-image > p {
    width: min(78%, 360px) !important;
    max-width: 78% !important;
}

/* bloc du bas un peu plus compact comme sur la maquette */
.harvest-form-intro--farm-image .harvest-tip {
    width: min(74%, 340px) !important;
    max-width: 74% !important;
    margin-bottom: 8px !important;
}

/* formulaire un peu plus haut et mieux aligné */
.harvest-form-layout .harvest-form-card {
    min-height: 690px !important;
}

/* tablette/mobile */
@media (max-width: 980px) {
    .harvest-form-layout {
        grid-template-columns: 1fr !important;
    }

    .harvest-form-layout .harvest-form-intro--farm-image {
        min-height: 560px !important;
        background-size: cover !important;
        background-position: center !important;
    }

    .harvest-form-layout .harvest-form-card {
        min-height: auto !important;
    }
}

/* ===== FIN AJUSTEMENT FIN IMAGE GAUCHE ===== */


/* ==========================================================
   RECOLTE FORM - VERSION PROPRE FOND GLOBAL
   ========================================================== */

.harvest-form-page-v8 {
    position: relative;
    min-height: 100vh;
    isolation: isolate;
    overflow: hidden;
    background: transparent;
}

/* PHOTO : fond réel de toute la page */
.harvest-form-page-v8 > .harvest-page-bg {
    position: fixed;
    inset: 0;

    width: 100vw;
    height: 100vh;
    max-width: none;

    object-fit: cover;
    object-position: 52% center;

    display: block;
    opacity: 1;

    z-index: 0;
    pointer-events: none;
}

/* Léger éclaircissement côté formulaire */
.harvest-form-page-v8 > .harvest-page-overlay {
    position: fixed;
    inset: 0;
    z-index: 1;

    background: linear-gradient(
        90deg,
        rgba(246,250,243,.08) 0%,
        rgba(246,250,243,.08) 38%,
        rgba(246,250,243,.18) 48%,
        rgba(246,250,243,.55) 60%,
        rgba(246,250,243,.82) 72%,
        rgba(246,250,243,.91) 100%
    );

    pointer-events: none;
}

/* Tout le contenu au-dessus de la photographie */
.harvest-form-page-v8 > .farm-dashboard__header,
.harvest-form-page-v8 > .harvest-form-layout {
    position: relative;
    z-index: 2;
}

/* Le haut fait partie du même visuel */
.harvest-form-page-v8 > .farm-dashboard__header {
    background: transparent !important;
}

/* La partie gauche n'est surtout PAS une carte */
.harvest-form-page-v8 .harvest-form-intro--farm-image {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Titre et texte lisibles directement sur la photo */
.harvest-form-page-v8 .harvest-form-intro--farm-image > h1 {
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    color: #073f2d !important;
    text-shadow:
        0 1px 2px rgba(255,255,255,.95),
        0 0 18px rgba(255,255,255,.85);
}

.harvest-form-page-v8 .harvest-form-intro--farm-image > p {
    background: transparent !important;
    color: #173f31 !important;
    text-shadow:
        0 1px 2px rgba(255,255,255,1),
        0 0 14px rgba(255,255,255,.90);
}

/* Petit encart rendement */
.harvest-form-page-v8 .harvest-tip {
    background: rgba(255,255,255,.88) !important;
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

/* Formulaire posé au-dessus du même paysage */
.harvest-form-page-v8 .harvest-form-card {
    background: rgba(255,255,255,.93) !important;
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
}

/* Bouton retour */
.harvest-form-page-v8 .dashboard-header-button {
    background: rgba(255,255,255,.88) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

@media (max-width: 980px) {
    .harvest-form-page-v8 > .harvest-page-bg {
        object-position: 48% center;
    }
}

/* ===== FIN RECOLTE FORM FOND GLOBAL ===== */

/* ==========================================================
   RECOLTE - AJUSTEMENT FINAL APRES FOND GLOBAL
   ========================================================== */

/* Le paysage reste bien visible sur toute la page */
.harvest-form-page-v8 > .harvest-page-overlay {
    background: linear-gradient(
        90deg,
        rgba(248,250,246,.03) 0%,
        rgba(248,250,246,.03) 45%,
        rgba(248,250,246,.10) 55%,
        rgba(248,250,246,.24) 68%,
        rgba(248,250,246,.38) 82%,
        rgba(248,250,246,.46) 100%
    ) !important;
}

/* Formulaire blanc et parfaitement lisible */
.harvest-form-page-v8 .harvest-form-card {
    opacity: 1 !important;
    background: rgba(255,255,255,.96) !important;
    color: #123f31 !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    box-shadow: 0 22px 55px rgba(20,60,40,.16) !important;
}

/* Toute la colonne gauche redevient visible */
.harvest-form-page-v8 .harvest-form-intro--farm-image {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;

    position: relative !important;
    z-index: 4 !important;

    flex-direction: column !important;
}

/* Badge */
.harvest-form-page-v8 .harvest-form-badge {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: fit-content !important;

    background: rgba(255,255,255,.88) !important;
    backdrop-filter: blur(5px);
}

/* Titre */
.harvest-form-page-v8
.harvest-form-intro--farm-image > h1 {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: fit-content !important;
    max-width: 430px !important;

    margin-top: 22px !important;

    color: #073f2d !important;

    font-size: clamp(3.2rem, 4.8vw, 5rem) !important;
    line-height: .95 !important;

    text-shadow:
        0 2px 3px rgba(255,255,255,1),
        0 0 22px rgba(255,255,255,.95) !important;
}

/* Texte sous le titre */
.harvest-form-page-v8
.harvest-form-intro--farm-image > p {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 390px !important;
    max-width: 90% !important;

    color: #123c2e !important;
    font-weight: 700 !important;

    text-shadow:
        0 1px 2px rgba(255,255,255,1),
        0 0 18px rgba(255,255,255,1) !important;
}

/* Rendement en bas à gauche */
.harvest-form-page-v8 .harvest-tip {
    visibility: visible !important;
    opacity: 1 !important;

    margin-top: auto !important;

    background: rgba(255,255,255,.92) !important;
}

/* Logo et bouton bien visibles */
.harvest-form-page-v8 .farm-dashboard__header {
    position: relative !important;
    z-index: 5 !important;
}

.harvest-form-page-v8 .farm-dashboard__brand {
    visibility: visible !important;
    opacity: 1 !important;
}

/* ===== FIN AJUSTEMENT ===== */

/* ===== RECOLTE - MISE EN PAGE PROCHE MAQUETTE ===== */

/* Header sur toute la largeur */
.harvest-form-page-v8 > .farm-dashboard__header {
    width: calc(100% - 48px) !important;
    max-width: none !important;
    margin: 18px 24px 0 !important;
    padding: 0 !important;
}

/* Logo réellement à gauche / bouton réellement à droite */
.harvest-form-page-v8 .farm-dashboard__brand {
    margin: 0 !important;
}

.harvest-form-page-v8 .dashboard-header-button {
    margin-left: auto !important;
}

/* Grande composition sur toute la page */
.harvest-form-page-v8 > .harvest-form-layout {
    width: calc(100% - 56px) !important;
    max-width: none !important;

    margin: 34px 28px 24px !important;

    grid-template-columns:
        minmax(370px, .80fr)
        minmax(650px, 1.20fr) !important;

    gap: 34px !important;
}

/* Partie texte */
.harvest-form-page-v8 .harvest-form-intro--farm-image {
    padding: 25px 0 20px 0 !important;
}

/* Formulaire beaucoup plus présent comme sur la maquette */
.harvest-form-page-v8 .harvest-form-card {
    width: 100% !important;
    max-width: 760px !important;

    justify-self: end !important;

    padding: 34px 38px !important;

    border-radius: 26px !important;
}

/* Titre mieux placé */
.harvest-form-page-v8
.harvest-form-intro--farm-image > h1 {
    max-width: 390px !important;
    font-size: clamp(3.4rem, 4.4vw, 4.8rem) !important;
}

/* Encart rendement aligné à gauche */
.harvest-form-page-v8 .harvest-tip {
    margin-left: 0 !important;
    max-width: 360px !important;
}

@media (max-width: 1050px) {
    .harvest-form-page-v8 > .harvest-form-layout {
        grid-template-columns: 1fr !important;
    }

    .harvest-form-page-v8 .harvest-form-card {
        max-width: none !important;
    }
}

/* ===== FIN MISE EN PAGE MAQUETTE ===== */

/* ===== RECOLTE FORM - LISIBILITE TEXTES ===== */

/* Logo en haut */
.harvest-form-page-v8 .farm-dashboard__brand {
    padding: 7px 12px 7px 7px !important;
    border-radius: 16px !important;
    background: rgba(255,255,255,.78) !important;
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.harvest-form-page-v8 .farm-dashboard__brand strong {
    color: #063d2b !important;
}

.harvest-form-page-v8 .farm-dashboard__brand small {
    color: #315b4c !important;
    font-weight: 700 !important;
}


/* Grand titre */
.harvest-form-page-v8
.harvest-form-intro--farm-image > h1 {
    width: fit-content !important;
    max-width: 390px !important;

    padding: 10px 17px 13px !important;
    border-radius: 18px !important;

    color: #063d2b !important;
    background: rgba(255,255,255,.80) !important;

    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);

    text-shadow: none !important;
    box-shadow: 0 10px 28px rgba(17,61,42,.10) !important;
}


/* Texte sous le titre */
.harvest-form-page-v8
.harvest-form-intro--farm-image > p {
    width: fit-content !important;
    max-width: 390px !important;

    padding: 10px 14px !important;
    border-radius: 13px !important;

    color: #173f31 !important;
    font-weight: 650 !important;

    background: rgba(255,255,255,.76) !important;

    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);

    text-shadow: none !important;
}


/* Encart rendement un peu plus net */
.harvest-form-page-v8 .harvest-tip {
    background: rgba(255,255,255,.94) !important;
    color: #174536 !important;
}


/* Texte du formulaire */
.harvest-form-page-v8 .harvest-form-card {
    color: #123f31 !important;
}

.harvest-form-page-v8 .harvest-form-card label {
    color: #21483a !important;
    font-weight: 700 !important;
}

/* ===== FIN LISIBILITE TEXTES ===== */

/* ===== RECOLTE FORM - TEXTES PLUS LISIBLES ===== */

/* Titre du formulaire */
.harvest-form-page-v8 .harvest-form-card h2,
.harvest-form-page-v8 .harvest-form-card h3 {
    font-size: 1.55rem !important;
    line-height: 1.2 !important;
}

/* Petit nom exploitation / surtitre */
.harvest-form-page-v8 .harvest-form-card .eyebrow,
.harvest-form-page-v8 .harvest-form-card .section-kicker {
    font-size: .86rem !important;
    font-weight: 800 !important;
}

/* Texte explicatif sous le titre */
.harvest-form-page-v8 .harvest-form-card > p,
.harvest-form-page-v8 .harvest-form-card .form-intro,
.harvest-form-page-v8 .harvest-form-card .form-description {
    font-size: .95rem !important;
    line-height: 1.5 !important;
}

/* Libellés des champs */
.harvest-form-page-v8 .harvest-form-card label {
    font-size: .94rem !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;
}

/* Champs, listes, zones de texte */
.harvest-form-page-v8 .harvest-form-card input,
.harvest-form-page-v8 .harvest-form-card select,
.harvest-form-page-v8 .harvest-form-card textarea {
    font-size: .98rem !important;
}

/* Placeholder */
.harvest-form-page-v8 .harvest-form-card input::placeholder,
.harvest-form-page-v8 .harvest-form-card textarea::placeholder {
    font-size: .95rem !important;
}

/* Petits textes d'aide */
.harvest-form-page-v8 .harvest-form-card small,
.harvest-form-page-v8 .harvest-form-card .form-help,
.harvest-form-page-v8 .harvest-form-card .form-text {
    font-size: .82rem !important;
    line-height: 1.45 !important;
}

/* Boutons */
.harvest-form-page-v8 .harvest-form-card button,
.harvest-form-page-v8 .harvest-form-card .parcel-secondary-button,
.harvest-form-page-v8 .harvest-form-card .harvest-primary-button {
    font-size: .94rem !important;
    font-weight: 750 !important;
}

/* Encart rendement */
.harvest-form-page-v8 .harvest-tip strong {
    font-size: 1rem !important;
}

.harvest-form-page-v8 .harvest-tip p {
    font-size: .86rem !important;
    line-height: 1.45 !important;
}

/* ===== FIN TEXTES PLUS LISIBLES ===== */

/* ===== RECOLTE - EQUILIBRE COLONNE GAUCHE ===== */

.harvest-form-page-v8 .harvest-form-intro--farm-image {
    padding-top: 18px !important;
    padding-bottom: 20px !important;
}

/* Badge */
.harvest-form-page-v8 .harvest-form-badge {
    margin-bottom: 28px !important;
}

/* Titre : plus léger et moins "bloc" */
.harvest-form-page-v8
.harvest-form-intro--farm-image > h1 {
    max-width: 330px !important;

    margin: 0 0 26px !important;
    padding: 12px 16px 15px !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.74) !important;

    box-shadow:
        0 10px 28px rgba(20,55,39,.08) !important;
}

/* Texte explicatif : plus d'air autour */
.harvest-form-page-v8
.harvest-form-intro--farm-image > p {
    width: 330px !important;
    max-width: 88% !important;

    margin: 0 !important;
    padding: 13px 16px !important;

    border-radius: 14px !important;

    background: rgba(255,255,255,.70) !important;

    line-height: 1.55 !important;
}

/* Rendement bien séparé du haut */
.harvest-form-page-v8 .harvest-tip {
    width: 330px !important;
    max-width: 88% !important;

    margin-top: auto !important;
    margin-bottom: 8px !important;

    padding: 18px 20px !important;

    border-radius: 18px !important;
}

/* ===== FIN EQUILIBRE COLONNE GAUCHE ===== */

/* ===== RECOLTE - EQUILIBRE GAUCHE / FORMULAIRE ===== */

.harvest-form-page-v8 > .harvest-form-layout {
    grid-template-columns:
        minmax(430px, .88fr)
        minmax(600px, 1.12fr) !important;

    gap: 16px !important;
}

/* La zone gauche utilise vraiment sa largeur */
.harvest-form-page-v8 .harvest-form-intro--farm-image {
    padding-left: 12px !important;
    padding-right: 8px !important;
}

/* Titre plus large */
.harvest-form-page-v8
.harvest-form-intro--farm-image > h1 {
    width: 400px !important;
    max-width: calc(100% - 10px) !important;

    padding: 13px 18px 16px !important;
}

/* Texte explicatif sur la même largeur */
.harvest-form-page-v8
.harvest-form-intro--farm-image > p {
    width: 400px !important;
    max-width: calc(100% - 10px) !important;

    padding: 14px 18px !important;
}

/* Conseil du bas également plus généreux */
.harvest-form-page-v8 .harvest-tip {
    width: 385px !important;
    max-width: calc(100% - 10px) !important;

    padding: 18px 20px !important;
}

/* Le formulaire se rapproche de la partie gauche */
.harvest-form-page-v8 .harvest-form-card {
    justify-self: stretch !important;
    max-width: none !important;
}

@media (max-width: 1100px) {
    .harvest-form-page-v8 > .harvest-form-layout {
        grid-template-columns:
            minmax(390px, .85fr)
            minmax(540px, 1.15fr) !important;

        gap: 12px !important;
    }

    .harvest-form-page-v8
    .harvest-form-intro--farm-image > h1,
    .harvest-form-page-v8
    .harvest-form-intro--farm-image > p {
        width: 370px !important;
    }

    .harvest-form-page-v8 .harvest-tip {
        width: 355px !important;
    }
}

/* ===== FIN EQUILIBRE ===== */

/* ===== RECOLTE - GAUCHE ENCORE PLUS LARGE ===== */

.harvest-form-page-v8 > .harvest-form-layout {
    grid-template-columns:
        minmax(490px, .95fr)
        minmax(590px, 1.05fr) !important;

    gap: 10px !important;
}

/* Bloc titre */
.harvest-form-page-v8
.harvest-form-intro--farm-image > h1 {
    width: 455px !important;
    max-width: calc(100% - 8px) !important;

    padding: 14px 20px 17px !important;
}

/* Texte explicatif */
.harvest-form-page-v8
.harvest-form-intro--farm-image > p {
    width: 455px !important;
    max-width: calc(100% - 8px) !important;

    padding: 15px 20px !important;
}

/* Rendement */
.harvest-form-page-v8 .harvest-tip {
    width: 430px !important;
    max-width: calc(100% - 8px) !important;

    padding: 19px 22px !important;
}

/* Un peu moins de retrait à gauche */
.harvest-form-page-v8 .harvest-form-intro--farm-image {
    padding-left: 4px !important;
    padding-right: 4px !important;
}

/* Formulaire rapproché */
.harvest-form-page-v8 .harvest-form-card {
    justify-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
}

/* ===== FIN GAUCHE ENCORE PLUS LARGE ===== */

/* ==========================================================
   RECOLTE - LARGEUR GAUCHE + RESPONSIVE MOBILE
   ========================================================== */

/* ===== GRAND ECRAN ===== */

.harvest-form-page-v8 > .harvest-form-layout {
    grid-template-columns:
        minmax(520px, 1fr)
        minmax(580px, 1.03fr) !important;

    gap: 8px !important;
}

/* Toute la colonne gauche est utilisée */
.harvest-form-page-v8 .harvest-form-intro--farm-image {
    padding-left: 0 !important;
    padding-right: 6px !important;
}

/* Titre */
.harvest-form-page-v8
.harvest-form-intro--farm-image > h1 {
    width: 500px !important;
    max-width: calc(100% - 6px) !important;

    padding: 15px 22px 18px !important;
}

/* Texte sous le titre */
.harvest-form-page-v8
.harvest-form-intro--farm-image > p {
    width: 500px !important;
    max-width: calc(100% - 6px) !important;

    padding: 16px 22px !important;

    line-height: 1.55 !important;
}

/* Rendement automatique */
.harvest-form-page-v8 .harvest-tip {
    width: 470px !important;
    max-width: calc(100% - 6px) !important;

    padding: 20px 24px !important;
}

/* Formulaire bien rapproché */
.harvest-form-page-v8 .harvest-form-card {
    width: 100% !important;
    max-width: none !important;

    justify-self: stretch !important;
}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 1180px) {

    .harvest-form-page-v8 > .harvest-form-layout {
        grid-template-columns:
            minmax(440px, .95fr)
            minmax(520px, 1.05fr) !important;

        gap: 10px !important;
    }

    .harvest-form-page-v8
    .harvest-form-intro--farm-image > h1,
    .harvest-form-page-v8
    .harvest-form-intro--farm-image > p {
        width: 420px !important;
    }

    .harvest-form-page-v8 .harvest-tip {
        width: 400px !important;
    }
}


/* ==========================================================
   TELEPHONE / PETITE TABLETTE
   ========================================================== */

@media (max-width: 980px) {

    .harvest-form-page-v8 {
        overflow-x: hidden !important;
    }

    .harvest-form-page-v8 > .farm-dashboard__header {
        width: calc(100% - 24px) !important;
        margin: 12px !important;
    }

    .harvest-form-page-v8 > .harvest-form-layout {
        width: calc(100% - 24px) !important;

        margin: 18px 12px 28px !important;

        display: grid !important;
        grid-template-columns: 1fr !important;

        gap: 22px !important;
    }

    /* Partie image / présentation */
    .harvest-form-page-v8
    .harvest-form-intro--farm-image {
        width: 100% !important;
        min-width: 0 !important;

        min-height: 500px !important;

        padding: 20px 0 !important;
    }

    .harvest-form-page-v8
    .harvest-form-intro--farm-image > h1 {
        width: min(100%, 440px) !important;
        max-width: 100% !important;

        font-size: clamp(2.8rem, 12vw, 4rem) !important;

        padding: 13px 17px 16px !important;
    }

    .harvest-form-page-v8
    .harvest-form-intro--farm-image > p {
        width: min(100%, 440px) !important;
        max-width: 100% !important;

        padding: 13px 17px !important;

        font-size: .98rem !important;
    }

    .harvest-form-page-v8 .harvest-tip {
        width: min(100%, 440px) !important;
        max-width: 100% !important;

        padding: 17px 18px !important;
    }

    /* Formulaire */
    .harvest-form-page-v8 .harvest-form-card {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        padding: 24px 20px !important;

        border-radius: 22px !important;
    }

    /* L'image reste bien cadrée sur le téléphone */
    .harvest-form-page-v8 > .harvest-page-bg {
        object-position: 38% center !important;
    }

    /* Voile légèrement renforcé pour garder le formulaire lisible */
    .harvest-form-page-v8 > .harvest-page-overlay {
        background: rgba(244,249,245,.18) !important;
    }
}


/* ==========================================================
   PETIT TELEPHONE
   ========================================================== */

@media (max-width: 560px) {

    .harvest-form-page-v8
    .harvest-form-intro--farm-image {
        min-height: 460px !important;
    }

    .harvest-form-page-v8
    .harvest-form-intro--farm-image > h1 {
        font-size: clamp(2.5rem, 13vw, 3.4rem) !important;
    }

    .harvest-form-page-v8 .harvest-form-card {
        padding: 21px 16px !important;
    }

    .harvest-form-page-v8 .harvest-form-card input,
    .harvest-form-page-v8 .harvest-form-card select,
    .harvest-form-page-v8 .harvest-form-card textarea {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* ===== FIN LARGEUR + RESPONSIVE ===== */

/* ==========================================================
   RECOLTE - COMPACTAGE VERSION TELEPHONE
   ========================================================== */

@media (max-width: 560px) {

    /* Header plus compact */
    .harvest-form-page-v8 > .farm-dashboard__header {
        width: calc(100% - 24px) !important;
        margin: 10px 12px 0 !important;
        padding: 0 !important;
        gap: 10px !important;
    }

    /* Bouton retour */
    .harvest-form-page-v8 .dashboard-header-button {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        min-height: 42px !important;
    }

    /* Le contenu commence plus vite */
    .harvest-form-page-v8 > .harvest-form-layout {
        width: calc(100% - 24px) !important;
        margin: 18px 12px 22px !important;
        gap: 16px !important;
    }

    /* On supprime la hauteur artificielle de la colonne gauche */
    .harvest-form-page-v8
    .harvest-form-intro--farm-image {
        min-height: 0 !important;
        height: auto !important;
        padding: 8px 0 0 !important;
        gap: 0 !important;
    }

    /* Badge */
    .harvest-form-page-v8 .harvest-form-badge {
        margin: 0 0 14px !important;
    }

    /* Titre */
    .harvest-form-page-v8
    .harvest-form-intro--farm-image > h1 {
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 0 14px !important;
        padding: 12px 16px 14px !important;

        font-size: clamp(2.6rem, 12vw, 3.3rem) !important;
    }

    /* Texte explicatif */
    .harvest-form-page-v8
    .harvest-form-intro--farm-image > p {
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 0 14px !important;
        padding: 13px 16px !important;
    }

    /* Rendement : ne doit plus être repoussé artificiellement en bas */
    .harvest-form-page-v8 .harvest-tip {
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 16px 18px !important;
    }

    /* Formulaire immédiatement après */
    .harvest-form-page-v8 .harvest-form-card {
        margin-top: 0 !important;
        padding: 22px 16px !important;
    }
}

/* ===== FIN COMPACTAGE TELEPHONE ===== */

/* ===== RECOLTE MOBILE - ESPACE ENTRE BLOCS ===== */
@media (max-width: 560px) {

    .harvest-form-page-v8
    .harvest-form-intro--farm-image > p {
        margin-bottom: 12px !important;
    }

    .harvest-form-page-v8 .harvest-tip {
        margin-top: 0 !important;
    }
}
/* ===== FIN ESPACE ENTRE BLOCS ===== */

/* ===== RECOLTE MOBILE - ESPACEMENTS UNIFORMES ===== */
@media (max-width: 560px) {

    .harvest-form-page-v8
    .harvest-form-intro--farm-image {
        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;
    }

    .harvest-form-page-v8 .harvest-form-badge,
    .harvest-form-page-v8
    .harvest-form-intro--farm-image > h1,
    .harvest-form-page-v8
    .harvest-form-intro--farm-image > p,
    .harvest-form-page-v8 .harvest-tip {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
}
/* ===== FIN ESPACEMENTS UNIFORMES ===== */

/* ==========================================================
   IRRIGATION FORM - VERSION VISUELLE COMPLETE
   ========================================================== */

.irrigation-form-page-visual {
    position: relative;
    min-height: 100vh;
    isolation: isolate;
    overflow-x: hidden;
    background: #edf7f4;
}


/* PHOTO DE FOND */

.irrigation-form-page-visual > .irrigation-page-bg {
    position: fixed;
    inset: 0;

    width: 100vw;
    height: 100vh;
    max-width: none;

    object-fit: cover;
    object-position: 48% center;

    display: block;

    z-index: 0;
    pointer-events: none;
}


/* FONDU VERS LE FORMULAIRE */

.irrigation-form-page-visual > .irrigation-page-overlay {
    position: fixed;
    inset: 0;

    z-index: 1;

    background: linear-gradient(
        90deg,
        rgba(244,250,248,.05) 0%,
        rgba(244,250,248,.07) 40%,
        rgba(244,250,248,.20) 52%,
        rgba(244,250,248,.54) 64%,
        rgba(244,250,248,.78) 78%,
        rgba(244,250,248,.88) 100%
    );

    pointer-events: none;
}


/* CONTENU AU-DESSUS */

.irrigation-form-page-visual > .farm-dashboard__header,
.irrigation-form-page-visual > .irrigation-form-layout {
    position: relative;
    z-index: 2;
}


/* HEADER */

.irrigation-form-page-visual > .farm-dashboard__header {
    width: calc(100% - 48px) !important;
    max-width: none !important;

    margin: 18px 24px 0 !important;
    padding: 0 !important;

    background: transparent !important;
}

.irrigation-form-page-visual .farm-dashboard__brand {
    padding: 7px 12px 7px 7px !important;

    border-radius: 16px !important;

    background: rgba(255,255,255,.80) !important;

    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.irrigation-form-page-visual .farm-dashboard__brand strong {
    color: #063d2b !important;
}

.irrigation-form-page-visual .farm-dashboard__brand small {
    color: #315b4c !important;
    font-weight: 700 !important;
}

.irrigation-form-page-visual .dashboard-header-button {
    margin-left: auto !important;

    background: rgba(255,255,255,.88) !important;

    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}


/* GRANDE COMPOSITION */

.irrigation-form-page-visual > .irrigation-form-layout {
    width: calc(100% - 56px) !important;
    max-width: none !important;

    margin: 34px 28px 28px !important;

    display: grid !important;

    grid-template-columns:
        minmax(520px, 1fr)
        minmax(580px, 1.03fr) !important;

    gap: 8px !important;

    align-items: stretch !important;
}


/* COLONNE GAUCHE : PLUS UNE CARTE */

.irrigation-form-page-visual .parcel-form-intro {
    min-height: 680px !important;

    padding: 18px 6px 20px 0 !important;

    display: flex !important;
    flex-direction: column !important;

    background: transparent !important;
    background-image: none !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;
}


/* BADGE */

.irrigation-form-page-visual .irrigation-form-badge {
    width: fit-content !important;

    margin: 0 0 28px !important;
    padding: 8px 14px !important;

    background: rgba(255,255,255,.88) !important;

    border-radius: 999px !important;

    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}


/* TITRE */

.irrigation-form-page-visual
.parcel-form-intro > h1 {
    width: 500px !important;
    max-width: calc(100% - 6px) !important;

    margin: 0 0 24px !important;
    padding: 15px 22px 18px !important;

    color: #063d2b !important;

    font-size: clamp(3.2rem, 4.4vw, 4.8rem) !important;
    line-height: .96 !important;

    background: rgba(255,255,255,.78) !important;

    border-radius: 18px !important;

    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);

    box-shadow: 0 10px 28px rgba(20,55,39,.08) !important;
}


/* TEXTE D'INTRODUCTION */

.irrigation-form-page-visual
.parcel-form-intro > p {
    width: 500px !important;
    max-width: calc(100% - 6px) !important;

    margin: 0 !important;
    padding: 16px 22px !important;

    color: #173f31 !important;

    font-size: 1rem !important;
    font-weight: 650 !important;
    line-height: 1.55 !important;

    background: rgba(255,255,255,.75) !important;

    border-radius: 14px !important;

    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}


/* CONSEIL DU BAS */

.irrigation-form-page-visual .irrigation-tip {
    width: 470px !important;
    max-width: calc(100% - 6px) !important;

    margin-top: auto !important;
    margin-bottom: 8px !important;

    padding: 20px 24px !important;

    color: #174536 !important;

    background: rgba(255,255,255,.93) !important;

    border-radius: 18px !important;

    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);

    box-shadow: 0 12px 28px rgba(20,65,43,.11) !important;
}

.irrigation-form-page-visual .irrigation-tip strong {
    font-size: 1rem !important;
}

.irrigation-form-page-visual .irrigation-tip p {
    font-size: .88rem !important;
    line-height: 1.45 !important;
}


/* FORMULAIRE */

.irrigation-form-page-visual .irrigation-form-card {
    width: 100% !important;
    max-width: none !important;

    min-height: 680px !important;

    padding: 34px 38px !important;

    justify-self: stretch !important;

    color: #123f31 !important;

    background: rgba(255,255,255,.95) !important;

    border-radius: 26px !important;

    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);

    box-shadow: 0 22px 55px rgba(20,60,40,.16) !important;
}


/* TEXTES DU FORMULAIRE */

.irrigation-form-page-visual .irrigation-form-card h2 {
    font-size: 1.55rem !important;
}

.irrigation-form-page-visual .irrigation-form-card label {
    font-size: .94rem !important;
    line-height: 1.35 !important;

    color: #21483a !important;
    font-weight: 750 !important;
}

.irrigation-form-page-visual .irrigation-form-card input,
.irrigation-form-page-visual .irrigation-form-card select,
.irrigation-form-page-visual .irrigation-form-card textarea {
    font-size: .98rem !important;
}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 1180px) {

    .irrigation-form-page-visual > .irrigation-form-layout {
        grid-template-columns:
            minmax(440px, .95fr)
            minmax(520px, 1.05fr) !important;

        gap: 10px !important;
    }

    .irrigation-form-page-visual
    .parcel-form-intro > h1,
    .irrigation-form-page-visual
    .parcel-form-intro > p {
        width: 420px !important;
    }

    .irrigation-form-page-visual .irrigation-tip {
        width: 400px !important;
    }
}


/* ==========================================================
   TELEPHONE / PETITE TABLETTE
   ========================================================== */

@media (max-width: 980px) {

    .irrigation-form-page-visual > .farm-dashboard__header {
        width: calc(100% - 24px) !important;

        margin: 10px 12px 0 !important;

        gap: 10px !important;
    }

    .irrigation-form-page-visual > .irrigation-form-layout {
        width: calc(100% - 24px) !important;

        margin: 18px 12px 26px !important;

        grid-template-columns: 1fr !important;

        gap: 18px !important;
    }

    .irrigation-form-page-visual .parcel-form-intro {
        width: 100% !important;

        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;

        padding: 8px 0 0 !important;

        gap: 14px !important;
    }

    /* Espacement uniforme comme Récoltes */
    .irrigation-form-page-visual .irrigation-form-badge,
    .irrigation-form-page-visual
    .parcel-form-intro > h1,
    .irrigation-form-page-visual
    .parcel-form-intro > p,
    .irrigation-form-page-visual .irrigation-tip {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .irrigation-form-page-visual
    .parcel-form-intro > h1 {
        width: 100% !important;
        max-width: 100% !important;

        padding: 13px 17px 16px !important;

        font-size: clamp(2.6rem, 12vw, 3.5rem) !important;
    }

    .irrigation-form-page-visual
    .parcel-form-intro > p {
        width: 100% !important;
        max-width: 100% !important;

        padding: 13px 17px !important;
    }

    .irrigation-form-page-visual .irrigation-tip {
        width: 100% !important;
        max-width: 100% !important;

        padding: 17px 18px !important;
    }

    .irrigation-form-page-visual .irrigation-form-card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 24px 20px !important;

        border-radius: 22px !important;
    }

    /* Champs en une seule colonne */
    .irrigation-form-page-visual .irrigation-form__row,
    .irrigation-form-page-visual .irrigation-form__volume {
        grid-template-columns: 1fr !important;
    }

    .irrigation-form-page-visual > .irrigation-page-bg {
        object-position: 42% center !important;
    }

    .irrigation-form-page-visual > .irrigation-page-overlay {
        background: rgba(244,249,247,.18) !important;
    }
}


/* ==========================================================
   PETIT TELEPHONE
   ========================================================== */

@media (max-width: 560px) {

    .irrigation-form-page-visual > .irrigation-form-layout {
        gap: 16px !important;
    }

    .irrigation-form-page-visual
    .parcel-form-intro > h1 {
        font-size: clamp(2.5rem, 13vw, 3.3rem) !important;
    }

    .irrigation-form-page-visual .irrigation-form-card {
        padding: 21px 16px !important;
    }

    .irrigation-form-page-visual .irrigation-form-card input,
    .irrigation-form-page-visual .irrigation-form-card select,
    .irrigation-form-page-visual .irrigation-form-card textarea {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* ===== FIN IRRIGATION FORM ===== */

/* ==========================================================
   LIVRAISON FORM - VERSION VISUELLE
   ========================================================== */

.delivery-form-page-visual {
    position: relative !important;
    min-height: 100vh !important;
    isolation: isolate !important;
    overflow-x: hidden !important;
    background: #f6f7f1 !important;
}


/* PHOTO GLOBALE */

.delivery-form-page-visual > .delivery-page-bg {
    position: fixed !important;
    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;

    object-fit: cover !important;
    object-position: 48% center !important;

    display: block !important;

    z-index: 0 !important;
    pointer-events: none !important;
}


/* FONDU VERS LE FORMULAIRE */

.delivery-form-page-visual > .delivery-page-overlay {
    position: fixed !important;
    inset: 0 !important;

    z-index: 1 !important;

    background: linear-gradient(
        90deg,
        rgba(250,248,242,.05) 0%,
        rgba(250,248,242,.06) 39%,
        rgba(250,248,242,.18) 51%,
        rgba(250,248,242,.52) 64%,
        rgba(250,248,242,.80) 78%,
        rgba(250,248,242,.90) 100%
    ) !important;

    pointer-events: none !important;
}


/* CONTENU */

.delivery-form-page-visual > .farm-dashboard__header,
.delivery-form-page-visual > .delivery-form-layout {
    position: relative !important;
    z-index: 2 !important;
}


/* HEADER */

.delivery-form-page-visual > .farm-dashboard__header {
    width: calc(100% - 48px) !important;
    max-width: none !important;

    margin: 18px 24px 0 !important;
    padding: 0 !important;

    background: transparent !important;
}

.delivery-form-page-visual .farm-dashboard__brand {
    padding: 9px 14px !important;
    border-radius: 16px !important;

    background: rgba(255,255,255,.82) !important;

    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.delivery-form-page-visual .farm-dashboard__brand strong {
    color: #063d2b !important;
}

.delivery-form-page-visual .farm-dashboard__brand small {
    color: #315b4c !important;
    font-weight: 700 !important;
}

.delivery-form-page-visual .dashboard-header-button {
    background: rgba(255,255,255,.90) !important;

    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}


/* MISE EN PAGE */

.delivery-form-page-visual > .delivery-form-layout {
    width: calc(100% - 56px) !important;
    max-width: none !important;

    margin: 32px 28px 38px !important;

    display: grid !important;

    grid-template-columns:
        minmax(500px, .95fr)
        minmax(620px, 1.05fr) !important;

    gap: 12px !important;

    align-items: start !important;
}


/* COLONNE GAUCHE */

.delivery-form-page-visual .parcel-form-intro {
    min-height: calc(100vh - 145px) !important;

    padding: 18px 8px 18px 0 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;

    position: sticky !important;
    top: 20px !important;

    background: transparent !important;
    background-image: none !important;

    border: 0 !important;
    box-shadow: none !important;
}


/* BADGE */

.delivery-form-page-visual .delivery-form-badge {
    width: fit-content !important;

    margin: 0 !important;
    padding: 8px 14px !important;

    background: rgba(255,255,255,.89) !important;

    border-radius: 999px !important;

    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}


/* TITRE */

.delivery-form-page-visual
.parcel-form-intro > h1 {
    width: 480px !important;
    max-width: calc(100% - 8px) !important;

    margin: 0 !important;
    padding: 15px 22px 18px !important;

    color: #073f2d !important;

    font-size: clamp(3rem, 4.2vw, 4.6rem) !important;
    line-height: .96 !important;

    background: rgba(255,255,255,.80) !important;

    border-radius: 18px !important;

    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);

    box-shadow: 0 10px 28px rgba(20,55,39,.09) !important;
}


/* TEXTE INTRO */

.delivery-form-page-visual
.parcel-form-intro > p {
    width: 480px !important;
    max-width: calc(100% - 8px) !important;

    margin: 0 !important;
    padding: 15px 20px !important;

    color: #173f31 !important;

    font-size: 1rem !important;
    font-weight: 650 !important;
    line-height: 1.55 !important;

    background: rgba(255,255,255,.76) !important;

    border-radius: 14px !important;

    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}


/* REFERENCE BL */

.delivery-form-page-visual .delivery-reference-preview {
    width: 450px !important;
    max-width: calc(100% - 8px) !important;

    margin: 0 !important;
    padding: 17px 20px !important;

    background: rgba(255,255,255,.90) !important;

    border-radius: 17px !important;

    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}


/* STOCK AUTO */

.delivery-form-page-visual .delivery-tip {
    width: 450px !important;
    max-width: calc(100% - 8px) !important;

    margin: auto 0 0 !important;
    padding: 18px 21px !important;

    background: rgba(255,255,255,.93) !important;

    border-radius: 18px !important;

    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);

    box-shadow: 0 12px 28px rgba(20,65,43,.11) !important;
}

.delivery-form-page-visual .delivery-tip strong {
    font-size: 1rem !important;
}

.delivery-form-page-visual .delivery-tip p {
    font-size: .88rem !important;
    line-height: 1.45 !important;
}


/* GRANDE CARTE FORMULAIRE */

.delivery-form-page-visual .delivery-form-card {
    width: 100% !important;
    max-width: none !important;

    padding: 34px 38px !important;

    background: rgba(255,255,255,.96) !important;

    border-radius: 26px !important;

    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);

    box-shadow: 0 22px 55px rgba(20,60,40,.16) !important;
}


/* LISIBILITE FORMULAIRE */

.delivery-form-page-visual .delivery-form-card h2 {
    font-size: 1.55rem !important;
}

.delivery-form-page-visual .delivery-form-card label {
    font-size: .94rem !important;
    line-height: 1.35 !important;

    color: #21483a !important;
    font-weight: 750 !important;
}

.delivery-form-page-visual .delivery-form-card input,
.delivery-form-page-visual .delivery-form-card select,
.delivery-form-page-visual .delivery-form-card textarea {
    font-size: .98rem !important;
}

.delivery-form-page-visual .delivery-form-section-title strong {
    font-size: 1rem !important;
}

.delivery-form-page-visual .delivery-form-section-title small {
    font-size: .84rem !important;
}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 1180px) {

    .delivery-form-page-visual > .delivery-form-layout {
        grid-template-columns:
            minmax(430px, .92fr)
            minmax(540px, 1.08fr) !important;

        gap: 10px !important;
    }

    .delivery-form-page-visual
    .parcel-form-intro > h1,
    .delivery-form-page-visual
    .parcel-form-intro > p {
        width: 415px !important;
    }

    .delivery-form-page-visual .delivery-reference-preview,
    .delivery-form-page-visual .delivery-tip {
        width: 395px !important;
    }
}


/* ==========================================================
   TELEPHONE / PETITE TABLETTE
   ========================================================== */

@media (max-width: 980px) {

    .delivery-form-page-visual > .farm-dashboard__header {
        width: calc(100% - 24px) !important;
        margin: 10px 12px 0 !important;
    }

    .delivery-form-page-visual .farm-dashboard__header-actions {
        gap: 8px !important;
    }

    .delivery-form-page-visual > .delivery-form-layout {
        width: calc(100% - 24px) !important;

        margin: 18px 12px 26px !important;

        grid-template-columns: 1fr !important;

        gap: 18px !important;
    }

    .delivery-form-page-visual .parcel-form-intro {
        position: relative !important;
        top: auto !important;

        min-height: 0 !important;
        height: auto !important;

        padding: 8px 0 0 !important;

        gap: 14px !important;
    }

    /* ESPACEMENTS IDENTIQUES */
    .delivery-form-page-visual .delivery-form-badge,
    .delivery-form-page-visual
    .parcel-form-intro > h1,
    .delivery-form-page-visual
    .parcel-form-intro > p,
    .delivery-form-page-visual .delivery-reference-preview,
    .delivery-form-page-visual .delivery-tip {
        margin: 0 !important;
    }

    .delivery-form-page-visual
    .parcel-form-intro > h1,
    .delivery-form-page-visual
    .parcel-form-intro > p,
    .delivery-form-page-visual .delivery-reference-preview,
    .delivery-form-page-visual .delivery-tip {
        width: 100% !important;
        max-width: 100% !important;
    }

    .delivery-form-page-visual
    .parcel-form-intro > h1 {
        padding: 13px 17px 16px !important;

        font-size: clamp(2.5rem, 11vw, 3.4rem) !important;
    }

    .delivery-form-page-visual
    .parcel-form-intro > p {
        padding: 13px 17px !important;
    }

    .delivery-form-page-visual .delivery-reference-preview,
    .delivery-form-page-visual .delivery-tip {
        padding: 16px 18px !important;
    }

    .delivery-form-page-visual .delivery-form-card {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        padding: 24px 20px !important;

        border-radius: 22px !important;
    }

    /* Deux colonnes deviennent une seule */
    .delivery-form-page-visual .delivery-form__row,
    .delivery-form-page-visual .delivery-commercial-grid {
        grid-template-columns: 1fr !important;
    }

    .delivery-form-page-visual .delivery-client-row {
        grid-template-columns: 1fr !important;
    }

    .delivery-form-page-visual > .delivery-page-bg {
        object-position: 42% center !important;
    }

    .delivery-form-page-visual > .delivery-page-overlay {
        background: rgba(250,248,242,.18) !important;
    }
}


/* ==========================================================
   PETIT TELEPHONE
   ========================================================== */

@media (max-width: 560px) {

    .delivery-form-page-visual > .delivery-form-layout {
        gap: 16px !important;
    }

    .delivery-form-page-visual
    .parcel-form-intro > h1 {
        font-size: clamp(2.45rem, 12vw, 3.2rem) !important;
    }

    .delivery-form-page-visual .delivery-form-card {
        padding: 21px 16px !important;
    }

    .delivery-form-page-visual .delivery-form-card input,
    .delivery-form-page-visual .delivery-form-card select,
    .delivery-form-page-visual .delivery-form-card textarea {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* boutons du header utilisables sur petit écran */
    .delivery-form-page-visual
    .farm-dashboard__header-actions {
        flex-wrap: wrap !important;
        justify-content: flex-end !important;
    }
}

/* ===== FIN LIVRAISON FORM VISUEL ===== */

/* ==========================================================
   STOCK ARTICLE FORM - VISUEL
   ========================================================== */

.stock-form-page-visual {
    position: relative;
    min-height: 100vh;
    isolation: isolate;
    overflow-x: hidden;
    background: #f3f7f1;
}

.stock-form-page-visual > .stock-page-bg {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    max-width: none;
    object-fit: cover;
    object-position: center;
    z-index: 0;
    pointer-events: none;
}

.stock-form-page-visual > .stock-page-overlay {
    position: fixed;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
        90deg,
        rgba(248,250,244,.05) 0%,
        rgba(248,250,244,.06) 40%,
        rgba(248,250,244,.18) 52%,
        rgba(248,250,244,.55) 65%,
        rgba(248,250,244,.88) 100%
    );
    pointer-events: none;
}

.stock-form-page-visual > .farm-dashboard__header,
.stock-form-page-visual > .stock-form-layout {
    position: relative;
    z-index: 2;
}

.stock-form-page-visual > .farm-dashboard__header {
    width: calc(100% - 48px) !important;
    max-width: none !important;
    margin: 18px 24px 0 !important;
    background: transparent !important;
}

.stock-form-page-visual .farm-dashboard__brand,
.stock-form-page-visual .dashboard-header-button {
    background: rgba(255,255,255,.88) !important;
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.stock-form-page-visual > .stock-form-layout {
    width: calc(100% - 56px) !important;
    max-width: none !important;
    margin: 32px 28px 30px !important;

    grid-template-columns:
        minmax(500px, 1fr)
        minmax(580px, 1.03fr) !important;

    gap: 10px !important;
}

/* ancien visuel intérieur devenu inutile */
.stock-form-page-visual .stock-form-visual {
    display: none !important;
}

.stock-form-page-visual .parcel-form-intro {
    min-height: 650px !important;
    padding: 18px 6px 20px 0 !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.stock-form-page-visual .stock-form-badge {
    width: fit-content !important;
    margin: 0 !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.88) !important;
}

.stock-form-page-visual .parcel-form-intro > h1 {
    width: 490px !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 15px 22px 18px !important;

    font-size: clamp(3rem,4.3vw,4.7rem) !important;
    line-height: .96 !important;
    color: #073f2d !important;

    border-radius: 18px !important;
    background: rgba(255,255,255,.80) !important;
    backdrop-filter: blur(7px);
}

.stock-form-page-visual .parcel-form-intro > p {
    width: 490px !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 15px 20px !important;

    font-size: 1rem !important;
    line-height: 1.55 !important;
    font-weight: 650 !important;

    border-radius: 14px !important;
    background: rgba(255,255,255,.76) !important;
}

.stock-form-page-visual .parcel-form-tip {
    width: 455px !important;
    max-width: 100% !important;
    margin-top: auto !important;
    padding: 18px 21px !important;

    border-radius: 18px !important;
    background: rgba(255,255,255,.94) !important;
}

.stock-form-page-visual .parcel-form-card {
    width: 100% !important;
    max-width: none !important;
    padding: 34px 38px !important;

    border-radius: 26px !important;
    background: rgba(255,255,255,.96) !important;

    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
}

.stock-form-page-visual .parcel-form-card h2 {
    font-size: 1.55rem !important;
}

.stock-form-page-visual .parcel-form-card label {
    font-size: .94rem !important;
    font-weight: 750 !important;
}

.stock-form-page-visual .parcel-form-card input,
.stock-form-page-visual .parcel-form-card select {
    font-size: .98rem !important;
}


/* TELEPHONE */

@media (max-width: 980px) {

    .stock-form-page-visual > .farm-dashboard__header {
        width: calc(100% - 24px) !important;
        margin: 10px 12px 0 !important;
    }

    .stock-form-page-visual > .stock-form-layout {
        width: calc(100% - 24px) !important;
        margin: 18px 12px 26px !important;

        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .stock-form-page-visual .parcel-form-intro {
        min-height: 0 !important;
        padding: 8px 0 0 !important;
        gap: 14px !important;
    }

    .stock-form-page-visual .stock-form-badge,
    .stock-form-page-visual .parcel-form-intro > h1,
    .stock-form-page-visual .parcel-form-intro > p,
    .stock-form-page-visual .parcel-form-tip {
        margin: 0 !important;
    }

    .stock-form-page-visual .parcel-form-intro > h1,
    .stock-form-page-visual .parcel-form-intro > p,
    .stock-form-page-visual .parcel-form-tip {
        width: 100% !important;
        max-width: 100% !important;
    }

    .stock-form-page-visual .parcel-form-intro > h1 {
        font-size: clamp(2.5rem,12vw,3.3rem) !important;
    }

    .stock-form-page-visual .parcel-form-card {
        width: 100% !important;
        max-width: 100% !important;
        padding: 22px 18px !important;
    }

    .stock-form-page-visual .stock-form__row {
        grid-template-columns: 1fr !important;
    }

    .stock-form-page-visual > .stock-page-bg {
        object-position: 35% center !important;
    }

    .stock-form-page-visual > .stock-page-overlay {
        background: rgba(246,249,244,.18) !important;
    }
}

/* ===== FIN STOCK ARTICLE FORM ===== */

/* ==========================================================
   STOCK FORM - FINITIONS LOGO / CARTE / BOUTON
   ========================================================== */

/* Logo identique aux autres modules */
.stock-form-page-visual .farm-dashboard__brand {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;

    padding: 7px 13px 7px 7px !important;

    border: 1px solid rgba(255,255,255,.58) !important;
    border-radius: 17px !important;

    background: rgba(255,255,255,.76) !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    box-shadow: 0 8px 24px rgba(20,60,40,.10) !important;
}

.stock-form-page-visual .farm-dashboard__brand .brand__icon {
    display: grid !important;
    place-items: center !important;

    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;

    border-radius: 12px !important;

    background: #16a77a !important;
}

.stock-form-page-visual .farm-dashboard__brand .brand__icon svg {
    width: 25px !important;
    height: 25px !important;

    fill: none !important;
    stroke: #fff !important;
    stroke-width: 2.2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.stock-form-page-visual .farm-dashboard__brand strong {
    color: #063d2b !important;
}

.stock-form-page-visual .farm-dashboard__brand small {
    color: #315b4c !important;
    font-weight: 700 !important;
}


/* Formulaire : moins blanc, paysage légèrement perceptible */
.stock-form-page-visual .parcel-form-card {
    background: rgba(255,255,255,.88) !important;

    border: 1px solid rgba(255,255,255,.62) !important;

    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;

    box-shadow:
        0 22px 55px rgba(20,60,40,.14) !important;
}


/* Bouton Stocks plus présent */
.stock-form-page-visual .dashboard-header-button {
    color: #07553c !important;
    font-weight: 750 !important;

    border: 1px solid rgba(31,137,100,.22) !important;

    background: rgba(255,255,255,.78) !important;

    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;

    box-shadow: 0 8px 22px rgba(20,60,40,.10) !important;
}


/* Mobile : même identité visuelle */
@media (max-width: 560px) {

    .stock-form-page-visual .farm-dashboard__brand {
        padding: 6px 11px 6px 6px !important;
    }

    .stock-form-page-visual .farm-dashboard__brand .brand__icon {
        width: 40px !important;
        height: 40px !important;
        flex-basis: 40px !important;
    }

    .stock-form-page-visual .parcel-form-card {
        background: rgba(255,255,255,.91) !important;
    }
}

/* ===== FIN FINITIONS STOCK ===== */

/* ==========================================================
   STOCK FORM - ALIGNEMENT VISUEL SUR IRRIGATION
   ========================================================== */

/* HEADER : mêmes proportions */
.stock-form-page-visual > .farm-dashboard__header {
    width: calc(100% - 48px) !important;
    max-width: none !important;
    margin: 18px 24px 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

/* Logo identique à Irrigation */
.stock-form-page-visual .farm-dashboard__brand {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;

    padding: 7px 12px 7px 7px !important;
    border-radius: 16px !important;

    background: rgba(255,255,255,.80) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow: none !important;
}

/* Bouton Stocks : même rendu que Irrigation */
.stock-form-page-visual .dashboard-header-button {
    color: #07553c !important;
    font-weight: 750 !important;

    background: rgba(255,255,255,.84) !important;

    border: 1px solid rgba(255,255,255,.60) !important;
    border-radius: 14px !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow: none !important;
}


/* COMPOSITION GENERALE */
.stock-form-page-visual > .stock-form-layout {
    width: calc(100% - 56px) !important;
    max-width: none !important;

    margin: 34px 28px 28px !important;

    grid-template-columns:
        minmax(520px, 1fr)
        minmax(580px, 1.03fr) !important;

    gap: 8px !important;

    align-items: stretch !important;
}


/* COLONNE GAUCHE */
.stock-form-page-visual .parcel-form-intro {
    min-height: 680px !important;

    padding: 18px 6px 20px 0 !important;

    display: flex !important;
    flex-direction: column !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* BADGE */
.stock-form-page-visual .stock-form-badge {
    width: fit-content !important;

    margin: 0 0 28px !important;
    padding: 8px 14px !important;

    border-radius: 999px !important;

    background: rgba(255,255,255,.88) !important;

    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}


/* TITRE : mêmes proportions que Nouvelle irrigation */
.stock-form-page-visual
.parcel-form-intro > h1 {
    width: 500px !important;
    max-width: calc(100% - 6px) !important;

    margin: 0 0 24px !important;
    padding: 15px 22px 18px !important;

    color: #063d2b !important;

    font-size: clamp(3.2rem, 4.4vw, 4.8rem) !important;
    line-height: .96 !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.78) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow: 0 10px 28px rgba(20,55,39,.08) !important;
}


/* TEXTE EXPLICATIF */
.stock-form-page-visual
.parcel-form-intro > p {
    width: 500px !important;
    max-width: calc(100% - 6px) !important;

    margin: 0 !important;
    padding: 16px 22px !important;

    color: #173f31 !important;

    font-size: 1rem !important;
    line-height: 1.55 !important;
    font-weight: 650 !important;

    border-radius: 14px !important;

    background: rgba(255,255,255,.75) !important;

    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}


/* CONSEIL DU BAS */
.stock-form-page-visual .parcel-form-tip {
    width: 470px !important;
    max-width: calc(100% - 6px) !important;

    margin-top: auto !important;
    margin-bottom: 8px !important;

    padding: 20px 24px !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.93) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow: 0 12px 28px rgba(20,65,43,.11) !important;
}


/* FORMULAIRE : même transparence que Irrigation */
.stock-form-page-visual .parcel-form-card {
    width: 100% !important;
    max-width: none !important;

    min-height: 680px !important;

    padding: 34px 38px !important;

    background: rgba(255,255,255,.91) !important;

    border: 1px solid rgba(255,255,255,.58) !important;
    border-radius: 26px !important;

    backdrop-filter: blur(9px) !important;
    -webkit-backdrop-filter: blur(9px) !important;

    box-shadow: 0 22px 55px rgba(20,60,40,.14) !important;
}


/* TEXTE FORMULAIRE */
.stock-form-page-visual .parcel-form-card h2 {
    color: #21483a !important;
    font-size: 1.55rem !important;
}

.stock-form-page-visual .parcel-form-card label {
    color: #21483a !important;
    font-size: .94rem !important;
    font-weight: 750 !important;
}

.stock-form-page-visual .parcel-form-card input,
.stock-form-page-visual .parcel-form-card select {
    font-size: .98rem !important;
}


/* ==========================================================
   TELEPHONE : MEME LOGIQUE QU'IRRIGATION
   ========================================================== */

@media (max-width: 980px) {

    .stock-form-page-visual > .farm-dashboard__header {
        width: calc(100% - 24px) !important;
        margin: 10px 12px 0 !important;
    }

    .stock-form-page-visual > .stock-form-layout {
        width: calc(100% - 24px) !important;

        margin: 18px 12px 26px !important;

        grid-template-columns: 1fr !important;

        gap: 18px !important;
    }

    .stock-form-page-visual .parcel-form-intro {
        min-height: 0 !important;
        height: auto !important;

        padding: 8px 0 0 !important;

        gap: 14px !important;
    }

    /* ESPACES UNIFORMES */
    .stock-form-page-visual .stock-form-badge,
    .stock-form-page-visual .parcel-form-intro > h1,
    .stock-form-page-visual .parcel-form-intro > p,
    .stock-form-page-visual .parcel-form-tip {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .stock-form-page-visual .parcel-form-intro > h1,
    .stock-form-page-visual .parcel-form-intro > p,
    .stock-form-page-visual .parcel-form-tip {
        width: 100% !important;
        max-width: 100% !important;
    }

    .stock-form-page-visual .parcel-form-intro > h1 {
        padding: 13px 17px 16px !important;

        font-size: clamp(2.6rem,12vw,3.5rem) !important;
    }

    .stock-form-page-visual .parcel-form-intro > p {
        padding: 13px 17px !important;
    }

    .stock-form-page-visual .parcel-form-tip {
        padding: 17px 18px !important;
    }

    .stock-form-page-visual .parcel-form-card {
        min-height: 0 !important;

        width: 100% !important;
        max-width: 100% !important;

        padding: 24px 20px !important;

        border-radius: 22px !important;

        background: rgba(255,255,255,.92) !important;
    }

    .stock-form-page-visual .stock-form__row {
        grid-template-columns: 1fr !important;
    }
}


/* PETIT TELEPHONE */

@media (max-width: 560px) {

    .stock-form-page-visual > .stock-form-layout {
        gap: 16px !important;
    }

    .stock-form-page-visual .parcel-form-intro > h1 {
        font-size: clamp(2.5rem,13vw,3.3rem) !important;
    }

    .stock-form-page-visual .parcel-form-card {
        padding: 21px 16px !important;
    }
}

/* ===== FIN ALIGNEMENT STOCK / IRRIGATION ===== */

/* ==========================================================
   LIVRAISON - ALIGNEMENT VISUEL SUR IRRIGATION
   ========================================================== */

/* Logo */
.delivery-form-page-visual .farm-dashboard__brand {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;

    padding: 7px 12px 7px 7px !important;

    border-radius: 16px !important;

    background: rgba(255,255,255,.80) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow: none !important;
}

.delivery-form-page-visual .farm-dashboard__brand .brand__icon {
    display: grid !important;
    place-items: center !important;

    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;

    border-radius: 12px !important;

    background: #16a77a !important;
}

.delivery-form-page-visual .farm-dashboard__brand .brand__icon svg {
    width: 25px !important;
    height: 25px !important;

    fill: none !important;
    stroke: #fff !important;
    stroke-width: 2.2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}


/* Boutons Clients / Livraisons */
.delivery-form-page-visual .dashboard-header-button {
    color: #07553c !important;
    font-weight: 750 !important;

    background: rgba(255,255,255,.84) !important;

    border: 1px solid rgba(255,255,255,.60) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow: none !important;
}


/* Carte formulaire moins blanche */
.delivery-form-page-visual .delivery-form-card {
    background: rgba(255,255,255,.91) !important;

    border: 1px solid rgba(255,255,255,.58) !important;

    backdrop-filter: blur(9px) !important;
    -webkit-backdrop-filter: blur(9px) !important;

    box-shadow:
        0 22px 55px rgba(20,60,40,.14) !important;
}


/* En-tête du formulaire également moins blanc */
.delivery-form-page-visual
.delivery-form-card
.parcel-form-card__heading {
    background: rgba(242,251,247,.72) !important;

    backdrop-filter: blur(5px) !important;
    -webkit-backdrop-filter: blur(5px) !important;
}


/* Mobile */
@media (max-width: 560px) {

    .delivery-form-page-visual .farm-dashboard__brand {
        padding: 6px 11px 6px 6px !important;
    }

    .delivery-form-page-visual .farm-dashboard__brand .brand__icon {
        width: 40px !important;
        height: 40px !important;
        flex-basis: 40px !important;
    }

    .delivery-form-page-visual .delivery-form-card {
        background: rgba(255,255,255,.92) !important;
    }
}

/* ===== FIN ALIGNEMENT LIVRAISON / IRRIGATION ===== */

/* ==========================================================
   LIVRAISON - PROPORTIONS IDENTIQUES A IRRIGATION
   DESKTOP UNIQUEMENT
   ========================================================== */

@media (min-width: 981px) {

    /* Composition plus centrée, comme Irrigation */
    .delivery-form-page-visual > .delivery-form-layout {
        width: min(calc(100% - 56px), 1380px) !important;
        max-width: 1380px !important;

        margin: 34px auto 38px !important;

        grid-template-columns:
            minmax(500px, 1fr)
            minmax(600px, 680px) !important;

        gap: 24px !important;

        align-items: start !important;
    }

    /* Partie gauche */
    .delivery-form-page-visual .parcel-form-intro {
        width: 100% !important;
        max-width: 520px !important;

        min-height: calc(100vh - 150px) !important;

        padding-right: 0 !important;
    }

    .delivery-form-page-visual
    .parcel-form-intro > h1,
    .delivery-form-page-visual
    .parcel-form-intro > p {
        width: 100% !important;
        max-width: 500px !important;
    }

    .delivery-form-page-visual .delivery-reference-preview,
    .delivery-form-page-visual .delivery-tip {
        width: 100% !important;
        max-width: 470px !important;
    }

    /* Formulaire moins massif */
    .delivery-form-page-visual .delivery-form-card {
        width: 100% !important;
        max-width: 680px !important;

        justify-self: end !important;

        padding: 32px 34px !important;

        border-radius: 26px !important;
    }
}

/* ===== FIN PROPORTIONS LIVRAISON ===== */

/* ===== LIVRAISON - ALIGNEMENT HEADER COMME IRRIGATION ===== */

@media (min-width: 981px) {

    .delivery-form-page-visual > .farm-dashboard__header {
        width: min(calc(100% - 56px), 1380px) !important;
        max-width: 1380px !important;

        margin: 18px auto 0 !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    .delivery-form-page-visual .farm-dashboard__brand {
        margin: 0 !important;
    }

    .delivery-form-page-visual .farm-dashboard__header-actions {
        margin-left: auto !important;
    }
}

/* ===== FIN ALIGNEMENT HEADER ===== */

/* ===== STOCK ARTICLE - HAUTEUR FORMULAIRE AJUSTEE ===== */

@media (min-width: 981px) {

    .stock-form-page-visual .parcel-form-card {
        min-height: 0 !important;
        height: fit-content !important;
        align-self: start !important;

        padding: 34px 38px 32px !important;
    }

    .stock-form-page-visual > .stock-form-layout {
        align-items: start !important;
    }
}

/* ===== FIN AJUSTEMENT HAUTEUR ===== */

/* ==========================================================
   STOCK ARTICLE - EQUILIBRE FINAL DESKTOP
   ========================================================== */

@media (min-width: 981px) {

    /* La composition garde la même structure */
    .stock-form-page-visual > .stock-form-layout {
        align-items: start !important;
    }

    /* Formulaire légèrement descendu pour équilibrer la gauche */
    .stock-form-page-visual .parcel-form-card {
        min-height: 535px !important;
        height: auto !important;

        margin-top: 54px !important;

        padding: 34px 38px 34px !important;

        display: flex !important;
        flex-direction: column !important;
    }

    /* Les actions restent naturellement en bas de la carte */
    .stock-form-page-visual .parcel-form__actions {
        margin-top: auto !important;
        padding-top: 24px !important;
    }
}

/* ===== FIN EQUILIBRE STOCK ARTICLE ===== */

/* ===== STOCK ARTICLE - REMONTEE BLOC SEUIL ===== */

@media (min-width: 981px) {

    .stock-form-page-visual .parcel-form-tip {
        margin-top: 36px !important;
        margin-bottom: 0 !important;
    }

}

/* ===== FIN REMONTEE SEUIL ===== */

/* ==========================================================
   PAGE STOCKS - REFONTE VISUELLE
   ========================================================== */

.stock-page {
    min-height: 100vh !important;

    background:
        radial-gradient(
            circle at 8% 28%,
            rgba(67,161,111,.12),
            transparent 28%
        ),
        radial-gradient(
            circle at 94% 72%,
            rgba(197,145,76,.10),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #f3faf6 0%,
            #fbfaf5 55%,
            #f4f8f4 100%
        ) !important;
}


/* HEADER CENTRE COMME LES AUTRES MODULES */

.stock-page > .farm-dashboard__header {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 20px auto 0 !important;
    padding: 0 !important;
}

.stock-page .farm-dashboard__brand {
    padding: 7px 12px 7px 7px !important;

    border-radius: 16px !important;

    background: rgba(255,255,255,.82) !important;

    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.stock-page .dashboard-header-button {
    background: rgba(255,255,255,.87) !important;

    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}


/* CONTENU */

.stock-page .farm-module-page__content {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin-left: auto !important;
    margin-right: auto !important;
}


/* ==========================================================
   HERO STOCKS
   ========================================================== */

.stock-page .stock-hero--visual {
    position: relative !important;
    overflow: hidden !important;

    min-height: 390px !important;

    padding: 38px 42px !important;

    display: grid !important;
    grid-template-columns:
        minmax(420px, 1fr)
        minmax(400px, .85fr) !important;

    gap: 36px !important;
    align-items: center !important;

    border: 1px solid rgba(255,255,255,.60) !important;
    border-radius: 30px !important;

    background-image:
        linear-gradient(
            90deg,
            rgba(244,249,244,.25) 0%,
            rgba(244,249,244,.16) 46%,
            rgba(244,249,244,.30) 62%,
            rgba(244,249,244,.58) 100%
        ),
        url("/images/stock/hero-stock-form.webp") !important;

    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    box-shadow:
        0 24px 55px rgba(27,66,45,.13) !important;
}


/* TEXTE HERO */

.stock-page
.stock-hero--visual > div:first-child {
    width: min(100%, 520px) !important;

    padding: 24px 26px !important;

    border-radius: 22px !important;

    background: rgba(255,255,255,.78) !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    box-shadow:
        0 12px 30px rgba(20,60,40,.10) !important;
}

.stock-page .stock-badge {
    display: inline-flex !important;
    width: fit-content !important;

    margin-bottom: 18px !important;
    padding: 8px 13px !important;

    border-radius: 999px !important;

    background: rgba(255,255,255,.88) !important;
}

.stock-page .stock-hero h1 {
    margin: 0 0 16px !important;

    color: #063d2b !important;

    font-size: clamp(3.3rem, 5vw, 5.2rem) !important;
    line-height: .95 !important;
}

.stock-page .stock-hero p {
    margin: 0 !important;

    color: #234c3d !important;

    font-size: 1.05rem !important;
    line-height: 1.6 !important;
    font-weight: 650 !important;
}


/* ==========================================================
   COMPTEURS
   ========================================================== */

.stock-page .stock-hero__stats {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;

    gap: 12px !important;

    align-self: center !important;
}

.stock-page .stock-hero__stats > div {
    min-height: 116px !important;

    padding: 18px !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;

    border: 1px solid rgba(255,255,255,.65) !important;
    border-radius: 18px !important;

    background: rgba(255,255,255,.88) !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    box-shadow:
        0 10px 25px rgba(20,60,40,.09) !important;
}

.stock-page .stock-hero__stats span {
    color: #527064 !important;

    font-size: .87rem !important;
    font-weight: 700 !important;
}

.stock-page .stock-hero__stats strong {
    margin-top: 5px !important;

    color: #8c5528 !important;

    font-size: 2rem !important;
    line-height: 1 !important;
}


/* ==========================================================
   SECTION MES ARTICLES
   ========================================================== */

.stock-page .stock-section {
    margin-top: 42px !important;
}

.stock-page .culture-section__heading {
    margin-bottom: 20px !important;
}

.stock-page .culture-section__heading > div > span {
    color: #178563 !important;

    font-size: .82rem !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
}

.stock-page .culture-section__heading h2 {
    color: #073f2d !important;

    font-size: 2rem !important;
}


/* BOUTON AJOUTER */

.stock-page .stock-primary-button {
    padding: 12px 18px !important;

    border-radius: 14px !important;

    box-shadow:
        0 10px 24px rgba(113,72,35,.12) !important;
}


/* ==========================================================
   CARTES ARTICLES
   ========================================================== */

.stock-page .stock-grid {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(260px, 1fr)) !important;

    gap: 20px !important;
}

.stock-page .stock-card {
    padding: 22px !important;

    border-radius: 22px !important;

    background: rgba(255,255,255,.92) !important;

    border: 1px solid rgba(36,116,83,.14) !important;

    box-shadow:
        0 14px 34px rgba(24,66,45,.09) !important;

    transition:
        transform .18s ease,
        box-shadow .18s ease !important;
}

.stock-page .stock-card:hover {
    transform: translateY(-3px);

    box-shadow:
        0 18px 38px rgba(24,66,45,.13) !important;
}


/* CARTE EN ALERTE */

.stock-page .stock-card--alert {
    border-color: rgba(196,101,62,.28) !important;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.96),
            rgba(255,248,243,.96)
        ) !important;
}


/* NOM ARTICLE */

.stock-page .stock-card h3 {
    margin-top: 7px !important;

    color: #073f2d !important;

    font-size: 1.35rem !important;
}


/* SOLDE */

.stock-page .stock-balance {
    margin-top: 18px !important;

    padding: 15px 16px !important;

    border-radius: 16px !important;

    background: rgba(244,235,222,.82) !important;
}

.stock-page .stock-balance span {
    color: #5c625c !important;
}

.stock-page .stock-balance strong {
    color: #814817 !important;

    font-size: 1.55rem !important;
}


/* BOUTONS ENTREE / SORTIE */

.stock-page .stock-card__quick-actions {
    margin-top: 18px !important;

    display: grid !important;
    grid-template-columns: 1fr 1fr !important;

    gap: 8px !important;
}

.stock-page .stock-card__quick-actions a {
    padding: 10px 12px !important;

    text-align: center !important;

    border-radius: 12px !important;

    background: rgba(255,255,255,.88) !important;

    border: 1px solid rgba(30,105,77,.15) !important;
}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 1100px) {

    .stock-page .stock-hero--visual {
        grid-template-columns:
            minmax(360px, 1fr)
            minmax(320px, .85fr) !important;
    }

    .stock-page .stock-grid {
        grid-template-columns:
            repeat(2, minmax(260px, 1fr)) !important;
    }
}


/* ==========================================================
   TELEPHONE
   ========================================================== */

@media (max-width: 760px) {

    .stock-page > .farm-dashboard__header,
    .stock-page .farm-module-page__content {
        width: calc(100% - 24px) !important;
    }

    .stock-page > .farm-dashboard__header {
        margin-top: 12px !important;

        align-items: flex-start !important;

        gap: 12px !important;
    }

    .stock-page .farm-dashboard__header-actions {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: flex-end !important;

        gap: 7px !important;
    }

    .stock-page .stock-hero--visual {
        min-height: auto !important;

        padding: 18px !important;

        grid-template-columns: 1fr !important;

        gap: 16px !important;

        border-radius: 24px !important;

        background-position: 35% center !important;
    }

    .stock-page
    .stock-hero--visual > div:first-child {
        width: 100% !important;

        padding: 18px !important;
    }

    .stock-page .stock-hero h1 {
        font-size: clamp(2.8rem, 14vw, 4rem) !important;
    }

    .stock-page .stock-hero__stats {
        width: 100% !important;

        grid-template-columns: repeat(3, 1fr) !important;

        gap: 7px !important;
    }

    .stock-page .stock-hero__stats > div {
        min-height: 90px !important;

        padding: 10px 8px !important;
    }

    .stock-page .stock-hero__stats span {
        font-size: .72rem !important;
    }

    .stock-page .stock-hero__stats strong {
        font-size: 1.55rem !important;
    }

    .stock-page .culture-section__heading {
        align-items: flex-start !important;
        gap: 14px !important;
    }

    .stock-page .stock-grid {
        grid-template-columns: 1fr !important;
    }
}


/* PETIT TELEPHONE */

@media (max-width: 480px) {

    .stock-page .stock-hero__stats {
        grid-template-columns: 1fr !important;
    }

    .stock-page .stock-hero__stats > div {
        min-height: 72px !important;
    }

    .stock-page .stock-card {
        padding: 18px !important;
    }
}

/* ===== FIN PAGE STOCKS ===== */

/* ===== STOCKS - LISIBILITE BLOC HERO ===== */

.stock-page
.stock-hero--visual > div:first-child {
    background: rgba(255,255,255,.88) !important;

    backdrop-filter: blur(9px) !important;
    -webkit-backdrop-filter: blur(9px) !important;

    border: 1px solid rgba(255,255,255,.72) !important;
}

/* Badge INVENTAIRE */
.stock-page .stock-badge {
    color: #8a572f !important;
    font-size: .88rem !important;
    font-weight: 800 !important;
    letter-spacing: .04em !important;

    background: rgba(255,255,255,.94) !important;
}

/* Grand titre Stocks */
.stock-page .stock-hero h1 {
    color: #053f2d !important;

    font-weight: 850 !important;

    text-shadow: none !important;
}

/* Texte explicatif */
.stock-page .stock-hero p {
    color: #174536 !important;

    font-size: 1.08rem !important;
    font-weight: 700 !important;
    line-height: 1.55 !important;

    opacity: 1 !important;
}

/* ===== FIN LISIBILITE HERO STOCKS ===== */

/* ==========================================================
   MOUVEMENT STOCK - AJUSTEMENTS SUR STRUCTURE STOCK VALIDEE
   ========================================================== */

/* Desktop */
@media (min-width: 981px) {

    .stock-movement-form-page > .stock-form-layout {
        align-items: start !important;
    }

    /* Colonne gauche */
    .stock-movement-form-page .parcel-form-intro {
        min-height: 680px !important;
    }

    .stock-movement-form-page .parcel-form-tip {
        margin-top: 36px !important;
        margin-bottom: 0 !important;
    }

    /* Le formulaire est plus long que "Nouvel article" */
    .stock-movement-form-page .parcel-form-card {
        min-height: 680px !important;
        height: auto !important;

        margin-top: 0 !important;

        align-self: start !important;
    }
}


/* Type de mouvement plus lisible */
.stock-movement-form-page .stock-movement-type {
    margin-top: 4px !important;
}

.stock-movement-form-page .stock-movement-type legend {
    color: #21483a !important;
    font-size: .94rem !important;
    font-weight: 750 !important;
}

.stock-movement-form-page .stock-movement-choice > span {
    background: rgba(255,255,255,.82) !important;
}

.stock-movement-form-page
.stock-movement-choice:has(input:checked) > span {
    background: rgba(225,246,237,.92) !important;
}


/* ==========================================================
   TELEPHONE
   ========================================================== */

@media (max-width: 980px) {

    .stock-movement-form-page .parcel-form-intro {
        min-height: 0 !important;
        height: auto !important;

        gap: 14px !important;
    }

    /* Espacements réguliers */
    .stock-movement-form-page .stock-form-badge,
    .stock-movement-form-page .parcel-form-intro > h1,
    .stock-movement-form-page .parcel-form-intro > p,
    .stock-movement-form-page .parcel-form-tip {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .stock-movement-form-page .parcel-form-card {
        min-height: 0 !important;
        margin-top: 0 !important;
    }

    /* Entrée / Sortie */
    .stock-movement-form-page .stock-movement-type__choices {
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
    }
}


/* Petit téléphone */
@media (max-width: 520px) {

    .stock-movement-form-page .stock-movement-type__choices {
        grid-template-columns: 1fr !important;
    }
}

/* ===== FIN MOUVEMENT STOCK ===== */

/* ==========================================================
   FORMULAIRE PARCELLE - STRUCTURE VISUELLE VALIDEE
   ========================================================== */

.parcel-form-page-visual {
    position: relative !important;
    min-height: 100vh !important;
    isolation: isolate !important;
    overflow-x: hidden !important;

    background: #eef7f2 !important;
}


/* IMAGE PLEINE PAGE */

.parcel-form-page-visual > .parcel-page-bg {
    position: fixed !important;
    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;

    object-fit: cover !important;
    object-position: 48% center !important;

    z-index: 0 !important;
    pointer-events: none !important;
}


/* FONDU VERS LE FORMULAIRE */

.parcel-form-page-visual > .parcel-page-overlay {
    position: fixed !important;
    inset: 0 !important;

    z-index: 1 !important;

    background: linear-gradient(
        90deg,
        rgba(245,250,246,.05) 0%,
        rgba(245,250,246,.06) 40%,
        rgba(245,250,246,.18) 52%,
        rgba(245,250,246,.54) 65%,
        rgba(245,250,246,.84) 100%
    ) !important;

    pointer-events: none !important;
}


/* CONTENU */

.parcel-form-page-visual > .farm-dashboard__header,
.parcel-form-page-visual > .parcel-form-layout {
    position: relative !important;
    z-index: 2 !important;
}


/* HEADER */

.parcel-form-page-visual > .farm-dashboard__header {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 18px auto 0 !important;
    padding: 0 !important;

    background: transparent !important;
}

.parcel-form-page-visual .farm-dashboard__brand {
    padding: 7px 12px 7px 7px !important;

    border-radius: 16px !important;

    background: rgba(255,255,255,.80) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}

.parcel-form-page-visual .dashboard-header-button {
    color: #07553c !important;
    font-weight: 750 !important;

    background: rgba(255,255,255,.84) !important;

    border: 1px solid rgba(255,255,255,.60) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}


/* COMPOSITION */

.parcel-form-page-visual > .parcel-form-layout {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 34px auto 30px !important;

    display: grid !important;

    grid-template-columns:
        minmax(500px, 1fr)
        minmax(560px, 1.03fr) !important;

    gap: 18px !important;

    align-items: start !important;
}


/* COLONNE GAUCHE */

.parcel-form-page-visual .parcel-form-intro {
    min-height: 620px !important;

    padding: 18px 8px 20px 0 !important;

    display: flex !important;
    flex-direction: column !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* BADGE */

.parcel-form-page-visual
.parcel-form-intro .parcel-hero__badge {
    width: fit-content !important;

    margin: 0 0 28px !important;
    padding: 8px 14px !important;

    border-radius: 999px !important;

    background: rgba(255,255,255,.88) !important;

    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}


/* TITRE */

.parcel-form-page-visual
.parcel-form-intro > h1 {
    width: 500px !important;
    max-width: calc(100% - 6px) !important;

    margin: 0 0 24px !important;
    padding: 15px 22px 18px !important;

    color: #063d2b !important;

    font-size: clamp(3.2rem, 4.4vw, 4.8rem) !important;
    line-height: .96 !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.78) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow: 0 10px 28px rgba(20,55,39,.08) !important;
}


/* TEXTE */

.parcel-form-page-visual
.parcel-form-intro > p {
    width: 500px !important;
    max-width: calc(100% - 6px) !important;

    margin: 0 !important;
    padding: 16px 22px !important;

    color: #173f31 !important;

    font-size: 1rem !important;
    line-height: 1.55 !important;
    font-weight: 650 !important;

    border-radius: 14px !important;

    background: rgba(255,255,255,.75) !important;

    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}


/* CONSEIL */

.parcel-form-page-visual .parcel-form-tip {
    width: 470px !important;
    max-width: calc(100% - 6px) !important;

    margin-top: 34px !important;
    margin-bottom: 0 !important;

    padding: 20px 24px !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.93) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow: 0 12px 28px rgba(20,65,43,.11) !important;
}


/* FORMULAIRE */

.parcel-form-page-visual .parcel-form-card {
    width: 100% !important;
    max-width: none !important;

    min-height: 560px !important;

    margin-top: 34px !important;

    padding: 34px 38px !important;

    color: #123f31 !important;

    border: 1px solid rgba(255,255,255,.58) !important;
    border-radius: 26px !important;

    background: rgba(255,255,255,.91) !important;

    backdrop-filter: blur(9px) !important;
    -webkit-backdrop-filter: blur(9px) !important;

    box-shadow:
        0 22px 55px rgba(20,60,40,.14) !important;
}


/* TEXTES FORMULAIRE */

.parcel-form-page-visual .parcel-form-card h2 {
    color: #21483a !important;
    font-size: 1.55rem !important;
}

.parcel-form-page-visual .parcel-form-card label {
    color: #21483a !important;

    font-size: .94rem !important;
    font-weight: 750 !important;
}

.parcel-form-page-visual .parcel-form-card input,
.parcel-form-page-visual .parcel-form-card select {
    font-size: .98rem !important;
}


/* ==========================================================
   TELEPHONE / TABLETTE
   ========================================================== */

@media (max-width: 980px) {

    .parcel-form-page-visual > .farm-dashboard__header {
        width: calc(100% - 24px) !important;

        margin: 10px 12px 0 !important;
    }

    .parcel-form-page-visual > .parcel-form-layout {
        width: calc(100% - 24px) !important;

        margin: 18px 12px 26px !important;

        grid-template-columns: 1fr !important;

        gap: 18px !important;
    }

    .parcel-form-page-visual .parcel-form-intro {
        min-height: 0 !important;
        height: auto !important;

        padding: 8px 0 0 !important;

        gap: 14px !important;
    }

    /* ESPACES IDENTIQUES */
    .parcel-form-page-visual
    .parcel-form-intro .parcel-hero__badge,
    .parcel-form-page-visual
    .parcel-form-intro > h1,
    .parcel-form-page-visual
    .parcel-form-intro > p,
    .parcel-form-page-visual
    .parcel-form-tip {
        margin: 0 !important;
    }

    .parcel-form-page-visual
    .parcel-form-intro > h1,
    .parcel-form-page-visual
    .parcel-form-intro > p,
    .parcel-form-page-visual
    .parcel-form-tip {
        width: 100% !important;
        max-width: 100% !important;
    }

    .parcel-form-page-visual
    .parcel-form-intro > h1 {
        padding: 13px 17px 16px !important;

        font-size: clamp(2.6rem, 12vw, 3.5rem) !important;
    }

    .parcel-form-page-visual
    .parcel-form-intro > p {
        padding: 13px 17px !important;
    }

    .parcel-form-page-visual .parcel-form-tip {
        padding: 17px 18px !important;
    }

    .parcel-form-page-visual .parcel-form-card {
        min-height: 0 !important;

        width: 100% !important;
        max-width: 100% !important;

        margin-top: 0 !important;

        padding: 24px 20px !important;

        border-radius: 22px !important;

        background: rgba(255,255,255,.92) !important;
    }

    .parcel-form-page-visual .parcel-form__row,
    .parcel-form-page-visual .parcel-form__surface {
        grid-template-columns: 1fr !important;
    }

    .parcel-form-page-visual > .parcel-page-bg {
        object-position: 42% center !important;
    }

    .parcel-form-page-visual > .parcel-page-overlay {
        background: rgba(244,249,245,.18) !important;
    }
}


/* PETIT TELEPHONE */

@media (max-width: 560px) {

    .parcel-form-page-visual > .parcel-form-layout {
        gap: 16px !important;
    }

    .parcel-form-page-visual
    .parcel-form-intro > h1 {
        font-size: clamp(2.5rem, 13vw, 3.3rem) !important;
    }

    .parcel-form-page-visual .parcel-form-card {
        padding: 21px 16px !important;
    }

    .parcel-form-page-visual .parcel-form-card input,
    .parcel-form-page-visual .parcel-form-card select {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* ===== FIN FORMULAIRE PARCELLE ===== */

/* ==========================================================
   FORMULAIRE CULTURE - VERSION VISUELLE
   ========================================================== */

.culture-form-page-visual {
    position: relative !important;
    min-height: 100vh !important;
    isolation: isolate !important;
    overflow-x: hidden !important;

    background: #eef7f2 !important;
}


/* IMAGE */

.culture-form-page-visual > .culture-page-bg {
    position: fixed !important;
    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;

    object-fit: cover !important;
    object-position: 48% center !important;

    z-index: 0 !important;
    pointer-events: none !important;
}


/* FONDU */

.culture-form-page-visual > .culture-page-overlay {
    position: fixed !important;
    inset: 0 !important;

    z-index: 1 !important;

    background: linear-gradient(
        90deg,
        rgba(244,249,245,.04) 0%,
        rgba(244,249,245,.05) 42%,
        rgba(244,249,245,.22) 55%,
        rgba(244,249,245,.64) 72%,
        rgba(244,249,245,.88) 100%
    ) !important;

    pointer-events: none !important;
}


/* CONTENU */

.culture-form-page-visual > .farm-dashboard__header,
.culture-form-page-visual > .culture-form-layout {
    position: relative !important;
    z-index: 2 !important;
}


/* HEADER */

.culture-form-page-visual > .farm-dashboard__header {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 18px auto 0 !important;
    padding: 0 !important;

    background: transparent !important;
}

.culture-form-page-visual .farm-dashboard__brand {
    padding: 7px 12px 7px 7px !important;

    border-radius: 16px !important;

    background: rgba(255,255,255,.82) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}

.culture-form-page-visual .dashboard-header-button {
    color: #07553c !important;
    font-weight: 750 !important;

    background: rgba(255,255,255,.86) !important;

    border: 1px solid rgba(255,255,255,.60) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}


/* COMPOSITION */

.culture-form-page-visual > .culture-form-layout {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 34px auto 30px !important;

    display: grid !important;

    grid-template-columns:
        minmax(500px, 1fr)
        minmax(540px, .95fr) !important;

    gap: 24px !important;

    align-items: start !important;
}


/* COLONNE GAUCHE */

.culture-form-page-visual .parcel-form-intro {
    min-height: 600px !important;

    padding: 18px 8px 20px 0 !important;

    display: flex !important;
    flex-direction: column !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* BADGE */

.culture-form-page-visual .culture-form-badge {
    width: fit-content !important;

    margin: 0 0 28px !important;
    padding: 8px 14px !important;

    color: #087355 !important;
    font-weight: 800 !important;

    border-radius: 999px !important;

    background: rgba(255,255,255,.90) !important;

    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}


/* TITRE */

.culture-form-page-visual
.parcel-form-intro > h1 {
    width: 500px !important;
    max-width: calc(100% - 6px) !important;

    margin: 0 0 24px !important;
    padding: 15px 22px 18px !important;

    color: #063d2b !important;

    font-size: clamp(3.2rem, 4.4vw, 4.8rem) !important;
    line-height: .96 !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.80) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow: 0 10px 28px rgba(20,55,39,.08) !important;
}


/* TEXTE */

.culture-form-page-visual
.parcel-form-intro > p {
    width: 500px !important;
    max-width: calc(100% - 6px) !important;

    margin: 0 !important;
    padding: 16px 22px !important;

    color: #173f31 !important;

    font-size: 1rem !important;
    line-height: 1.55 !important;
    font-weight: 650 !important;

    border-radius: 14px !important;

    background: rgba(255,255,255,.77) !important;

    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}


/* CONSEIL */

.culture-form-page-visual .parcel-form-tip {
    width: 470px !important;
    max-width: calc(100% - 6px) !important;

    margin-top: 34px !important;
    margin-bottom: 0 !important;

    padding: 20px 24px !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.93) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow: 0 12px 28px rgba(20,65,43,.11) !important;
}


/* FORMULAIRE */

.culture-form-page-visual .parcel-form-card {
    width: 100% !important;
    max-width: none !important;

    min-height: 470px !important;

    margin-top: 50px !important;
    padding: 34px 38px !important;

    border: 1px solid rgba(255,255,255,.62) !important;
    border-radius: 26px !important;

    background: rgba(255,255,255,.91) !important;

    backdrop-filter: blur(9px) !important;
    -webkit-backdrop-filter: blur(9px) !important;

    box-shadow:
        0 22px 55px rgba(20,60,40,.14) !important;
}

.culture-form-page-visual .parcel-form-card h2 {
    color: #21483a !important;
    font-size: 1.55rem !important;
}

.culture-form-page-visual .parcel-form-card label {
    color: #21483a !important;

    font-size: .94rem !important;
    font-weight: 750 !important;
}

.culture-form-page-visual .parcel-form-card input,
.culture-form-page-visual .parcel-form-card select {
    font-size: .98rem !important;
}


/* ==========================================================
   TELEPHONE / TABLETTE
   ========================================================== */

@media (max-width: 980px) {

    .culture-form-page-visual > .farm-dashboard__header {
        width: calc(100% - 24px) !important;
        margin: 10px 12px 0 !important;
    }

    .culture-form-page-visual > .culture-form-layout {
        width: calc(100% - 24px) !important;

        margin: 18px 12px 26px !important;

        grid-template-columns: 1fr !important;

        gap: 18px !important;
    }

    .culture-form-page-visual .parcel-form-intro {
        min-height: 0 !important;
        height: auto !important;

        padding: 8px 0 0 !important;

        gap: 14px !important;
    }

    .culture-form-page-visual .culture-form-badge,
    .culture-form-page-visual .parcel-form-intro > h1,
    .culture-form-page-visual .parcel-form-intro > p,
    .culture-form-page-visual .parcel-form-tip {
        margin: 0 !important;
    }

    .culture-form-page-visual .parcel-form-intro > h1,
    .culture-form-page-visual .parcel-form-intro > p,
    .culture-form-page-visual .parcel-form-tip {
        width: 100% !important;
        max-width: 100% !important;
    }

    .culture-form-page-visual .parcel-form-intro > h1 {
        padding: 13px 17px 16px !important;

        font-size: clamp(2.6rem, 12vw, 3.5rem) !important;
    }

    .culture-form-page-visual .parcel-form-intro > p {
        padding: 13px 17px !important;
    }

    .culture-form-page-visual .parcel-form-tip {
        padding: 17px 18px !important;
    }

    .culture-form-page-visual .parcel-form-card {
        width: 100% !important;
        max-width: 100% !important;

        min-height: 0 !important;

        margin-top: 0 !important;
        padding: 24px 20px !important;

        border-radius: 22px !important;
    }

    .culture-form-page-visual > .culture-page-bg {
        object-position: 42% center !important;
    }

    .culture-form-page-visual > .culture-page-overlay {
        background: rgba(244,249,245,.18) !important;
    }
}


/* PETIT TELEPHONE */

@media (max-width: 560px) {

    .culture-form-page-visual .parcel-form-card {
        padding: 21px 16px !important;
    }

    .culture-form-page-visual .parcel-form-card input,
    .culture-form-page-visual .parcel-form-card select {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* ===== FIN FORMULAIRE CULTURE ===== */

/* ==========================================================
   NOUVELLE CAMPAGNE - AJUSTEMENTS
   ========================================================== */

@media (min-width: 981px) {

    .culture-campaign-form-page > .culture-form-layout {
        align-items: start !important;
    }

    .culture-campaign-form-page .parcel-form-intro {
        min-height: 690px !important;
    }

    .culture-campaign-form-page .parcel-form-tip {
        margin-top: 34px !important;
    }

    /* Formulaire plus long que Nouvelle culture */
    .culture-campaign-form-page .parcel-form-card {
        min-height: 690px !important;
        height: auto !important;

        margin-top: 0 !important;

        padding: 32px 38px !important;
    }
}


/* Fond légèrement plus lisible côté formulaire */

.culture-campaign-form-page > .culture-page-overlay {
    background: linear-gradient(
        90deg,
        rgba(244,249,245,.03) 0%,
        rgba(244,249,245,.05) 38%,
        rgba(244,249,245,.18) 51%,
        rgba(244,249,245,.58) 66%,
        rgba(244,249,245,.88) 100%
    ) !important;
}


/* TELEPHONE */

@media (max-width: 980px) {

    .culture-campaign-form-page .parcel-form-intro {
        min-height: 0 !important;
    }

    .culture-campaign-form-page .parcel-form-card {
        min-height: 0 !important;
        margin-top: 0 !important;
    }

    .culture-campaign-form-page .culture-form__row {
        grid-template-columns: 1fr !important;
    }

    .culture-campaign-form-page > .culture-page-overlay {
        background: rgba(244,249,245,.18) !important;
    }
}

/* ===== FIN NOUVELLE CAMPAGNE ===== */

/* ==========================================================
   NOUVELLE CAMPAGNE - EQUILIBRE FINAL DESKTOP
   ========================================================== */

@media (min-width: 981px) {

    /* Formulaire légèrement plus compact */
    .culture-campaign-form-page .parcel-form-card {
        min-height: 0 !important;
        height: fit-content !important;

        padding: 28px 32px 26px !important;
    }

    /* Réduction légère des espaces internes */
    .culture-campaign-form-page .parcel-form {
        gap: 14px !important;
    }

    /* Zone notes un peu moins haute */
    .culture-campaign-form-page textarea {
        min-height: 88px !important;
    }

    /* Colonne gauche équilibrée */
    .culture-campaign-form-page .parcel-form-intro {
        min-height: 610px !important;
    }

    /* Descend Historique conservé */
    .culture-campaign-form-page .parcel-form-tip {
        margin-top: 64px !important;
    }
}

/* ===== FIN EQUILIBRE NOUVELLE CAMPAGNE ===== */

/* ==========================================================
   CLIENTS - PAGE PRINCIPALE
   ========================================================== */

.client-index-page {
    min-height: 100vh !important;

    background:
        linear-gradient(
            180deg,
            #f4faf7 0%,
            #fbfaf5 55%,
            #f5f8f5 100%
        ) !important;
}


/* HEADER */

.client-index-page > .farm-dashboard__header {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 20px auto 0 !important;
    padding: 0 !important;
}

.client-index-page .farm-dashboard__brand,
.client-index-page .dashboard-header-button {
    background: rgba(255,255,255,.86) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}

.client-index-page .farm-dashboard__brand {
    padding: 7px 12px 7px 7px !important;
    border-radius: 16px !important;
}


/* CONTENU */

.client-index-page .farm-module-page__content {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin-left: auto !important;
    margin-right: auto !important;
}


/* HERO */

.client-index-page .client-hero {
    position: relative !important;
    overflow: hidden !important;

    min-height: 390px !important;

    padding: 38px 42px !important;

    display: grid !important;
    grid-template-columns:
        minmax(500px, 1fr)
        minmax(280px, .55fr) !important;

    gap: 30px !important;
    align-items: center !important;

    border-radius: 30px !important;

    background-image:
        linear-gradient(
            90deg,
            rgba(244,249,246,.18) 0%,
            rgba(244,249,246,.12) 45%,
            rgba(244,249,246,.34) 68%,
            rgba(244,249,246,.62) 100%
        ),
        url("/images/clients/hero-clients.webp") !important;

    background-size: cover !important;
    background-position: center !important;

    box-shadow:
        0 24px 55px rgba(25,65,46,.13) !important;
}


/* BLOC TEXTE */

.client-index-page
.client-hero > div:first-child {
    width: min(100%, 560px) !important;

    padding: 24px 26px !important;

    border-radius: 22px !important;

    background: rgba(255,255,255,.86) !important;

    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;

    box-shadow:
        0 12px 30px rgba(20,60,40,.10) !important;
}

.client-index-page .client-badge {
    display: inline-flex !important;
    width: fit-content !important;

    margin-bottom: 17px !important;

    background: rgba(255,255,255,.94) !important;
}

.client-index-page .client-hero h1 {
    margin: 0 0 16px !important;

    color: #063d2b !important;

    font-size: clamp(3rem, 4.7vw, 5rem) !important;
    line-height: .98 !important;
}

.client-index-page .client-hero p {
    margin: 0 !important;

    color: #194738 !important;

    font-size: 1.05rem !important;
    line-height: 1.6 !important;
    font-weight: 650 !important;
}


/* COMPTEUR */

.client-index-page .client-hero__stat {
    min-height: 145px !important;

    padding: 24px !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;

    border-radius: 20px !important;

    background: rgba(255,255,255,.90) !important;

    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;

    box-shadow:
        0 12px 28px rgba(20,60,40,.11) !important;
}

.client-index-page .client-hero__stat span {
    color: #587064 !important;
    font-weight: 700 !important;
}

.client-index-page .client-hero__stat strong {
    margin-top: 7px !important;

    color: #925c2c !important;

    font-size: 2.5rem !important;
}


/* SECTION CONTACTS */

.client-index-page .client-section {
    margin-top: 42px !important;
}

.client-index-page .client-grid {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(280px, 1fr)) !important;

    gap: 20px !important;
}


/* CARTES */

.client-index-page .client-card {
    padding: 22px !important;

    border-radius: 22px !important;

    background: rgba(255,255,255,.94) !important;

    border: 1px solid rgba(35,110,80,.13) !important;

    box-shadow:
        0 14px 34px rgba(24,66,45,.09) !important;
}

.client-index-page .client-card h3 {
    color: #073f2d !important;
}

.client-index-page .client-card p {
    color: #52645d !important;
}


/* TABLETTE */

@media (max-width: 1100px) {

    .client-index-page .client-grid {
        grid-template-columns:
            repeat(2, minmax(260px, 1fr)) !important;
    }
}


/* TELEPHONE */

@media (max-width: 760px) {

    .client-index-page > .farm-dashboard__header,
    .client-index-page .farm-module-page__content {
        width: calc(100% - 24px) !important;
    }

    .client-index-page > .farm-dashboard__header {
        margin-top: 12px !important;
        gap: 12px !important;
    }

    .client-index-page .farm-dashboard__header-actions {
        flex-wrap: wrap !important;
        justify-content: flex-end !important;
        gap: 7px !important;
    }

    .client-index-page .client-hero {
        min-height: auto !important;

        padding: 18px !important;

        grid-template-columns: 1fr !important;

        gap: 16px !important;

        border-radius: 24px !important;

        background-position: 42% center !important;
    }

    .client-index-page
    .client-hero > div:first-child {
        width: 100% !important;

        padding: 18px !important;
    }

    .client-index-page .client-hero h1 {
        font-size: clamp(2.7rem, 12vw, 3.8rem) !important;
    }

    .client-index-page .client-hero__stat {
        min-height: 90px !important;
        padding: 15px 18px !important;
    }

    .client-index-page .client-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ===== FIN CLIENTS PAGE PRINCIPALE ===== */

/* ==========================================================
   CLIENTS - FOND DE PAGE PLUS VIVANT
   ========================================================== */

.client-index-page {
    background:
        radial-gradient(
            circle at 8% 28%,
            rgba(71, 170, 126, .16),
            transparent 30%
        ),
        radial-gradient(
            circle at 91% 70%,
            rgba(196, 145, 83, .13),
            transparent 32%
        ),
        linear-gradient(
            180deg,
            #edf8f2 0%,
            #f7f6ec 52%,
            #eef6f1 100%
        ) !important;
}

/* ===== FIN FOND CLIENTS ===== */

/* ==========================================================
   CLIENTS - CORRECTION FOND + POSITION HEADER
   ========================================================== */

/* Fond réellement plus présent */
.farm-module-page.client-page.client-index-page {
    background-color: #eaf5ee !important;

    background-image:
        radial-gradient(
            circle at 10% 35%,
            rgba(61, 166, 112, .24) 0%,
            rgba(61, 166, 112, .10) 28%,
            transparent 48%
        ),
        radial-gradient(
            circle at 88% 68%,
            rgba(205, 159, 91, .22) 0%,
            rgba(205, 159, 91, .09) 30%,
            transparent 50%
        ),
        linear-gradient(
            135deg,
            #e9f6ee 0%,
            #f7f3e7 52%,
            #eaf4ee 100%
        ) !important;

    min-height: 100vh !important;
}


/* Descendre le header */
.client-index-page > .farm-dashboard__header {
    margin-top: 34px !important;
}


/* Téléphone */
@media (max-width: 760px) {

    .client-index-page > .farm-dashboard__header {
        margin-top: 20px !important;
    }
}

/* ===== FIN CORRECTION CLIENTS ===== */

/* CLIENTS - POSITION FINALE DU LOGO */

@media (min-width: 761px) {
    .client-index-page .farm-dashboard__brand {
        transform: translateX(0) translateY(12px) !important;
    }
}

/* ===== FIN POSITION LOGO CLIENTS ===== */

/* CLIENTS - ESPACE ENTRE HEADER ET BANDEAU */

@media (min-width: 761px) {
    .client-index-page .client-hero {
        margin-top: 22px !important;
    }
}

/* ===== FIN ESPACE HEADER CLIENTS ===== */

/* ==========================================================
   CLIENT - FORMULAIRE VISUEL COMPLET
   ========================================================== */

.client-form-page-visual {
    position: relative !important;
    min-height: 100vh !important;

    isolation: isolate !important;
    overflow-x: hidden !important;

    background: #eef6f1 !important;
}


/* IMAGE PLEINE PAGE */

.client-form-page-visual > .client-form-page-bg {
    position: fixed !important;
    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;

    object-fit: cover !important;
    object-position: center !important;

    z-index: 0 !important;
    pointer-events: none !important;
}


/* FONDU */

.client-form-page-visual > .client-form-page-overlay {
    position: fixed !important;
    inset: 0 !important;

    z-index: 1 !important;

    background: linear-gradient(
        90deg,
        rgba(244,249,246,.05) 0%,
        rgba(244,249,246,.06) 39%,
        rgba(244,249,246,.22) 52%,
        rgba(244,249,246,.64) 68%,
        rgba(244,249,246,.90) 100%
    ) !important;

    pointer-events: none !important;
}


/* CONTENU AU-DESSUS DU FOND */

.client-form-page-visual > .farm-dashboard__header,
.client-form-page-visual > .client-form-layout {
    position: relative !important;
    z-index: 2 !important;
}


/* ==========================================================
   HEADER
   ========================================================== */

.client-form-page-visual > .farm-dashboard__header {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 18px auto 0 !important;
    padding: 0 !important;

    background: transparent !important;
}

.client-form-page-visual .farm-dashboard__brand {
    padding: 7px 12px 7px 7px !important;

    border-radius: 16px !important;

    background: rgba(255,255,255,.84) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}

.client-form-page-visual .dashboard-header-button {
    background: rgba(255,255,255,.86) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}


/* ==========================================================
   STRUCTURE GENERALE
   ========================================================== */

.client-form-page-visual > .client-form-layout {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 32px auto 38px !important;

    display: grid !important;

    grid-template-columns:
        minmax(470px, .88fr)
        minmax(650px, 1.12fr) !important;

    gap: 28px !important;

    align-items: start !important;
}


/* ==========================================================
   COLONNE GAUCHE
   ========================================================== */

.client-form-page-visual .parcel-form-intro {
    min-height: 720px !important;

    padding: 16px 8px 20px 0 !important;

    display: flex !important;
    flex-direction: column !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* BADGE */

.client-form-page-visual .client-form-badge {
    width: fit-content !important;

    margin: 0 0 26px !important;
    padding: 8px 14px !important;

    color: #087355 !important;
    font-weight: 800 !important;

    border-radius: 999px !important;

    background: rgba(255,255,255,.91) !important;

    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}


/* TITRE */

.client-form-page-visual
.parcel-form-intro > h1 {
    width: 500px !important;
    max-width: 100% !important;

    margin: 0 0 22px !important;
    padding: 15px 22px 18px !important;

    color: #063d2b !important;

    font-size: clamp(3rem, 4.2vw, 4.6rem) !important;
    line-height: .97 !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.82) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow:
        0 10px 28px rgba(20,55,39,.09) !important;
}


/* TEXTE EXPLICATIF */

.client-form-page-visual
.parcel-form-intro > p {
    width: 500px !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 16px 22px !important;

    color: #173f31 !important;

    font-size: 1rem !important;
    line-height: 1.55 !important;
    font-weight: 650 !important;

    border-radius: 14px !important;

    background: rgba(255,255,255,.78) !important;

    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}


/* ETAT FACTURATION */

.client-form-page-visual .client-billing-readiness {
    width: 480px !important;
    max-width: 100% !important;

    margin-top: 28px !important;

    background: rgba(255,255,255,.92) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow:
        0 12px 28px rgba(20,65,43,.10) !important;
}


/* BLOC FACTURES FIGEES */

.client-form-page-visual .parcel-form-tip {
    width: 470px !important;
    max-width: 100% !important;

    margin-top: 38px !important;
    margin-bottom: 0 !important;

    padding: 19px 22px !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.94) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;

    box-shadow:
        0 12px 28px rgba(20,65,43,.11) !important;
}


/* ==========================================================
   FORMULAIRE
   ========================================================== */

.client-form-page-visual .client-form-card {
    width: 100% !important;
    max-width: none !important;

    margin-top: 0 !important;
    padding: 30px 34px 32px !important;

    border: 1px solid rgba(255,255,255,.62) !important;
    border-radius: 26px !important;

    background: rgba(255,255,255,.91) !important;

    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;

    box-shadow:
        0 22px 55px rgba(20,60,40,.15) !important;
}

.client-form-page-visual .client-form-card h2 {
    color: #21483a !important;
}

.client-form-page-visual .client-form-card label {
    color: #21483a !important;

    font-weight: 750 !important;
}


/* SECTIONS INTERNES */

.client-form-page-visual .client-form-section {
    padding: 20px 0 !important;
}

.client-form-page-visual
.client-form-section + .client-form-section {
    border-top: 1px solid rgba(30,100,70,.10) !important;
}


/* CHAMPS */

.client-form-page-visual .client-form-card input,
.client-form-page-visual .client-form-card select,
.client-form-page-visual .client-form-card textarea {
    background: rgba(255,255,255,.88) !important;
}


/* ==========================================================
   TABLETTE / TELEPHONE
   ========================================================== */

@media (max-width: 980px) {

    .client-form-page-visual > .farm-dashboard__header {
        width: calc(100% - 24px) !important;

        margin: 10px 12px 0 !important;
    }

    .client-form-page-visual > .client-form-layout {
        width: calc(100% - 24px) !important;

        margin: 18px 12px 28px !important;

        grid-template-columns: 1fr !important;

        gap: 18px !important;
    }

    .client-form-page-visual .parcel-form-intro {
        min-height: 0 !important;

        padding: 8px 0 0 !important;

        gap: 14px !important;
    }

    /* Espacement uniforme des blocs */
    .client-form-page-visual .client-form-badge,
    .client-form-page-visual .parcel-form-intro > h1,
    .client-form-page-visual .parcel-form-intro > p,
    .client-form-page-visual .client-billing-readiness,
    .client-form-page-visual .parcel-form-tip {
        margin: 0 !important;
    }

    .client-form-page-visual .parcel-form-intro > h1,
    .client-form-page-visual .parcel-form-intro > p,
    .client-form-page-visual .client-billing-readiness,
    .client-form-page-visual .parcel-form-tip {
        width: 100% !important;
        max-width: 100% !important;
    }

    .client-form-page-visual
    .parcel-form-intro > h1 {
        padding: 13px 17px 16px !important;

        font-size: clamp(2.6rem, 12vw, 3.5rem) !important;
    }

    .client-form-page-visual
    .parcel-form-intro > p {
        padding: 13px 17px !important;
    }

    .client-form-page-visual .client-form-card {
        width: 100% !important;
        max-width: 100% !important;

        margin-top: 0 !important;

        padding: 24px 20px !important;

        border-radius: 22px !important;
    }

    .client-form-page-visual .delivery-form__row {
        grid-template-columns: 1fr !important;
    }

    .client-form-page-visual > .client-form-page-bg {
        object-position: 42% center !important;
    }

    .client-form-page-visual > .client-form-page-overlay {
        background: rgba(244,249,245,.18) !important;
    }
}


/* PETIT TELEPHONE */

@media (max-width: 560px) {

    .client-form-page-visual .client-form-card {
        padding: 20px 16px !important;
    }

    .client-form-page-visual
    .farm-dashboard__header-actions {
        flex-wrap: wrap !important;
        gap: 7px !important;
    }
}

/* ===== FIN FORMULAIRE CLIENT ===== */

/* ==========================================================
   ANIMAUX - PAGE PRINCIPALE
   ========================================================== */

.animal-page {
    min-height: 100vh !important;

    background:
        radial-gradient(
            circle at 8% 30%,
            rgba(185, 126, 78, .18),
            transparent 31%
        ),
        radial-gradient(
            circle at 91% 72%,
            rgba(74, 151, 102, .16),
            transparent 34%
        ),
        linear-gradient(
            135deg,
            #f4eee5 0%,
            #f3f7ea 52%,
            #edf6ef 100%
        ) !important;
}


/* HEADER */

.animal-page > .farm-dashboard__header {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 34px auto 0 !important;
    padding: 0 !important;
}

.animal-page .farm-dashboard__brand {
    padding: 7px 12px 7px 7px !important;

    border-radius: 16px !important;

    background: rgba(255,255,255,.86) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}

.animal-page .dashboard-header-button {
    background: rgba(255,255,255,.86) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}


/* CONTENU */

.animal-page .farm-module-page__content {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin-left: auto !important;
    margin-right: auto !important;
}


/* ==========================================================
   HERO
   ========================================================== */

.animal-page .animal-hero {
    position: relative !important;
    overflow: hidden !important;

    min-height: 390px !important;

    margin-top: 22px !important;
    padding: 38px 42px !important;

    display: grid !important;

    grid-template-columns:
        minmax(500px, 1fr)
        minmax(400px, .82fr) !important;

    gap: 32px !important;
    align-items: center !important;

    border-radius: 30px !important;

    background-image:
        linear-gradient(
            90deg,
            rgba(244,247,238,.15) 0%,
            rgba(244,247,238,.08) 42%,
            rgba(244,247,238,.22) 59%,
            rgba(244,247,238,.58) 100%
        ),
        url("/images/elevage/hero-elevage.webp") !important;

    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    box-shadow:
        0 24px 55px rgba(52,72,48,.14) !important;
}


/* TEXTE HERO */

.animal-page .animal-hero__content {
    width: min(100%, 570px) !important;

    padding: 24px 26px !important;

    border-radius: 22px !important;

    background: rgba(255,255,255,.86) !important;

    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;

    box-shadow:
        0 12px 30px rgba(35,55,39,.10) !important;
}

.animal-page .animal-badge {
    display: inline-flex !important;
    width: fit-content !important;

    margin-bottom: 17px !important;
    padding: 8px 13px !important;

    color: #92552e !important;
    font-weight: 800 !important;

    border-radius: 999px !important;

    background: rgba(255,255,255,.94) !important;
}

.animal-page .animal-hero h1 {
    margin: 0 0 16px !important;

    color: #173f2c !important;

    font-size: clamp(3.1rem, 4.7vw, 5rem) !important;
    line-height: .97 !important;
}

.animal-page .animal-hero p {
    margin: 0 !important;

    color: #315344 !important;

    font-size: 1.05rem !important;
    line-height: 1.6 !important;
    font-weight: 650 !important;
}


/* STATS */

.animal-page .animal-hero__stats {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;

    gap: 11px !important;
}

.animal-page .animal-hero__stats > div {
    min-height: 116px !important;

    padding: 17px 14px !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.90) !important;

    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;

    box-shadow:
        0 10px 25px rgba(35,60,40,.10) !important;
}

.animal-page .animal-hero__stats span {
    color: #607168 !important;

    font-size: .84rem !important;
    font-weight: 700 !important;
}

.animal-page .animal-hero__stats strong {
    margin-top: 6px !important;

    color: #a25f32 !important;

    font-size: 2rem !important;
}


/* ==========================================================
   SECTION
   ========================================================== */

.animal-page .animal-section {
    margin-top: 42px !important;
}

.animal-page .animal-primary-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 12px 18px !important;

    color: #fff !important;
    font-weight: 750 !important;
    text-decoration: none !important;

    border-radius: 14px !important;

    background:
        linear-gradient(
            135deg,
            #b56d3d,
            #94532d
        ) !important;

    box-shadow:
        0 10px 24px rgba(110,66,38,.18) !important;
}


/* EMPTY */

.animal-page .animal-empty {
    padding: 46px 30px !important;

    text-align: center !important;

    border: 1px solid rgba(110,120,85,.13) !important;
    border-radius: 24px !important;

    background: rgba(255,255,255,.88) !important;

    box-shadow:
        0 14px 34px rgba(40,65,45,.08) !important;
}

.animal-page .animal-empty__icon {
    display: block !important;
    margin-bottom: 12px !important;

    font-size: 2.8rem !important;
}

.animal-page .animal-empty h3 {
    color: #173f2c !important;
}

.animal-page .animal-empty p {
    max-width: 620px !important;
    margin: 10px auto 22px !important;

    color: #5a6b61 !important;
}


/* ==========================================================
   CARTES ANIMAUX
   ========================================================== */

.animal-page .animal-grid {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(280px, 1fr)) !important;

    gap: 20px !important;
}

.animal-page .animal-card {
    padding: 22px !important;

    border: 1px solid rgba(102,111,75,.14) !important;
    border-radius: 22px !important;

    background: rgba(255,255,255,.94) !important;

    box-shadow:
        0 14px 34px rgba(40,65,45,.09) !important;
}

.animal-page .animal-card--inactive {
    opacity: .78;
}

.animal-page .animal-card__top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    margin-bottom: 12px !important;
}

.animal-page .animal-card__icon {
    font-size: 2rem !important;
}

.animal-page .animal-status {
    padding: 6px 10px !important;

    border-radius: 999px !important;

    font-size: .76rem !important;
    font-weight: 800 !important;
}

.animal-page .animal-status--active {
    color: #087354 !important;
    background: #e3f6ed !important;
}

.animal-page .animal-status--inactive {
    color: #765c50 !important;
    background: #eee7e1 !important;
}

.animal-page .animal-card__type {
    color: #a05f34 !important;

    font-size: .76rem !important;
    font-weight: 850 !important;
    letter-spacing: .06em !important;
}

.animal-page .animal-card h3 {
    margin: 7px 0 16px !important;

    color: #173f2c !important;

    font-size: 1.35rem !important;
}

.animal-page .animal-card__details {
    display: grid !important;
    gap: 8px !important;
}

.animal-page .animal-card__details p {
    margin: 0 !important;

    display: flex !important;
    justify-content: space-between !important;
    gap: 14px !important;

    color: #637168 !important;
}

.animal-page .animal-card__details strong {
    color: #29483b !important;
    text-align: right !important;
}

.animal-page .animal-headcount {
    margin-top: 18px !important;
    padding: 14px 16px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    border-radius: 15px !important;

    background: #f4eadf !important;
}

.animal-page .animal-headcount span {
    color: #6c665e !important;
    font-weight: 700 !important;
}

.animal-page .animal-headcount strong {
    color: #965a31 !important;
    font-size: 1.65rem !important;
}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 1100px) {

    .animal-page .animal-grid {
        grid-template-columns:
            repeat(2, minmax(260px, 1fr)) !important;
    }

    .animal-page .animal-hero {
        grid-template-columns:
            minmax(400px, 1fr)
            minmax(330px, .8fr) !important;
    }
}


/* ==========================================================
   TELEPHONE
   ========================================================== */

@media (max-width: 760px) {

    .animal-page > .farm-dashboard__header,
    .animal-page .farm-module-page__content {
        width: calc(100% - 24px) !important;
    }

    .animal-page > .farm-dashboard__header {
        margin-top: 18px !important;

        gap: 12px !important;
    }

    .animal-page .farm-dashboard__header-actions {
        flex-wrap: wrap !important;
        justify-content: flex-end !important;

        gap: 7px !important;
    }

    .animal-page .animal-hero {
        min-height: auto !important;

        padding: 18px !important;

        grid-template-columns: 1fr !important;

        gap: 16px !important;

        border-radius: 24px !important;

        background-position: 42% center !important;
    }

    .animal-page .animal-hero__content {
        width: 100% !important;

        padding: 18px !important;
    }

    .animal-page .animal-hero h1 {
        font-size: clamp(2.7rem, 12vw, 3.8rem) !important;
    }

    .animal-page .animal-hero__stats {
        grid-template-columns: repeat(3, 1fr) !important;

        gap: 7px !important;
    }

    .animal-page .animal-hero__stats > div {
        min-height: 88px !important;

        padding: 10px 8px !important;
    }

    .animal-page .animal-hero__stats span {
        font-size: .70rem !important;
    }

    .animal-page .animal-hero__stats strong {
        font-size: 1.5rem !important;
    }

    .animal-page .animal-grid {
        grid-template-columns: 1fr !important;
    }
}


@media (max-width: 480px) {

    .animal-page .animal-hero__stats {
        grid-template-columns: 1fr !important;
    }

    .animal-page .animal-hero__stats > div {
        min-height: 70px !important;
    }
}

/* ===== FIN ANIMAUX PAGE PRINCIPALE ===== */

/* ANIMAUX - LOGO PLUS BAS */

@media (min-width: 761px) {
    .animal-page .farm-dashboard__brand {
        transform: translateY(12px) !important;
    }
}

/* ===== FIN POSITION LOGO ANIMAUX ===== */

/* ANIMAUX - ALIGNEMENT FINAL HEADER */

@media (min-width: 761px) {

    .animal-page .farm-dashboard__brand {
        transform: translateY(20px) !important;
    }

    .animal-page .animal-hero {
        margin-top: 34px !important;
    }
}

/* ===== FIN ALIGNEMENT HEADER ANIMAUX ===== */

/* ==========================================================
   ANIMAUX - FORMULAIRE
   ========================================================== */

.animal-form-page {
    position: relative !important;
    min-height: 100vh !important;
    isolation: isolate !important;
    overflow-x: hidden !important;
}

.animal-form-page__bg {
    position: fixed !important;
    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    object-fit: cover !important;
    object-position: center !important;

    z-index: 0 !important;
}

.animal-form-page__overlay {
    position: fixed !important;
    inset: 0 !important;

    z-index: 1 !important;

    background: linear-gradient(
        90deg,
        rgba(246,247,239,.04) 0%,
        rgba(246,247,239,.08) 40%,
        rgba(246,247,239,.28) 55%,
        rgba(246,247,239,.72) 75%,
        rgba(246,247,239,.92) 100%
    ) !important;
}

.animal-form-page > .farm-dashboard__header,
.animal-form-page > .animal-form-layout {
    position: relative !important;
    z-index: 2 !important;
}


/* HEADER */

.animal-form-page > .farm-dashboard__header {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 30px auto 0 !important;
    padding: 0 !important;
}

.animal-form-page .farm-dashboard__brand {
    padding: 7px 12px 7px 7px !important;

    border-radius: 16px !important;

    background: rgba(255,255,255,.86) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}

.animal-form-page .dashboard-header-button {
    background: rgba(255,255,255,.88) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}


/* STRUCTURE */

.animal-form-layout {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 42px auto 34px !important;

    display: grid !important;

    grid-template-columns:
        minmax(470px, .9fr)
        minmax(650px, 1.1fr) !important;

    gap: 30px !important;

    align-items: start !important;
}


/* GAUCHE */

.animal-form-page .parcel-form-intro {
    min-height: 690px !important;

    padding: 12px 8px 20px 0 !important;

    display: flex !important;
    flex-direction: column !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.animal-form-badge {
    width: fit-content !important;

    margin: 0 0 26px !important;
    padding: 8px 14px !important;

    color: #955b35 !important;
    font-weight: 800 !important;

    border-radius: 999px !important;

    background: rgba(255,255,255,.92) !important;
}

.animal-form-page .parcel-form-intro > h1 {
    width: 500px !important;
    max-width: 100% !important;

    margin: 0 0 22px !important;
    padding: 15px 22px 18px !important;

    color: #173f2c !important;

    font-size: clamp(3rem, 4.2vw, 4.6rem) !important;
    line-height: .97 !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.84) !important;

    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}

.animal-form-page .parcel-form-intro > p {
    width: 500px !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 16px 22px !important;

    color: #315344 !important;

    font-weight: 650 !important;
    line-height: 1.55 !important;

    border-radius: 14px !important;

    background: rgba(255,255,255,.80) !important;
}

.animal-form-page .parcel-form-tip {
    width: 470px !important;
    max-width: 100% !important;

    margin-top: 52px !important;

    background: rgba(255,255,255,.94) !important;
}


/* FORMULAIRE */

.animal-form-card {
    width: 100% !important;
    max-width: none !important;

    margin-top: 0 !important;
    padding: 30px 34px !important;

    border-radius: 26px !important;

    background: rgba(255,255,255,.92) !important;

    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;

    box-shadow:
        0 22px 55px rgba(45,65,42,.15) !important;
}

.animal-form__row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;

    gap: 14px !important;
}

.animal-form-card label {
    color: #29483b !important;
    font-weight: 750 !important;
}

.animal-form-card input,
.animal-form-card select,
.animal-form-card textarea {
    background: rgba(255,255,255,.90) !important;
}

.animal-form-card textarea {
    min-height: 90px !important;
}

.animal-form-card .form-help {
    color: #65736b !important;
    font-size: .78rem !important;
}


/* BOUTON */

.animal-form-page .animal-primary-button {
    padding: 12px 18px !important;

    color: #fff !important;
    font-weight: 750 !important;

    border: 0 !important;
    border-radius: 14px !important;

    background:
        linear-gradient(
            135deg,
            #b56d3d,
            #94532d
        ) !important;
}


/* TELEPHONE */

@media (max-width: 980px) {

    .animal-form-page > .farm-dashboard__header {
        width: calc(100% - 24px) !important;
        margin: 14px 12px 0 !important;
    }

    .animal-form-layout {
        width: calc(100% - 24px) !important;

        margin: 20px 12px 28px !important;

        grid-template-columns: 1fr !important;

        gap: 18px !important;
    }

    .animal-form-page .parcel-form-intro {
        min-height: 0 !important;

        padding: 8px 0 0 !important;

        gap: 14px !important;
    }

    .animal-form-badge,
    .animal-form-page .parcel-form-intro > h1,
    .animal-form-page .parcel-form-intro > p,
    .animal-form-page .parcel-form-tip {
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
    }

    .animal-form-badge {
        width: fit-content !important;
    }

    .animal-form-page .parcel-form-intro > h1 {
        font-size: clamp(2.6rem, 12vw, 3.5rem) !important;
    }

    .animal-form-card {
        padding: 24px 20px !important;
    }

    .animal-form__row {
        grid-template-columns: 1fr !important;
    }

    .animal-form-page__overlay {
        background: rgba(245,248,241,.20) !important;
    }

    .animal-form-page__bg {
        object-position: 42% center !important;
    }
}

@media (max-width: 560px) {

    .animal-form-card {
        padding: 20px 16px !important;
    }
}

/* ===== FIN FORMULAIRE ANIMAUX ===== */

/* ==========================================================
   DOSSIER ANIMAL / LOT
   ========================================================== */

.animal-record-page {
    position: relative !important;
    min-height: 100vh !important;
    isolation: isolate !important;
    overflow-x: hidden !important;
}

.animal-record-page__bg,
.animal-record-page__overlay {
    position: fixed !important;
    inset: 0 !important;

    width: 100vw !important;
    height: 100vh !important;
}

.animal-record-page__bg {
    object-fit: cover !important;
    object-position: center !important;
    z-index: 0 !important;
}

.animal-record-page__overlay {
    z-index: 1 !important;

    background:
        linear-gradient(
            90deg,
            rgba(244,247,238,.12),
            rgba(244,247,238,.44) 48%,
            rgba(244,247,238,.92) 100%
        ) !important;
}

.animal-record-page > .farm-dashboard__header,
.animal-record-layout {
    position: relative !important;
    z-index: 2 !important;
}

.animal-record-page > .farm-dashboard__header {
    width: min(calc(100% - 56px), 1380px) !important;
    max-width: 1380px !important;

    margin: 34px auto 0 !important;
    padding: 0 !important;
}

.animal-record-page .farm-dashboard__brand,
.animal-record-page .dashboard-header-button {
    background: rgba(255,255,255,.88) !important;

    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

.animal-record-page .farm-dashboard__brand {
    padding: 7px 12px 7px 7px !important;
    border-radius: 16px !important;
}


.animal-record-layout {
    width: min(calc(100% - 56px), 1380px) !important;

    margin: 56px auto 38px !important;

    display: grid !important;
    grid-template-columns:
        minmax(400px, .72fr)
        minmax(680px, 1.28fr) !important;

    gap: 28px !important;
    align-items: start !important;
}


/* IDENTITE */

.animal-record-identity {
    padding-top: 20px !important;
}

.animal-record-identity h1 {
    width: fit-content !important;
    max-width: 520px !important;

    margin: 22px 0 18px !important;
    padding: 18px 24px !important;

    color: #173f2c !important;

    font-size: clamp(3rem, 4.5vw, 4.8rem) !important;
    line-height: .95 !important;

    border-radius: 20px !important;

    background: rgba(255,255,255,.88) !important;
}

.animal-record-identity > p {
    width: fit-content !important;

    padding: 13px 18px !important;

    color: #315344 !important;
    font-weight: 750 !important;

    border-radius: 14px !important;

    background: rgba(255,255,255,.86) !important;
}

.animal-record-headcount {
    width: 280px !important;

    margin-top: 38px !important;
    padding: 18px 20px !important;

    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.94) !important;
}

.animal-record-headcount span {
    color: #5c6b62 !important;
    font-weight: 700 !important;
}

.animal-record-headcount strong {
    color: #a45f32 !important;
    font-size: 2rem !important;
}


/* CARTE */

.animal-record-card {
    padding: 30px 34px !important;

    border-radius: 26px !important;

    background: rgba(255,255,255,.93) !important;

    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;

    box-shadow:
        0 22px 55px rgba(40,65,45,.15) !important;
}

.animal-record-card__heading {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;

    gap: 20px !important;

    margin-bottom: 26px !important;
}

.animal-record-card__heading > div > span {
    color: #a45f32 !important;
    font-size: .78rem !important;
    font-weight: 850 !important;
}

.animal-record-card__heading h2 {
    margin: 5px 0 0 !important;
    color: #173f2c !important;
}


/* DETAILS */

.animal-record-details {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;

    gap: 12px !important;
}

.animal-record-details > div {
    padding: 15px 16px !important;

    border-radius: 15px !important;

    background: #f4f8f4 !important;
}

.animal-record-details span {
    display: block !important;

    margin-bottom: 5px !important;

    color: #6a756e !important;
    font-size: .79rem !important;
}

.animal-record-details strong {
    color: #29483b !important;
}


/* NOTES */

.animal-record-notes {
    margin-top: 18px !important;
    padding: 16px 18px !important;

    border-radius: 15px !important;

    background: #f8f2e9 !important;
}

.animal-record-notes > span {
    color: #9b6037 !important;
    font-size: .79rem !important;
    font-weight: 850 !important;
}

.animal-record-notes p {
    margin: 6px 0 0 !important;
}


/* MODULES */

.animal-record-modules {
    margin-top: 26px !important;

    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;

    gap: 12px !important;
}

.animal-record-modules article {
    padding: 16px !important;

    display: grid !important;
    grid-template-columns: auto 1fr !important;

    gap: 12px !important;

    border: 1px solid rgba(70,100,78,.11) !important;
    border-radius: 16px !important;

    background: rgba(249,251,248,.95) !important;
}

.animal-record-modules article > span {
    font-size: 1.45rem !important;
}

.animal-record-modules strong,
.animal-record-modules small {
    display: block !important;
}

.animal-record-modules strong {
    color: #29483b !important;
}

.animal-record-modules small {
    margin-top: 3px !important;
    color: #69766e !important;
}

.animal-record-modules em {
    grid-column: 2 !important;

    color: #9b7a62 !important;
    font-size: .72rem !important;
    font-style: normal !important;
}


/* CARTE LISTE */

.animal-card__links {
    display: flex !important;
    gap: 12px !important;
    align-items: center !important;
}


/* RESPONSIVE */

@media (max-width: 980px) {

    .animal-record-layout {
        width: calc(100% - 24px) !important;

        margin: 24px 12px 30px !important;

        grid-template-columns: 1fr !important;
    }

    .animal-record-page > .farm-dashboard__header {
        width: calc(100% - 24px) !important;
        margin: 28px 12px 0 !important;
    }

    .animal-record-identity {
        padding-top: 0 !important;
    }

    .animal-record-identity h1,
    .animal-record-identity > p,
    .animal-record-headcount {
        max-width: 100% !important;
    }
}

@media (max-width: 600px) {

    .animal-record-details,
    .animal-record-modules {
        grid-template-columns: 1fr !important;
    }

    .animal-record-card {
        padding: 22px 17px !important;
    }

    .animal-record-card__heading {
        flex-direction: column !important;
    }
}

/* ===== FIN DOSSIER ANIMAL ===== */

/* ==========================================================
   SOINS ANIMAUX
   ========================================================== */

.animal-record-module--active > a {
    grid-column: 2 !important;

    width: fit-content !important;

    color: #087354 !important;
    font-size: .82rem !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}


/* PAGE SOINS */

.soin-layout {
    grid-template-columns:
        minmax(360px, .62fr)
        minmax(700px, 1.38fr) !important;
}

.soin-record-card {
    min-height: 520px !important;
}

.soin-empty {
    padding: 54px 24px !important;
    text-align: center !important;
}

.soin-empty > span {
    display: block !important;
    margin-bottom: 12px !important;

    font-size: 2.5rem !important;
}

.soin-empty h3 {
    color: #173f2c !important;
}

.soin-empty p {
    max-width: 520px !important;
    margin: 10px auto 22px !important;

    color: #65736b !important;
}


/* LISTE */

.soin-list {
    display: grid !important;
    gap: 14px !important;
}

.soin-card {
    padding: 18px 20px !important;

    border: 1px solid rgba(40,100,70,.12) !important;
    border-radius: 18px !important;

    background: #f9fbf9 !important;
}

.soin-card__top {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;

    gap: 18px !important;
}

.soin-card__top > div > span {
    color: #9b6037 !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
}

.soin-card h3 {
    margin: 4px 0 0 !important;
    color: #173f2c !important;
}

.soin-due {
    padding: 7px 10px !important;

    color: #8b6037 !important;
    font-size: .76rem !important;
    font-weight: 750 !important;

    border-radius: 999px !important;

    background: #f8eee2 !important;
}

.soin-card__details {
    margin-top: 16px !important;

    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;

    gap: 9px !important;
}

.soin-card__details p {
    margin: 0 !important;
    padding: 11px 12px !important;

    border-radius: 12px !important;

    background: #eef6f1 !important;
}

.soin-card__details span,
.soin-card__details strong {
    display: block !important;
}

.soin-card__details span {
    margin-bottom: 4px !important;

    color: #718078 !important;
    font-size: .72rem !important;
}

.soin-card__details strong {
    color: #29483b !important;
}

.soin-card__notes {
    margin: 12px 0 0 !important;

    color: #58685f !important;
}


/* FORMULAIRE */

.soin-form-card {
    min-height: 590px !important;
}


/* RESPONSIVE */

@media (max-width: 980px) {

    .soin-layout {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 600px) {

    .soin-card__top {
        flex-direction: column !important;
    }

    .soin-card__details {
        grid-template-columns: 1fr !important;
    }
}

/* ===== FIN SOINS ANIMAUX ===== */

/* ==========================================================
   REPRODUCTION ANIMAUX
   ========================================================== */

.reproduction-layout {
    grid-template-columns:
        minmax(360px, .62fr)
        minmax(700px, 1.38fr) !important;
}

.reproduction-record-card {
    min-height: 520px !important;
}

.reproduction-empty {
    padding: 54px 24px !important;
    text-align: center !important;
}

.reproduction-empty > span {
    display: block !important;
    margin-bottom: 12px !important;
    font-size: 2.5rem !important;
}

.reproduction-empty h3 {
    color: #173f2c !important;
}

.reproduction-empty p {
    max-width: 560px !important;
    margin: 10px auto 22px !important;
    color: #65736b !important;
}


/* LISTE */

.reproduction-list {
    display: grid !important;
    gap: 14px !important;
}

.reproduction-card {
    padding: 18px 20px !important;

    border: 1px solid rgba(150,85,125,.13) !important;
    border-radius: 18px !important;

    background: #fcf9fb !important;
}

.reproduction-card__top {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;

    gap: 18px !important;
}

.reproduction-card__top > div > span {
    color: #a05d87 !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
}

.reproduction-card h3 {
    margin: 4px 0 0 !important;
    color: #173f2c !important;
}

.reproduction-due {
    padding: 7px 10px !important;

    color: #945f7f !important;
    font-size: .76rem !important;
    font-weight: 750 !important;

    border-radius: 999px !important;

    background: #f7eaf2 !important;
}

.reproduction-card__details {
    margin-top: 16px !important;

    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;

    gap: 9px !important;
}

.reproduction-card__details p {
    margin: 0 !important;
    padding: 11px 12px !important;

    border-radius: 12px !important;

    background: #f5edf3 !important;
}

.reproduction-card__details span,
.reproduction-card__details strong {
    display: block !important;
}

.reproduction-card__details span {
    margin-bottom: 4px !important;

    color: #7b6f77 !important;
    font-size: .72rem !important;
}

.reproduction-card__details strong {
    color: #29483b !important;
}

.reproduction-card__notes {
    margin: 12px 0 0 !important;
    color: #58685f !important;
}


/* FORMULAIRE */

.reproduction-form-card {
    min-height: 570px !important;
}


/* RESPONSIVE */

@media (max-width: 980px) {

    .reproduction-layout {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 600px) {

    .reproduction-card__top {
        flex-direction: column !important;
    }

    .reproduction-card__details {
        grid-template-columns: 1fr !important;
    }
}

/* ===== FIN REPRODUCTION ANIMAUX ===== */

/* ==========================================================
   ALIMENTATION ANIMAUX
   ========================================================== */

.alimentation-layout {
    grid-template-columns:
        minmax(360px, .62fr)
        minmax(700px, 1.38fr) !important;
}

.alimentation-record-card {
    min-height: 520px !important;
}

.alimentation-empty {
    padding: 54px 24px !important;
    text-align: center !important;
}

.alimentation-empty > span {
    display: block !important;
    margin-bottom: 12px !important;
    font-size: 2.5rem !important;
}

.alimentation-empty h3 {
    color: #173f2c !important;
}

.alimentation-empty p {
    max-width: 550px !important;
    margin: 10px auto 22px !important;
    color: #65736b !important;
}


/* LISTE */

.alimentation-list {
    display: grid !important;
    gap: 14px !important;
}

.alimentation-card {
    padding: 18px 20px !important;

    border: 1px solid rgba(167,132,40,.16) !important;
    border-radius: 18px !important;

    background: #fffdf6 !important;
}

.alimentation-card__top {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;

    gap: 18px !important;
}

.alimentation-card__top > div > span {
    color: #987829 !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
}

.alimentation-card__top small {
    display: block !important;
    margin-top: 4px !important;

    color: #726c55 !important;
}

.alimentation-card h3 {
    margin: 4px 0 0 !important;
    color: #173f2c !important;
}

.alimentation-quantity {
    padding: 8px 12px !important;

    color: #856b23 !important;
    font-weight: 800 !important;

    border-radius: 999px !important;

    background: #faf2d9 !important;
}

.alimentation-card__details {
    margin-top: 16px !important;

    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;

    gap: 9px !important;
}

.alimentation-card__details p {
    margin: 0 !important;
    padding: 11px 12px !important;

    border-radius: 12px !important;

    background: #f8f4e6 !important;
}

.alimentation-card__details span,
.alimentation-card__details strong {
    display: block !important;
}

.alimentation-card__details span {
    margin-bottom: 4px !important;

    color: #7d7868 !important;
    font-size: .72rem !important;
}

.alimentation-card__details strong {
    color: #29483b !important;
}

.alimentation-card__notes {
    margin: 12px 0 0 !important;
    color: #58685f !important;
}


/* FORMULAIRE */

.alimentation-form-card {
    min-height: 570px !important;
}


/* RESPONSIVE */

@media (max-width: 980px) {

    .alimentation-layout {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 600px) {

    .alimentation-card__top {
        flex-direction: column !important;
    }

    .alimentation-card__details {
        grid-template-columns: 1fr !important;
    }
}

/* ===== FIN ALIMENTATION ANIMAUX ===== */

/* ==========================================================
   HISTORIQUE DOSSIER ANIMAL
   ========================================================== */

.animal-history-layout {
    grid-template-columns:
        minmax(360px, .62fr)
        minmax(700px, 1.38fr) !important;
}

.animal-history-card {
    min-height: 520px !important;
}


/* ETAT VIDE */

.animal-history-empty {
    padding: 58px 24px !important;

    text-align: center !important;
}

.animal-history-empty > span {
    display: block !important;

    margin-bottom: 12px !important;

    font-size: 2.6rem !important;
}

.animal-history-empty h3 {
    color: #173f2c !important;
}

.animal-history-empty p {
    max-width: 540px !important;

    margin: 10px auto 0 !important;

    color: #65736b !important;
}


/* CHRONOLOGIE */

.animal-history-timeline {
    position: relative !important;

    display: grid !important;

    gap: 14px !important;
}

.animal-history-timeline::before {
    content: "" !important;

    position: absolute !important;

    top: 8px !important;
    bottom: 8px !important;
    left: 38px !important;

    width: 2px !important;

    background: rgba(40,110,78,.14) !important;
}


/* EVENEMENT */

.animal-history-event {
    position: relative !important;

    display: grid !important;

    grid-template-columns:
        78px 1fr !important;

    gap: 14px !important;

    align-items: start !important;
}

.animal-history-event__date {
    position: relative !important;
    z-index: 2 !important;

    min-height: 66px !important;

    padding: 9px 6px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 15px !important;

    background: #fff !important;

    border: 1px solid rgba(40,100,70,.13) !important;
}

.animal-history-event__date strong {
    color: #a25f32 !important;

    font-size: 1.35rem !important;
}

.animal-history-event__date span {
    color: #6c786f !important;

    font-size: .72rem !important;
}


/* CONTENU */

.animal-history-event__content {
    min-height: 66px !important;

    padding: 14px 17px !important;

    border-radius: 16px !important;

    background: #f9fbf9 !important;

    border: 1px solid rgba(50,100,72,.10) !important;
}

.animal-history-kind {
    display: block !important;

    margin-bottom: 4px !important;

    font-size: .70rem !important;
    font-weight: 850 !important;
    letter-spacing: .04em !important;
}

.animal-history-event__content h3 {
    margin: 0 !important;

    color: #173f2c !important;

    font-size: 1rem !important;
}

.animal-history-event__content p {
    margin: 5px 0 0 !important;

    color: #637168 !important;
}


/* DIFFERENCIATION */

.animal-history-event--soin
.animal-history-kind {
    color: #586fc7 !important;
}

.animal-history-event--reproduction
.animal-history-kind {
    color: #a05d87 !important;
}

.animal-history-event--alimentation
.animal-history-kind {
    color: #987829 !important;
}


/* RESPONSIVE */

@media (max-width: 980px) {

    .animal-history-layout {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 600px) {

    .animal-history-event {
        grid-template-columns:
            64px 1fr !important;
    }

    .animal-history-timeline::before {
        left: 31px !important;
    }
}

/* ===== FIN HISTORIQUE DOSSIER ANIMAL ===== */

/* ==========================================================
   MATERIEL
   ========================================================== */

.materiel-page .materiel-hero {
    background-image:
        linear-gradient(
            90deg,
            rgba(240,247,246,.16) 0%,
            rgba(240,247,246,.08) 42%,
            rgba(240,247,246,.26) 62%,
            rgba(240,247,246,.66) 100%
        ),
        url("/images/materiel/hero-materiel.webp") !important;
}

.materiel-page .materiel-badge,
.materiel-form-page .materiel-form-badge {
    color: #477e8c !important;
}

.materiel-page .animal-hero__stats strong {
    color: #477e8c !important;
}

.materiel-primary-button {
    background:
        linear-gradient(
            135deg,
            #5c929e,
            #3f7481
        ) !important;
}

.materiel-maintenance {
    width: 100% !important;
}

.materiel-maintenance strong {
    font-size: 1rem !important;
    color: #477e8c !important;
}

.materiel-form-page .animal-form-page__overlay {
    background: linear-gradient(
        90deg,
        rgba(242,248,247,.05) 0%,
        rgba(242,248,247,.08) 40%,
        rgba(242,248,247,.30) 57%,
        rgba(242,248,247,.76) 76%,
        rgba(242,248,247,.94) 100%
    ) !important;
}

/* ===== FIN MATERIEL ===== */

/* ==========================================================
   DOSSIER MATERIEL
   ========================================================== */

.materiel-record-page
.animal-record-page__overlay {
    background:
        linear-gradient(
            90deg,
            rgba(236,246,244,.30) 0%,
            rgba(236,246,244,.10) 38%,
            rgba(236,246,244,.45) 63%,
            rgba(236,246,244,.90) 100%
        ) !important;
}

.materiel-record-status {
    color: #477e8c !important;
    font-size: 1.05rem !important;
}

.materiel-record-next {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;

    margin-top: 16px !important;
    padding: 14px 16px !important;

    border-radius: 16px !important;

    background:
        rgba(255,255,255,.88) !important;

    border:
        1px solid rgba(71,126,140,.15) !important;
}

.materiel-record-next > span {
    font-size: 1.4rem !important;
}

.materiel-record-next div {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.materiel-record-next small {
    color: #67766f !important;
}

.materiel-record-next strong {
    color: #477e8c !important;
}


.materiel-record-information {
    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;

    gap: 12px !important;

    margin-top: 20px !important;
}

.materiel-record-information > div {
    padding: 14px 16px !important;

    border-radius: 15px !important;

    background: #f8faf9 !important;

    border:
        1px solid rgba(44,94,70,.09) !important;

    display: flex !important;
    flex-direction: column !important;

    gap: 5px !important;
}

.materiel-record-information span {
    color: #6c7770 !important;

    font-size: .75rem !important;
}

.materiel-record-information strong {
    color: #173f2c !important;
}


.materiel-record-notes {
    margin-top: 14px !important;

    padding: 14px 16px !important;

    border-radius: 15px !important;

    background:
        rgba(243,247,245,.86) !important;
}

.materiel-record-notes span {
    display: block !important;

    margin-bottom: 5px !important;

    color: #6c7770 !important;

    font-size: .75rem !important;
}

.materiel-record-notes p {
    margin: 0 !important;

    color: #244938 !important;
}


.materiel-record-modules {
    margin-top: 20px !important;
}


/* RESPONSIVE */

@media (max-width: 700px) {

    .materiel-record-information {
        grid-template-columns: 1fr !important;
    }
}

/* ===== FIN DOSSIER MATERIEL ===== */

/* ==========================================================
   ENTRETIENS MATERIEL
   ========================================================== */

.materiel-entretien-layout {
    grid-template-columns:
        minmax(350px, .60fr)
        minmax(700px, 1.40fr) !important;
}

.materiel-entretien-card {
    min-height: 520px !important;
}

.materiel-entretien-list {
    display: grid !important;
    gap: 13px !important;
    margin-top: 18px !important;
}

.materiel-entretien-item {
    display: grid !important;
    grid-template-columns:
        72px minmax(0, 1fr) auto !important;

    gap: 14px !important;
    align-items: center !important;

    padding: 12px !important;

    border-radius: 17px !important;

    border:
        1px solid rgba(50,100,72,.11) !important;

    background:
        rgba(249,251,250,.95) !important;
}

.materiel-entretien-date {
    min-height: 64px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 14px !important;

    background: #fff !important;

    border:
        1px solid rgba(71,126,140,.14) !important;
}

.materiel-entretien-date strong {
    font-size: 1.28rem !important;
    color: #477e8c !important;
}

.materiel-entretien-date span {
    font-size: .7rem !important;
    color: #718078 !important;
}

.materiel-entretien-content > span {
    display: block !important;

    margin-bottom: 3px !important;

    color: #477e8c !important;

    font-size: .68rem !important;
    font-weight: 850 !important;
}

.materiel-entretien-content h3 {
    margin: 0 !important;

    color: #173f2c !important;

    font-size: 1rem !important;
}

.materiel-entretien-content p {
    margin: 4px 0 0 !important;

    color: #617168 !important;
}

.materiel-entretien-meta {
    display: flex !important;
    flex-wrap: wrap !important;

    gap: 7px !important;

    margin-top: 8px !important;
}

.materiel-entretien-meta small {
    padding: 5px 8px !important;

    border-radius: 8px !important;

    background:
        rgba(71,126,140,.08) !important;

    color: #49665d !important;
}

.materiel-entretien-edit {
    white-space: nowrap !important;

    color: #477e8c !important;
    font-size: .76rem !important;
    font-weight: 800 !important;
}

@media (max-width: 980px) {

    .materiel-entretien-layout {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 650px) {

    .materiel-entretien-item {
        grid-template-columns: 62px 1fr !important;
    }

    .materiel-entretien-edit {
        grid-column: 2 !important;
    }
}

/* ===== FIN ENTRETIENS MATERIEL ===== */



/* ==========================================================
   ENTRETIENS MATERIEL - MISE EN PAGE STABLE
   ========================================================== */

@media (min-width: 981px) {

    .materiel-entretien-page
    .materiel-entretien-layout {
        grid-template-columns:
            minmax(260px, 320px)
            minmax(0, 1fr) !important;

        gap: 36px !important;
    }

    .materiel-entretien-page
    .animal-record-identity {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 320px !important;
    }

    .materiel-entretien-page
    .animal-record-identity h1 {
        width: 100% !important;
        max-width: 100% !important;

        box-sizing: border-box !important;

        font-size: clamp(
            2.25rem,
            3.2vw,
            3.6rem
        ) !important;

        line-height: 1 !important;

        overflow: hidden !important;
    }

    .materiel-entretien-page
    .animal-record-identity > p,
    .materiel-entretien-page
    .animal-record-headcount,
    .materiel-entretien-page
    .materiel-record-next {
        width: 100% !important;
        max-width: 100% !important;

        box-sizing: border-box !important;
    }

    .materiel-entretien-page
    .materiel-entretien-card {
        width: 100% !important;
        min-width: 0 !important;

        box-sizing: border-box !important;
    }
}

@media (max-width: 980px) {

    .materiel-entretien-page
    .materiel-entretien-layout {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    .materiel-entretien-page
    .animal-record-identity {
        max-width: 100% !important;
    }
}

/* ===== FIN ENTRETIENS MATERIEL - MISE EN PAGE STABLE ===== */

/* ==========================================================
   ACTIONS ENTRETIEN MATERIEL
   ========================================================== */

.materiel-entretien-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    white-space: nowrap !important;
}

.materiel-entretien-actions form {
    margin: 0 !important;
}

.materiel-entretien-delete {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;

    color: #b64e45 !important;
    font: inherit !important;
    font-size: .76rem !important;
    font-weight: 800 !important;

    text-decoration: underline !important;
    cursor: pointer !important;
}

.materiel-entretien-delete:hover {
    text-decoration: none !important;
}

@media (max-width: 650px) {

    .materiel-entretien-actions {
        grid-column: 2 !important;
        justify-content: flex-start !important;
    }
}

/* ===== FIN ACTIONS ENTRETIEN MATERIEL ===== */

/* ==========================================================
   PANNES / INTERVENTIONS MATERIEL
   ========================================================== */

@media (min-width: 981px) {

    .materiel-intervention-page
    .materiel-intervention-layout {
        grid-template-columns:
            minmax(260px, 320px)
            minmax(0, 1fr) !important;

        gap: 36px !important;
    }

    .materiel-intervention-page
    .animal-record-identity {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 320px !important;
    }

    .materiel-intervention-page
    .animal-record-identity h1 {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;

        font-size:
            clamp(2.25rem, 3.2vw, 3.6rem) !important;

        line-height: 1 !important;
        overflow: hidden !important;
    }

    .materiel-intervention-page
    .animal-record-identity > p,
    .materiel-intervention-page
    .animal-record-headcount {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .materiel-intervention-page
    .materiel-intervention-card {
        min-width: 0 !important;
        width: 100% !important;
    }
}

@media (max-width: 980px) {

    .materiel-intervention-page
    .materiel-intervention-layout {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }
}

/* ===== FIN PANNES / INTERVENTIONS MATERIEL ===== */

/* ==========================================================
   HISTORIQUE MATERIEL
   ========================================================== */

@media (min-width: 981px) {

    .materiel-history-page
    .materiel-history-layout {
        grid-template-columns:
            minmax(260px, 320px)
            minmax(0, 1fr) !important;

        gap: 36px !important;
    }

    .materiel-history-page
    .animal-record-identity {
        width: 100% !important;
        max-width: 320px !important;
        min-width: 0 !important;
    }

    .materiel-history-page
    .animal-record-identity h1 {
        width: 100% !important;
        max-width: 100% !important;

        box-sizing: border-box !important;

        font-size:
            clamp(2.25rem, 3.2vw, 3.6rem) !important;

        line-height: 1 !important;
        overflow: hidden !important;
    }

    .materiel-history-page
    .animal-record-identity > p,
    .materiel-history-page
    .animal-record-headcount {
        width: 100% !important;
        max-width: 100% !important;

        box-sizing: border-box !important;
    }

    .materiel-history-card {
        min-width: 0 !important;
        min-height: 520px !important;
    }
}

.materiel-history-meta {
    display: flex !important;
    flex-wrap: wrap !important;

    gap: 7px !important;

    margin-top: 8px !important;
}

.materiel-history-meta small {
    padding: 5px 8px !important;

    border-radius: 8px !important;

    background:
        rgba(71,126,140,.08) !important;

    color: #49665d !important;
}

.materiel-history-event--entretien
.animal-history-kind {
    color: #477e8c !important;
}

.materiel-history-event--intervention
.animal-history-kind {
    color: #b45d42 !important;
}

@media (max-width: 980px) {

    .materiel-history-page
    .materiel-history-layout {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }
}

/* ===== FIN HISTORIQUE MATERIEL ===== */

/* ==========================================================
   PLANNING
   ========================================================== */

.planning-page {
    min-height: 100vh !important;

    background:
        linear-gradient(
            rgba(239,246,237,.82),
            rgba(239,246,237,.92)
        ),
        url("/images/planning/hero-planning.webp")
        center / cover fixed !important;
}


/* HERO */

.planning-hero {
    min-height: 310px !important;

    padding: 42px 46px !important;

    display: grid !important;

    grid-template-columns:
        minmax(0, 1.25fr)
        minmax(360px, .75fr) !important;

    gap: 30px !important;
    align-items: center !important;

    border-radius: 30px !important;

    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.94) 0%,
            rgba(255,255,255,.85) 46%,
            rgba(255,255,255,.48) 100%
        ),
        url("/images/planning/hero-planning.webp")
        center / cover !important;

    box-shadow:
        0 24px 60px rgba(46,76,53,.15) !important;
}

.planning-badge {
    display: inline-flex !important;

    padding: 8px 13px !important;

    border-radius: 999px !important;

    background: rgba(255,255,255,.86) !important;

    color: #557a3c !important;

    font-size: .76rem !important;
    font-weight: 900 !important;
    letter-spacing: .05em !important;
}

.planning-hero h1 {
    margin: 18px 0 12px !important;

    color: #173f2c !important;

    font-size: clamp(2.8rem, 5vw, 5rem) !important;
    line-height: .95 !important;
}

.planning-hero__content > p {
    max-width: 650px !important;

    margin: 0 !important;

    color: #405c4c !important;
    font-weight: 650 !important;
    line-height: 1.65 !important;
}

.planning-hero__date {
    width: fit-content !important;

    margin-top: 20px !important;
    padding: 9px 13px !important;

    border-radius: 11px !important;

    background: rgba(255,255,255,.82) !important;

    color: #607066 !important;
}

.planning-hero__date strong {
    color: #173f2c !important;
}


/* STATS */

.planning-hero__stats {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 10px !important;
}

.planning-stat {
    min-height: 105px !important;

    padding: 16px 12px !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;

    text-align: center !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.91) !important;

    box-shadow:
        0 10px 28px rgba(45,68,49,.10) !important;
}

.planning-stat span {
    color: #647269 !important;
    font-size: .72rem !important;
    font-weight: 750 !important;
}

.planning-stat strong {
    margin-top: 5px !important;

    color: #557a3c !important;

    font-size: 1.85rem !important;
}

.planning-stat--late strong {
    color: #b64e45 !important;
}

.planning-stat--today strong {
    color: #b48128 !important;
}


/* BARRE */

.planning-toolbar {
    margin: 32px 0 18px !important;

    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;

    gap: 20px !important;
}

.planning-toolbar span {
    color: #6e8462 !important;

    font-size: .75rem !important;
    font-weight: 900 !important;
}

.planning-toolbar h2 {
    margin: 4px 0 0 !important;

    color: #173f2c !important;
}

.planning-primary-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 8px !important;

    padding: 12px 18px !important;

    border: 0 !important;
    border-radius: 12px !important;

    background:
        linear-gradient(
            135deg,
            #71974e,
            #527d3a
        ) !important;

    color: #fff !important;

    font: inherit !important;
    font-weight: 800 !important;

    text-decoration: none !important;
    cursor: pointer !important;

    box-shadow:
        0 10px 22px rgba(62,104,51,.18) !important;
}


/* SECTIONS */

.planning-section {
    margin-top: 20px !important;
    padding: 24px 26px !important;

    border-radius: 24px !important;

    background: rgba(255,255,255,.93) !important;

    box-shadow:
        0 18px 46px rgba(49,73,52,.10) !important;
}

.planning-section--overdue {
    border-left: 5px solid #c85d52 !important;
}

.planning-section--today {
    border-left: 5px solid #d7a641 !important;
}

.planning-section--upcoming {
    border-left: 5px solid #6d9851 !important;
}

.planning-section__heading {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;

    gap: 20px !important;

    margin-bottom: 17px !important;
}

.planning-section__heading span {
    color: #718168 !important;

    font-size: .72rem !important;
    font-weight: 900 !important;
}

.planning-section__heading h2 {
    margin: 3px 0 0 !important;

    color: #173f2c !important;
}

.planning-section__heading > strong {
    min-width: 38px !important;
    height: 38px !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    border-radius: 50% !important;

    background: #f0f5ed !important;

    color: #557a3c !important;
}


/* EVENEMENTS */

.planning-event-list {
    display: grid !important;
    gap: 11px !important;
}

.planning-event {
    display: grid !important;

    grid-template-columns:
        68px minmax(0, 1fr) auto !important;

    gap: 14px !important;
    align-items: center !important;

    padding: 12px !important;

    border-radius: 16px !important;

    background: #f9fbf8 !important;

    border:
        1px solid rgba(70,106,61,.10) !important;
}

.planning-event--overdue {
    background: #fff8f6 !important;
}

.planning-event--today {
    background: #fffbf2 !important;
}

.planning-event__date {
    min-height: 61px !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;

    border-radius: 13px !important;

    background: #fff !important;

    border:
        1px solid rgba(60,92,56,.10) !important;
}

.planning-event__date strong {
    color: #557a3c !important;

    font-size: 1.25rem !important;
}

.planning-event__date span {
    color: #718078 !important;

    font-size: .68rem !important;
}

.planning-event--overdue
.planning-event__date strong {
    color: #b64e45 !important;
}

.planning-event--today
.planning-event__date strong {
    color: #b48128 !important;
}

.planning-event__heading {
    display: flex !important;
    align-items: center !important;

    gap: 8px !important;

    margin-bottom: 3px !important;
}

.planning-event__source {
    color: #638054 !important;

    font-size: .68rem !important;
    font-weight: 850 !important;
    text-transform: uppercase !important;
}

.planning-event__body h3 {
    margin: 0 !important;

    color: #173f2c !important;

    font-size: 1rem !important;
}

.planning-event__body p {
    margin: 4px 0 0 !important;

    color: #68766d !important;

    font-size: .85rem !important;
}

.planning-priority {
    padding: 3px 7px !important;

    border-radius: 7px !important;

    font-size: .62rem !important;
    font-weight: 850 !important;
}

.planning-priority--high {
    background: #fff0ed !important;
    color: #ac4e44 !important;
}

.planning-priority--low {
    background: #f0f4ef !important;
    color: #738075 !important;
}


/* ACTIONS */

.planning-event__actions {
    display: flex !important;
    align-items: center !important;

    gap: 9px !important;
}

.planning-event__actions form {
    margin: 0 !important;
}

.planning-action {
    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    color: #527d3a !important;

    font: inherit !important;
    font-size: .72rem !important;
    font-weight: 800 !important;

    text-decoration: underline !important;

    cursor: pointer !important;
}

.planning-action--done {
    color: #34734c !important;
}

.planning-action--delete {
    color: #b64e45 !important;
}

.planning-event__automatic {
    padding: 5px 8px !important;

    border-radius: 8px !important;

    background: #eef4eb !important;

    color: #718168 !important;

    font-size: .65rem !important;
    font-weight: 800 !important;
}


/* VIDE */

.planning-section-empty {
    padding: 18px !important;

    border-radius: 13px !important;

    background: #f8faf7 !important;

    color: #7a867e !important;

    text-align: center !important;
}

.planning-empty {
    padding: 60px 30px !important;

    border-radius: 25px !important;

    background: rgba(255,255,255,.93) !important;

    text-align: center !important;
}

.planning-empty > span {
    font-size: 3rem !important;
}

.planning-empty h2 {
    color: #173f2c !important;
}

.planning-empty p {
    max-width: 600px !important;

    margin: 10px auto 22px !important;

    color: #68766d !important;
}


/* TERMINEES */

.planning-completed {
    margin: 22px 0 40px !important;

    padding: 18px 22px !important;

    border-radius: 18px !important;

    background: rgba(255,255,255,.88) !important;
}

.planning-completed summary {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;

    cursor: pointer !important;
}

.planning-completed summary > span:first-child {
    display: flex !important;
    flex-direction: column !important;
}

.planning-completed summary strong {
    color: #496b3d !important;
}

.planning-completed summary small {
    margin-top: 2px !important;

    color: #7d887f !important;
}

.planning-completed__list {
    display: grid !important;

    gap: 8px !important;

    margin-top: 15px !important;
}

.planning-completed-item {
    display: grid !important;

    grid-template-columns:
        38px minmax(0, 1fr) auto !important;

    gap: 10px !important;
    align-items: center !important;

    padding: 10px 12px !important;

    border-radius: 12px !important;

    background: #f7f9f6 !important;
}

.planning-completed-item > div:nth-child(2) {
    display: flex !important;
    flex-direction: column !important;
}

.planning-completed-item small {
    color: #849087 !important;
}


/* FORMULAIRE */

.planning-form-page
.animal-form-page__overlay {
    background:
        linear-gradient(
            90deg,
            rgba(241,247,237,.08) 0%,
            rgba(241,247,237,.12) 40%,
            rgba(241,247,237,.50) 65%,
            rgba(241,247,237,.94) 100%
        ) !important;
}

.planning-form-badge {
    color: #60863f !important;
}

.planning-done-field {
    display: flex !important;
    align-items: center !important;

    gap: 10px !important;

    padding: 12px 14px !important;

    border-radius: 12px !important;

    background: rgba(239,245,236,.85) !important;
}

.planning-done-field input {
    width: 18px !important;
    height: 18px !important;
}

.planning-done-field label {
    margin: 0 !important;

    color: #365a3d !important;

    font-weight: 750 !important;
}


/* RESPONSIVE */

@media (max-width: 980px) {

    .planning-hero {
        grid-template-columns: 1fr !important;
    }

    .planning-hero__stats {
        max-width: 540px !important;
    }
}

@media (max-width: 700px) {

    .planning-hero {
        padding: 26px 20px !important;
    }

    .planning-hero__stats {
        grid-template-columns: 1fr !important;
    }

    .planning-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .planning-event {
        grid-template-columns:
            60px minmax(0, 1fr) !important;
    }

    .planning-event__actions,
    .planning-event__automatic {
        grid-column: 2 !important;

        justify-content: flex-start !important;
    }

    .planning-completed-item {
        grid-template-columns:
            36px minmax(0, 1fr) !important;
    }

    .planning-completed-item
    .planning-event__actions {
        grid-column: 2 !important;
    }
}

/* ===== FIN PLANNING ===== */

.record-delete-form {
    margin: 0 !important;
}

.record-delete-button {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #b64e45 !important;
    font: inherit !important;
    font-weight: 800 !important;
    text-decoration: underline !important;
    cursor: pointer !important;
}

.record-main-delete {
    color: #b64e45 !important;
    cursor: pointer !important;
}


.culture-edit-delete {
    margin-top: 14px !important;
    text-align: right !important;
}


/* ==========================================================
   MODALE GLOBALE DE SUPPRESSION
   ========================================================== */

.delete-modal[hidden] {
    display: none !important;
}

.delete-modal {
    position: fixed !important;
    inset: 0 !important;

    z-index: 99999 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 20px !important;
}

.delete-modal__backdrop {
    position: absolute !important;
    inset: 0 !important;

    background:
        rgba(20, 42, 31, .48) !important;

    backdrop-filter: blur(5px) !important;
    -webkit-backdrop-filter: blur(5px) !important;
}

.delete-modal__dialog {
    position: relative !important;
    z-index: 1 !important;

    width: min(100%, 500px) !important;

    padding: 28px !important;

    border-radius: 24px !important;

    background:
        rgba(255,255,255,.98) !important;

    box-shadow:
        0 28px 80px rgba(23,63,44,.28) !important;
}

.delete-modal__icon {
    width: 54px !important;
    height: 54px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-bottom: 18px !important;

    border-radius: 16px !important;

    background: #fff0ec !important;

    font-size: 1.55rem !important;
}

.delete-modal__content > span {
    color: #b25349 !important;

    font-size: .72rem !important;
    font-weight: 900 !important;
    letter-spacing: .06em !important;
}

.delete-modal__content h2 {
    margin: 5px 0 10px !important;

    color: #173f2c !important;

    font-size: 1.5rem !important;
}

.delete-modal__content p {
    margin: 0 !important;

    color: #617068 !important;
    line-height: 1.6 !important;
}

.delete-modal__actions {
    display: flex !important;
    justify-content: flex-end !important;

    gap: 10px !important;

    margin-top: 26px !important;
}

.delete-modal__cancel,
.delete-modal__confirm {
    padding: 11px 17px !important;

    border-radius: 11px !important;

    font: inherit !important;
    font-weight: 800 !important;

    cursor: pointer !important;
}

.delete-modal__cancel {
    border:
        1px solid rgba(40,90,65,.15) !important;

    background: #fff !important;

    color: #476356 !important;
}

.delete-modal__confirm {
    border: 0 !important;

    background: #b85248 !important;

    color: #fff !important;
}

.delete-modal-open {
    overflow: hidden !important;
}

/* ===== FIN MODALE SUPPRESSION ===== */

/* ==========================================================
   MODALE SUPPRESSION - OUVERTURE INSTANTANEE
   ========================================================== */

.delete-modal__backdrop {
    background: rgba(20, 42, 31, .58) !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.delete-modal__dialog {
    transform: translateZ(0) !important;
}


.dashboard-message--error {
    background: #fff1ee !important;
    color: #9b4038 !important;
    border-color: rgba(155, 64, 56, .18) !important;
}


/* ==========================================================
   GESTION - PAGE D'ACCUEIL
   ========================================================== */

.gestion-shell {
    min-height: 100vh;
    background:
        linear-gradient(
            180deg,
            #f4f7f5 0%,
            #eef4f1 100%
        );
    color: #183b2c;
}

.gestion-header {
    min-height: 76px;
    padding: 14px clamp(20px, 4vw, 58px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background: rgba(255,255,255,.96);
    border-bottom: 1px solid rgba(31,87,61,.08);
}

.gestion-brand {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #173f2c;
    text-decoration: none;
}

.gestion-brand__icon {
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: #e5f5ec;
    font-size: 1.35rem;
}

.gestion-brand strong,
.gestion-brand small {
    display: block;
}

.gestion-brand strong {
    font-size: 1.04rem;
}

.gestion-brand small {
    margin-top: 2px;
    color: #708079;
    font-size: .75rem;
}

.gestion-back {
    padding: 10px 15px;
    border: 1px solid rgba(28,82,59,.12);
    border-radius: 11px;
    background: #fff;
    color: #315c49;
    font-weight: 800;
    text-decoration: none;
}

.gestion-content {
    width: min(1420px, calc(100% - 40px));
    margin: 0 auto;
    padding: 28px 0 50px;
}

.gestion-hero {
    position: relative;
    min-height: 330px;
    overflow: hidden;
    display: flex;
    align-items: center;
    padding: clamp(34px, 6vw, 78px);
    border-radius: 28px;
    background-image: var(--gestion-hero);
    background-size: cover;
    background-position: center;
    box-shadow: 0 22px 55px rgba(28,61,46,.14);
}

.gestion-hero__overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(17,49,35,.68) 0%,
            rgba(22,59,42,.52) 43%,
            rgba(22,59,42,.12) 100%
        );
}

.gestion-hero__text {
    position: relative;
    z-index: 1;
    max-width: 650px;
    color: #fff;
}

.gestion-badge {
    display: inline-flex;
    margin-bottom: 17px;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    font-size: .73rem;
    font-weight: 900;
    letter-spacing: .06em;
}

.gestion-hero h1 {
    margin: 0;
    font-size: clamp(2.2rem, 4vw, 4rem);
    line-height: 1.02;
}

.gestion-hero p {
    max-width: 600px;
    margin: 20px 0 0;
    color: rgba(255,255,255,.9);
    font-size: 1.05rem;
    line-height: 1.65;
}

.gestion-heading {
    margin: 43px 0 22px;
}

.gestion-heading__eyebrow {
    color: #7954a5;
    font-size: .74rem;
    font-weight: 900;
    letter-spacing: .07em;
}

.gestion-heading h2 {
    margin: 7px 0 7px;
    color: #173f2c;
    font-size: clamp(1.65rem, 3vw, 2.35rem);
}

.gestion-heading p {
    margin: 0;
    color: #728078;
}

.gestion-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.gestion-card {
    min-height: 255px;
    padding: 23px;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(31,85,62,.08);
    border-radius: 21px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 12px 34px rgba(38,70,54,.07);
}

.gestion-card--active {
    border-color: rgba(62,140,98,.22);
}

.gestion-card--electronic {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f6f0fc 100%
        );
}

.gestion-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.gestion-card__icon {
    width: 49px;
    height: 49px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    background: #f1ebf9;
    font-size: 1.45rem;
}

.gestion-card__status {
    padding: 6px 9px;
    border-radius: 999px;
    background: #f0f2f1;
    color: #7a847f;
    font-size: .66rem;
    font-weight: 900;
}

.gestion-card__status--ready {
    background: #e4f6ec;
    color: #20764f;
}

.gestion-card__status--test {
    background: #f2e9fb;
    color: #744ca1;
}

.gestion-card h3 {
    margin: 20px 0 8px;
    color: #173f2c;
    font-size: 1.18rem;
}

.gestion-card p {
    margin: 0 0 20px;
    color: #6d7b74;
    font-size: .9rem;
    line-height: 1.55;
}

.gestion-card__link,
.gestion-card__future {
    margin-top: auto;
    font-size: .86rem;
    font-weight: 900;
}

.gestion-card__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #7550a1;
    text-decoration: none;
}

.gestion-card__future {
    color: #9aa29e;
}

.gestion-info {
    margin-top: 25px;
    padding: 20px 22px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    border: 1px solid rgba(39,112,76,.12);
    border-radius: 18px;
    background: #edf8f2;
}

.gestion-info__icon {
    font-size: 1.35rem;
}

.gestion-info strong {
    color: #20533b;
}

.gestion-info p {
    margin: 5px 0 0;
    color: #63756c;
    line-height: 1.55;
}

@media (max-width: 1100px) {
    .gestion-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .gestion-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .gestion-content {
        width: min(100% - 24px, 1420px);
        padding-top: 14px;
    }

    .gestion-hero {
        min-height: 390px;
        padding: 28px 23px;
        background-position: 60% center;
    }

    .gestion-hero__overlay {
        background:
            rgba(17,49,35,.74);
    }

    .gestion-grid {
        grid-template-columns: 1fr;
    }
}

/* ===== FIN PAGE GESTION ===== */

/* ==========================================================
   GESTION - AJUSTEMENT HEADER + FOND
   ========================================================== */

.gestion-shell {
    background:
        radial-gradient(
            circle at 8% 18%,
            rgba(72, 177, 126, .20),
            transparent 32%
        ),
        radial-gradient(
            circle at 92% 24%,
            rgba(133, 94, 183, .15),
            transparent 30%
        ),
        radial-gradient(
            circle at 65% 88%,
            rgba(224, 177, 94, .12),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            #f2f8f4 0%,
            #eef6f1 52%,
            #f7f3ed 100%
        ) !important;
}


/* Header aligné sur le contenu de la page */
.gestion-header {
    width: min(1420px, calc(100% - 40px)) !important;
    min-height: 72px !important;

    margin: 0 auto !important;
    padding: 12px 0 !important;

    background: transparent !important;
    border-bottom: 0 !important;
}


/* Logo un peu plus présent */
.gestion-brand {
    padding: 7px 11px !important;
    border-radius: 14px !important;

    background: rgba(255,255,255,.72) !important;

    box-shadow:
        0 8px 24px rgba(32,75,53,.06) !important;
}


/* Retour plus proche du contenu */
.gestion-back {
    background: rgba(255,255,255,.82) !important;

    box-shadow:
        0 8px 24px rgba(32,75,53,.06) !important;
}


/* Un peu plus de respiration/couleur derrière les cartes */
.gestion-grid {
    position: relative !important;
}

.gestion-card {
    background:
        rgba(255,255,255,.90) !important;

    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}


/* Mobile */
@media (max-width: 680px) {

    .gestion-header {
        width: calc(100% - 24px) !important;
    }

}


/* ==========================================================
   FOURNISSEURS
   ========================================================== */

.supplier-shell,
.supplier-form-shell {
    min-height: 100vh;
    color: #173f2c;

    background:
        radial-gradient(
            circle at 8% 20%,
            rgba(75, 177, 126, .19),
            transparent 30%
        ),
        radial-gradient(
            circle at 94% 30%,
            rgba(132, 94, 183, .12),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #f3f8f5 0%,
            #f8f5ef 100%
        );
}

.supplier-header {
    width: min(1420px, calc(100% - 40px));
    min-height: 72px;

    margin: 0 auto;
    padding: 12px 0;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.supplier-brand {
    display: flex;
    align-items: center;
    gap: 10px;

    padding: 7px 11px;

    border-radius: 14px;

    background: rgba(255,255,255,.78);

    color: #173f2c;
    text-decoration: none;

    box-shadow:
        0 8px 25px rgba(30,70,51,.06);
}

.supplier-brand > span {
    width: 39px;
    height: 39px;

    display: grid;
    place-items: center;

    border-radius: 12px;

    background: #e3f5ec;
}

.supplier-brand strong,
.supplier-brand small {
    display: block;
}

.supplier-brand small {
    margin-top: 2px;
    color: #75837c;
    font-size: .72rem;
}

.supplier-header__actions {
    display: flex;
    gap: 10px;
}

.supplier-header-button {
    padding: 10px 14px;

    border: 1px solid rgba(32,88,62,.12);
    border-radius: 11px;

    background: rgba(255,255,255,.88);

    color: #24533e;
    font-weight: 800;
    text-decoration: none;
}

.supplier-header-button--primary,
.supplier-primary-button {
    border: 0;

    background:
        linear-gradient(
            135deg,
            #218b68,
            #1ba980
        );

    color: #fff;
}

.supplier-content {
    width: min(1420px, calc(100% - 40px));
    margin: 0 auto;
    padding: 15px 0 50px;
}

.supplier-hero {
    min-height: 300px;

    padding: clamp(30px, 5vw, 65px);

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;

    border-radius: 27px;

    background:
        linear-gradient(
            110deg,
            rgba(255,255,255,.94) 0%,
            rgba(243,250,246,.91) 50%,
            rgba(236,228,247,.88) 100%
        );

    box-shadow:
        0 22px 55px rgba(35,71,52,.10);
}

.supplier-hero__content {
    max-width: 720px;
}

.supplier-badge {
    display: inline-flex;

    padding: 8px 12px;

    border-radius: 999px;

    background: #efe7f9;

    color: #71509d;

    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .06em;
}

.supplier-hero h1,
.supplier-form-intro h1 {
    margin: 18px 0 10px;

    color: #103f2c;

    font-size: clamp(2.4rem, 5vw, 4.4rem);
    line-height: 1;
}

.supplier-hero p,
.supplier-form-intro > p {
    max-width: 650px;

    color: #64766c;
    line-height: 1.65;
}

.supplier-hero__counter {
    width: 250px;

    padding: 28px;

    border-radius: 22px;

    background: rgba(255,255,255,.87);

    box-shadow:
        0 12px 35px rgba(45,75,59,.08);
}

.supplier-hero__counter small,
.supplier-hero__counter strong {
    display: block;
}

.supplier-hero__counter small {
    color: #718179;
}

.supplier-hero__counter strong {
    margin-top: 10px;

    color: #7e56a6;

    font-size: 2.3rem;
}

.supplier-section {
    margin-top: 43px;
}

.supplier-section__heading {
    margin-bottom: 20px;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
}

.supplier-section__heading span {
    color: #75509d;

    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
}

.supplier-section__heading h2 {
    margin: 6px 0 0;

    font-size: 2rem;
}

.supplier-primary-button,
.supplier-secondary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    padding: 12px 17px;

    border-radius: 12px;

    font: inherit;
    font-weight: 850;
    text-decoration: none;
    cursor: pointer;
}

.supplier-secondary-button {
    border: 1px solid rgba(33,84,59,.14);

    background: #fff;

    color: #476658;
}

.supplier-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 18px;
}

.supplier-card {
    min-height: 285px;

    padding: 23px;

    display: flex;
    flex-direction: column;

    border:
        1px solid rgba(34,91,65,.10);

    border-radius: 21px;

    background: rgba(255,255,255,.92);

    box-shadow:
        0 12px 35px rgba(35,70,53,.07);
}

.supplier-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.supplier-card__icon {
    width: 48px;
    height: 48px;

    display: grid;
    place-items: center;

    border-radius: 14px;

    background: #efe7f9;

    font-size: 1.4rem;
}

.supplier-card__status {
    padding: 6px 9px;

    border-radius: 999px;

    background: #f0f2f1;

    color: #7b8781;

    font-size: .65rem;
    font-weight: 900;
}

.supplier-card__status--active {
    background: #e4f7ed;
    color: #208059;
}

.supplier-card__eyebrow {
    margin-top: 20px;

    color: #7e5aa2;

    font-size: .67rem;
    font-weight: 900;
}

.supplier-card h3 {
    margin: 5px 0 14px;

    color: #173f2c;
}

.supplier-card__details {
    display: grid;
    gap: 7px;

    color: #6a7a72;
    font-size: .84rem;
}

.supplier-card__footer {
    margin-top: auto;
    padding-top: 18px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-top:
        1px solid rgba(37,83,61,.08);

    font-size: .83rem;
}

.supplier-card__footer span {
    color: #849089;
}

.supplier-card__footer a {
    color: #7650a1;
    font-weight: 900;
}

.supplier-empty {
    padding: 55px 25px;

    border-radius: 23px;

    background: rgba(255,255,255,.9);

    text-align: center;
}

.supplier-empty > span {
    font-size: 2.4rem;
}

.supplier-empty p {
    max-width: 500px;
    margin: 8px auto 22px;

    color: #708078;
}


/* FORMULAIRE */

.supplier-form-layout {
    width: min(1220px, calc(100% - 40px));

    margin: 28px auto 0;

    display: grid;
    grid-template-columns:
        minmax(0, .85fr)
        minmax(480px, 1.15fr);

    gap: 35px;

    align-items: start;
}

.supplier-form-intro {
    padding: clamp(28px, 5vw, 55px);
}

.supplier-form-intro h1 {
    font-size: clamp(2.4rem, 5vw, 4rem);
}

.supplier-form-tip {
    margin-top: 28px;
    padding: 18px;

    display: flex;
    gap: 12px;

    border-radius: 17px;

    background: rgba(238,247,242,.92);
}

.supplier-form-tip p {
    margin: 5px 0 0;

    color: #63766c;
    line-height: 1.5;
}

.supplier-form-card {
    padding: 28px;

    border:
        1px solid rgba(35,88,63,.10);

    border-radius: 24px;

    background: rgba(255,255,255,.94);

    box-shadow:
        0 20px 55px rgba(36,70,53,.09);
}

.supplier-form-grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 14px;
}

.supplier-form-grid--full {
    grid-template-columns: 1fr;
}

.supplier-form-card form > .supplier-form-grid {
    margin-bottom: 13px;
}

.supplier-form-card label {
    display: block;

    margin-bottom: 6px;

    color: #315846;

    font-size: .78rem;
    font-weight: 800;
}

.supplier-form-card input,
.supplier-form-card textarea,
.supplier-form-card select {
    width: 100%;

    padding: 12px 13px;

    border:
        1px solid rgba(32,82,59,.14);

    border-radius: 11px;

    background: #fbfcfb;

    color: #173f2c;

    font: inherit;
}

.supplier-form-card textarea {
    resize: vertical;
}

.supplier-form-actions {
    margin-top: 22px;

    display: flex;
    align-items: center;
    justify-content: flex-end;

    gap: 10px;
}


@media (max-width: 950px) {

    .supplier-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .supplier-form-layout {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 650px) {

    .supplier-header,
    .supplier-content,
    .supplier-form-layout {
        width: calc(100% - 24px);
    }

    .supplier-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .supplier-header__actions {
        width: 100%;
        flex-wrap: wrap;
    }

    .supplier-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .supplier-hero__counter {
        width: 100%;
    }

    .supplier-section__heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .supplier-grid,
    .supplier-form-grid {
        grid-template-columns: 1fr;
    }

}

/* ===== FIN FOURNISSEURS ===== */

/* ==========================================================
   FACTURES FOURNISSEURS
   ========================================================== */

.supplier-invoice-shell {
    min-height: 100vh;

    background:
        radial-gradient(
            circle at 8% 15%,
            rgba(75,177,126,.18),
            transparent 30%
        ),
        radial-gradient(
            circle at 92% 30%,
            rgba(133,94,183,.13),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #f3f8f5 0%,
            #f8f5ef 100%
        );
}

.supplier-invoice-hero {
    min-height: 300px;

    padding: clamp(30px, 5vw, 65px);

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 35px;

    border-radius: 27px;

    background:
        linear-gradient(
            120deg,
            rgba(255,255,255,.95),
            rgba(237,247,241,.94) 50%,
            rgba(240,232,249,.91)
        );

    box-shadow:
        0 22px 55px rgba(35,71,52,.10);
}

.supplier-invoice-hero h1 {
    margin: 18px 0 10px;

    color: #103f2c;

    font-size: clamp(2.3rem, 5vw, 4.3rem);
    line-height: 1;
}

.supplier-invoice-hero p {
    max-width: 650px;

    color: #64766c;
    line-height: 1.65;
}

.supplier-invoice-summary {
    min-width: 380px;

    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.supplier-invoice-summary article {
    padding: 20px 14px;

    border-radius: 17px;

    background: rgba(255,255,255,.88);

    text-align: center;

    box-shadow:
        0 10px 30px rgba(38,70,54,.07);
}

.supplier-invoice-summary small,
.supplier-invoice-summary strong {
    display: block;
}

.supplier-invoice-summary small {
    color: #76837d;
    font-size: .63rem;
    font-weight: 900;
}

.supplier-invoice-summary strong {
    margin-top: 8px;

    color: #7650a1;

    font-size: 1.7rem;
}

.supplier-invoice-list {
    display: grid;
    gap: 13px;
}

.supplier-invoice-card {
    padding: 19px 21px;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto
        auto;

    align-items: center;

    gap: 25px;

    border:
        1px solid rgba(31,86,62,.09);

    border-radius: 18px;

    background: rgba(255,255,255,.93);

    box-shadow:
        0 10px 30px rgba(35,70,53,.06);
}

.supplier-invoice-card__main {
    display: flex;
    align-items: center;
    gap: 15px;
}

.supplier-invoice-card__icon {
    width: 50px;
    height: 50px;

    display: grid;
    place-items: center;

    flex: 0 0 auto;

    border-radius: 15px;

    background: #efe7f9;

    font-size: 1.35rem;
}

.supplier-invoice-card__main small {
    color: #75509d;

    font-size: .7rem;
    font-weight: 900;
}

.supplier-invoice-card__main h3 {
    margin: 4px 0 7px;

    color: #173f2c;
}

.supplier-invoice-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;

    color: #75817b;

    font-size: .79rem;
}

.supplier-invoice-card__amount {
    text-align: right;
}

.supplier-invoice-card__amount small,
.supplier-invoice-card__amount strong {
    display: block;
}

.supplier-invoice-card__amount small {
    color: #87918c;
}

.supplier-invoice-card__amount strong {
    margin: 3px 0 6px;

    color: #173f2c;

    font-size: 1.25rem;
}

.supplier-payment-status {
    display: inline-flex;

    padding: 5px 8px;

    border-radius: 999px;

    font-size: .63rem;
    font-weight: 900;
}

.supplier-payment-status--unpaid {
    background: #fff0e7;
    color: #ad622f;
}

.supplier-payment-status--partial {
    background: #fff6d8;
    color: #92711d;
}

.supplier-payment-status--paid {
    background: #e3f6eb;
    color: #237650;
}

.supplier-invoice-card__actions a {
    color: #7650a1;

    font-size: .83rem;
    font-weight: 900;
}

.supplier-invoice-amounts {
    margin-bottom: 14px;

    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 12px;

    padding: 15px;

    border-radius: 15px;

    background: #f5f8f6;
}

.supplier-document-field {
    margin-bottom: 14px;

    padding: 16px;

    border:
        1px dashed rgba(78,117,98,.27);

    border-radius: 15px;

    background: #fbfcfb;
}

.supplier-document-field small {
    display: block;
    margin-top: 6px;

    color: #7b8781;
}

.supplier-duplicate-warning {
    margin-bottom: 20px;
    padding: 17px;

    display: flex;
    gap: 12px;

    border:
        1px solid rgba(180,80,61,.18);

    border-radius: 15px;

    background: #fff1ed;

    color: #8e4137;
}

.supplier-duplicate-warning p {
    margin: 5px 0;
    line-height: 1.5;
}

.supplier-duplicate-warning small {
    color: #a26157;
}

@media (max-width: 850px) {

    .supplier-invoice-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .supplier-invoice-summary {
        width: 100%;
        min-width: 0;
    }

    .supplier-invoice-card {
        grid-template-columns: 1fr;
    }

    .supplier-invoice-card__amount {
        text-align: left;
    }

}

@media (max-width: 650px) {

    .supplier-invoice-summary,
    .supplier-invoice-amounts {
        grid-template-columns: 1fr;
    }

}

/* ===== FIN FACTURES FOURNISSEURS ===== */

.supplier-duplicate-override {
    padding: 12px 17px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: #b65b45 !important;
    color: #fff !important;
    font: inherit !important;
    font-weight: 850 !important;
    cursor: pointer !important;
}

.supplier-duplicate-badge {
    color: #a6533f !important;
    font-weight: 850 !important;
}


/* ==========================================================
   FACTURE FOURNISSEUR - AJUSTEMENT VISUEL FORMULAIRE
   ========================================================== */

.supplier-invoice-form-page .supplier-form-shell {
    min-height: 100vh;

    background:
        radial-gradient(
            circle at 8% 18%,
            rgba(62, 178, 119, .24),
            transparent 31%
        ),
        radial-gradient(
            circle at 90% 20%,
            rgba(142, 91, 190, .19),
            transparent 30%
        ),
        radial-gradient(
            circle at 78% 88%,
            rgba(224, 187, 113, .16),
            transparent 28%
        ),
        linear-gradient(
            135deg,
            #eef8f1 0%,
            #f7f4ed 48%,
            #f3edf9 100%
        );
}


/* Header ramené sur la largeur du contenu */
.supplier-invoice-form-page .supplier-header {
    width: min(980px, calc(100% - 40px));
    margin-left: auto;
    margin-right: auto;
}


/* Logo un peu plus présent */
.supplier-invoice-form-page .supplier-brand {
    background: rgba(255, 255, 255, .88);

    box-shadow:
        0 8px 24px rgba(28, 85, 57, .10);
}


/* Bouton retour plus intégré à l'ambiance */
.supplier-invoice-form-page .supplier-header-button {
    background: rgba(255, 255, 255, .88);

    border-color: rgba(65, 122, 91, .16);

    box-shadow:
        0 8px 24px rgba(44, 73, 59, .08);
}


/* Carte formulaire légèrement plus chaleureuse */
.supplier-invoice-form-page .supplier-form-card {
    background: rgba(255, 255, 255, .93);

    box-shadow:
        0 24px 60px rgba(44, 73, 59, .13);
}


/* Bloc protection un peu plus vivant */
.supplier-invoice-form-page .supplier-form-tip {
    background:
        linear-gradient(
            135deg,
            rgba(227, 247, 236, .96),
            rgba(239, 247, 241, .94)
        );

    border:
        1px solid rgba(46, 157, 103, .10);
}


@media (max-width: 850px) {

    .supplier-invoice-form-page .supplier-header {
        width: calc(100% - 28px);
    }

}

/* ===== FIN AJUSTEMENT FACTURE FOURNISSEUR ===== */


/* ===== FACTURE FOURNISSEUR : FICHE DETAIL ===== */

.supplier-detail-content {
    padding-bottom: 56px;
}

.supplier-detail-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 28px;
    padding: 34px;
    border: 1px solid rgba(45, 70, 50, .10);
    border-radius: 28px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 18px 45px rgba(46, 57, 43, .08);
    backdrop-filter: blur(10px);
}

.supplier-detail-hero__text h1 {
    margin: 12px 0 7px;
    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 1;
}

.supplier-detail-hero__text > p {
    margin: 0;
    font-size: 1.08rem;
    color: #667065;
}

.supplier-detail-total {
    min-width: 220px;
    padding: 22px 24px;
    border-radius: 22px;
    background:
        linear-gradient(
            145deg,
            rgba(238, 246, 232, .95),
            rgba(246, 238, 226, .95)
        );
}

.supplier-detail-total small,
.supplier-detail-field small,
.supplier-detail-amounts small,
.supplier-payment-preparation small,
.supplier-detail-notes small {
    display: block;
    margin-bottom: 6px;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
    color: #778073;
}

.supplier-detail-total > strong {
    display: block;
    margin-bottom: 15px;
    font-size: 2rem;
    color: #243328;
}

.supplier-detail-duplicate {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: fit-content;
    margin-top: 20px;
    padding: 12px 16px;
    border-radius: 14px;
    background: #fff1d8;
    color: #805815;
}

.supplier-detail-duplicate span {
    font-size: .82rem;
}

.supplier-detail-grid {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(360px, .92fr);
    gap: 24px;
    margin-bottom: 24px;
}

.supplier-detail-card {
    padding: 30px;
    border: 1px solid rgba(49, 67, 49, .10);
    border-radius: 26px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 16px 40px rgba(49, 61, 47, .07);
}

.supplier-detail-card__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 25px;
}

.supplier-detail-card__heading span:first-child {
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .1em;
    color: #6a7a68;
}

.supplier-detail-card__heading h2 {
    margin: 5px 0 0;
    font-size: 1.45rem;
}

.supplier-detail-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.supplier-detail-field {
    min-height: 88px;
    padding: 16px;
    border-radius: 17px;
    background: #f7f8f4;
}

.supplier-detail-field strong {
    font-size: .98rem;
    color: #29332b;
}

.supplier-detail-amounts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #e8ebe5;
}

.supplier-detail-amounts > div {
    padding: 15px;
    border-radius: 16px;
    background: #f7f8f4;
}

.supplier-detail-amounts__total {
    background: #eef5e9 !important;
}

.supplier-detail-amounts strong {
    font-size: 1.05rem;
}

.supplier-detail-notes {
    margin-top: 18px;
    padding: 18px;
    border-radius: 17px;
    background: #faf7f1;
}

.supplier-detail-notes p {
    margin: 0;
    line-height: 1.6;
    color: #4c564c;
}

.supplier-document-info {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px;
    border-radius: 18px;
    background: #f7f8f4;
}

.supplier-document-info > div:last-child {
    min-width: 0;
}

.supplier-document-info strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.supplier-document-info small {
    display: block;
    margin-top: 4px;
    color: #768076;
}

.supplier-document-icon {
    display: grid;
    place-items: center;
    flex: 0 0 54px;
    height: 54px;
    border-radius: 16px;
    background: #e7efe2;
    font-size: .75rem;
    font-weight: 900;
    color: #446044;
}

.supplier-document-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 17px 0;
}

.supplier-secondary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 18px;
    border: 1px solid #d7ddd3;
    border-radius: 13px;
    background: #fff;
    color: #39473c;
    font-weight: 750;
    text-decoration: none;
}

.supplier-document-preview {
    overflow: hidden;
    max-height: 580px;
    border: 1px solid #e1e5df;
    border-radius: 18px;
    background: #f2f3f1;
}

.supplier-document-preview img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 580px;
    object-fit: contain;
}

.supplier-document-preview--pdf {
    height: 580px;
}

.supplier-document-preview--pdf iframe {
    width: 100%;
    height: 100%;
    border: 0;
    background: #fff;
}

.supplier-document-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 310px;
    padding: 35px;
    text-align: center;
    border: 1px dashed #ccd4c9;
    border-radius: 20px;
    background: #fafbf8;
}

.supplier-document-empty > span {
    font-size: 2.2rem;
}

.supplier-document-empty h3 {
    margin: 12px 0 5px;
}

.supplier-document-empty p {
    max-width: 340px;
    margin: 0 0 18px;
    color: #737c72;
}

.supplier-payment-card {
    margin-bottom: 18px;
}

.supplier-payment-preparation__summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.supplier-payment-preparation__summary > div {
    padding: 17px;
    border-radius: 17px;
    background: #f7f8f4;
}

.supplier-payment-preparation__summary strong {
    display: block;
    font-size: 1.08rem;
}

.supplier-payment-empty {
    display: flex;
    align-items: center;
    gap: 17px;
    padding: 20px;
    border-radius: 19px;
    background:
        linear-gradient(
            135deg,
            rgba(245, 239, 229, .9),
            rgba(238, 241, 248, .9)
        );
}

.supplier-payment-empty > span {
    font-size: 1.8rem;
}

.supplier-payment-empty > div {
    flex: 1;
}

.supplier-payment-empty p {
    margin: 4px 0 0;
    color: #6f776e;
}

.supplier-disabled-button {
    padding: 11px 17px;
    border: 0;
    border-radius: 13px;
    background: #dfe3dc;
    color: #899087;
    font-weight: 750;
    cursor: not-allowed;
}

.supplier-detail-history {
    padding: 5px 5px 0;
    font-size: .8rem;
    color: #7e877d;
}

.supplier-invoice-card__actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

.supplier-invoice-card__actions a {
    text-decoration: none;
}

@media (max-width: 1000px) {

    .supplier-detail-grid {
        grid-template-columns: 1fr;
    }

    .supplier-detail-hero {
        flex-direction: column;
    }

    .supplier-detail-total {
        width: 100%;
    }
}

@media (max-width: 700px) {

    .supplier-detail-hero,
    .supplier-detail-card {
        padding: 22px;
        border-radius: 22px;
    }

    .supplier-detail-fields,
    .supplier-detail-amounts,
    .supplier-payment-preparation__summary {
        grid-template-columns: 1fr;
    }

    .supplier-payment-empty {
        align-items: flex-start;
        flex-direction: column;
    }

    .supplier-document-preview--pdf {
        height: 480px;
    }
}

/* ===== FACTURE FOURNISSEUR : FINITIONS FICHE DETAIL ===== */

/* Chaque carte garde sa hauteur naturelle */
.supplier-detail-grid {
    align-items: start;
}

/* Libellés un peu plus lisibles */
.supplier-detail-field small,
.supplier-detail-amounts small,
.supplier-payment-preparation small,
.supplier-detail-notes small,
.supplier-detail-total small {
    font-size: .78rem;
    line-height: 1.3;
}

/* Meilleure lisibilité des valeurs */
.supplier-detail-field strong {
    line-height: 1.35;
}

/* Aperçu du document plus confortable sur grand écran */
@media (min-width: 1001px) {
    .supplier-document-preview--pdf {
        height: 640px;
    }

    .supplier-document-preview img {
        max-height: 640px;
    }

    .supplier-document-preview {
        max-height: 640px;
    }
}


/* ===== FACTURE FOURNISSEUR : LAYOUT DETAIL FINAL ===== */

@media (min-width: 1001px) {

    .supplier-detail-grid {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(400px, .92fr);
        grid-template-rows: auto auto;
        align-items: start;
    }

    .supplier-detail-grid
    > .supplier-detail-card:nth-child(1) {
        grid-column: 1;
        grid-row: 1;
    }

    .supplier-detail-grid
    > .supplier-detail-card:nth-child(2) {
        grid-column: 2;
        grid-row: 1 / span 2;
    }

    .supplier-detail-grid
    > .supplier-payment-card {
        grid-column: 1;
        grid-row: 2;
        margin-bottom: 0;
    }

}

@media (max-width: 1000px) {

    .supplier-detail-grid
    > .supplier-detail-card,
    .supplier-detail-grid
    > .supplier-payment-card {
        grid-column: auto;
        grid-row: auto;
    }

}



/* ===== REGLEMENT FOURNISSEUR : FORMULAIRE ===== */

.supplier-payment-form-content {
    max-width: 1180px;
    margin: 0 auto;
    padding-bottom: 60px;
}

.supplier-payment-form-hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 28px;
    margin-bottom: 24px;
    padding: 32px;
    border: 1px solid rgba(45, 70, 50, .10);
    border-radius: 28px;
    background: rgba(255, 255, 255, .90);
    box-shadow: 0 18px 45px rgba(46, 57, 43, .08);
}

.supplier-payment-form-hero h1 {
    margin: 12px 0 7px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.supplier-payment-form-hero p {
    margin: 0;
    color: #687267;
}

.supplier-payment-form-balance {
    display: grid;
    grid-template-columns: repeat(3, minmax(130px, 1fr));
    gap: 10px;
    min-width: 470px;
}

.supplier-payment-form-balance > div {
    padding: 16px;
    border-radius: 17px;
    background: #f6f7f3;
}

.supplier-payment-form-balance small {
    display: block;
    margin-bottom: 5px;
    font-size: .69rem;
    font-weight: 850;
    letter-spacing: .07em;
    color: #788176;
}

.supplier-payment-form-balance strong {
    font-size: 1.08rem;
    color: #29352c;
}

.supplier-payment-form-balance__remaining {
    background: #eaf3e5 !important;
}

.supplier-payment-form-card {
    padding: 30px;
    border: 1px solid rgba(49, 67, 49, .10);
    border-radius: 26px;
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 16px 40px rgba(49, 61, 47, .07);
}

.supplier-payment-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.supplier-payment-form-field {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.supplier-payment-form-field--wide {
    grid-column: 1 / -1;
}

.supplier-payment-form-field label {
    font-size: .82rem;
    font-weight: 800;
    color: #435045;
}

.supplier-payment-form-field input,
.supplier-payment-form-field select,
.supplier-payment-form-field textarea {
    width: 100%;
    min-height: 48px;
    padding: 11px 13px;
    border: 1px solid #d7ddd3;
    border-radius: 13px;
    background: #fbfcfa;
    font: inherit;
    color: #29332b;
}

.supplier-payment-form-field textarea {
    min-height: 105px;
    resize: vertical;
}

.supplier-payment-form-field > small {
    font-size: .76rem;
    color: #7a8378;
}

.supplier-payment-form-field ul {
    margin: 2px 0 0;
    padding-left: 19px;
    color: #a34135;
    font-size: .8rem;
}

.supplier-payment-amount-input {
    position: relative;
}

.supplier-payment-amount-input input {
    padding-right: 42px;
}

.supplier-payment-amount-input > span {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    font-weight: 800;
    color: #667064;
}

.supplier-payment-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 26px;
    padding-top: 22px;
    border-top: 1px solid #e7eae4;
}

.supplier-payment-form-actions button {
    border: 0;
    cursor: pointer;
    font: inherit;
}

@media (max-width: 900px) {

    .supplier-payment-form-hero {
        flex-direction: column;
    }

    .supplier-payment-form-balance {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 650px) {

    .supplier-payment-form-grid,
    .supplier-payment-form-balance {
        grid-template-columns: 1fr;
    }

    .supplier-payment-form-card,
    .supplier-payment-form-hero {
        padding: 21px;
        border-radius: 21px;
    }

    .supplier-payment-form-actions {
        flex-direction: column-reverse;
    }

    .supplier-payment-form-actions > * {
        width: 100%;
    }
}

/* ===== REGLEMENT FOURNISSEUR : ALIGNEMENT HEADER ===== */

/*
 * Le logo et le bouton retour suivent exactement
 * la largeur du contenu de la page règlement.
 * Cette règle ne concerne que cette page.
 */
.supplier-payment-form-page .supplier-header {
    width: min(1180px, calc(100% - 32px));
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

@media (max-width: 650px) {
    .supplier-payment-form-page .supplier-header {
        width: calc(100% - 20px);
    }
}



/* ===== REGLEMENT FOURNISSEUR : HISTORIQUE ===== */

.supplier-payment-history {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.supplier-payment-history__item {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 15px;
    border: 1px solid #e5e9e2;
    border-radius: 16px;
    background: #fafbf8;
}

.supplier-payment-history__icon {
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    height: 42px;
    border-radius: 13px;
    background: #e9f3e4;
}

.supplier-payment-history__main {
    flex: 1;
    min-width: 0;
}

.supplier-payment-history__top {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 5px;
}

.supplier-payment-history__top strong {
    font-size: 1.05rem;
    color: #25362a;
}

.supplier-payment-history__top span {
    font-size: .8rem;
    font-weight: 700;
    color: #6e786d;
}

.supplier-payment-history__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 14px;
    font-size: .78rem;
    color: #70796f;
}

.supplier-payment-history__main p {
    margin: 7px 0 0;
    font-size: .79rem;
    line-height: 1.45;
    color: #606a60;
}

.supplier-payment-add {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 14px;
    padding: 14px 15px;
    border-radius: 16px;
    background: #f4f6f1;
}

.supplier-payment-add small {
    display: block;
    margin-bottom: 3px;
    font-size: .67rem;
    font-weight: 850;
    letter-spacing: .07em;
    color: #778176;
}

.supplier-payment-add strong {
    color: #26372a;
}

.supplier-payment-complete {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-top: 14px;
    padding: 15px;
    border-radius: 16px;
    background: #eaf4e5;
    color: #315334;
}

.supplier-payment-complete > span {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .75);
    font-weight: 900;
}

.supplier-payment-complete p {
    margin: 2px 0 0;
    font-size: .78rem;
}

@media (max-width: 650px) {
    .supplier-payment-add {
        align-items: stretch;
        flex-direction: column;
    }

    .supplier-payment-add .supplier-primary-button {
        width: 100%;
    }
}



/* ===== REGLEMENT FOURNISSEUR : ACTIONS HISTORIQUE ===== */

.supplier-payment-history__actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 9px;
}

.supplier-payment-history__actions form {
    margin: 0;
}

.supplier-payment-history__actions a,
.supplier-payment-history__actions button {
    padding: 0;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: .76rem;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
}

.supplier-payment-history__actions a {
    color: #28795c;
}

.supplier-payment-history__actions button {
    color: #a34a3e;
}

.supplier-payment-history__actions a:hover,
.supplier-payment-history__actions button:hover {
    text-decoration: underline;
}


/* ===== DEPENSES : PAGE INDEX ===== */

.expense-shell {
    min-height: 100vh;
    padding-bottom: 60px;
}

.expense-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: min(1240px, calc(100% - 40px));
    margin: 0 auto;
    padding: 22px 0;
}

.expense-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: inherit;
    text-decoration: none;
}

.expense-brand > span {
    font-size: 1.75rem;
}

.expense-brand strong,
.expense-brand small {
    display: block;
}

.expense-brand small {
    margin-top: 2px;
    color: #737c72;
}

.expense-header__actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.expense-header-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 17px;
    border: 1px solid rgba(46, 64, 48, .14);
    border-radius: 14px;
    background: rgba(255, 255, 255, .86);
    color: #344439;
    font-weight: 750;
    text-decoration: none;
}

.expense-header-button--disabled {
    opacity: .48;
    cursor: not-allowed;
}

.expense-content {
    width: min(1240px, calc(100% - 40px));
    margin: 0 auto;
}

.expense-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 32px;
    padding: 34px;
    border: 1px solid rgba(44, 66, 47, .10);
    border-radius: 28px;
    background:
        linear-gradient(
            135deg,
            rgba(239, 247, 233, .96),
            rgba(250, 242, 229, .96) 52%,
            rgba(242, 238, 248, .94)
        );
    box-shadow: 0 18px 45px rgba(49, 61, 47, .08);
}

.expense-badge {
    display: inline-flex;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .72);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
}

.expense-hero h1 {
    margin: 13px 0 8px;
    font-size: clamp(2rem, 4vw, 3.1rem);
    line-height: 1;
}

.expense-hero p {
    max-width: 620px;
    margin: 0;
    line-height: 1.55;
    color: #667065;
}

.expense-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(150px, 1fr));
    gap: 10px;
    min-width: 520px;
}

.expense-summary article {
    padding: 17px;
    border-radius: 18px;
    background: rgba(255, 255, 255, .82);
}

.expense-summary small {
    display: block;
    min-height: 30px;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .07em;
    color: #778176;
}

.expense-summary strong {
    display: block;
    margin-top: 4px;
    font-size: 1.25rem;
    color: #28362c;
}

.expense-summary span {
    display: block;
    margin-top: 4px;
    font-size: .75rem;
    color: #7a8378;
}

.expense-info {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 18px 0;
    padding: 16px 19px;
    border-radius: 18px;
    background: rgba(235, 244, 231, .86);
}

.expense-info > span {
    font-size: 1.45rem;
}

.expense-info strong {
    display: block;
}

.expense-info p {
    margin: 3px 0 0;
    font-size: .84rem;
    color: #687267;
}

.expense-section {
    padding: 28px;
    border: 1px solid rgba(49, 67, 49, .10);
    border-radius: 26px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 16px 40px rgba(49, 61, 47, .06);
}

.expense-section__heading {
    margin-bottom: 20px;
}

.expense-section__heading span {
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .1em;
    color: #71806f;
}

.expense-section__heading h2 {
    margin: 4px 0 0;
}

.expense-list {
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.expense-card {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(150px, auto)
        minmax(145px, auto);
    align-items: center;
    gap: 22px;
    padding: 17px;
    border: 1px solid #e5e9e2;
    border-radius: 18px;
    background: #fbfcfa;
}

.expense-card__main {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 14px;
}

.expense-card__icon {
    display: grid;
    place-items: center;
    flex: 0 0 50px;
    height: 50px;
    border-radius: 15px;
    font-size: 1.35rem;
}

.expense-card__icon--supplier_invoice {
    background: #eaf3e5;
}

.expense-card__icon--manual {
    background: #f6eddf;
}

.expense-card__text {
    min-width: 0;
}

.expense-card__labels {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.expense-origin,
.expense-duplicate {
    display: inline-flex;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: .64rem;
    font-weight: 850;
}

.expense-origin--invoice {
    background: #e8f2e3;
    color: #436343;
}

.expense-origin--manual {
    background: #f5ecdf;
    color: #785d35;
}

.expense-duplicate {
    background: #fff0d7;
    color: #835d18;
}

.expense-card h3 {
    margin: 6px 0 5px;
    font-size: 1rem;
}

.expense-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 14px;
    font-size: .76rem;
    color: #717a70;
}

.expense-card__amount {
    text-align: right;
}

.expense-card__amount small {
    display: block;
    margin-bottom: 3px;
    font-size: .67rem;
    font-weight: 850;
    color: #788177;
}

.expense-card__amount strong {
    display: block;
    margin-bottom: 7px;
    font-size: 1.08rem;
}

.expense-card__actions {
    text-align: right;
}

.expense-card__actions a {
    color: #28795c;
    font-size: .79rem;
    font-weight: 800;
    text-decoration: none;
}

.expense-card__actions span {
    font-size: .75rem;
    color: #929990;
}

.expense-empty {
    padding: 50px 25px;
    text-align: center;
}

.expense-empty > span {
    font-size: 2rem;
}

.expense-empty h3 {
    margin: 10px 0 5px;
}

.expense-empty p {
    max-width: 500px;
    margin: 0 auto;
    color: #737c72;
}

@media (max-width: 1000px) {

    .expense-hero {
        flex-direction: column;
    }

    .expense-summary {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 760px) {

    .expense-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .expense-header__actions {
        width: 100%;
        flex-wrap: wrap;
    }

    .expense-card {
        grid-template-columns: 1fr;
    }

    .expense-card__amount,
    .expense-card__actions {
        text-align: left;
    }

    .expense-summary {
        grid-template-columns: 1fr;
    }
}


/* ===== MA FERME PEI : BANQUE ===== */

.banque-page {
    min-height: 100vh;
    background: #f4f7f3;
}

.banque-shell {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
    padding: 24px 0 64px;
}

.banque-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 36px;
}

.banque-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: inherit;
    text-decoration: none;
}

.banque-brand__icon {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(31, 63, 44, .08);
    font-size: 23px;
}

.banque-brand span:last-child {
    display: flex;
    flex-direction: column;
}

.banque-brand strong {
    font-size: 17px;
}

.banque-brand small {
    margin-top: 2px;
    color: #66756b;
}

.banque-back {
    color: #365c44;
    font-weight: 700;
    text-decoration: none;
}

.banque-title,
.banque-form-title {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 28px;
}

.banque-form-title {
    display: block;
    max-width: 760px;
}

.banque-eyebrow {
    display: inline-block;
    margin-bottom: 8px;
    color: #407451;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
}

.banque-title h1,
.banque-form-title h1 {
    margin: 0;
    color: #203d2a;
    font-size: clamp(30px, 4vw, 44px);
    line-height: 1.08;
}

.banque-title p,
.banque-form-title p {
    max-width: 720px;
    margin: 12px 0 0;
    color: #637169;
    font-size: 16px;
    line-height: 1.65;
}

.banque-primary-button,
.banque-secondary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 20px;
    border: 0;
    border-radius: 12px;
    font: inherit;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.banque-primary-button {
    background: #285d3b;
    color: #fff;
}

.banque-secondary-button {
    background: #eef2ef;
    color: #365c44;
}

.banque-flash {
    margin-bottom: 22px;
    padding: 14px 18px;
    border-radius: 12px;
    font-weight: 700;
}

.banque-flash--success {
    background: #e9f7ed;
    color: #24623a;
}

.banque-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 32px;
}

.banque-summary article {
    padding: 22px;
    border: 1px solid #e2e9e3;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(35, 68, 46, .05);
}

.banque-summary span,
.banque-summary small {
    display: block;
    color: #718078;
}

.banque-summary strong {
    display: block;
    margin-top: 8px;
    color: #213f2b;
    font-size: 30px;
}

.banque-summary small {
    margin-top: 4px;
    font-size: 12px;
}

.banque-section {
    padding: 28px;
    border: 1px solid #e3e9e4;
    border-radius: 22px;
    background: #fff;
}

.banque-section__heading {
    margin-bottom: 22px;
}

.banque-section__heading span {
    color: #65816d;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
}

.banque-section__heading h2 {
    margin: 6px 0 0;
    color: #263f2d;
}

.banque-empty {
    padding: 55px 24px;
    border: 1px dashed #ccd8ce;
    border-radius: 18px;
    background: #f8faf8;
    text-align: center;
}

.banque-empty__icon {
    margin-bottom: 10px;
    font-size: 38px;
}

.banque-empty h3 {
    margin: 0;
    color: #294632;
}

.banque-empty p {
    max-width: 520px;
    margin: 10px auto 22px;
    color: #6a786f;
}

.banque-account-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.banque-account {
    padding: 22px;
    border: 1px solid #dde7df;
    border-radius: 18px;
    background: #fbfcfb;
}

.banque-account--inactive {
    opacity: .66;
}

.banque-account__top {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.banque-account__icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    background: #eef5ef;
    font-size: 21px;
}

.banque-status {
    height: fit-content;
    padding: 6px 10px;
    border-radius: 999px;
    background: #ecefed;
    color: #667169;
    font-size: 12px;
    font-weight: 800;
}

.banque-status--active {
    background: #e3f4e7;
    color: #256239;
}

.banque-account h3 {
    margin: 18px 0 4px;
    color: #233f2c;
    font-size: 20px;
}

.banque-account__bank {
    margin: 0 0 20px;
    color: #6e7b73;
}

.banque-account__details {
    margin: 0;
}

.banque-account__details > div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 11px 0;
    border-top: 1px solid #e7ebe8;
}

.banque-account__details dt {
    color: #758078;
}

.banque-account__details dd {
    margin: 0;
    color: #294432;
    font-weight: 800;
    text-align: right;
}

.banque-account__future {
    margin-top: 18px;
    padding: 12px 14px;
    border-radius: 11px;
    background: #f0f4f1;
    color: #6a766e;
    font-size: 13px;
    line-height: 1.5;
}

.banque-form-card {
    max-width: 900px;
    padding: 30px;
    border: 1px solid #e1e8e2;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(30, 62, 41, .05);
}

.banque-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.banque-field {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.banque-field--full {
    grid-column: 1 / -1;
}

.banque-field label {
    color: #334c3b;
    font-weight: 800;
}

.banque-field input:not([type="checkbox"]),
.banque-field select {
    width: 100%;
    min-height: 48px;
    padding: 10px 13px;
    border: 1px solid #ccd8cf;
    border-radius: 11px;
    background: #fff;
    color: #233b2a;
    font: inherit;
}

.banque-field input:focus,
.banque-field select:focus {
    outline: 3px solid rgba(47, 111, 68, .12);
    border-color: #548564;
}

.banque-field .form-help,
.banque-field small {
    color: #78847c;
    font-size: 12px;
    line-height: 1.45;
}

.banque-field--checkbox {
    justify-content: flex-end;
}

.banque-field--checkbox > label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 0;
}

.banque-field--checkbox input {
    margin-top: 4px;
}

.banque-field--checkbox span {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.banque-field--checkbox span > div,
.banque-field--checkbox span > small {
    font-weight: 400;
}

.banque-security-note {
    display: flex;
    gap: 12px;
    margin-top: 26px;
    padding: 15px 17px;
    border-radius: 13px;
    background: #f1f6f2;
    color: #53655a;
}

.banque-security-note p {
    margin: 0;
    line-height: 1.55;
}

.banque-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 28px;
    padding-top: 22px;
    border-top: 1px solid #e7ece8;
}

@media (max-width: 760px) {
    .banque-shell {
        width: min(100% - 22px, 1180px);
    }

    .banque-title {
        align-items: stretch;
        flex-direction: column;
    }

    .banque-summary,
    .banque-account-grid,
    .banque-form-grid {
        grid-template-columns: 1fr;
    }

    .banque-field--full {
        grid-column: auto;
    }

    .banque-header {
        align-items: flex-start;
    }

    .banque-section,
    .banque-form-card {
        padding: 20px;
    }

    .banque-form-actions {
        flex-direction: column-reverse;
    }

    .banque-form-actions a,
    .banque-form-actions button {
        width: 100%;
    }
}


/* ===== BANQUE ACTIONS COMPTE ===== */

.banque-account__actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #e7ebe8;
}

.banque-account__edit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 15px;
    border: 1px solid #cad7cd;
    border-radius: 10px;
    background: #fff;
    color: #315d40;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
}

.banque-account__edit:hover {
    background: #f2f7f3;
}


/* ===== BANQUE FICHE COMPTE ===== */

.banque-account__actions {
    gap: 9px;
}

.banque-account__open {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 15px;
    border-radius: 10px;
    background: #285d3b;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
}

.banque-account-header-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}

.banque-account-hero {
    display: flex;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 22px;
    padding: 26px 28px;
    border: 1px solid #dfe7e1;
    border-radius: 22px;
    background: #fff;
}

.banque-account-hero h1 {
    margin: 0;
    color: #203d2a;
    font-size: clamp(30px, 4vw, 42px);
}

.banque-account-hero p {
    margin: 9px 0 0;
    color: #68766d;
}

.banque-account-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

.banque-account-summary article {
    padding: 20px 22px;
    border: 1px solid #e1e8e2;
    border-radius: 17px;
    background: #fff;
}

.banque-account-summary span,
.banque-account-summary small {
    display: block;
    color: #718078;
}

.banque-account-summary strong {
    display: block;
    margin: 7px 0 3px;
    color: #23422d;
    font-size: 26px;
}

.banque-flow-summary {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-bottom: 30px;
}

.banque-flow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 20px;
    border-radius: 15px;
}

.banque-flow span {
    font-weight: 700;
}

.banque-flow strong {
    font-size: 18px;
}

.banque-flow--credit {
    background: #eaf6ed;
    color: #28643b;
}

.banque-flow--debit {
    background: #fff0ec;
    color: #9b4937;
}

.banque-movement-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.banque-movement-heading h2 {
    margin: 3px 0 0;
    color: #263f2d;
}

.banque-primary-button:disabled {
    opacity: .55;
    cursor: not-allowed;
}

.banque-movement-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.banque-movement {
    display: grid;
    grid-template-columns:
        125px
        minmax(0, 1fr)
        120px
        130px;
    align-items: center;
    gap: 18px;
    padding: 16px 18px;
    border: 1px solid #e1e7e2;
    border-radius: 14px;
    background: #fbfcfb;
}

.banque-movement__date,
.banque-movement__main {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.banque-movement small {
    color: #78847c;
    font-size: 12px;
}

.banque-movement__amount {
    font-size: 17px;
    font-weight: 900;
    text-align: right;
}

.banque-movement__amount--credit {
    color: #27713f;
}

.banque-movement__amount--debit {
    color: #a64d3c;
}

.banque-match-status {
    display: inline-flex;
    padding: 6px 9px;
    border-radius: 999px;
    background: #ecefed;
    color: #69746c;
    font-size: 11px;
    font-weight: 800;
}

.banque-match-status--todo {
    background: #fff0d9;
    color: #9a5a12;
}

.banque-match-status--partial {
    background: #f4eede;
    color: #766018;
}

.banque-match-status--matched {
    background: #e4f5e8;
    color: #28683d;
}

@media (max-width: 760px) {

    .banque-account-summary,
    .banque-flow-summary {
        grid-template-columns: 1fr;
    }

    .banque-account-hero,
    .banque-movement-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .banque-account-header-actions {
        align-items: flex-end;
        flex-direction: column;
    }

    .banque-movement {
        grid-template-columns: 1fr;
        gap: 9px;
    }

    .banque-movement__amount {
        text-align: left;
    }
}


/* ===== BANQUE IMPORT CSV ===== */

.banque-import-drop {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 34px 22px;
    border: 2px dashed #ccd9cf;
    border-radius: 18px;
    background: #f8faf8;
    text-align: center;
}

.banque-import-drop__icon {
    font-size: 36px;
}

.banque-import-drop label {
    color: #294632;
    font-size: 17px;
    font-weight: 800;
}

.banque-import-drop input[type="file"] {
    max-width: 100%;
}

.banque-import-drop small {
    color: #77847b;
}

.banque-import-error {
    margin-bottom: 20px;
    padding: 14px 17px;
    border-radius: 12px;
    background: #fff0ec;
    color: #954735;
    font-weight: 700;
}

.banque-import-preview {
    margin-top: 28px;
    padding: 28px;
    border: 1px solid #e0e8e2;
    border-radius: 22px;
    background: #fff;
}

.banque-import-preview__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 20px;
}

.banque-import-preview__heading h2 {
    margin: 3px 0;
    color: #243f2c;
}

.banque-import-preview__heading p {
    margin: 5px 0 0;
    color: #758078;
}

.banque-import-preview__safe {
    padding: 8px 11px;
    border-radius: 999px;
    background: #e7f5ea;
    color: #28643c;
    font-size: 12px;
    font-weight: 800;
}

.banque-import-columns {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
}

.banque-import-columns strong,
.banque-import-columns span {
    padding: 7px 10px;
    border-radius: 9px;
    background: #f0f4f1;
    color: #56665c;
    font-size: 12px;
}

.banque-import-table-wrap {
    overflow-x: auto;
}

.banque-import-table {
    width: 100%;
    border-collapse: collapse;
}

.banque-import-table th,
.banque-import-table td {
    padding: 12px 11px;
    border-bottom: 1px solid #e8ece9;
    text-align: left;
}

.banque-import-table th {
    color: #64736a;
    font-size: 12px;
}

.banque-import-table td:last-child,
.banque-import-table th:last-child {
    text-align: right;
}

.bank-amount-positive {
    color: #26713f;
    font-weight: 800;
}

.bank-amount-negative {
    color: #a14b39;
    font-weight: 800;
}

.banque-import-preview__more {
    color: #748078;
    font-size: 12px;
}

.banque-import-next {
    margin-top: 22px;
    padding: 16px 18px;
    border-radius: 13px;
    background: #f2f6f3;
}

.banque-import-next strong {
    color: #294632;
}

.banque-import-next p {
    margin: 5px 0 0;
    color: #68766d;
    line-height: 1.55;
}

@media (max-width: 760px) {
    .banque-import-preview__heading {
        flex-direction: column;
    }

    .banque-import-preview {
        padding: 20px;
    }
}


/* ===== BANQUE CONFIRMATION IMPORT ===== */

.banque-flash--warning {
    background: #fff3df;
    color: #8a5915;
}

.banque-import-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 18px;
}

.banque-import-check {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.banque-import-check--new {
    background: #e6f5e9;
    color: #286a3d;
}

.banque-import-check--duplicate {
    background: #fff0dc;
    color: #966019;
}

.bank-row-status {
    display: inline-flex;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
}

.bank-row-status--new {
    background: #e5f5e9;
    color: #286a3d;
}

.bank-row-status--duplicate {
    background: #fff0dc;
    color: #966019;
}

.banque-import-confirm {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 24px;
    padding: 18px 20px;
    border-radius: 15px;
    background: #f1f6f2;
}

.banque-import-confirm strong {
    color: #26462f;
}

.banque-import-confirm p {
    margin: 4px 0 0;
    color: #68766d;
}

@media (max-width: 760px) {
    .banque-import-confirm {
        align-items: stretch;
        flex-direction: column;
    }

    .banque-import-confirm button {
        width: 100%;
    }
}


/* ===== BANQUE PROPOSITIONS RAPPROCHEMENT ===== */

.banque-suggestion {
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid #e0e6e1;
    border-radius: 11px;
    background: #f7f9f7;
}

.banque-suggestion--strong {
    border-color: #b9ddc2;
    background: #edf8ef;
}

.banque-suggestion--probable {
    border-color: #e7d4a8;
    background: #fff8e9;
}

.banque-suggestion--none {
    padding: 8px 10px;
    border-style: dashed;
    color: #7a857e;
    font-size: 12px;
}

.banque-suggestion__top {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.banque-suggestion__top strong {
    color: #2c6840;
    font-size: 12px;
}

.banque-suggestion--probable
.banque-suggestion__top strong {
    color: #8c651e;
}

.banque-suggestion__top span {
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .75);
    color: #68746c;
    font-size: 10px;
    font-weight: 800;
}

.banque-suggestion__label {
    margin-top: 6px;
    color: #304a38;
    font-size: 13px;
    font-weight: 800;
}

.banque-suggestion__details {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 12px;
    margin-top: 5px;
    color: #647168;
    font-size: 11px;
}

.banque-suggestion__reason {
    display: block;
    margin-top: 5px;
    color: #718078;
}

.banque-suggestion__more {
    display: block;
    margin-top: 5px;
    color: #7f6a39;
    font-weight: 700;
}


/* ===== BANQUE VALIDATION RAPPROCHEMENT ===== */

.banque-suggestion__actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 9px;
}

.banque-reconcile-button {
    min-height: 34px;
    padding: 0 12px;
    border: 0;
    border-radius: 9px;
    background: #2d6b41;
    color: #fff;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

.banque-reconcile-button:hover {
    background: #245936;
}


/* ===== BANQUE RAPPROCHEMENT MANUEL ===== */

.bank-manual-link {
    display: block;
    margin-top: 7px;
    color: #356446;
    font-size: 10px;
    font-weight: 800;
    text-decoration: none;
}

.bank-manual-link:hover {
    text-decoration: underline;
}

.bank-manual-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 18px;
    padding: 26px 28px;
    border: 1px solid #dfe7e1;
    border-radius: 22px;
    background: #fff;
}

.bank-manual-hero h1 {
    margin: 0;
    color: #203d2a;
    font-size: clamp(27px, 4vw, 38px);
}

.bank-manual-hero p {
    margin: 8px 0 0;
    color: #6a786f;
}

.bank-manual-amount {
    white-space: nowrap;
    font-size: 28px;
    font-weight: 900;
}

.bank-manual-amount--credit {
    color: #287442;
}

.bank-manual-amount--debit {
    color: #a64b39;
}

.bank-manual-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-bottom: 28px;
}

.bank-manual-summary article {
    padding: 18px 20px;
    border: 1px solid #e0e7e1;
    border-radius: 16px;
    background: #fff;
}

.bank-manual-summary span {
    display: block;
    color: #748178;
}

.bank-manual-summary strong {
    display: block;
    margin-top: 6px;
    color: #294632;
    font-size: 23px;
}

.bank-manual-summary__remaining {
    background: #eef7f0 !important;
}

.bank-manual-intro {
    margin: 8px 0 0;
    color: #6b786f;
}

.bank-manual-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.bank-manual-candidate {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(260px, .8fr)
        minmax(230px, .7fr);
    align-items: center;
    gap: 24px;
    padding: 20px;
    border: 1px solid #dde6df;
    border-radius: 16px;
    background: #fbfcfb;
}

.bank-manual-candidate__type {
    display: inline-flex;
    padding: 5px 8px;
    border-radius: 999px;
    background: #e9f4eb;
    color: #356b44;
    font-size: 10px;
    font-weight: 800;
}

.bank-manual-candidate h3 {
    margin: 8px 0 6px;
    color: #294632;
}

.bank-manual-candidate__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    color: #728078;
    font-size: 11px;
}

.bank-manual-candidate__amounts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.bank-manual-candidate__amounts > div {
    padding: 9px;
    border-radius: 10px;
    background: #f0f4f1;
}

.bank-manual-candidate__amounts span {
    display: block;
    color: #738078;
    font-size: 9px;
}

.bank-manual-candidate__amounts strong {
    display: block;
    margin-top: 3px;
    color: #304b38;
    font-size: 12px;
}

.bank-manual-form {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.bank-manual-form label {
    color: #52645a;
    font-size: 11px;
    font-weight: 800;
}

.bank-manual-form input {
    width: 100%;
    min-height: 40px;
    margin-top: 5px;
    padding: 7px 10px;
    border: 1px solid #cad7cd;
    border-radius: 9px;
    background: #fff;
    color: #294632;
    font: inherit;
    font-weight: 800;
}

@media (max-width: 900px) {

    .bank-manual-candidate {
        grid-template-columns: 1fr;
    }

    .bank-manual-summary {
        grid-template-columns: 1fr;
    }

    .bank-manual-hero {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* ===== BANQUE DETAIL RAPPROCHEMENTS ===== */

.bank-reco-detail-link {
    display: block;
    margin-top: 5px;
    color: #496955;
    font-size: 10px;
    font-weight: 800;
    text-decoration: none;
}

.bank-reco-detail-link:hover {
    text-decoration: underline;
}

.bank-reco-detail-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 18px;
    padding: 26px 28px;
    border: 1px solid #dfe7e1;
    border-radius: 22px;
    background: #fff;
}

.bank-reco-detail-hero h1 {
    margin: 0;
    color: #203d2a;
    font-size: clamp(27px, 4vw, 38px);
}

.bank-reco-detail-hero p {
    margin: 8px 0 0;
    color: #69776e;
}

.bank-reco-detail-list {
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.bank-reco-detail-item {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        180px
        210px;
    align-items: center;
    gap: 22px;
    padding: 19px;
    border: 1px solid #dde6df;
    border-radius: 15px;
    background: #fbfcfb;
}

.bank-reco-detail-item h3 {
    margin: 8px 0 6px;
    color: #294632;
}

.bank-reco-detail-item__amount span {
    display: block;
    color: #748078;
    font-size: 11px;
}

.bank-reco-detail-item__amount strong {
    display: block;
    margin-top: 4px;
    color: #294632;
    font-size: 18px;
}

.bank-reco-cancel-button {
    width: 100%;
    min-height: 40px;
    padding: 0 12px;
    border: 1px solid #e0b7ae;
    border-radius: 10px;
    background: #fff5f2;
    color: #9b4938;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

.bank-reco-detail-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 22px;
}

@media (max-width: 850px) {

    .bank-reco-detail-item {
        grid-template-columns: 1fr;
    }

    .bank-reco-detail-hero {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* ==========================================================
   MA FERME PEI : MON COMPTABLE
   ========================================================== */

.comptable-page {
    min-height: 100vh;
    background:
        linear-gradient(
            135deg,
            #f2f8f3 0%,
            #f8f6ee 100%
        );
}

.comptable-shell {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
    padding: 28px 0 60px;
}


/* HEADER */

.comptable-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;

    margin-bottom: 22px;
    padding: 30px 32px;

    border: 1px solid #dce7df;
    border-radius: 22px;

    background: rgba(255, 255, 255, .94);

    box-shadow:
        0 14px 38px
        rgba(39, 74, 50, .06);
}

.comptable-header > div {
    max-width: 760px;
}

.comptable-eyebrow {
    display: inline-block;

    margin-bottom: 8px;

    color: #5d7b64;

    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
}

.comptable-header h1 {
    margin: 0;

    color: #173d28;

    font-size: clamp(30px, 4vw, 44px);
    line-height: 1.1;
}

.comptable-header p {
    margin: 12px 0 0;

    color: #68766d;

    font-size: 15px;
    line-height: 1.65;
}

.comptable-back {
    flex-shrink: 0;

    color: #315e40;

    font-size: 14px;
    font-weight: 800;

    text-decoration: none;
}

.comptable-back:hover {
    text-decoration: underline;
}


/* NAVIGATION MOIS */

.comptable-period {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 20px;

    margin-bottom: 14px;
    padding: 15px 20px;

    border: 1px solid #dce7df;
    border-radius: 16px;

    background: #edf5ef;
}

.comptable-period > div {
    text-align: center;
}

.comptable-period small {
    display: block;

    margin-bottom: 2px;

    color: #7a897e;

    font-size: 9px;
    font-weight: 900;
    letter-spacing: .1em;
}

.comptable-period strong {
    color: #234b31;

    font-size: 18px;
}

.comptable-period a {
    color: #3b6849;

    font-size: 13px;
    font-weight: 800;

    text-decoration: none;
}

.comptable-period a:last-child {
    text-align: right;
}

.comptable-period a:hover {
    text-decoration: underline;
}


/* SELECTEUR DE MOIS */

.comptable-month-form {
    display: flex;
    align-items: end;
    gap: 10px;

    margin-bottom: 20px;
    padding: 16px 18px;

    border: 1px solid #e0e8e2;
    border-radius: 15px;

    background: rgba(255, 255, 255, .88);
}

.comptable-month-form label {
    color: #56675b;

    font-size: 12px;
    font-weight: 800;
}

.comptable-month-form input {
    min-height: 42px;

    padding: 8px 11px;

    border: 1px solid #cad7cd;
    border-radius: 10px;

    background: #fff;

    color: #263d2d;

    font: inherit;
}

.comptable-month-form button {
    min-height: 42px;

    padding: 0 18px;

    border: 0;
    border-radius: 10px;

    background: #29643d;
    color: #fff;

    font: inherit;
    font-weight: 800;

    cursor: pointer;
}

.comptable-month-form button:hover {
    background: #205431;
}


/* ALERTES */

.comptable-ready,
.comptable-warning {
    margin-bottom: 20px;

    padding: 17px 20px;

    border-radius: 15px;

    font-size: 14px;
}

.comptable-ready {
    border: 1px solid #cce4d2;

    background: #e9f6ec;
    color: #255e38;

    font-weight: 800;
}

.comptable-warning {
    border: 1px solid #ecd7af;

    background: #fff5e4;
    color: #76531b;
}

.comptable-warning strong {
    display: block;

    margin-bottom: 7px;

    color: #744d12;
}

.comptable-warning ul {
    margin: 0;
    padding-left: 22px;
}

.comptable-warning li + li {
    margin-top: 5px;
}


/* CARTES */

.comptable-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;

    margin-bottom: 26px;
}

.comptable-card {
    display: flex;
    flex-direction: column;

    min-height: 190px;

    padding: 22px;

    border: 1px solid #dce6df;
    border-radius: 19px;

    background: #fff;

    box-shadow:
        0 10px 28px
        rgba(40, 69, 49, .05);
}

.comptable-card > span:first-child {
    color: #607268;

    font-size: 11px;
    font-weight: 900;
    letter-spacing: .045em;
}

.comptable-card > strong {
    margin-top: 16px;

    color: #173d28;

    font-size: 38px;
    line-height: 1;
}

.comptable-card > b {
    margin-top: 7px;

    color: #334e3b;

    font-size: 18px;
}

.comptable-card > small {
    margin-top: auto;
    padding-top: 16px;

    color: #77847b;

    font-size: 12px;
}

.comptable-positive {
    color: #287241 !important;
}

.comptable-negative {
    color: #a14d3b !important;
}


/* ZIP */

.comptable-zip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;

    padding: 28px 30px;

    border: 1px solid #dbe6de;
    border-radius: 21px;

    background: #fff;

    box-shadow:
        0 12px 32px
        rgba(39, 72, 48, .05);
}

.comptable-zip h2 {
    margin: 0;

    color: #193f29;

    font-size: 25px;
}

.comptable-zip p {
    max-width: 720px;

    margin: 9px 0 0;

    color: #6d7b71;

    line-height: 1.55;
}

.comptable-zip button {
    flex-shrink: 0;

    min-height: 46px;

    padding: 0 20px;

    border: 0;
    border-radius: 11px;

    background: #9aa99e;
    color: #fff;

    font: inherit;
    font-weight: 800;

    cursor: not-allowed;
}


/* RESPONSIVE */

@media (max-width: 900px) {

    .comptable-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .comptable-header {
        flex-direction: column;
    }

    .comptable-zip {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 620px) {

    .comptable-shell {
        width: min(100% - 20px, 1180px);
    }

    .comptable-header {
        padding: 22px;
    }

    .comptable-grid {
        grid-template-columns: 1fr;
    }

    .comptable-period {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .comptable-period a,
    .comptable-period a:last-child {
        text-align: center;
    }

    .comptable-month-form {
        align-items: stretch;
        flex-direction: column;
    }

    .comptable-month-form input,
    .comptable-month-form button {
        width: 100%;
    }

    .comptable-zip {
        padding: 22px;
    }
}


/* ===== MON COMPTABLE : BOUTON EXPORT ACTIF ===== */

.comptable-zip form {
    flex-shrink: 0;
    margin: 0;
}

.comptable-zip form button {
    background: #29643d;
    cursor: pointer;
}

.comptable-zip form button:hover {
    background: #205431;
}


/* ==========================================================
   MA FERME PEI : PILOTAGE
   ========================================================== */

.pilotage-page {
    min-height: 100vh;
    background:
        linear-gradient(
            135deg,
            #f1f7f2 0%,
            #f8f6ed 100%
        );
}

.pilotage-shell {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
    padding: 28px 0 64px;
}

.pilotage-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;

    margin-bottom: 20px;
    padding: 30px 32px;

    border: 1px solid #dce7df;
    border-radius: 22px;

    background: rgba(255, 255, 255, .95);

    box-shadow:
        0 14px 38px
        rgba(39, 74, 50, .06);
}

.pilotage-header > div {
    max-width: 720px;
}

.pilotage-eyebrow {
    display: block;

    margin-bottom: 8px;

    color: #54735d;

    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
}

.pilotage-header h1 {
    margin: 0;

    color: #173d28;

    font-size: clamp(30px, 4vw, 44px);
    line-height: 1.08;
}

.pilotage-header p {
    margin: 11px 0 0;

    color: #68766d;

    font-size: 15px;
    line-height: 1.6;
}

.pilotage-back {
    color: #315e40;

    font-size: 14px;
    font-weight: 800;

    text-decoration: none;
}

.pilotage-period {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;

    margin-bottom: 14px;
    padding: 15px 20px;

    border: 1px solid #dce7df;
    border-radius: 16px;

    background: #edf5ef;
}

.pilotage-period > div {
    text-align: center;
}

.pilotage-period small {
    display: block;

    color: #7a897e;

    font-size: 9px;
    font-weight: 900;
    letter-spacing: .1em;
}

.pilotage-period strong {
    display: block;

    margin-top: 2px;

    color: #234b31;

    font-size: 18px;
}

.pilotage-period a {
    color: #3b6849;

    font-size: 13px;
    font-weight: 800;

    text-decoration: none;
}

.pilotage-period a:last-child {
    text-align: right;
}

.pilotage-month-form {
    display: flex;
    align-items: end;
    gap: 10px;

    margin-bottom: 14px;
    padding: 15px 18px;

    border: 1px solid #e0e8e2;
    border-radius: 15px;

    background: #fff;
}

.pilotage-month-form label {
    color: #56675b;

    font-size: 12px;
    font-weight: 800;
}

.pilotage-month-form input {
    min-height: 42px;

    padding: 8px 11px;

    border: 1px solid #cad7cd;
    border-radius: 10px;

    background: #fff;

    font: inherit;
}

.pilotage-month-form button {
    min-height: 42px;

    padding: 0 18px;

    border: 0;
    border-radius: 10px;

    background: #29643d;
    color: #fff;

    font: inherit;
    font-weight: 800;

    cursor: pointer;
}

.pilotage-note {
    display: flex;
    gap: 10px;

    margin-bottom: 24px;
    padding: 13px 16px;

    border: 1px solid #dbe5df;
    border-radius: 13px;

    background: #f5f8f6;
    color: #68766d;

    font-size: 12px;
}

.pilotage-note strong {
    flex-shrink: 0;
    color: #3f634a;
}

.pilotage-section {
    margin-bottom: 28px;
}

.pilotage-section__heading {
    margin-bottom: 12px;
}

.pilotage-section__heading span {
    color: #6c7d71;

    font-size: 10px;
    font-weight: 900;
    letter-spacing: .09em;
}

.pilotage-section__heading h2 {
    margin: 3px 0 0;

    color: #264430;

    font-size: 21px;
}

.pilotage-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}

.pilotage-grid--three {
    grid-template-columns: repeat(3, 1fr);
}

.pilotage-card {
    display: flex;
    flex-direction: column;

    min-height: 190px;

    padding: 21px;

    border: 1px solid #dfe7e1;
    border-radius: 18px;

    background: #fff;

    box-shadow:
        0 9px 26px
        rgba(39, 69, 47, .05);
}

.pilotage-card__icon {
    display: grid;
    place-items: center;

    width: 42px;
    height: 42px;

    margin-bottom: 15px;

    border-radius: 12px;

    background: #f0f4f1;

    font-size: 20px;
}

.pilotage-card small {
    color: #6d7c72;

    font-size: 10px;
    font-weight: 900;
    letter-spacing: .06em;
}

.pilotage-card strong {
    margin-top: 8px;

    color: #203f2a;

    font-size: 29px;
    line-height: 1.1;
}

.pilotage-card p {
    margin: auto 0 0;
    padding-top: 14px;

    color: #77847b;

    font-size: 12px;
    line-height: 1.45;
}

.pilotage-card a {
    margin-top: 9px;

    color: #376d47;

    font-size: 12px;
    font-weight: 800;

    text-decoration: none;
}

.pilotage-card--positive {
    border-color: #cfe4d5;
}

.pilotage-card--negative {
    border-color: #ead7d1;
}

.pilotage-card--warning {
    border-color: #ead8b5;
    background: #fffbf3;
}

.pilotage-card--highlight {
    background: #f1f6f2;
}

.pilotage-card--bank {
    background:
        linear-gradient(
            145deg,
            #eff7f1,
            #ffffff
        );
}

.pilotage-money-positive {
    color: #287141 !important;
}

.pilotage-money-negative {
    color: #a14d3b !important;
}

.pilotage-alerts {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pilotage-alert {
    display: flex;
    gap: 9px;

    padding: 13px 16px;

    border-radius: 12px;

    font-size: 13px;
}

.pilotage-alert--warning {
    background: #fff3df;
    color: #805719;
}

.pilotage-alert--info {
    background: #edf4ef;
    color: #496454;
}

@media (max-width: 1000px) {

    .pilotage-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .pilotage-grid--three {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 650px) {

    .pilotage-shell {
        width: min(100% - 20px, 1180px);
    }

    .pilotage-header {
        flex-direction: column;
        padding: 22px;
    }

    .pilotage-period {
        grid-template-columns: 1fr;
        gap: 10px;
        text-align: center;
    }

    .pilotage-period a,
    .pilotage-period a:last-child {
        text-align: center;
    }

    .pilotage-month-form {
        align-items: stretch;
        flex-direction: column;
    }

    .pilotage-grid,
    .pilotage-grid--three {
        grid-template-columns: 1fr;
    }

    .pilotage-note {
        flex-direction: column;
    }
}


/* ===== DEPENSE FLASH RAPPROCHEMENT ===== */

.depense-flash {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    max-width: 1180px;
    margin: 0 auto 18px;
    padding: 15px 18px;

    border-radius: 14px;

    font-size: 14px;
}

.depense-flash--error {
    border: 1px solid #e8bbb1;
    background: #fff0ed;
    color: #8e3526;
}

.depense-flash__icon {
    font-size: 19px;
    line-height: 1.2;
}

.depense-flash strong {
    display: block;
    margin-bottom: 3px;
}

.depense-flash p {
    margin: 0;
    line-height: 1.5;
}


/* ===== FOURNISSEUR ARCHIVAGE ===== */

.supplier-card--archived {
    opacity: .78;
    background: #f6f7f5;
}

.supplier-card--archived
.supplier-card__status {
    background: #eceeea;
    color: #6e776f;
}

.supplier-card__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.supplier-card__actions form {
    margin: 0;
}

.supplier-card__actions a,
.supplier-card__actions button {
    border: 0;
    background: transparent;
    color: #526b59;
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
    text-decoration: none;
}

.supplier-card__archive {
    color: #a6533d !important;
}

.supplier-card__reactivate {
    color: #237043 !important;
}


/* ===== BANQUE ACTION IGNORER ===== */

.bank-movement-status-form {
    margin: 0;
}

.bank-ignore-link,
.bank-restore-link {
    display: inline-block;
    padding: 0;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.bank-ignore-link {
    color: #8a6957;
}

.bank-restore-link {
    color: #237043;
}


/* ===== BANQUE FILTRES PERIODE ===== */

.banque-flow-summary {
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

.banque-flow--variation strong {
    color: #45564a;
}

.bank-period-panel {
    margin: 22px 0 26px;
    padding: 18px 20px;
    border: 1px solid rgba(65, 91, 71, .12);
    border-radius: 18px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 10px 26px rgba(40, 60, 46, .06);
}

.bank-period-navigation {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto
        minmax(0, 1fr);
    align-items: center;
    gap: 18px;
}

.bank-period-current {
    min-width: 190px;
    text-align: center;
}

.bank-period-current small {
    display: block;
    margin-bottom: 4px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
    color: #78847b;
}

.bank-period-current strong {
    font-size: 20px;
    color: #263a2c;
}

.bank-period-arrow {
    font-size: 13px;
    font-weight: 800;
    color: #315b3c;
    text-decoration: none;
}

.bank-period-navigation
.bank-period-arrow:last-child {
    text-align: right;
}

.bank-period-arrow--disabled {
    color: #aeb6b0;
    cursor: default;
}

.bank-period-filters {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(65, 91, 71, .10);
}

.bank-period-filters label {
    display: grid;
    gap: 5px;
}

.bank-period-filters label > span {
    font-size: 11px;
    font-weight: 800;
    color: #66736a;
}

.bank-period-filters select {
    min-width: 145px;
    height: 42px;
    padding: 0 38px 0 12px;
    border: 1px solid #d8dfda;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    color: #304137;
}

.bank-period-submit {
    height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #315f3d;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.bank-period-reset {
    height: 42px;
    display: inline-flex;
    align-items: center;
    padding: 0 4px;
    color: #65756a;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.bank-period-result {
    margin-top: 12px;
    font-size: 12px;
    color: #78847b;
}

.bank-period-result strong {
    color: #304137;
}

@media (max-width: 850px) {

    .banque-flow-summary {
        grid-template-columns: 1fr;
    }

    .bank-period-navigation {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .bank-period-navigation
    .bank-period-arrow:last-child {
        text-align: center;
    }

    .bank-period-filters {
        align-items: stretch;
    }

    .bank-period-filters label,
    .bank-period-filters select,
    .bank-period-submit {
        width: 100%;
    }

}


/* ===== FACTURES FOURNISSEURS FILTRES PERIODE ===== */

.supplier-period-panel {
    margin: 0 0 26px;
    padding: 18px 20px;
    border: 1px solid rgba(85, 82, 110, .10);
    border-radius: 18px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 10px 26px rgba(45, 49, 53, .05);
}

.supplier-period-navigation {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto
        minmax(0, 1fr);
    align-items: center;
    gap: 18px;
}

.supplier-period-current {
    min-width: 190px;
    text-align: center;
}

.supplier-period-current small {
    display: block;
    margin-bottom: 4px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
    color: #817c88;
}

.supplier-period-current strong {
    font-size: 20px;
    color: #293a30;
}

.supplier-period-arrow {
    font-size: 13px;
    font-weight: 800;
    color: #3c6549;
    text-decoration: none;
}

.supplier-period-navigation
.supplier-period-arrow:last-child {
    text-align: right;
}

.supplier-period-arrow--disabled {
    color: #b0b3af;
    cursor: default;
}

.supplier-period-filters {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(85, 82, 110, .10);
}

.supplier-period-filters label {
    display: grid;
    gap: 5px;
}

.supplier-period-filters label > span {
    font-size: 11px;
    font-weight: 800;
    color: #686e69;
}

.supplier-period-filters select {
    min-width: 145px;
    height: 42px;
    padding: 0 38px 0 12px;
    border: 1px solid #d8dfda;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    color: #304137;
}

.supplier-period-filters
label:last-of-type select {
    min-width: 230px;
}

.supplier-period-submit {
    height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #248b69;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.supplier-period-reset {
    height: 42px;
    display: inline-flex;
    align-items: center;
    padding: 0 4px;
    color: #65756a;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.supplier-period-result {
    margin-top: 12px;
    font-size: 12px;
    color: #78847b;
}

.supplier-period-result strong {
    color: #304137;
}

.supplier-period-partial {
    display: block;
    margin-top: 3px;
    font-size: 10px;
    font-weight: 800;
    color: #96712e;
}

@media (max-width: 900px) {

    .supplier-period-navigation {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .supplier-period-navigation
    .supplier-period-arrow:last-child {
        text-align: center;
    }

    .supplier-period-filters {
        align-items: stretch;
    }

    .supplier-period-filters label,
    .supplier-period-filters select,
    .supplier-period-submit {
        width: 100%;
    }

}


/* ===== DEPENSES FILTRES PERIODE ===== */

.expense-period-panel {
    margin: 0 0 26px;
    padding: 18px 20px;
    border: 1px solid rgba(60, 92, 69, .10);
    border-radius: 18px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 10px 26px rgba(45, 60, 49, .05);
}

.expense-period-navigation {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto
        minmax(0, 1fr);
    align-items: center;
    gap: 18px;
}

.expense-period-current {
    min-width: 190px;
    text-align: center;
}

.expense-period-current small {
    display: block;
    margin-bottom: 4px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
    color: #78847b;
}

.expense-period-current strong {
    font-size: 20px;
    color: #263a2c;
}

.expense-period-arrow {
    font-size: 13px;
    font-weight: 800;
    color: #315b3c;
    text-decoration: none;
}

.expense-period-navigation
.expense-period-arrow:last-child {
    text-align: right;
}

.expense-period-arrow--disabled {
    color: #aeb6b0;
}

.expense-period-filters {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(60, 92, 69, .10);
}

.expense-period-filters label {
    display: grid;
    gap: 5px;
}

.expense-period-filters label > span {
    font-size: 11px;
    font-weight: 800;
    color: #66736a;
}

.expense-period-filters select {
    min-width: 145px;
    height: 42px;
    padding: 0 38px 0 12px;
    border: 1px solid #d8dfda;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    color: #304137;
}

.expense-period-filters
label:nth-of-type(3) select,
.expense-period-filters
label:nth-of-type(4) select {
    min-width: 210px;
}

.expense-period-submit {
    height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #27835f;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.expense-period-reset {
    height: 42px;
    display: inline-flex;
    align-items: center;
    padding: 0 4px;
    color: #65756a;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.expense-period-result {
    margin-top: 12px;
    font-size: 12px;
    color: #78847b;
}

.expense-period-result strong {
    color: #304137;
}

@media (max-width: 900px) {

    .expense-period-navigation {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .expense-period-navigation
    .expense-period-arrow:last-child {
        text-align: center;
    }

    .expense-period-filters {
        align-items: stretch;
    }

    .expense-period-filters label,
    .expense-period-filters select,
    .expense-period-submit {
        width: 100%;
    }

}


/* ===== FACTURES CLIENTS FILTRES PERIODE ===== */

.invoice-period-panel {
    margin: 0 0 18px;
    padding: 18px 20px;
    border: 1px solid rgba(56, 87, 66, .10);
    border-radius: 18px;
    background: rgba(255, 255, 255, .90);
    box-shadow: 0 10px 26px rgba(45, 60, 49, .05);
}

.invoice-period-navigation {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto
        minmax(0, 1fr);
    align-items: center;
    gap: 18px;
}

.invoice-period-current {
    min-width: 190px;
    text-align: center;
}

.invoice-period-current small {
    display: block;
    margin-bottom: 4px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
    color: #78847b;
}

.invoice-period-current strong {
    font-size: 20px;
    color: #263a2c;
}

.invoice-period-arrow {
    font-size: 13px;
    font-weight: 800;
    color: #315b3c;
    text-decoration: none;
}

.invoice-period-navigation
.invoice-period-arrow:last-child {
    text-align: right;
}

.invoice-period-arrow--disabled {
    color: #aeb6b0;
}

.invoice-period-filters {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(56, 87, 66, .10);
}

.invoice-period-filters label {
    display: grid;
    gap: 5px;
}

.invoice-period-filters label > span {
    font-size: 11px;
    font-weight: 800;
    color: #66736a;
}

.invoice-period-filters select {
    min-width: 145px;
    height: 42px;
    padding: 0 38px 0 12px;
    border: 1px solid #d8dfda;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    color: #304137;
}

.invoice-period-filters
label:nth-of-type(3) select {
    min-width: 230px;
}

.invoice-period-submit {
    height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #2b805d;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.invoice-period-reset {
    height: 42px;
    display: inline-flex;
    align-items: center;
    padding: 0 4px;
    color: #65756a;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.invoice-period-result {
    margin-top: 12px;
    font-size: 12px;
    color: #78847b;
}

.invoice-period-result strong {
    color: #304137;
}

@media (max-width: 900px) {

    .invoice-period-navigation {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .invoice-period-navigation
    .invoice-period-arrow:last-child {
        text-align: center;
    }

    .invoice-period-filters {
        align-items: stretch;
    }

    .invoice-period-filters label,
    .invoice-period-filters select,
    .invoice-period-submit {
        width: 100%;
    }

}


/* ===== CLIENTS RECHERCHE ARCHIVAGE ===== */

.client-hero__stat small {
    display: block;
    margin-top: 4px;
    font-size: 10px;
    color: #7b847e;
}

.client-directory-filters {
    margin: 0 0 24px;
    padding: 18px 20px;
    border: 1px solid rgba(63, 88, 69, .10);
    border-radius: 18px;
    background: rgba(255, 255, 255, .90);
    box-shadow: 0 10px 26px rgba(45, 60, 49, .05);
}

.client-directory-form {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
}

.client-directory-form label {
    display: grid;
    gap: 5px;
}

.client-directory-form label > span {
    font-size: 11px;
    font-weight: 800;
    color: #66736a;
}

.client-directory-form input,
.client-directory-form select {
    height: 42px;
    padding: 0 12px;
    border: 1px solid #d8dfda;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    color: #304137;
}

.client-directory-search {
    flex: 1 1 300px;
}

.client-directory-search input {
    width: 100%;
}

.client-directory-form select {
    min-width: 165px;
}

.client-directory-submit {
    height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #24956f;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.client-directory-reset {
    height: 42px;
    display: inline-flex;
    align-items: center;
    color: #65756a;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.client-directory-result {
    margin-top: 12px;
    font-size: 12px;
    color: #78847b;
}

.client-directory-result strong {
    color: #304137;
}

.client-card {
    position: relative;
}

.client-card--archived {
    opacity: .72;
}

.client-card__status {
    position: absolute;
    top: 14px;
    right: 14px;
}

.client-status-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 900;
}

.client-status-badge--active {
    background: #e4f7ea;
    color: #257343;
}

.client-status-badge--archived {
    background: #eff0ed;
    color: #7b827d;
}

.client-reactivate-button {
    padding: 0;
    border: 0;
    background: transparent;
    color: #318258;
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

@media (max-width: 820px) {

    .client-directory-form {
        align-items: stretch;
    }

    .client-directory-form label,
    .client-directory-form input,
    .client-directory-form select,
    .client-directory-submit {
        width: 100%;
    }

}


/* ===== FOURNISSEURS RECHERCHE FILTRES ===== */

.supplier-hero__counter-detail {
    display: block;
    margin-top: 5px;
    font-size: 10px;
    color: #78837c;
}

.supplier-directory-filters {
    margin: 0 0 24px;
    padding: 18px 20px;
    border: 1px solid rgba(63, 88, 69, .10);
    border-radius: 18px;
    background: rgba(255, 255, 255, .90);
    box-shadow: 0 10px 26px rgba(45, 60, 49, .05);
}

.supplier-directory-form {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
}

.supplier-directory-form label {
    display: grid;
    gap: 5px;
}

.supplier-directory-form label > span {
    font-size: 11px;
    font-weight: 800;
    color: #66736a;
}

.supplier-directory-form input,
.supplier-directory-form select {
    height: 42px;
    padding: 0 12px;
    border: 1px solid #d8dfda;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    color: #304137;
}

.supplier-directory-search {
    flex: 1 1 360px;
}

.supplier-directory-search input {
    width: 100%;
}

.supplier-directory-form select {
    min-width: 170px;
}

.supplier-directory-submit {
    height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #24956f;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.supplier-directory-reset {
    height: 42px;
    display: inline-flex;
    align-items: center;
    color: #65756a;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.supplier-directory-result {
    margin-top: 12px;
    font-size: 12px;
    color: #78847b;
}

.supplier-directory-result strong {
    color: #304137;
}

@media (max-width: 820px) {

    .supplier-directory-form {
        align-items: stretch;
    }

    .supplier-directory-form label,
    .supplier-directory-form input,
    .supplier-directory-form select,
    .supplier-directory-submit {
        width: 100%;
    }

}


/* ===== MATERIEL RECHERCHE FILTRES ===== */

.materiel-directory-filters {
    margin: 0 0 24px;
    padding: 18px 20px;
    border: 1px solid rgba(63, 88, 69, .10);
    border-radius: 18px;
    background: rgba(255, 255, 255, .90);
    box-shadow: 0 10px 26px rgba(45, 60, 49, .05);
}

.materiel-directory-form {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
}

.materiel-directory-form label {
    display: grid;
    gap: 5px;
}

.materiel-directory-form label > span {
    font-size: 11px;
    font-weight: 800;
    color: #66736a;
}

.materiel-directory-form input,
.materiel-directory-form select {
    height: 42px;
    padding: 0 12px;
    border: 1px solid #d8dfda;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    color: #304137;
}

.materiel-directory-search {
    flex: 1 1 280px;
}

.materiel-directory-search input {
    width: 100%;
}

.materiel-directory-form select {
    min-width: 175px;
}

.materiel-directory-submit {
    height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #24956f;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.materiel-directory-reset {
    height: 42px;
    display: inline-flex;
    align-items: center;
    color: #65756a;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.materiel-directory-result {
    margin-top: 12px;
    font-size: 12px;
    color: #78847b;
}

.materiel-directory-result strong {
    color: #304137;
}

@media (max-width: 900px) {

    .materiel-directory-form {
        align-items: stretch;
    }

    .materiel-directory-form label,
    .materiel-directory-form input,
    .materiel-directory-form select,
    .materiel-directory-submit {
        width: 100%;
    }

}


/* ===== ANIMAUX RECHERCHE FILTRES ===== */

.animal-directory-filters {
    margin: 0 0 24px;
    padding: 18px 20px;
    border: 1px solid rgba(63, 88, 69, .10);
    border-radius: 18px;
    background: rgba(255, 255, 255, .90);
    box-shadow: 0 10px 26px rgba(45, 60, 49, .05);
}

.animal-directory-form {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
}

.animal-directory-form label {
    display: grid;
    gap: 5px;
}

.animal-directory-form label > span {
    font-size: 11px;
    font-weight: 800;
    color: #66736a;
}

.animal-directory-form input,
.animal-directory-form select {
    height: 42px;
    padding: 0 12px;
    border: 1px solid #d8dfda;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    color: #304137;
}

.animal-directory-search {
    flex: 1 1 260px;
}

.animal-directory-search input {
    width: 100%;
}

.animal-directory-form select {
    min-width: 155px;
}

.animal-directory-submit {
    height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #24956f;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.animal-directory-reset {
    height: 42px;
    display: inline-flex;
    align-items: center;
    color: #65756a;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.animal-directory-result {
    margin-top: 12px;
    font-size: 12px;
    color: #78847b;
}

.animal-directory-result strong {
    color: #304137;
}

@media (max-width: 980px) {

    .animal-directory-form {
        align-items: stretch;
    }

    .animal-directory-form label,
    .animal-directory-form input,
    .animal-directory-form select,
    .animal-directory-submit {
        width: 100%;
    }

}


/* ===== LIVRAISONS FILTRES PERIODE ===== */

.delivery-period-panel {
    margin: 0 0 24px;
    padding: 18px 20px;
    border: 1px solid rgba(63, 88, 69, .10);
    border-radius: 18px;
    background: rgba(255, 255, 255, .90);
    box-shadow: 0 10px 26px rgba(45, 60, 49, .05);
}

.delivery-period-navigation {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto
        minmax(0, 1fr);
    align-items: center;
    gap: 18px;
}

.delivery-period-current {
    min-width: 190px;
    text-align: center;
}

.delivery-period-current small,
.delivery-period-current span {
    display: block;
}

.delivery-period-current small {
    margin-bottom: 4px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
    color: #78847b;
}

.delivery-period-current strong {
    display: block;
    font-size: 20px;
    color: #263a2c;
}

.delivery-period-current span {
    margin-top: 3px;
    font-size: 10px;
    color: #8a948d;
}

.delivery-period-arrow {
    font-size: 13px;
    font-weight: 800;
    color: #315b3c;
    text-decoration: none;
}

.delivery-period-navigation
.delivery-period-arrow:last-child {
    text-align: right;
}

.delivery-period-arrow--disabled {
    color: #aeb6b0;
}

.delivery-period-filters {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(56, 87, 66, .10);
}

.delivery-period-filters label {
    display: grid;
    gap: 5px;
}

.delivery-period-filters label > span {
    font-size: 11px;
    font-weight: 800;
    color: #66736a;
}

.delivery-period-filters select {
    min-width: 145px;
    height: 42px;
    padding: 0 38px 0 12px;
    border: 1px solid #d8dfda;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    color: #304137;
}

.delivery-period-filters
label:nth-of-type(4) select {
    min-width: 220px;
}

.delivery-period-submit {
    height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #24956f;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.delivery-period-reset {
    height: 42px;
    display: inline-flex;
    align-items: center;
    color: #65756a;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.delivery-period-result {
    margin-top: 12px;
    font-size: 12px;
    color: #78847b;
}

.delivery-period-result strong {
    color: #304137;
}

@media (max-width: 920px) {

    .delivery-period-navigation {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .delivery-period-navigation
    .delivery-period-arrow:last-child {
        text-align: center;
    }

    .delivery-period-filters {
        align-items: stretch;
    }

    .delivery-period-filters label,
    .delivery-period-filters select,
    .delivery-period-submit {
        width: 100%;
    }

}


/* ===== RECOLTES FILTRES HISTORIQUE ===== */

.harvest-history-filters {
    margin: 0 0 24px;
    padding: 18px 20px;
    border: 1px solid rgba(63, 88, 69, .10);
    border-radius: 18px;
    background: rgba(255, 255, 255, .90);
    box-shadow: 0 10px 26px rgba(45, 60, 49, .05);
}

.harvest-history-filters__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.harvest-history-filters__heading small {
    display: block;
    margin-bottom: 3px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
    color: #7a877d;
}

.harvest-history-filters__heading strong {
    font-size: 19px;
    color: #263a2c;
}

.harvest-history-filters__heading > span {
    font-size: 12px;
    font-weight: 700;
    color: #77837a;
}

.harvest-history-form {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(56, 87, 66, .10);
}

.harvest-history-form label {
    display: grid;
    gap: 5px;
}

.harvest-history-form label > span {
    font-size: 11px;
    font-weight: 800;
    color: #66736a;
}

.harvest-history-form select {
    min-width: 160px;
    height: 42px;
    padding: 0 38px 0 12px;
    border: 1px solid #d8dfda;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    color: #304137;
}

.harvest-history-form
label:nth-of-type(3) select,
.harvest-history-form
label:nth-of-type(4) select {
    min-width: 205px;
}

.harvest-history-submit {
    height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #24956f;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.harvest-history-reset {
    height: 42px;
    display: inline-flex;
    align-items: center;
    color: #65756a;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.harvest-history-summary {
    margin-top: 12px;
    font-size: 12px;
    color: #78847b;
}

.harvest-history-summary strong {
    color: #304137;
}

@media (max-width: 920px) {

    .harvest-history-filters__heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .harvest-history-form {
        align-items: stretch;
    }

    .harvest-history-form label,
    .harvest-history-form select,
    .harvest-history-submit {
        width: 100%;
    }

}



/* =========================================================
   PARAMETRES EXPLOITATION
   ========================================================= */

.exploitation-settings-page {
    min-height: 100vh;
    background:
        linear-gradient(
            180deg,
            #f6fbf8 0%,
            #ffffff 46%,
            #f8faf9 100%
        );
}

.exploitation-settings-hero {
    display: flex;
    justify-content: space-between;
    gap: 32px;
    padding: 42px;
    border-radius: 28px;
    background:
        linear-gradient(
            135deg,
            #174f43 0%,
            #267d67 100%
        );
    color: #fff;
    box-shadow:
        0 18px 45px
        rgba(25, 79, 66, 0.16);
}

.exploitation-settings-badge {
    display: inline-flex;
    margin-bottom: 16px;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    color: #bff2df;
}

.exploitation-settings-hero h1 {
    margin: 0 0 12px;
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 1.05;
}

.exploitation-settings-hero p {
    max-width: 690px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.65;
}

.exploitation-settings-identity {
    min-width: 220px;
    align-self: center;
    padding: 22px 24px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
}

.exploitation-settings-identity span,
.exploitation-settings-identity small {
    display: block;
    color: rgba(255, 255, 255, 0.7);
}

.exploitation-settings-identity strong {
    display: block;
    margin: 6px 0;
    font-size: 1.25rem;
}

.exploitation-settings-intro {
    margin: 42px 0 20px;
}

.exploitation-settings-intro span {
    display: block;
    margin-bottom: 7px;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    color: #20775f;
}

.exploitation-settings-intro h2 {
    margin: 0 0 8px;
    color: #183b32;
}

.exploitation-settings-intro p {
    max-width: 760px;
    margin: 0;
    color: #687b75;
    line-height: 1.6;
}

.exploitation-settings-grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.exploitation-settings-card {
    display: flex;
    flex-direction: column;
    min-height: 240px;
    padding: 26px;
    border: 1px solid #e2ebe7;
    border-radius: 22px;
    background: #fff;
    box-shadow:
        0 12px 30px
        rgba(38, 83, 70, 0.07);
}

.exploitation-settings-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.exploitation-settings-card__icon {
    display: grid;
    width: 50px;
    height: 50px;
    place-items: center;
    border-radius: 16px;
    background: #edf8f3;
    font-size: 1.45rem;
}

.exploitation-settings-card__status {
    padding: 7px 11px;
    border-radius: 999px;
    background: #eef7f3;
    color: #28735e;
    font-size: 0.76rem;
    font-weight: 750;
}

.exploitation-settings-card__content {
    flex: 1;
    padding: 22px 0;
}

.exploitation-settings-card__content h3 {
    margin: 0 0 9px;
    color: #1f3e36;
    font-size: 1.18rem;
}

.exploitation-settings-card__content p {
    margin: 0;
    color: #6e7f79;
    line-height: 1.55;
}

.exploitation-settings-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding-top: 17px;
    border-top: 1px solid #edf1ef;
    color: #83908c;
    font-size: 0.8rem;
}

.exploitation-settings-coming {
    color: #25765f;
    font-weight: 750;
}

.exploitation-settings-billing {
    display: grid;
    grid-template-columns:
        auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 22px;
    margin-top: 24px;
    padding: 28px;
    border-radius: 22px;
    background: #f5f0fb;
    border: 1px solid #e8dcf3;
}

.exploitation-settings-billing__icon {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 18px;
    background: #fff;
    font-size: 1.55rem;
}

.exploitation-settings-billing__content span {
    display: block;
    margin-bottom: 5px;
    color: #7955a3;
    font-size: 0.73rem;
    font-weight: 800;
    letter-spacing: 0.11em;
}

.exploitation-settings-billing__content h2 {
    margin: 0 0 6px;
    color: #49315f;
}

.exploitation-settings-billing__content p {
    margin: 0;
    color: #746782;
    line-height: 1.5;
}

.exploitation-settings-protection {
    display: flex;
    gap: 16px;
    margin-top: 24px;
    padding: 20px 22px;
    border-radius: 18px;
    background: #f7faf9;
    border: 1px solid #e3ece8;
}

.exploitation-settings-protection > span {
    font-size: 1.35rem;
}

.exploitation-settings-protection strong {
    color: #29473f;
}

.exploitation-settings-protection p {
    margin: 5px 0 0;
    color: #778680;
    line-height: 1.5;
}

@media (max-width: 850px) {

    .exploitation-settings-hero {
        flex-direction: column;
        padding: 28px;
    }

    .exploitation-settings-identity {
        width: 100%;
        min-width: 0;
    }

    .exploitation-settings-grid {
        grid-template-columns: 1fr;
    }

    .exploitation-settings-billing {
        grid-template-columns: 1fr;
    }

    .exploitation-settings-billing__icon {
        display: none;
    }
}


/* =========================================================
   REFERENTIELS EXPLOITATION
   ========================================================= */

.referential-hero {
    margin-bottom: 26px;
    padding: 34px;
    border-radius: 24px;
    background:
        linear-gradient(
            135deg,
            #315f4f 0%,
            #417965 100%
        );
    color: #fff;
}

.referential-hero h1 {
    margin: 0 0 10px;
    font-size: clamp(1.8rem, 4vw, 2.8rem);
}

.referential-hero p {
    max-width: 720px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.6;
}

.referential-layout {
    display: grid;
    grid-template-columns:
        minmax(270px, 0.7fr)
        minmax(0, 1.3fr);
    gap: 24px;
    align-items: start;
}

.referential-form-card,
.referential-list-card,
.referential-edit-card {
    padding: 28px;
    border: 1px solid #e1ebe7;
    border-radius: 22px;
    background: #fff;
    box-shadow:
        0 12px 30px
        rgba(38, 83, 70, 0.07);
}

.referential-form-card h2,
.referential-edit-card h1 {
    margin: 6px 0 8px;
    color: #213f37;
}

.referential-form-card > p,
.referential-edit-card > p {
    margin: 0 0 22px;
    color: #71817b;
    line-height: 1.55;
}

.referential-list {
    display: grid;
    gap: 11px;
}

.referential-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 18px;
    border: 1px solid #e5ece9;
    border-radius: 16px;
    background: #fbfdfc;
}

.referential-item--archived {
    opacity: 0.66;
    background: #f7f8f8;
}

.referential-item__main {
    display: flex;
    align-items: center;
    gap: 13px;
}

.referential-item__icon {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    background: #eef7f3;
}

.referential-item__main strong,
.referential-item__main small {
    display: block;
}

.referential-item__main strong {
    color: #28473e;
}

.referential-item__main small {
    margin-top: 3px;
    color: #84918d;
}

.referential-item__actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.referential-item__actions a {
    color: #28735e;
    font-weight: 700;
    text-decoration: none;
}

.referential-reactivate-button {
    border: 0;
    padding: 8px 12px;
    border-radius: 999px;
    background: #e8f6ef;
    color: #247158;
    font: inherit;
    font-size: 0.82rem;
    font-weight: 750;
    cursor: pointer;
}

.referential-empty {
    padding: 38px 20px;
    text-align: center;
    border: 1px dashed #dce8e3;
    border-radius: 17px;
    color: #75847f;
}

.referential-empty > span {
    display: block;
    margin-bottom: 10px;
    font-size: 2rem;
}

.referential-empty strong {
    display: block;
    color: #345248;
}

.referential-empty p {
    margin: 6px 0 0;
}

.referential-edit-card {
    max-width: 720px;
    margin: 30px auto 0;
}

.referential-edit-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 22px;
}

@media (max-width: 820px) {

    .referential-layout {
        grid-template-columns: 1fr;
    }

    .referential-item {
        align-items: flex-start;
        flex-direction: column;
    }

    .referential-item__actions {
        width: 100%;
        justify-content: flex-end;
    }
}


/* =========================================================
   REFERENTIELS - VALEURS SYSTEME PROTEGEES
   Réutilisable Stock / Elevage / Materiel / Gestion
   ========================================================= */

.referential-system-card {
    margin-bottom: 24px;
    padding: 24px 28px;
    border: 1px solid #dfe9e5;
    border-radius: 20px;
    background:
        linear-gradient(
            135deg,
            #f8fcfa 0%,
            #ffffff 100%
        );
    box-shadow:
        0 10px 26px
        rgba(38, 83, 70, 0.05);
}

.referential-system-card__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.referential-system-card__heading h2 {
    margin: 5px 0 0;
    color: #203f36;
    font-size: 1.28rem;
}

.referential-system-lock {
    flex: 0 0 auto;
    padding: 7px 12px;
    border: 1px solid #dce8e3;
    border-radius: 999px;
    background: #eef6f2;
    color: #557069;
    font-size: 0.78rem;
    font-weight: 750;
}

.referential-system-card__intro {
    max-width: 850px;
    margin: 14px 0 18px;
    color: #71817b;
    line-height: 1.55;
}

.referential-system-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.referential-system-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 13px;
    border: 1px solid #dce8e3;
    border-radius: 999px;
    background: #fff;
    color: #315248;
    font-size: 0.86rem;
    font-weight: 700;
}

@media (max-width: 650px) {

    .referential-system-card {
        padding: 20px;
    }

    .referential-system-card__heading {
        flex-direction: column;
    }
}


/* =========================================================
   REFERENTIELS - SELECT
   ========================================================= */

.referential-select {
    width: 100%;
    min-height: 48px;
    padding: 0 42px 0 14px;

    border: 1px solid #d7e3df;
    border-radius: 12px;

    background-color: #ffffff;

    color: #28473e;
    font: inherit;
    font-weight: 600;

    cursor: pointer;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.referential-select:hover {
    border-color: #b8cec6;
}

.referential-select:focus {
    outline: none;
    border-color: #347764;

    box-shadow:
        0 0 0 3px
        rgba(52, 119, 100, 0.12);
}

/* =========================================================
   FORMULAIRE DEPENSE MANUELLE
   ========================================================= */

.expense-page .expense-section form > div:first-child > div {
    min-width: 0;
}

.expense-page .expense-section label {
    display: block;
    margin-bottom: 7px;
    color: #234b3d;
    font-size: .82rem;
    font-weight: 700;
}

.expense-page .expense-section input:not([type="hidden"]):not([type="file"]),
.expense-page .expense-section select,
.expense-page .expense-section textarea {
    display: block;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    border: 1px solid #cfded5;
    border-radius: 12px;
    background: rgba(255, 255, 255, .94);
    color: #173f32;
    font: inherit;
    outline: none;
    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

.expense-page .expense-section input:not([type="hidden"]):not([type="file"]),
.expense-page .expense-section select {
    min-height: 46px;
    padding: 10px 13px;
}

.expense-page .expense-section textarea {
    min-height: 108px;
    padding: 12px 13px;
    resize: vertical;
}

.expense-page .expense-section input::placeholder,
.expense-page .expense-section textarea::placeholder {
    color: #8a9790;
    opacity: 1;
}

.expense-page .expense-section input:not([type="hidden"]):not([type="file"]):focus,
.expense-page .expense-section select:focus,
.expense-page .expense-section textarea:focus {
    border-color: #27a47d;
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(39, 164, 125, .12);
}

.expense-page .expense-section input[type="file"] {
    display: block;
    width: 100%;
    box-sizing: border-box;
    min-height: 46px;
    padding: 8px;
    border: 1px solid #cfded5;
    border-radius: 12px;
    background: rgba(255, 255, 255, .94);
    color: #39564b;
    font: inherit;
}

.expense-page .expense-section input[type="file"]::file-selector-button {
    margin-right: 10px;
    padding: 8px 12px;
    border: 0;
    border-radius: 9px;
    background: #eef6f1;
    color: #1d624d;
    font-weight: 700;
    cursor: pointer;
}

.expense-page .expense-section .form-help {
    display: block;
    margin-top: 6px;
    color: #708078;
    font-size: .76rem;
    line-height: 1.45;
}

.expense-page .expense-section ul {
    margin: 6px 0 0;
    padding-left: 18px;
    color: #b0443c;
    font-size: .78rem;
}

@media (max-width: 760px) {
    .expense-page .expense-section form > div:first-child {
        grid-template-columns: 1fr !important;
    }
}


/* ==========================================================
   FACTURE - FACTURATION ELECTRONIQUE
   ========================================================== */

.invoice-electronic-panel {
    margin-top: 28px;
    border: 1px solid #d7e7e0;
    border-radius: 18px;
    background: #f8fbfa;
    padding: 22px;
}

.invoice-electronic-panel__heading {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 14px;
    align-items: center;
}

.invoice-electronic-panel__icon {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 14px;
    background: #e4f6ee;
    font-size: 1.25rem;
}

.invoice-electronic-panel__heading > div:nth-child(2) {
    display: grid;
    gap: 3px;
}

.invoice-electronic-panel__heading span {
    color: #6f867d;
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .04em;
}

.invoice-electronic-panel__heading h2 {
    margin: 0;
    color: #204f40;
    font-size: 1.05rem;
}

.invoice-electronic-panel__heading p {
    margin: 0;
    color: #74877f;
    font-size: .73rem;
}

.invoice-electronic-state {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: .65rem;
    font-weight: 900;
    white-space: nowrap;
}

.invoice-electronic-state--waiting {
    background: #fff2d8;
    color: #91671d;
}

.invoice-electronic-state--ready {
    background: #e3f7ed;
    color: #176e53;
}

.invoice-electronic-prepare,
.invoice-electronic-ready {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 18px;
    border-radius: 14px;
    background: #fff;
    padding: 16px;
}

.invoice-electronic-prepare > div,
.invoice-electronic-ready > div {
    display: grid;
    gap: 4px;
}

.invoice-electronic-prepare strong,
.invoice-electronic-ready strong {
    color: #285848;
    font-size: .78rem;
}

.invoice-electronic-prepare span,
.invoice-electronic-ready span,
.invoice-electronic-ready small {
    color: #758980;
    font-size: .66rem;
    line-height: 1.45;
}

.invoice-electronic-prepare-button,
.invoice-electronic-download {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 11px;
    background: #1e8062;
    padding: 8px 14px;
    color: #fff;
    font: inherit;
    font-size: .7rem;
    font-weight: 900;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
}

.invoice-electronic-prepare-button:hover,
.invoice-electronic-download:hover {
    background: #176d53;
}

.invoice-electronic-security {
    display: flex;
    gap: 9px;
    align-items: flex-start;
    margin-top: 13px;
    border-radius: 12px;
    background: #eef5f2;
    padding: 10px 12px;
}

.invoice-electronic-security p {
    margin: 0;
    color: #61776e;
    font-size: .65rem;
    line-height: 1.5;
}

.invoice-electronic-security strong {
    color: #315e4e;
}

@media (max-width: 700px) {

    .invoice-electronic-panel__heading {
        grid-template-columns: auto 1fr;
    }

    .invoice-electronic-state {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .invoice-electronic-prepare,
    .invoice-electronic-ready {
        align-items: stretch;
        flex-direction: column;
    }

    .invoice-electronic-prepare form,
    .invoice-electronic-prepare-button,
    .invoice-electronic-download {
        width: 100%;
        box-sizing: border-box;
    }

}

/* ===== FIN FACTURATION ELECTRONIQUE ===== */

.invoice-vat-franchise-mention {
    margin-top: 18px;
    border-left: 3px solid #1e8062;
    border-radius: 8px;
    background: #f1f8f5;
    padding: 10px 12px;
    color: #315e4e;
    font-size: .68rem;
    font-weight: 800;
}

.delivery-vat-input--disabled {
    opacity: .65;
}

.delivery-vat-input--disabled input {
    cursor: not-allowed;
    background: #f1f4f3;
}

/* =========================================================
   FACTURE ELECTRONIQUE - DEPOT PLATEFORME
   ========================================================= */

.invoice-electronic-platform-deposit {
    margin-top: 14px;
    padding: 16px;
    border: 1px solid #d8e7e1;
    border-radius: 16px;
    background: #f8fbfa;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.invoice-electronic-platform-deposit__info {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.invoice-electronic-platform-deposit__info > span {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: 12px;
    background: #edf5f2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.invoice-electronic-platform-deposit__info small {
    display: block;
    margin-bottom: 3px;
    color: #657d74;
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .05em;
}

.invoice-electronic-platform-deposit__info strong {
    display: block;
    color: #174d3d;
    font-size: .86rem;
}

.invoice-electronic-platform-deposit__info p {
    margin: 4px 0 0;
    color: #63756e;
    font-size: .75rem;
    line-height: 1.45;
}

.invoice-electronic-platform-button {
    border: 0;
    border-radius: 11px;
    padding: 11px 16px;
    background: #1b8d68;
    color: #fff;
    font: inherit;
    font-size: .76rem;
    font-weight: 800;
    white-space: nowrap;
    cursor: pointer;
}

.invoice-electronic-platform-button:hover {
    background: #167557;
}

.invoice-electronic-platform-result {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 11px;
}

.invoice-electronic-platform-result > span {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
}

.invoice-electronic-platform-result strong {
    display: block;
    color: #174d3d;
    font-size: .84rem;
}

.invoice-electronic-platform-result p {
    margin: 3px 0;
    color: #63756e;
    font-size: .74rem;
    line-height: 1.45;
}

.invoice-electronic-platform-result small {
    display: block;
    margin-top: 5px;
    color: #61736c;
    font-size: .7rem;
}

.invoice-electronic-platform-result--success > span {
    background: #e3f5ed;
    color: #167154;
}

.invoice-electronic-platform-result--warning > span {
    background: #fff1dc;
    color: #a56813;
}

@media (max-width: 760px) {
    .invoice-electronic-platform-deposit {
        align-items: stretch;
        flex-direction: column;
    }

    .invoice-electronic-platform-deposit form {
        width: 100%;
    }

    .invoice-electronic-platform-button {
        width: 100%;
    }
}

/* =========================================================
   COMPTABLE - PARAMETRES
   ========================================================= */

.comptable-header__actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.comptable-settings-link {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    border: 1px solid #cfe2da;
    border-radius: 10px;
    background: #f4faf7;
    padding: 0 12px;
    color: #17684e;
    font-size: .75rem;
    font-weight: 800;
    text-decoration: none;
}

.comptable-settings-link:hover {
    background: #eaf6f0;
}

.comptable-settings-notice {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin: 16px 0;
    border: 1px solid #cfe5dc;
    border-radius: 16px;
    background: #f1faf6;
    padding: 16px 18px;
}

.comptable-settings-notice > span {
    font-size: 1.15rem;
}

.comptable-settings-notice strong {
    display: block;
    color: #145a44;
    font-size: .86rem;
}

.comptable-settings-notice p {
    margin: 4px 0 0;
    color: #60746c;
    font-size: .76rem;
    line-height: 1.5;
}

.comptable-settings-form {
    display: grid;
    gap: 18px;
}

.comptable-settings-card {
    border: 1px solid #d8e5df;
    border-radius: 18px;
    background: #fff;
    padding: 22px;
}

.comptable-settings-card__title {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    margin-bottom: 20px;
}

.comptable-settings-card__title > span {
    display: flex;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: #eef7f3;
}

.comptable-settings-card__title small {
    display: block;
    margin-bottom: 3px;
    color: #71847c;
    font-size: .66rem;
    font-weight: 900;
    letter-spacing: .06em;
}

.comptable-settings-card__title h2 {
    margin: 0;
    color: #0c4938;
    font-size: 1rem;
}

.comptable-settings-card__title p {
    margin: 5px 0 0;
    color: #6b7b75;
    font-size: .76rem;
    line-height: 1.45;
}

.comptable-settings-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.comptable-settings-full {
    grid-column: 1 / -1;
}

.comptable-settings-form label {
    display: block;
    margin-bottom: 6px;
    color: #294f43;
    font-size: .75rem;
    font-weight: 800;
}

.comptable-settings-form input[type="text"],
.comptable-settings-form input[type="email"],
.comptable-settings-form input[type="number"] {
    width: 100%;
    min-height: 43px;
    box-sizing: border-box;
    border: 1px solid #ccdcd5;
    border-radius: 10px;
    background: #fff;
    padding: 9px 11px;
    color: #183d32;
    font: inherit;
}

.comptable-settings-form input:focus {
    border-color: #198863;
    outline: 2px solid #d9efe7;
}

.comptable-settings-check {
    margin-top: 16px;
    border-radius: 12px;
    background: #f7faf9;
    padding: 13px 15px;
}

.comptable-settings-check > div {
    margin: 0;
}

.comptable-settings-check label {
    display: inline;
    margin: 0 0 0 7px;
}

.comptable-settings-check--secure {
    border: 1px solid #d9eadf;
    background: #f2f9f5;
}

.comptable-settings-day {
    max-width: 330px;
    margin-top: 16px;
}

.comptable-settings-form .help-text,
.comptable-settings-form .form-text,
.comptable-settings-form div > small {
    display: block;
    margin-top: 6px;
    color: #71827b;
    font-size: .7rem;
    line-height: 1.4;
}

.comptable-settings-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.comptable-settings-actions a {
    color: #657971;
    font-size: .76rem;
    font-weight: 800;
    text-decoration: none;
}

.comptable-settings-actions button {
    border: 0;
    border-radius: 11px;
    background: #197b5b;
    padding: 12px 18px;
    color: #fff;
    font: inherit;
    font-size: .78rem;
    font-weight: 900;
    cursor: pointer;
}

.comptable-settings-actions button:hover {
    background: #14674c;
}

@media (max-width: 760px) {
    .comptable-header__actions {
        width: 100%;
        justify-content: flex-start;
    }

    .comptable-settings-grid {
        grid-template-columns: 1fr;
    }

    .comptable-settings-full {
        grid-column: auto;
    }

    .comptable-settings-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .comptable-settings-actions button {
        width: 100%;
    }
}

/* =========================================================
   COMPTABLE - HISTORIQUE DOSSIERS
   ========================================================= */

.comptable-history {
    margin-top: 20px;
    border: 1px solid #d8e5df;
    border-radius: 18px;
    background: #fff;
    padding: 22px;
}

.comptable-history__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.comptable-history__heading h2 {
    margin: 5px 0 0;
    color: #0b4937;
    font-size: 1.08rem;
}

.comptable-history__heading p {
    max-width: 620px;
    margin: 6px 0 0;
    color: #667a72;
    font-size: .76rem;
    line-height: 1.5;
}

.comptable-history__count {
    flex: 0 0 auto;
    border-radius: 999px;
    background: #edf7f2;
    padding: 7px 11px;
    color: #176b50;
    font-size: .7rem;
    font-weight: 900;
}

.comptable-history-empty {
    display: flex;
    align-items: center;
    gap: 14px;
    border-radius: 14px;
    background: #f6f9f8;
    padding: 18px;
}

.comptable-history-empty > span {
    display: flex;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #edf4f1;
    font-size: 1.1rem;
}

.comptable-history-empty strong {
    display: block;
    color: #315a4d;
    font-size: .82rem;
}

.comptable-history-empty p {
    margin: 4px 0 0;
    color: #75867f;
    font-size: .73rem;
}

.comptable-history-list {
    display: grid;
    gap: 10px;
}

.comptable-history-item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 14px;
    border: 1px solid #e0eae6;
    border-radius: 14px;
    background: #fbfdfc;
    padding: 15px;
}

.comptable-history-item__version span {
    display: flex;
    width: 45px;
    height: 45px;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: #e7f5ef;
    color: #14694e;
    font-size: .78rem;
    font-weight: 900;
}

.comptable-history-item__title {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
}

.comptable-history-item__title strong {
    color: #194d3d;
    font-size: .82rem;
}

.comptable-history-item__content p {
    margin: 3px 0 6px;
    color: #71817b;
    font-size: .71rem;
}

.comptable-history-item__content small {
    display: block;
    margin-top: 5px;
    color: #71817b;
    font-size: .68rem;
}

.comptable-history-item__meta {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
    color: #71817b;
    font-size: .68rem;
}

.comptable-history-warning {
    color: #9a6517;
    font-weight: 800;
}

.comptable-history-ok {
    color: #167054;
    font-weight: 800;
}

.comptable-history-status {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    border-radius: 999px;
    padding: 0 8px;
    font-size: .63rem;
    font-weight: 900;
}

.comptable-history-status--prepared {
    background: #fff2dd;
    color: #986316;
}

.comptable-history-status--sent {
    background: #e4f5ed;
    color: #146b50;
}

.comptable-history-item__actions {
    display: flex;
    align-items: center;
}

.comptable-history-item__actions a {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    border: 1px solid #cce0d7;
    border-radius: 10px;
    background: #f3faf7;
    padding: 0 11px;
    color: #17694f;
    font-size: .7rem;
    font-weight: 900;
    text-decoration: none;
    white-space: nowrap;
}

.comptable-history-item__actions a:hover {
    background: #e9f6f0;
}

@media (max-width: 760px) {
    .comptable-history__heading {
        flex-direction: column;
    }

    .comptable-history-item {
        grid-template-columns: auto 1fr;
    }

    .comptable-history-item__actions {
        grid-column: 1 / -1;
    }

    .comptable-history-item__actions a {
        width: 100%;
        justify-content: center;
    }
}


/* ===== HARMONISATION VISUELLE GESTION 2026-08-23 ===== */

/*
 * Couche commune aux pages de Gestion.
 * Le fonctionnement métier et les classes historiques restent en place.
 */

.gestion-visual-shell {
    min-height: 100vh;
    background:
        radial-gradient(
            circle at 10% 0%,
            rgba(226, 244, 234, .72),
            transparent 32%
        ),
        radial-gradient(
            circle at 92% 14%,
            rgba(255, 236, 205, .55),
            transparent 28%
        ),
        #f7faf7;
}

.gestion-visual-shell > .farm-dashboard__header,
.gestion-top-header,
.gestion-unified-header {
    width: min(1420px, calc(100% - 40px));
    min-height: 76px;
    margin: 0 auto;
    padding: 14px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    background: transparent;
    border: 0;
}

.gestion-unified-brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    padding: 7px 11px;
    border-radius: 15px;
    background: rgba(255,255,255,.82);
    color: #173f2c;
    text-decoration: none;
    box-shadow: 0 10px 30px rgba(31,74,53,.08);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.gestion-unified-brand strong,
.gestion-unified-brand small {
    display: block;
}

.gestion-unified-brand strong {
    color: #173f2c;
    font-size: 1.02rem;
    line-height: 1.15;
}

.gestion-unified-brand small {
    margin-top: 3px;
    color: #738078;
    font-size: .73rem;
}

.gestion-unified-brand > span:first-child,
.gestion-unified-brand .banque-brand__icon {
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    flex: 0 0 43px;
    border-radius: 14px;
    background: linear-gradient(145deg, #e9f7ef, #dff2e8);
    color: #267957;
    box-shadow: inset 0 0 0 1px rgba(36,117,82,.08);
    font-size: 0;
}

.gestion-unified-brand svg {
    width: 27px;
    height: 27px;
    fill: none;
    stroke: currentColor;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.gestion-unified-actions,
.gestion-visual-shell .farm-dashboard__header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.gestion-visual-shell .dashboard-header-button,
.gestion-visual-shell .supplier-header-button,
.gestion-visual-shell .expense-header-button,
.gestion-visual-shell .banque-back,
.gestion-visual-shell .banque-secondary-button,
.gestion-visual-shell .comptable-back,
.gestion-visual-shell .comptable-settings-link {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 10px 15px;
    border: 1px solid rgba(31,87,61,.12);
    border-radius: 13px;
    background: rgba(255,255,255,.88);
    color: #285841;
    font-family: inherit;
    font-size: .88rem;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 8px 22px rgba(31,74,53,.06);
    cursor: pointer;
    transition:
        transform .16s ease,
        box-shadow .16s ease,
        background .16s ease;
}

.gestion-visual-shell .dashboard-header-button:hover,
.gestion-visual-shell .supplier-header-button:hover,
.gestion-visual-shell .expense-header-button:hover,
.gestion-visual-shell .banque-back:hover,
.gestion-visual-shell .banque-secondary-button:hover,
.gestion-visual-shell .comptable-back:hover,
.gestion-visual-shell .comptable-settings-link:hover {
    transform: translateY(-1px);
    background: #fff;
    box-shadow: 0 12px 28px rgba(31,74,53,.10);
}

.gestion-visual-shell .banque-primary-button,
.gestion-visual-shell .supplier-primary-button,
.gestion-visual-shell .supplier-header-button--primary,
.gestion-visual-shell .expense-period-submit,
.gestion-visual-shell .supplier-period-submit,
.gestion-visual-shell .supplier-directory-submit,
.gestion-visual-shell .bank-period-submit,
.gestion-visual-shell .banque-reconcile-button {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 11px 17px;
    border: 0;
    border-radius: 13px;
    background: linear-gradient(135deg, #25845f, #22a579);
    color: #fff;
    font-family: inherit;
    font-weight: 850;
    text-decoration: none;
    box-shadow: 0 11px 24px rgba(34,132,95,.20);
    cursor: pointer;
    transition:
        transform .16s ease,
        box-shadow .16s ease;
}

.gestion-visual-shell .banque-primary-button:hover,
.gestion-visual-shell .supplier-primary-button:hover,
.gestion-visual-shell .supplier-header-button--primary:hover,
.gestion-visual-shell .expense-period-submit:hover,
.gestion-visual-shell .supplier-period-submit:hover,
.gestion-visual-shell .supplier-directory-submit:hover,
.gestion-visual-shell .bank-period-submit:hover,
.gestion-visual-shell .banque-reconcile-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 15px 30px rgba(34,132,95,.25);
}

.gestion-visual-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(26px, 4vw, 48px);
    border: 1px solid rgba(255,255,255,.58);
    border-radius: 28px;
    background-image:
        linear-gradient(
            100deg,
            rgba(18,65,44,.91) 0%,
            rgba(26,89,61,.75) 48%,
            rgba(27,91,62,.36) 100%
        ),
        var(--gestion-visual-image);
    background-size: cover;
    background-position: center;
    box-shadow: 0 22px 55px rgba(36,73,54,.13);
}

.gestion-visual-hero h1,
.gestion-visual-hero h2,
.gestion-visual-hero p,
.gestion-visual-hero strong,
.gestion-visual-hero .banque-eyebrow,
.gestion-visual-hero .supplier-badge,
.gestion-visual-hero .expense-badge,
.gestion-visual-hero .comptable-eyebrow {
    color: #fff;
}

.gestion-visual-hero p {
    max-width: 760px;
    color: rgba(255,255,255,.88);
}

.gestion-visual-hero .banque-eyebrow,
.gestion-visual-hero .supplier-badge,
.gestion-visual-hero .expense-badge,
.gestion-visual-hero .comptable-eyebrow {
    display: inline-flex;
    width: fit-content;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.20);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.gestion-visual-hero .banque-account-hero__status,
.gestion-visual-hero .supplier-invoice-summary,
.gestion-visual-hero .expense-summary,
.gestion-visual-hero .supplier-detail-total,
.gestion-visual-hero .supplier-payment-form-balance,
.gestion-visual-hero .supplier-hero__counter {
    position: relative;
    z-index: 2;
}

.gestion-visual-shell .banque-summary article,
.gestion-visual-shell .banque-section,
.gestion-visual-shell .banque-form-card,
.gestion-visual-shell .banque-account-summary,
.gestion-visual-shell .banque-flow-summary,
.gestion-visual-shell .bank-period-panel,
.gestion-visual-shell .bank-manual-summary,
.gestion-visual-shell .supplier-section,
.gestion-visual-shell .supplier-period-panel,
.gestion-visual-shell .supplier-form-card,
.gestion-visual-shell .supplier-detail-card,
.gestion-visual-shell .supplier-payment-form-card,
.gestion-visual-shell .supplier-directory-filters,
.gestion-visual-shell .expense-section,
.gestion-visual-shell .expense-period-panel,
.gestion-visual-shell .expense-info,
.gestion-visual-shell .comptable-period,
.gestion-visual-shell .comptable-card,
.gestion-visual-shell .comptable-zip,
.gestion-visual-shell .comptable-history,
.gestion-visual-shell .comptable-settings-card,
.gestion-visual-shell .comptable-settings-notice {
    border-color: rgba(36,91,63,.09);
    border-radius: 22px;
    background: rgba(255,255,255,.92);
    box-shadow: 0 13px 38px rgba(37,74,54,.07);
}

.gestion-visual-shell .banque-account,
.gestion-visual-shell .supplier-card,
.gestion-visual-shell .supplier-invoice-card,
.gestion-visual-shell .expense-card,
.gestion-visual-shell .banque-movement,
.gestion-visual-shell .bank-manual-candidate,
.gestion-visual-shell .bank-reco-detail-item,
.gestion-visual-shell .comptable-history-item {
    border-color: rgba(36,91,63,.09);
    border-radius: 18px;
    background: rgba(255,255,255,.95);
    box-shadow: 0 8px 26px rgba(37,74,54,.055);
}

.gestion-visual-shell input,
.gestion-visual-shell select,
.gestion-visual-shell textarea {
    border-radius: 12px;
}

.gestion-visual-shell .banque-form-card input,
.gestion-visual-shell .banque-form-card select,
.gestion-visual-shell .banque-form-card textarea,
.gestion-visual-shell .supplier-form-card input,
.gestion-visual-shell .supplier-form-card select,
.gestion-visual-shell .supplier-form-card textarea,
.gestion-visual-shell .comptable-settings-card input,
.gestion-visual-shell .comptable-settings-card select,
.gestion-visual-shell .comptable-settings-card textarea {
    border-color: rgba(44,92,67,.14);
    background: rgba(255,255,255,.96);
    box-shadow: inset 0 1px 2px rgba(31,63,44,.025);
}

.gestion-visual-shell input:focus,
.gestion-visual-shell select:focus,
.gestion-visual-shell textarea:focus {
    border-color: rgba(34,140,98,.52);
    outline: none;
    box-shadow: 0 0 0 4px rgba(36,153,108,.09);
}

.gestion-top-header {
    margin-bottom: 8px;
}

.gestion-visual-shell .comptable-header.gestion-visual-hero {
    margin-top: 8px;
    margin-bottom: 24px;
}

.gestion-visual-shell .gestion-card,
.gestion-visual-shell .banque-account,
.gestion-visual-shell .supplier-card,
.gestion-visual-shell .supplier-invoice-card,
.gestion-visual-shell .expense-card {
    transition:
        transform .18s ease,
        box-shadow .18s ease;
}

.gestion-visual-shell .gestion-card:hover,
.gestion-visual-shell .banque-account:hover,
.gestion-visual-shell .supplier-card:hover,
.gestion-visual-shell .supplier-invoice-card:hover,
.gestion-visual-shell .expense-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 38px rgba(37,74,54,.10);
}

@media (max-width: 900px) {
    .gestion-visual-shell > .farm-dashboard__header,
    .gestion-top-header,
    .gestion-unified-header {
        width: min(100% - 28px, 1420px);
    }

    .gestion-visual-hero {
        padding: 28px 24px;
        border-radius: 22px;
    }
}

@media (max-width: 720px) {
    .gestion-visual-shell > .farm-dashboard__header,
    .gestion-top-header,
    .gestion-unified-header {
        align-items: stretch;
        flex-direction: column;
    }

    .gestion-unified-actions,
    .gestion-visual-shell .farm-dashboard__header-actions {
        justify-content: flex-start;
    }

    .gestion-visual-shell .dashboard-header-button,
    .gestion-visual-shell .supplier-header-button,
    .gestion-visual-shell .expense-header-button,
    .gestion-visual-shell .banque-back,
    .gestion-visual-shell .banque-secondary-button,
    .gestion-visual-shell .comptable-back,
    .gestion-visual-shell .comptable-settings-link {
        min-height: 40px;
    }

    .gestion-visual-hero {
        padding: 24px 20px;
    }
}


/* ===== FINITION VISUELLE GESTION LOGO IMAGES FORMULAIRES ===== */

.gestion-visual-shell .farm-dashboard__brand {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding: 9px 15px 9px 9px;
    border: 1px solid rgba(255,255,255,.65);
    border-radius: 22px;
    background: rgba(255,253,247,.93);
    color: #123f2e;
    text-decoration: none;
    box-shadow: 0 12px 34px rgba(34,70,50,.10);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.gestion-visual-shell .farm-dashboard__brand .brand__icon {
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(145deg, #23885f, #146f51);
    color: #fff;
    box-shadow: 0 8px 20px rgba(20,111,81,.20);
}

.gestion-visual-shell .farm-dashboard__brand .brand__icon svg {
    width: 36px;
    height: 36px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.gestion-visual-shell .farm-dashboard__brand .brand__text {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.gestion-visual-shell .farm-dashboard__brand .brand__text strong {
    color: #123f2e;
    font-size: 1.18rem;
    font-weight: 900;
}

.gestion-visual-shell .farm-dashboard__brand .brand__text small {
    margin-top: 5px;
    color: #35664f;
    font-size: .82rem;
    font-weight: 650;
}

.gestion-visual-shell:not(.gestion-form-visual) .gestion-visual-hero {
    background-image:
        linear-gradient(
            100deg,
            rgba(17,63,43,.91) 0%,
            rgba(25,84,59,.73) 48%,
            rgba(24,82,56,.32) 100%
        ),
        var(--gestion-family-image);
    background-size: cover;
    background-position: center;
}

.gestion-form-visual {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    background-image:
        linear-gradient(
            90deg,
            rgba(246,249,245,.18),
            rgba(246,249,245,.36)
        ),
        var(--gestion-family-image);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.gestion-form-visual::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        linear-gradient(
            90deg,
            rgba(245,248,244,.06) 0%,
            rgba(245,248,244,.18) 45%,
            rgba(245,248,244,.42) 100%
        );
}

.gestion-form-visual .gestion-visual-hero {
    background: rgba(250,250,247,.88);
    border: 1px solid rgba(255,255,255,.70);
    box-shadow: 0 18px 50px rgba(28,63,45,.13);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.gestion-form-visual .gestion-visual-hero h1,
.gestion-form-visual .gestion-visual-hero h2,
.gestion-form-visual .gestion-visual-hero strong {
    color: #123f2e;
}

.gestion-form-visual .gestion-visual-hero p {
    color: #496b59;
}

.gestion-form-visual .gestion-visual-hero .banque-eyebrow,
.gestion-form-visual .gestion-visual-hero .supplier-badge,
.gestion-form-visual .gestion-visual-hero .expense-badge,
.gestion-form-visual .gestion-visual-hero .comptable-eyebrow {
    color: #206448;
    background: rgba(229,246,237,.88);
    border: 1px solid rgba(36,130,89,.10);
}

.gestion-form-visual .banque-form-card,
.gestion-form-visual .supplier-form-card,
.gestion-form-visual .supplier-payment-form-card,
.gestion-form-visual .comptable-settings-card,
.gestion-form-visual .expense-section {
    background: rgba(255,255,255,.93);
    border: 1px solid rgba(255,255,255,.72);
    box-shadow: 0 20px 52px rgba(30,66,47,.12);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.gestion-visual-shell .farm-dashboard__header .dashboard-header-button,
.gestion-visual-shell .farm-dashboard__header .supplier-header-button,
.gestion-visual-shell .farm-dashboard__header .expense-header-button,
.gestion-visual-shell .farm-dashboard__header .banque-back,
.gestion-visual-shell .farm-dashboard__header .banque-secondary-button {
    min-height: 48px;
    padding: 12px 17px;
    border: 1px solid rgba(31,87,61,.11);
    border-radius: 15px;
    background: rgba(255,255,255,.91);
    color: #24533e;
    font-family: inherit;
    font-weight: 850;
    text-decoration: none;
    box-shadow: 0 10px 26px rgba(31,74,53,.08);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

@media (max-width: 720px) {
    .gestion-visual-shell .farm-dashboard__brand .brand__icon {
        width: 50px;
        height: 50px;
        flex-basis: 50px;
    }

    .gestion-visual-shell .farm-dashboard__brand .brand__icon svg {
        width: 31px;
        height: 31px;
    }

    .gestion-visual-shell .farm-dashboard__brand .brand__text strong {
        font-size: 1rem;
    }

    .gestion-visual-shell .farm-dashboard__brand .brand__text small {
        font-size: .72rem;
    }

    .gestion-form-visual {
        background-attachment: scroll;
    }
}


/* HOME HERO FIX DESCENDERS 2026-08-23 */
.hero--farm-image .hero__content h1,
.hero--farm-image .hero__content h1 span {
    padding-bottom: .16em;
    margin-bottom: -.16em;
}

.hero--farm-image .hero__content h1 {
    padding-bottom: .12em;
}

.hero--farm-image .hero__content h1 span {
}


/* AUTH PASSWORD VISIBILITY 2026-08-23 */
.auth-password {
    position: relative;
}

.auth-password input {
    padding-right: 50px;
}

.auth-password__toggle {
    position: absolute;
    top: 50%;
    right: 9px;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    transform: translateY(-50%);
    cursor: pointer;
    color: #547267;
    background: transparent;
    display: grid;
    place-items: center;
    transition:
        color 160ms ease,
        background 160ms ease;
}

.auth-password__toggle:hover {
    color: var(--green-700);
    background: rgba(36, 179, 128, 0.08);
}

.auth-password__toggle:focus-visible {
    outline: 2px solid rgba(28, 157, 115, 0.55);
    outline-offset: 2px;
}

.auth-password__toggle svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.auth-password__toggle svg[hidden] {
    display: none;
}


/* AUTH FORGOT PASSWORD LINK 2026-08-23 */
.auth-password-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: -4px;
}

.auth-password-actions a {
    color: var(--green-700);
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
    transition: opacity 160ms ease;
}

.auth-password-actions a:hover {
    text-decoration: underline;
}

.auth-password-actions a:focus-visible {
    outline: 2px solid rgba(28, 157, 115, .55);
    outline-offset: 3px;
    border-radius: 4px;
}

/* EXPLOITATION SETTINGS FARM BACKGROUND 2026-08-23 */
body:has(.exploitation-settings-page) {
    min-height: 100vh;
    background:
        linear-gradient(
            rgba(241, 248, 243, 0.44),
            rgba(241, 248, 243, 0.54)
        ),
        url("../images/exploitation/hero-exploitation-Horvhjz.webp")
        center center / cover fixed no-repeat;
}

.exploitation-settings-page {
    position: relative;
    background: transparent;
}

.exploitation-settings-page .farm-dashboard__header,
.exploitation-settings-page .farm-module-page__content {
    position: relative;
    z-index: 1;
}

.exploitation-settings-page .exploitation-settings-card {
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.exploitation-settings-page .exploitation-settings-intro {
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.92);
}

@media (max-width: 900px) {
    body:has(.exploitation-settings-page) {
        background-attachment: scroll;
    }
}

/* EXPLOITATION SETTINGS CONTRAST FIX 2026-08-23 */

/* Logo plus net, sans effet de cadre/ombre */
.exploitation-settings-page
.farm-dashboard__brand .brand__icon {
    box-shadow: none;
}

.exploitation-settings-page
.farm-dashboard__brand .brand__text strong {
    color: #123b30;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.9);
}

.exploitation-settings-page
.farm-dashboard__brand .brand__text small {
    color: #315f52;
    font-weight: 650;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.95);
}


/* Introduction lisible sur la photographie */
.exploitation-settings-page
.exploitation-settings-intro > div {
    width: fit-content;
    max-width: 820px;
    padding: 16px 20px;
    border: 1px solid rgba(255, 255, 255, 0.74);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 10px 28px rgba(23, 67, 53, 0.08);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.exploitation-settings-page
.exploitation-settings-intro span {
    color: #11694f;
}

.exploitation-settings-page
.exploitation-settings-intro h2 {
    color: #123c30;
}

.exploitation-settings-page
.exploitation-settings-intro p {
    color: #435f56;
    font-weight: 520;
}


/* Cartes plus franches et plus lisibles */
.exploitation-settings-page
.exploitation-settings-card {
    border-color: rgba(38, 92, 72, 0.13);
    background: rgba(255, 255, 255, 0.985);
    box-shadow:
        0 16px 36px rgba(28, 70, 55, 0.14);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.exploitation-settings-page
.exploitation-settings-card__content h3 {
    color: #153d31;
    font-weight: 800;
}

.exploitation-settings-page
.exploitation-settings-card__content p {
    color: #506a61;
    font-weight: 520;
}

.exploitation-settings-page
.exploitation-settings-card__footer {
    border-top-color: #dfe9e5;
    color: #61766f;
}

.exploitation-settings-page
.exploitation-settings-card__status {
    background: #e8f6ef;
    color: #17694f;
    font-weight: 800;
}

.exploitation-settings-page
.exploitation-settings-coming {
    color: #12684e;
    font-weight: 800;
}


/* Blocs du bas : même niveau de lisibilité */
.exploitation-settings-page
.exploitation-settings-billing {
    background: rgba(249, 246, 253, 0.97);
    box-shadow: 0 14px 32px rgba(49, 43, 65, 0.10);
}

.exploitation-settings-page
.exploitation-settings-protection {
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 12px 28px rgba(28, 70, 55, 0.08);
}

.exploitation-settings-page
.exploitation-settings-protection p {
    color: #536b63;
}

@media (max-width: 850px) {
    .exploitation-settings-page
    .exploitation-settings-intro > div {
        width: 100%;
    }
}

/* EXPLOITATION SETTINGS BRAND FRAME 2026-08-23 */
.exploitation-settings-page
.farm-dashboard__brand {
    padding: 9px 16px 9px 9px;
    border: 1px solid rgba(255, 255, 255, 0.88);
    border-radius: 22px;
    background: rgba(255, 252, 245, 0.92);
    box-shadow:
        0 12px 30px rgba(31, 67, 51, 0.10);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.exploitation-settings-page
.farm-dashboard__brand .brand__icon {
    box-shadow: none;
}

.exploitation-settings-page
.farm-dashboard__brand .brand__text strong {
    color: #123d32;
    text-shadow: none;
}

.exploitation-settings-page
.farm-dashboard__brand .brand__text small {
    color: #527469;
    text-shadow: none;
}

/* ONBOARDING TOOLS FARM BACKGROUND 2026-08-23 */
.onboarding-page--farm-image {
    background-image:
        linear-gradient(
            90deg,
            rgba(239, 249, 243, 0.56) 0%,
            rgba(239, 249, 243, 0.48) 48%,
            rgba(239, 249, 243, 0.40) 100%
        ),
        var(--onboarding-image);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.onboarding-page--farm-image .auth-background {
    display: none;
}

.onboarding-page--farm-image .auth-brand {
    padding: 9px 16px 9px 9px;
    border: 1px solid rgba(255, 255, 255, 0.88);
    border-radius: 22px;
    background: rgba(255, 252, 245, 0.92);
    box-shadow: 0 12px 30px rgba(31, 67, 51, 0.10);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.onboarding-page--farm-image .onboarding-intro {
    padding: 30px;
    border: 1px solid rgba(255, 255, 255, 0.74);
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: 0 20px 48px rgba(28, 70, 55, 0.11);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.onboarding-page--farm-image .onboarding-card {
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 24px 60px rgba(28, 70, 55, 0.14);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

@media (max-width: 760px) {
    .onboarding-page--farm-image {
        background-attachment: scroll;
        background-image:
            linear-gradient(
                rgba(239, 249, 243, 0.64),
                rgba(239, 249, 243, 0.58)
            ),
            var(--onboarding-image);
    }

    .onboarding-page--farm-image .onboarding-intro {
        padding: 24px;
    }
}

/* CULTURE FORMS RIGHT CONTRAST 2026-08-23 */

/*
 * Nouvelle campagne
 * Modifier la campagne
 * Modifier la culture
 *
 * Le paysage reste visible jusque sous la partie formulaire,
 * sans sacrifier la lisibilité de la carte.
 */
.culture-form-page-visual > .culture-page-overlay,
.culture-campaign-form-page > .culture-page-overlay {
    background:
        linear-gradient(
            90deg,
            rgba(244, 249, 245, 0.02) 0%,
            rgba(244, 249, 245, 0.03) 36%,
            rgba(244, 249, 245, 0.08) 50%,
            rgba(244, 249, 245, 0.24) 66%,
            rgba(244, 249, 245, 0.52) 100%
        ) !important;
}

.culture-form-page-visual .parcel-form-card {
    border-color: rgba(37, 91, 69, 0.12) !important;
    background: rgba(255, 255, 255, 0.94) !important;
    box-shadow:
        0 22px 55px rgba(20, 60, 40, 0.16) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

.culture-form-page-visual
.parcel-form-card__heading h2 {
    color: #173f32 !important;
}

.culture-form-page-visual
.parcel-form-card__heading p {
    color: #587268 !important;
}

.culture-form-page-visual
.parcel-form-card label {
    color: #284f41 !important;
}

.culture-form-page-visual
.parcel-form-card input,
.culture-form-page-visual
.parcel-form-card select,
.culture-form-page-visual
.parcel-form-card textarea {
    border-color: #cfdfd9 !important;
    background: rgba(255, 255, 255, 0.91) !important;
    color: #31594c !important;
}

@media (max-width: 980px) {
    .culture-form-page-visual > .culture-page-overlay,
    .culture-campaign-form-page > .culture-page-overlay {
        background: rgba(244, 249, 245, 0.20) !important;
    }
}

/* FACTURATION VISUAL CONTRAST 2026-08-23 */

/* Logo conforme aux autres pages validées */
.invoice-page
> .farm-dashboard__header
.farm-dashboard__brand {
    padding: 9px 16px 9px 9px;
    border: 1px solid rgba(255, 255, 255, 0.88);
    border-radius: 22px;
    background: rgba(255, 252, 245, 0.94);
    box-shadow: 0 12px 30px rgba(31, 67, 51, 0.10);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.invoice-page
> .farm-dashboard__header
.farm-dashboard__brand .brand__text strong {
    color: #123d32;
}

.invoice-page
> .farm-dashboard__header
.farm-dashboard__brand .brand__text small {
    color: #527469;
    font-weight: 650;
}


/* Bloc principal du hero plus franc */
.invoice-page
.invoice-hero--farm-image > div:first-child {
    border: 1px solid rgba(255, 255, 255, 0.82);
    background: rgba(255, 255, 255, 0.91);
    box-shadow: 0 14px 36px rgba(16, 70, 45, 0.16);
}


/* Badge FACTURATION clairement visible */
.invoice-page .invoice-badge {
    border: 1px solid rgba(15, 92, 67, 0.16);
    background: linear-gradient(
        135deg,
        #18795d,
        #209774
    );
    color: #ffffff;
    box-shadow: 0 7px 18px rgba(24, 121, 93, 0.20);
    font-weight: 900;
}


/* Cartes principales plus nettes */
.invoice-page .invoice-payment-overview article,
.invoice-page .invoice-candidate-card,
.invoice-page .invoice-period-panel,
.invoice-page .invoice-list-card {
    border-color: rgba(39, 91, 71, 0.16);
    background: rgba(255, 255, 255, 0.99);
    box-shadow:
        0 14px 34px rgba(31, 76, 58, 0.11);
}


/* Textes secondaires moins délavés */
.invoice-page .invoice-payment-overview small,
.invoice-page .invoice-list-card small,
.invoice-page .invoice-list-card span {
    color: #60766e;
    font-weight: 650;
}

.invoice-page .invoice-payment-overview strong,
.invoice-page .invoice-list-card strong,
.invoice-page .invoice-candidate-card__top h3 {
    color: #173f33;
    font-weight: 800;
}

.invoice-page .invoice-candidate-card > p {
    color: #506b61;
    font-weight: 600;
}


/* Statistiques du hero également mieux détachées */
.invoice-page
.invoice-hero--farm-image
.invoice-hero__stats > div {
    border: 1px solid rgba(35, 87, 67, 0.12);
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 12px 30px rgba(15, 65, 43, 0.16);
}

/* FACTURATION UX READABILITY 2026-08-23 */

/* Badge et introduction */
.invoice-page .invoice-badge {
    padding: 8px 12px;
    font-size: 0.76rem;
    line-height: 1.2;
}

.invoice-page .invoice-hero p {
    font-size: 0.92rem;
    line-height: 1.6;
}


/* Statistiques du hero */
.invoice-page .invoice-hero__stats span {
    font-size: 0.74rem;
    line-height: 1.35;
}

.invoice-page .invoice-hero__stats strong {
    font-size: 1.35rem;
}


/* Titres de sections */
.invoice-page .culture-section__heading span {
    font-size: 0.76rem;
    line-height: 1.3;
}

.invoice-page .culture-section__heading h2 {
    font-size: clamp(1.35rem, 2.2vw, 1.75rem);
}


/* Cartes des livraisons à facturer */
.invoice-page .invoice-candidate-card {
    line-height: 1.45;
}

.invoice-page .invoice-candidate-card__top small {
    font-size: 0.76rem;
}

.invoice-page .invoice-candidate-card__top h3 {
    font-size: 1rem;
    line-height: 1.35;
}

.invoice-page .invoice-candidate-card__top > span {
    padding: 7px 10px;
    font-size: 0.72rem;
}

.invoice-page .invoice-candidate-card > p {
    font-size: 0.86rem;
    line-height: 1.45;
}

.invoice-page .invoice-ready strong,
.invoice-page .invoice-blocked strong {
    font-size: 0.82rem;
}

.invoice-page .invoice-ready small,
.invoice-page .invoice-blocked,
.invoice-page .invoice-blocked ul {
    font-size: 0.74rem;
    line-height: 1.45;
}

.invoice-page .invoice-create-button {
    min-height: 46px;
    font-size: 0.82rem;
}


/* Cartes récapitulatives des paiements */
.invoice-page .invoice-payment-overview small {
    font-size: 0.72rem;
    line-height: 1.3;
}

.invoice-page .invoice-payment-overview strong {
    font-size: 1rem;
    line-height: 1.25;
}


/* Filtres de période */
.invoice-page .invoice-period-current small {
    font-size: 0.72rem;
}

.invoice-page .invoice-period-current strong {
    font-size: 1rem;
}

.invoice-page .invoice-period-filters label,
.invoice-page .invoice-period-filters label > span {
    font-size: 0.76rem;
}

.invoice-page .invoice-period-filters select,
.invoice-page .invoice-period-submit,
.invoice-page .invoice-period-reset {
    font-size: 0.80rem;
}


/* Liste des factures */
.invoice-page .invoice-list-card {
    min-height: 64px;
    padding: 15px 17px;
}

.invoice-page .invoice-list-card small,
.invoice-page .invoice-list-card span {
    font-size: 0.72rem;
    line-height: 1.35;
}

.invoice-page .invoice-list-card strong {
    font-size: 0.90rem;
    line-height: 1.35;
}

.invoice-page .invoice-payment-chip {
    font-size: 0.68rem !important;
    line-height: 1.2;
}

.invoice-page .invoice-list-card__balance {
    font-size: 0.78rem;
}


/* Messages */
.invoice-page .invoice-message {
    font-size: 0.80rem;
    line-height: 1.45;
}

@media (max-width: 680px) {
    .invoice-page .invoice-payment-overview small {
        font-size: 0.68rem;
    }

    .invoice-page .invoice-payment-overview strong {
        font-size: 0.92rem;
    }

    .invoice-page .invoice-list-card small,
    .invoice-page .invoice-list-card span {
        font-size: 0.70rem;
    }
}



/* FACTURATION UX FINAL CONTRAST 2026-08-23 */

/* =========================================================
   CARTES : BLANC FRANC + RELIEF PLUS NET
   ========================================================= */

.invoice-page .invoice-payment-overview article,
.invoice-page .invoice-candidate-card,
.invoice-page .invoice-period-panel,
.invoice-page .invoice-list-card {
    border: 1px solid rgba(30, 92, 68, 0.22) !important;
    background: #ffffff !important;
    box-shadow:
        0 16px 38px rgba(27, 72, 54, 0.14) !important;
}

.invoice-page .invoice-candidate-card {
    padding: 22px !important;
}

.invoice-page .invoice-list-card {
    min-height: 76px !important;
    padding: 18px 20px !important;
}

.invoice-page .invoice-period-panel {
    padding: 22px 24px !important;
}


/* =========================================================
   TITRES ET SECTIONS
   ========================================================= */

.invoice-page .culture-section__heading span {
    font-size: 0.82rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em;
}

.invoice-page .culture-section__heading h2 {
    font-size: clamp(1.55rem, 2.4vw, 2rem) !important;
    line-height: 1.2;
    color: #123c30 !important;
}

.invoice-page .invoice-hero h1 {
    font-size: clamp(2.4rem, 4.8vw, 3.5rem) !important;
}

.invoice-page .invoice-hero p {
    font-size: 1rem !important;
    line-height: 1.65 !important;
}


/* =========================================================
   BADGE FACTURATION
   ========================================================= */

.invoice-page .invoice-badge {
    padding: 9px 14px !important;
    font-size: 0.82rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em;
}


/* =========================================================
   STATISTIQUES DU HERO
   ========================================================= */

.invoice-page .invoice-hero__stats > div {
    min-width: 132px;
    padding: 18px !important;
}

.invoice-page .invoice-hero__stats span {
    font-size: 0.80rem !important;
    font-weight: 700;
    color: #47685d !important;
}

.invoice-page .invoice-hero__stats strong {
    font-size: 1.55rem !important;
    color: #153f31 !important;
}


/* =========================================================
   RECAP PAIEMENTS
   ========================================================= */

.invoice-page .invoice-payment-overview article {
    padding: 18px 20px !important;
}

.invoice-page .invoice-payment-overview small {
    font-size: 0.80rem !important;
    font-weight: 850 !important;
    color: #526e64 !important;
}

.invoice-page .invoice-payment-overview strong {
    font-size: 1.15rem !important;
    color: #153e31 !important;
}


/* =========================================================
   LIVRAISONS A FACTURER
   ========================================================= */

.invoice-page .invoice-candidate-card__top small {
    font-size: 0.82rem !important;
    font-weight: 900 !important;
}

.invoice-page .invoice-candidate-card__top h3 {
    margin-top: 7px;
    font-size: 1.08rem !important;
    line-height: 1.3;
}

.invoice-page .invoice-candidate-card__top > span {
    padding: 8px 11px !important;
    font-size: 0.78rem !important;
}

.invoice-page .invoice-candidate-card > p {
    font-size: 0.92rem !important;
    line-height: 1.5 !important;
    color: #405f54 !important;
}

.invoice-page .invoice-ready,
.invoice-page .invoice-blocked {
    padding: 14px !important;
}

.invoice-page .invoice-ready strong,
.invoice-page .invoice-blocked strong {
    font-size: 0.88rem !important;
}

.invoice-page .invoice-ready small,
.invoice-page .invoice-blocked,
.invoice-page .invoice-blocked ul {
    font-size: 0.80rem !important;
    line-height: 1.5 !important;
}

.invoice-page .invoice-create-button {
    min-height: 48px !important;
    font-size: 0.88rem !important;
}


/* =========================================================
   FILTRES DE PERIODE
   ========================================================= */

.invoice-page .invoice-period-current small {
    font-size: 0.78rem !important;
}

.invoice-page .invoice-period-current strong {
    font-size: 1.08rem !important;
}

.invoice-page .invoice-period-filters label,
.invoice-page .invoice-period-filters label > span {
    font-size: 0.82rem !important;
    font-weight: 750 !important;
}

.invoice-page .invoice-period-filters select {
    min-height: 44px;
    font-size: 0.86rem !important;
}

.invoice-page .invoice-period-submit,
.invoice-page .invoice-period-reset {
    min-height: 44px;
    font-size: 0.86rem !important;
}


/* =========================================================
   LISTE DES FACTURES
   ========================================================= */

.invoice-page .invoice-list-card small,
.invoice-page .invoice-list-card span {
    font-size: 0.80rem !important;
    line-height: 1.4 !important;
    color: #526d63 !important;
}

.invoice-page .invoice-list-card strong {
    font-size: 1rem !important;
    line-height: 1.35 !important;
    color: #153d31 !important;
}

.invoice-page .invoice-payment-chip {
    padding: 6px 9px;
    font-size: 0.74rem !important;
}

.invoice-page .invoice-list-card__balance {
    font-size: 0.86rem !important;
}


/* =========================================================
   MESSAGES
   ========================================================= */

.invoice-page .invoice-message {
    padding: 14px 17px !important;
    font-size: 0.86rem !important;
    line-height: 1.5 !important;
}


/* =========================================================
   MOBILE : NE PLUS DESCENDRE SOUS UNE TAILLE LISIBLE
   ========================================================= */

@media (max-width: 680px) {

    .invoice-page .invoice-payment-overview small {
        font-size: 0.76rem !important;
    }

    .invoice-page .invoice-payment-overview strong {
        font-size: 1rem !important;
    }

    .invoice-page .invoice-list-card small,
    .invoice-page .invoice-list-card span {
        font-size: 0.76rem !important;
    }

    .invoice-page .invoice-candidate-card__top small,
    .invoice-page .invoice-ready small {
        font-size: 0.76rem !important;
    }
}



/* FACTURATION PAGE BACKGROUND DEPTH 2026-08-23 */
.invoice-page {
    background:
        radial-gradient(
            circle at 7% 14%,
            rgba(31, 126, 91, 0.30),
            transparent 34%
        ),
        radial-gradient(
            circle at 94% 12%,
            rgba(188, 100, 65, 0.22),
            transparent 32%
        ),
        radial-gradient(
            circle at 48% 78%,
            rgba(67, 135, 106, 0.10),
            transparent 38%
        ),
        linear-gradient(
            135deg,
            #d9ebe3 0%,
            #e9f1ed 44%,
            #f0eee7 68%,
            #f2dfd4 100%
        ) !important;
}


/* FACTURATION LOWER DEPTH 2026-08-23 */

/* On conserve le haut, on renforce seulement le bas */
.invoice-page {
    position: relative;
    isolation: isolate;
}

.invoice-page::after {
    content: "";
    position: absolute;
    inset: 46% 0 0 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(
            180deg,
            rgba(210, 223, 216, 0.00) 0%,
            rgba(204, 219, 212, 0.38) 22%,
            rgba(196, 214, 206, 0.72) 100%
        ),
        radial-gradient(
            circle at 14% 88%,
            rgba(42, 120, 86, 0.16),
            transparent 34%
        ),
        radial-gradient(
            circle at 88% 92%,
            rgba(178, 116, 82, 0.12),
            transparent 30%
        );
}

.invoice-page > * {
    position: relative;
    z-index: 1;
}

/* Bas de page : cartes plus présentes */
.invoice-page .invoice-list-card {
    border: 1px solid rgba(35, 89, 67, 0.18);
    background: rgba(255, 255, 255, 0.995);
    box-shadow:
        0 16px 36px rgba(26, 70, 51, 0.11),
        0 2px 0 rgba(255, 255, 255, 0.70) inset;
}

/* Un peu plus de présence sur les infos de la liste */
.invoice-page .invoice-list-card small,
.invoice-page .invoice-list-card span,
.invoice-page .invoice-list-card__balance {
    color: #506960;
    font-weight: 650;
}

.invoice-page .invoice-list-card strong {
    color: #163d31;
    font-weight: 800;
}



/* FACTURATION PAYMENT FILTERS READABILITY 2026-08-23 */
.invoice-page .invoice-payment-filters {
    gap: 10px;
    margin-bottom: 18px;
}

.invoice-page .invoice-payment-filters a {
    min-height: 42px;
    padding: 0 17px;
    border-width: 1px;
    font-size: 0.84rem;
    line-height: 1;
    font-weight: 800;
}

.invoice-page .invoice-payment-filters a:hover,
.invoice-page .invoice-payment-filters a.is-active {
    border-color: #248d6c;
    background: #e1f4eb;
    color: #0f684d;
}

@media (max-width: 680px) {
    .invoice-page .invoice-payment-filters a {
        min-height: 40px;
        padding: 0 14px;
        font-size: 0.80rem;
    }
}



/* FACTURATION HERO STATS SPACING 2026-08-23 */
.invoice-page .invoice-hero__stats {
    gap: 22px;
}

@media (max-width: 760px) {
    .invoice-page .invoice-hero__stats {
        gap: 12px;
    }
}



/* SUPPLIER INVOICE UX VISUAL FIX 2026-08-23 */

/* =========================================================
   FOND GENERAL PLUS PRESENT
   ========================================================= */

.supplier-invoice-page .supplier-invoice-shell {
    background:
        radial-gradient(
            circle at 8% 15%,
            rgba(38, 130, 91, 0.26),
            transparent 34%
        ),
        radial-gradient(
            circle at 94% 18%,
            rgba(174, 105, 73, 0.18),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #dcebe4 0%,
            #eaf1ed 48%,
            #f0e7de 100%
        ) !important;
}


/* =========================================================
   HERO : IMAGE MOINS SOMBRE
   ========================================================= */

.supplier-invoice-page .supplier-invoice-hero {
    background-image:
        linear-gradient(
            100deg,
            rgba(18, 65, 44, 0.68) 0%,
            rgba(26, 89, 61, 0.46) 48%,
            rgba(27, 91, 62, 0.12) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center !important;
    box-shadow:
        0 22px 55px rgba(35, 73, 54, 0.16) !important;
}

.supplier-invoice-page .supplier-invoice-hero h1 {
    color: #ffffff !important;
    font-size: clamp(2.6rem, 4.6vw, 4rem) !important;
    line-height: 1.05 !important;
}

.supplier-invoice-page .supplier-invoice-hero p {
    color: rgba(255, 255, 255, 0.94) !important;
    font-size: 1rem !important;
    line-height: 1.6 !important;
}

.supplier-invoice-page .supplier-badge {
    padding: 8px 12px !important;
    border: 1px solid rgba(255,255,255,.30) !important;
    background: rgba(11, 74, 51, 0.55) !important;
    color: #ffffff !important;
    font-size: 0.78rem !important;
    font-weight: 900 !important;
}


/* =========================================================
   3 COMPTEURS DU HERO
   ========================================================= */

.supplier-invoice-page .supplier-invoice-summary {
    min-width: 420px;
    gap: 18px !important;
}

.supplier-invoice-page .supplier-invoice-summary article {
    min-height: 112px;
    padding: 18px 16px !important;
    border: 1px solid rgba(34, 88, 66, 0.15);
    background: rgba(255, 255, 255, 0.97) !important;
    box-shadow:
        0 14px 34px rgba(20, 64, 45, 0.17) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.supplier-invoice-page .supplier-invoice-summary small {
    color: #536d63 !important;
    font-size: 0.78rem !important;
    line-height: 1.3 !important;
    font-weight: 850 !important;
}

.supplier-invoice-page .supplier-invoice-summary strong {
    margin-top: 10px !important;
    color: #123f31 !important;
    font-size: 1.95rem !important;
    line-height: 1 !important;
    font-weight: 900 !important;
}

.supplier-invoice-page .supplier-period-partial {
    color: #835f25 !important;
    font-size: 0.72rem !important;
    font-weight: 800 !important;
}


/* =========================================================
   PANNEAU DE PERIODE / FILTRES
   ========================================================= */

.supplier-invoice-page .supplier-period-panel {
    border: 1px solid rgba(35, 88, 67, 0.16) !important;
    background: #ffffff !important;
    box-shadow:
        0 16px 38px rgba(34, 77, 58, 0.11) !important;
}

.supplier-invoice-page .supplier-period-panel label,
.supplier-invoice-page .supplier-period-panel span,
.supplier-invoice-page .supplier-period-panel small {
    color: #4f695f !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;
}

.supplier-invoice-page .supplier-period-panel select {
    min-height: 44px;
    font-size: 0.88rem !important;
    color: #294f41 !important;
}

.supplier-invoice-page .supplier-period-submit {
    min-height: 44px;
    padding: 0 18px !important;
    font-size: 0.86rem !important;
}


/* =========================================================
   SECTION FACTURES ENREGISTREES
   ========================================================= */

.supplier-invoice-page .supplier-section {
    border: 1px solid rgba(35, 88, 67, 0.14) !important;
    background: rgba(255,255,255,.98) !important;
    box-shadow:
        0 16px 38px rgba(34, 77, 58, 0.09) !important;
}

.supplier-invoice-page .supplier-section h2 {
    color: #143e31 !important;
    font-size: clamp(1.55rem, 2.4vw, 2rem) !important;
}

.supplier-invoice-page .supplier-section__eyebrow,
.supplier-invoice-page .supplier-eyebrow {
    font-size: 0.78rem !important;
    font-weight: 900 !important;
}


/* =========================================================
   CARTES DE FACTURES
   ========================================================= */

.supplier-invoice-page .supplier-invoice-card {
    min-height: 88px;
    padding: 20px 22px !important;

    border: 1px solid rgba(34, 88, 66, 0.16) !important;
    background: #ffffff !important;

    box-shadow:
        0 12px 30px rgba(34, 75, 56, 0.09) !important;
}

.supplier-invoice-page .supplier-invoice-card__main small {
    color: #695184 !important;
    font-size: 0.80rem !important;
    font-weight: 900 !important;
}

.supplier-invoice-page .supplier-invoice-card__main h3 {
    margin: 6px 0 8px !important;
    color: #133d30 !important;
    font-size: 1.04rem !important;
    line-height: 1.3 !important;
    font-weight: 850 !important;
}

.supplier-invoice-page .supplier-invoice-card__meta {
    color: #526b62 !important;
    font-size: 0.80rem !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
}

.supplier-invoice-page .supplier-invoice-card__amount small {
    color: #61756e !important;
    font-size: 0.78rem !important;
    font-weight: 750 !important;
}

.supplier-invoice-page .supplier-invoice-card__amount strong {
    margin: 4px 0 7px !important;
    color: #123d30 !important;
    font-size: 1.35rem !important;
    font-weight: 900 !important;
}

.supplier-invoice-page .supplier-payment-status {
    padding: 6px 9px !important;
    font-size: 0.72rem !important;
}

.supplier-invoice-page .supplier-invoice-card__actions a {
    color: #67408e !important;
    font-size: 0.84rem !important;
    line-height: 1.35 !important;
    font-weight: 850 !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 850px) {

    .supplier-invoice-page .supplier-invoice-summary {
        min-width: 0;
        gap: 12px !important;
    }

    .supplier-invoice-page .supplier-invoice-summary strong {
        font-size: 1.65rem !important;
    }

    .supplier-invoice-page .supplier-invoice-card__main small,
    .supplier-invoice-page .supplier-invoice-card__meta {
        font-size: 0.76rem !important;
    }
}



/* SUPPLIER INVOICE SECTION HEADING SPACING 2026-08-23 */
.supplier-invoice-page .supplier-section__heading {
    box-sizing: border-box;
    padding: 22px 26px 18px;
    gap: 22px;
}

.supplier-invoice-page
.supplier-section__heading > div {
    min-width: 0;
}

.supplier-invoice-page
.supplier-section__heading .supplier-primary-button {
    flex: 0 0 auto;
}

@media (max-width: 850px) {
    .supplier-invoice-page .supplier-section__heading {
        padding: 20px 20px 16px;
        gap: 14px;
    }
}



/* SUPPLIER INVOICE FORM BACKGROUND HEADER FIX 2026-08-23 */

/* Vraie photographie en fond pleine page */
.supplier-invoice-form-page
.supplier-form-shell.gestion-form-visual {
    background-image:
        linear-gradient(
            90deg,
            rgba(240, 247, 242, 0.30) 0%,
            rgba(240, 247, 242, 0.36) 48%,
            rgba(246, 244, 238, 0.48) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

/* Le voile supplémentaire ne doit plus blanchir la photo */
.supplier-invoice-form-page
.supplier-form-shell.gestion-form-visual::before {
    background:
        linear-gradient(
            90deg,
            rgba(245, 248, 244, 0.02) 0%,
            rgba(245, 248, 244, 0.07) 48%,
            rgba(245, 248, 244, 0.16) 100%
        ) !important;
}

/* Logo et bouton retour alignés par leur bord inférieur */
.supplier-invoice-form-page
.gestion-top-header {
    align-items: flex-end !important;
}

/* Panneaux suffisamment francs sur la photographie */
.supplier-invoice-form-page
.supplier-form-intro.gestion-visual-hero {
    background: rgba(255, 253, 248, 0.90) !important;
    border-color: rgba(255, 255, 255, 0.82) !important;
    box-shadow:
        0 20px 52px rgba(27, 66, 47, 0.16) !important;
}

.supplier-invoice-form-page
.supplier-form-card {
    background: rgba(255, 255, 255, 0.96) !important;
    border-color: rgba(255, 255, 255, 0.84) !important;
    box-shadow:
        0 22px 56px rgba(28, 67, 49, 0.15) !important;
}

@media (max-width: 720px) {
    .supplier-invoice-form-page
    .supplier-form-shell.gestion-form-visual {
        background-attachment: scroll !important;

        background-image:
            linear-gradient(
                rgba(242, 248, 244, 0.46),
                rgba(242, 248, 244, 0.52)
            ),
            var(--gestion-family-image) !important;
    }

    .supplier-invoice-form-page
    .gestion-top-header {
        align-items: stretch !important;
    }
}



/* SUPPLIER INVOICE FORM HEADER WIDTH ALIGNMENT 2026-08-23 */

/*
 * Le header utilise exactement la même largeur que
 * le layout Nouvelle / Modifier facture fournisseur.
 *
 * Gauche : logo = panneau introduction
 * Droite : bouton retour = carte formulaire
 */
.supplier-invoice-form-page
.supplier-form-shell
> .gestion-top-header {
    width: min(1220px, calc(100% - 40px)) !important;
    box-sizing: border-box;
    margin-left: auto !important;
    margin-right: auto !important;
    align-items: flex-end !important;
}

@media (max-width: 900px) {
    .supplier-invoice-form-page
    .supplier-form-shell
    > .gestion-top-header {
        width: min(1220px, calc(100% - 28px)) !important;
    }
}

@media (max-width: 720px) {
    .supplier-invoice-form-page
    .supplier-form-shell
    > .gestion-top-header {
        width: calc(100% - 24px) !important;
        align-items: stretch !important;
    }
}



/* SUPPLIER INVOICE DETAIL VISUAL UX 2026-08-23 */

/* =========================================================
   HEADER : MEME LARGEUR QUE LE CONTENU + ALIGNEMENT
   ========================================================= */

.supplier-invoice-detail-page
.supplier-invoice-shell
> .gestion-top-header {
    width: min(1420px, calc(100% - 40px)) !important;
    box-sizing: border-box;
    margin-left: auto !important;
    margin-right: auto !important;
    align-items: flex-end !important;
}


/* Action principale clairement identifiable */
.supplier-invoice-detail-page
.supplier-header-button--primary {
    border: 0 !important;
    background:
        linear-gradient(
            135deg,
            #25845f,
            #1d9870
        ) !important;
    color: #ffffff !important;
    box-shadow:
        0 11px 26px rgba(31, 128, 91, 0.20) !important;
}


/* =========================================================
   HERO : PHOTO PLUS PRESENTE
   ========================================================= */

.supplier-invoice-detail-page
.supplier-detail-hero {
    background-image:
        linear-gradient(
            100deg,
            rgba(16, 63, 43, 0.64) 0%,
            rgba(23, 82, 57, 0.40) 48%,
            rgba(24, 82, 56, 0.10) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center !important;

    border: 1px solid rgba(255,255,255,.62) !important;

    box-shadow:
        0 22px 55px rgba(31, 70, 51, 0.16) !important;
}

.supplier-invoice-detail-page
.supplier-detail-hero__text h1 {
    color: #ffffff !important;
    font-size: clamp(2.5rem, 4.4vw, 3.8rem) !important;
    line-height: 1.05 !important;
}

.supplier-invoice-detail-page
.supplier-detail-hero__text > p {
    color: rgba(255,255,255,.94) !important;
    font-size: 1.02rem !important;
    line-height: 1.55 !important;
}


/* Badge du hero */
.supplier-invoice-detail-page
.supplier-detail-hero .supplier-badge {
    padding: 8px 12px !important;

    border: 1px solid rgba(255,255,255,.28) !important;

    background:
        rgba(12, 76, 52, 0.58) !important;

    color: #ffffff !important;

    font-size: 0.78rem !important;
    font-weight: 900 !important;
}


/* =========================================================
   MONTANT TTC : CONTRASTE FORT
   ========================================================= */

.supplier-invoice-detail-page
.supplier-detail-total {
    min-width: 220px;

    padding: 25px 24px !important;

    border:
        1px solid rgba(34, 88, 66, 0.16) !important;

    border-radius: 22px !important;

    background:
        rgba(255, 255, 255, 0.97) !important;

    box-shadow:
        0 16px 38px rgba(20, 62, 45, 0.17) !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.supplier-invoice-detail-page
.supplier-detail-total small {
    color: #526b62 !important;

    font-size: 0.82rem !important;
    font-weight: 850 !important;
    letter-spacing: 0.06em;
}

.supplier-invoice-detail-page
.supplier-detail-total strong {
    margin: 8px 0 12px !important;

    color: #123e31 !important;

    font-size: 2rem !important;
    line-height: 1 !important;
    font-weight: 900 !important;
}


/* =========================================================
   GRANDES CARTES DU DETAIL
   ========================================================= */

.supplier-invoice-detail-page
.supplier-detail-card {
    border:
        1px solid rgba(34, 88, 66, 0.14) !important;

    background: #ffffff !important;

    box-shadow:
        0 16px 38px rgba(33, 74, 56, 0.10) !important;
}


/* Titres de cartes */
.supplier-invoice-detail-page
.supplier-detail-card__heading span:first-child {
    color: #526d62 !important;

    font-size: 0.82rem !important;
    font-weight: 900 !important;
}

.supplier-invoice-detail-page
.supplier-detail-card__heading h2 {
    color: #133d31 !important;

    font-size: 1.60rem !important;
    line-height: 1.25 !important;
}


/* =========================================================
   CHAMPS D INFORMATION
   ========================================================= */

.supplier-invoice-detail-page
.supplier-detail-field {
    border:
        1px solid rgba(38, 89, 69, 0.08);

    background: #f5f8f5 !important;
}

.supplier-invoice-detail-page
.supplier-detail-field small,
.supplier-invoice-detail-page
.supplier-detail-amounts small {
    color: #5a7168 !important;

    font-size: 0.82rem !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;
}

.supplier-invoice-detail-page
.supplier-detail-field strong {
    color: #1a4034 !important;

    font-size: 1rem !important;
    line-height: 1.4 !important;
    font-weight: 800 !important;
}


/* Montants intermédiaires */
.supplier-invoice-detail-page
.supplier-detail-amounts > div {
    border:
        1px solid rgba(38, 89, 69, 0.08);

    background: #f5f8f5 !important;
}

.supplier-invoice-detail-page
.supplier-detail-amounts strong {
    color: #163e32 !important;

    font-size: 1.12rem !important;
    font-weight: 850 !important;
}

.supplier-invoice-detail-page
.supplier-detail-amounts__total {
    background: #e9f4ed !important;
}


/* =========================================================
   DOCUMENT ET METADONNEES
   ========================================================= */

.supplier-invoice-detail-page
.supplier-document-info {
    border:
        1px solid rgba(38, 89, 69, 0.08);

    background: #f5f8f5 !important;
}

.supplier-invoice-detail-page
.supplier-document-info strong {
    color: #183f33 !important;

    font-size: 0.96rem !important;
}

.supplier-invoice-detail-page
.supplier-document-info small,
.supplier-invoice-detail-page
.supplier-detail-history {
    color: #5c7169 !important;

    font-size: 0.82rem !important;
    line-height: 1.45 !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 1000px) {

    .supplier-invoice-detail-page
    .supplier-detail-total {
        min-width: 0;
    }
}

@media (max-width: 720px) {

    .supplier-invoice-detail-page
    .supplier-invoice-shell
    > .gestion-top-header {
        width: calc(100% - 24px) !important;
        align-items: stretch !important;
    }

    .supplier-invoice-detail-page
    .supplier-detail-hero__text h1 {
        font-size: 2.15rem !important;
    }

    .supplier-invoice-detail-page
    .supplier-detail-field small,
    .supplier-invoice-detail-page
    .supplier-detail-amounts small,
    .supplier-invoice-detail-page
    .supplier-document-info small {
        font-size: 0.78rem !important;
    }
}



/* SUPPLIER INVOICE DETAIL MOBILE FINAL 2026-08-23 */

@media (max-width: 720px) {

    /* =====================================================
       AUCUN DEBORDEMENT HORIZONTAL
       ===================================================== */

    body.supplier-invoice-detail-page,
    .supplier-invoice-detail-page .supplier-invoice-shell {
        width: 100%;
        max-width: 100%;
    }

    .supplier-invoice-detail-page
    .supplier-invoice-shell *,
    .supplier-invoice-detail-page
    .supplier-invoice-shell *::before,
    .supplier-invoice-detail-page
    .supplier-invoice-shell *::after {
        box-sizing: border-box;
    }

    .supplier-invoice-detail-page
    .supplier-content,
    .supplier-invoice-detail-page
    .supplier-detail-content {
        width: calc(100% - 24px) !important;
        max-width: calc(100% - 24px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }


    /* =====================================================
       LOGO OFFICIEL COMPLET
       ===================================================== */

    .supplier-invoice-detail-page
    .farm-dashboard__brand {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .supplier-invoice-detail-page
    .farm-dashboard__brand .brand__text {
        display: flex !important;
        min-width: 0;
        flex-direction: column;
    }

    .supplier-invoice-detail-page
    .farm-dashboard__brand .brand__text strong {
        display: block !important;
        font-size: 1rem !important;
        white-space: normal !important;
    }

    .supplier-invoice-detail-page
    .farm-dashboard__brand .brand__text small {
        display: block !important;
        margin-top: 3px !important;
        color: #35664f !important;
        font-size: 0.72rem !important;
        line-height: 1.25 !important;
        font-weight: 650 !important;
        white-space: normal !important;
    }


    /* =====================================================
       BOUTONS DU HEADER
       ===================================================== */

    .supplier-invoice-detail-page
    .farm-dashboard__header-actions {
        display: grid !important;
        width: 100% !important;
        min-width: 0;
        grid-template-columns:
            minmax(0, 1.35fr)
            minmax(0, .85fr);
        gap: 10px !important;
    }

    .supplier-invoice-detail-page
    .farm-dashboard__header-actions
    .supplier-header-button {
        width: 100%;
        min-width: 0;
        min-height: 44px;
        padding: 10px 12px !important;
        justify-content: center;
        text-align: center;
        white-space: normal;
        line-height: 1.25;
    }


    /* =====================================================
       HERO MOBILE
       ===================================================== */

    .supplier-invoice-detail-page
    .supplier-detail-hero {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        padding: 22px 20px 24px !important;
        gap: 22px !important;
        overflow: hidden;
    }

    .supplier-invoice-detail-page
    .supplier-detail-hero__text {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .supplier-invoice-detail-page
    .supplier-detail-hero__text h1 {
        max-width: 100%;
        margin-top: 16px;
        font-size: clamp(1.85rem, 8.5vw, 2.25rem) !important;
        line-height: 1.08 !important;
        overflow-wrap: anywhere;
        word-break: normal;
    }

    .supplier-invoice-detail-page
    .supplier-detail-hero__text > p {
        font-size: 0.92rem !important;
    }


    /* Carte montant : bien séparée du titre */
    .supplier-invoice-detail-page
    .supplier-detail-total {
        width: 100% !important;
        max-width: 100%;
        min-width: 0 !important;
        margin-top: 2px;
        padding: 22px !important;
    }


    /* =====================================================
       CARTES DU DETAIL
       ===================================================== */

    .supplier-invoice-detail-page
    .supplier-detail-grid,
    .supplier-invoice-detail-page
    .supplier-detail-card,
    .supplier-invoice-detail-page
    .supplier-payment-card,
    .supplier-invoice-detail-page
    .supplier-detail-fields,
    .supplier-invoice-detail-page
    .supplier-detail-amounts {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .supplier-invoice-detail-page
    .supplier-detail-card {
        padding: 20px !important;
    }

    .supplier-invoice-detail-page
    .supplier-detail-field,
    .supplier-invoice-detail-page
    .supplier-detail-amounts > div {
        min-width: 0;
    }


    /* Noms de fichiers / textes métier longs */
    .supplier-invoice-detail-page
    .supplier-document-info strong,
    .supplier-invoice-detail-page
    .supplier-document-info small,
    .supplier-invoice-detail-page
    .supplier-detail-field strong,
    .supplier-invoice-detail-page
    .supplier-detail-history {
        max-width: 100%;
        overflow-wrap: anywhere;
        word-break: normal;
    }
}



/* SUPPLIER INVOICE FORM MOBILE BOTTOM SPACE 2026-08-23 */

@media (max-width: 720px) {

    /*
     * Nouvelle facture + Modifier facture :
     * réserve suffisamment de place après le formulaire
     * pour que les boutons restent entièrement visibles.
     */
    .supplier-invoice-form-page
    .supplier-form-layout {
        margin-bottom: 120px !important;
    }

    .supplier-invoice-form-page
    .supplier-form-card {
        margin-bottom: 0 !important;
    }

    .supplier-invoice-form-page
    .supplier-form-actions {
        padding-bottom: 8px;
    }
}



/* SUPPLIER INVOICE FORM MOBILE CARD GAP 2026-08-23 */
@media (max-width: 720px) {

    .supplier-invoice-form-page
    .supplier-form-card {
        margin-bottom: 24px !important;
    }
}



/* SUPPLIER DIRECTORY VISUAL UX 2026-08-23 */

/* =========================================================
   FOND GENERAL : PLUS DE CARACTERE
   ========================================================= */

.supplier-shell.gestion-visual-shell {
    background:
        radial-gradient(
            circle at 8% 16%,
            rgba(45, 151, 103, 0.24),
            transparent 34%
        ),
        radial-gradient(
            circle at 94% 18%,
            rgba(190, 132, 89, 0.18),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #dcebe4 0%,
            #edf2ee 50%,
            #f1e8de 100%
        ) !important;
}


/* =========================================================
   HEADER / LOGO
   ========================================================= */

.supplier-shell.gestion-visual-shell
> .supplier-header {
    width: min(1420px, calc(100% - 40px)) !important;
    min-height: 88px;
    padding: 14px 0 10px;
    align-items: flex-end;
}

.supplier-shell.gestion-visual-shell
.supplier-brand.gestion-unified-brand {
    padding: 9px 16px 9px 9px;
    border: 1px solid rgba(255,255,255,.86);
    border-radius: 22px;
    background: rgba(255,253,247,.94);
    box-shadow: 0 12px 32px rgba(31,72,52,.11);
}

.supplier-shell.gestion-visual-shell
.supplier-brand__icon {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    border-radius: 17px;
}

.supplier-shell.gestion-visual-shell
.supplier-brand strong {
    font-size: 1.03rem;
}

.supplier-shell.gestion-visual-shell
.supplier-brand small {
    margin-top: 2px;
    font-size: 0.73rem;
    color: #527267;
}


/* Boutons du header */
.supplier-shell.gestion-visual-shell
.supplier-header-button {
    min-height: 46px;
    padding: 11px 16px;
    font-size: 0.86rem;
}


/* =========================================================
   HERO : IMAGE PLUS CLAIRE
   ========================================================= */

.supplier-shell.gestion-visual-shell
.supplier-hero.gestion-visual-hero {
    min-height: 300px;

    background-image:
        linear-gradient(
            100deg,
            rgba(16, 63, 43, 0.63) 0%,
            rgba(23, 82, 57, 0.40) 48%,
            rgba(24, 82, 56, 0.10) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center !important;

    border: 1px solid rgba(255,255,255,.62);
    box-shadow: 0 22px 55px rgba(31,70,51,.16);
}

.supplier-shell.gestion-visual-shell
.supplier-hero h1 {
    color: #ffffff !important;
    font-size: clamp(2.6rem, 4.8vw, 4rem) !important;
    line-height: 1.04;
}

.supplier-shell.gestion-visual-shell
.supplier-hero p {
    color: rgba(255,255,255,.94) !important;
    font-size: 1rem !important;
    line-height: 1.6;
}

.supplier-shell.gestion-visual-shell
.supplier-hero .supplier-badge {
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,.30);
    background: rgba(11,74,51,.56);
    color: #ffffff !important;
    font-size: 0.78rem;
    font-weight: 900;
}


/* =========================================================
   COMPTEUR DU HERO
   ========================================================= */

.supplier-shell.gestion-visual-shell
.supplier-hero__counter {
    min-width: 235px;
    padding: 22px 24px;

    border: 1px solid rgba(35,88,67,.14);
    border-radius: 22px;

    background: rgba(255,255,255,.97) !important;

    box-shadow:
        0 16px 38px rgba(20,62,45,.17);

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.supplier-shell.gestion-visual-shell
.supplier-hero__counter small {
    color: #526c63 !important;
    font-size: 0.82rem !important;
    line-height: 1.3;
    font-weight: 800;
}

.supplier-shell.gestion-visual-shell
.supplier-hero__counter strong {
    color: #123e31 !important;
    font-size: 2rem !important;
    line-height: 1;
    font-weight: 900;
}

.supplier-shell.gestion-visual-shell
.supplier-hero__counter-detail {
    margin-top: 8px;
    color: #5b7168 !important;
    font-size: 0.78rem !important;
    line-height: 1.4;
    font-weight: 650;
}


/* =========================================================
   RECHERCHE / FILTRES
   ========================================================= */

.supplier-shell.gestion-visual-shell
.supplier-directory-filters {
    padding: 22px 24px;

    border: 1px solid rgba(35,88,67,.15);
    background: rgba(255,255,255,.98);

    box-shadow:
        0 15px 36px rgba(34,77,58,.10);
}

.supplier-shell.gestion-visual-shell
.supplier-directory-form {
    gap: 14px;
}

.supplier-shell.gestion-visual-shell
.supplier-directory-form label > span {
    color: #405f54;
    font-size: 0.82rem;
    font-weight: 800;
}

.supplier-shell.gestion-visual-shell
.supplier-directory-form input,
.supplier-shell.gestion-visual-shell
.supplier-directory-form select {
    min-height: 46px;
    font-size: 0.90rem;
}

.supplier-shell.gestion-visual-shell
.supplier-directory-submit {
    min-height: 46px;
    font-size: 0.86rem;
}

.supplier-shell.gestion-visual-shell
.supplier-directory-reset {
    font-size: 0.82rem;
}

.supplier-shell.gestion-visual-shell
.supplier-directory-result {
    margin-top: 14px;
    color: #5a7067;
    font-size: 0.82rem;
}


/* =========================================================
   SECTION MES FOURNISSEURS
   ========================================================= */

.supplier-shell.gestion-visual-shell
.supplier-section {
    overflow: hidden;

    border: 1px solid rgba(35,88,67,.14);
    background: rgba(255,255,255,.98);

    box-shadow:
        0 16px 38px rgba(34,77,58,.09);
}

.supplier-shell.gestion-visual-shell
.supplier-section__heading {
    padding: 22px 26px 18px;
    gap: 20px;
}

.supplier-shell.gestion-visual-shell
.supplier-section__heading span {
    font-size: 0.78rem;
    font-weight: 900;
}

.supplier-shell.gestion-visual-shell
.supplier-section__heading h2 {
    color: #143e31;
    font-size: clamp(1.55rem, 2.4vw, 2rem);
}


/* =========================================================
   GRILLE / CARTE FOURNISSEUR
   ========================================================= */

.supplier-shell.gestion-visual-shell
.supplier-grid {
    padding: 0 26px 26px;

    grid-template-columns:
        repeat(auto-fill, minmax(330px, 1fr));

    gap: 20px;
}

.supplier-shell.gestion-visual-shell
.supplier-card {
    min-height: 300px;
    padding: 24px;

    border: 1px solid rgba(34,88,66,.15);
    border-radius: 20px;

    background: #ffffff;

    box-shadow:
        0 12px 30px rgba(34,75,56,.09);
}

.supplier-shell.gestion-visual-shell
.supplier-card__icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
}

.supplier-shell.gestion-visual-shell
.supplier-card__status {
    padding: 6px 9px;
    font-size: 0.72rem;
    font-weight: 900;
}

.supplier-shell.gestion-visual-shell
.supplier-card__eyebrow {
    color: #665080;
    font-size: 0.78rem;
    font-weight: 900;
}

.supplier-shell.gestion-visual-shell
.supplier-card h3 {
    margin-top: 7px;
    color: #153e32;
    font-size: 1.08rem;
    line-height: 1.35;
}

.supplier-shell.gestion-visual-shell
.supplier-card__details {
    color: #536d63;
    font-size: 0.84rem;
    line-height: 1.55;
}

.supplier-shell.gestion-visual-shell
.supplier-card__footer {
    margin-top: auto;
    padding-top: 18px;
}

.supplier-shell.gestion-visual-shell
.supplier-card__actions a,
.supplier-shell.gestion-visual-shell
.supplier-card__actions button {
    font-size: 0.82rem;
    font-weight: 850;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 720px) {

    .supplier-shell.gestion-visual-shell
    > .supplier-header {
        width: calc(100% - 24px) !important;
        align-items: stretch;
    }

    .supplier-shell.gestion-visual-shell
    .supplier-header__actions {
        display: grid;
        width: 100%;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .supplier-shell.gestion-visual-shell
    .supplier-header-button {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .supplier-shell.gestion-visual-shell
    .supplier-hero {
        padding: 24px 20px !important;
        gap: 20px;
    }

    .supplier-shell.gestion-visual-shell
    .supplier-hero h1 {
        font-size: 2.15rem !important;
    }

    .supplier-shell.gestion-visual-shell
    .supplier-hero__counter {
        width: 100%;
        min-width: 0;
    }

    .supplier-shell.gestion-visual-shell
    .supplier-section__heading {
        padding: 20px;
    }

    .supplier-shell.gestion-visual-shell
    .supplier-grid {
        padding: 0 20px 20px;
        grid-template-columns: 1fr;
    }

    .supplier-shell.gestion-visual-shell
    .supplier-card {
        min-height: 0;
        padding: 20px;
    }
}



/* SUPPLIER DIRECTORY CARD CONTRAST 2026-08-23 */

/* Panneau global plus présent */
.supplier-shell.gestion-visual-shell
.supplier-section {
    border: 1px solid rgba(33, 89, 66, 0.20) !important;

    background:
        linear-gradient(
            135deg,
            rgba(226, 238, 231, 0.99) 0%,
            rgba(238, 244, 239, 0.99) 55%,
            rgba(244, 238, 229, 0.98) 100%
        ) !important;

    box-shadow:
        0 20px 48px rgba(30, 72, 53, 0.14) !important;
}

/* Bandeau titre mieux détaché */
.supplier-shell.gestion-visual-shell
.supplier-section__heading {
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(33, 89, 66, 0.14);
    background: rgba(255, 255, 255, 0.28);
}

/* Carte fournisseur plus franche */
.supplier-shell.gestion-visual-shell
.supplier-card {
    border: 1px solid rgba(27, 97, 69, 0.24) !important;
    background: rgba(255, 255, 255, 1) !important;
    box-shadow:
        0 16px 38px rgba(28, 75, 55, 0.16) !important;
}

/* Accentuation au survol */
.supplier-shell.gestion-visual-shell
.supplier-card:hover {
    transform: translateY(-2px);
    border-color: rgba(27, 125, 87, 0.32) !important;
    box-shadow:
        0 22px 48px rgba(28, 75, 55, 0.20) !important;
}

/* Pied de carte mieux séparé */
.supplier-shell.gestion-visual-shell
.supplier-card__footer {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(33, 89, 66, 0.14);
}

/* Le bouton d’action ressort aussi un peu mieux */
.supplier-shell.gestion-visual-shell
.supplier-section .supplier-primary-button {
    box-shadow:
        0 10px 24px rgba(29, 130, 91, 0.22) !important;
}

@media (max-width: 720px) {
    .supplier-shell.gestion-visual-shell
    .supplier-section {
        background:
            linear-gradient(
                145deg,
                rgba(229, 240, 233, 0.99),
                rgba(243, 237, 229, 0.98)
            ) !important;
    }

    .supplier-shell.gestion-visual-shell
    .supplier-card {
        box-shadow:
            0 12px 28px rgba(28, 75, 55, 0.14) !important;
    }
}

/* Niveau 2 : panneau Mes fournisseurs légèrement teinté */
.supplier-shell.gestion-visual-shell
.supplier-section {
    border-color: rgba(34, 88, 66, 0.16) !important;

    background:
        linear-gradient(
            135deg,
            rgba(235, 244, 239, 0.98) 0%,
            rgba(244, 247, 242, 0.98) 52%,
            rgba(247, 241, 233, 0.96) 100%
        ) !important;

    box-shadow:
        0 18px 44px rgba(31, 72, 53, 0.12) !important;
}


/* Le bandeau de titre reste légèrement plus clair */
.supplier-shell.gestion-visual-shell
.supplier-section__heading {
    border-bottom:
        1px solid rgba(39, 91, 70, 0.10);

    background:
        rgba(255, 255, 255, 0.40);
}


/* Niveau 3 : chaque fournisseur ressort franchement */
.supplier-shell.gestion-visual-shell
.supplier-card {
    border:
        1px solid rgba(31, 94, 68, 0.20) !important;

    background:
        rgba(255, 255, 255, 0.995) !important;

    box-shadow:
        0 14px 34px rgba(28, 75, 55, 0.13) !important;
}


/* Légère profondeur supplémentaire au survol */
.supplier-shell.gestion-visual-shell
.supplier-card:hover {
    transform: translateY(-2px);

    border-color:
        rgba(31, 125, 87, 0.26) !important;

    box-shadow:
        0 19px 42px rgba(28, 75, 55, 0.17) !important;
}


/* Le pied de carte est mieux séparé du contenu */
.supplier-shell.gestion-visual-shell
.supplier-card__footer {
    border-top:
        1px solid rgba(39, 91, 70, 0.11);
}


/* Mobile : garder le contraste sans alourdir */
@media (max-width: 720px) {

    .supplier-shell.gestion-visual-shell
    .supplier-section {
        background:
            linear-gradient(
                145deg,
                rgba(237, 245, 240, 0.98),
                rgba(247, 242, 235, 0.97)
            ) !important;
    }

    .supplier-shell.gestion-visual-shell
    .supplier-card {
        box-shadow:
            0 11px 28px rgba(28, 75, 55, 0.12) !important;
    }
}




/* SUPPLIER FORM MOBILE BOTTOM SPACE 2026-08-23 */

/* =========================================================
   HEADER : MEME LARGEUR QUE LE FORMULAIRE
   ========================================================= */

.supplier-form-page
.supplier-form-shell
> .gestion-top-header {
    width: min(1220px, calc(100% - 40px)) !important;
    box-sizing: border-box;
    margin-left: auto !important;
    margin-right: auto !important;
    align-items: flex-end !important;
}


/* =========================================================
   MOBILE : VRAIE RESPIRATION EN BAS
   ========================================================= */

@media (max-width: 900px) {

    .supplier-form-page
    .supplier-form-shell
    > .gestion-top-header {
        width: min(1220px, calc(100% - 28px)) !important;
    }
}


@media (max-width: 720px) {

    /*
     * Le header occupe exactement la même largeur
     * que le formulaire en mobile.
     */
    .supplier-form-page
    .supplier-form-shell
    > .gestion-top-header {
        width: calc(100% - 24px) !important;
        align-items: stretch !important;
    }

    /*
     * La réserve est portée par la PAGE elle-même,
     * et non uniquement par la grille.
     * Elle reste donc réellement scrollable et visible.
     */
    .supplier-form-page
    .supplier-form-shell.gestion-form-visual {
        box-sizing: border-box;
        padding-bottom: 140px !important;
    }

    /*
     * On annule l’ancien margin-bottom qui ne produisait
     * pas le résultat visuel attendu.
     */
    .supplier-form-page
    .supplier-form-layout {
        margin-bottom: 0 !important;
    }

    /*
     * Espace visible entre la carte blanche
     * et la photographie / zone inférieure.
     */
    .supplier-form-page
    .supplier-form-card {
        margin-bottom: 28px !important;
    }

    /*
     * Respiration interne autour des boutons.
     */
    .supplier-form-page
    .supplier-form-actions {
        padding-bottom: 10px;
    }
}



/* SUPPLIER FORM HEADER HORIZONTAL ALIGNMENT 2026-08-23 */

/*
 * Desktop :
 * logo et bouton retour centrés sur la même ligne horizontale,
 * tout en conservant exactement la largeur du formulaire.
 */
.supplier-form-page
.supplier-form-shell
> .gestion-top-header {
    width: min(1220px, calc(100% - 40px)) !important;
    align-items: center !important;
}

/*
 * Évite quune hauteur différente du bouton
 * donne limpression quil descend par rapport au logo.
 */
.supplier-form-page
.supplier-form-shell
> .gestion-top-header
.supplier-header-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
}

@media (max-width: 900px) {
    .supplier-form-page
    .supplier-form-shell
    > .gestion-top-header {
        width: min(1220px, calc(100% - 28px)) !important;
    }
}

@media (max-width: 720px) {
    .supplier-form-page
    .supplier-form-shell
    > .gestion-top-header {
        width: calc(100% - 24px) !important;
        align-items: stretch !important;
    }

    .supplier-form-page
    .supplier-form-shell
    > .gestion-top-header
    .supplier-header-button {
        align-self: stretch;
    }
}



/* BANQUE CONSULTATION VISUAL UX 2026-08-23 */

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual) {
    background: transparent !important;
}


/* =========================================================
   HEADER / LOGO / ALIGNEMENT
   ========================================================= */

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
> .farm-dashboard__header,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
> .banque-header {
    width: min(1420px, calc(100% - 40px)) !important;
    min-height: 88px;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 14px 0 10px;
    align-items: center !important;
}

/* Logo des pages utilisant encore banque-brand */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-brand.gestion-unified-brand {
    gap: 14px;
    padding: 9px 15px 9px 9px;

    border: 1px solid rgba(255,255,255,.78);
    border-radius: 22px;

    background: rgba(255,253,247,.94);

    box-shadow:
        0 12px 32px rgba(31,72,52,.11);
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-brand__icon {
    width: 58px;
    height: 58px;
    flex: 0 0 58px;

    display: grid;
    place-items: center;

    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            #23885f,
            #146f51
        );

    color: #ffffff;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-brand__icon svg {
    width: 36px;
    height: 36px;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-brand strong {
    color: #123f2e;
    font-size: 1.18rem;
    font-weight: 900;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-brand small {
    margin-top: 5px;
    color: #35664f;
    font-size: .82rem;
    font-weight: 650;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-back,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-secondary-button,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.dashboard-header-button {
    min-height: 46px;
    padding: 11px 16px;
    font-size: .86rem;
}


/* =========================================================
   HERO : PHOTO PLUS VISIBLE
   ========================================================= */

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-title.gestion-visual-hero,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-hero.gestion-visual-hero {
    background-image:
        linear-gradient(
            100deg,
            rgba(16, 63, 43, 0.64) 0%,
            rgba(23, 82, 57, 0.40) 48%,
            rgba(24, 82, 56, 0.10) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center !important;

    border: 1px solid rgba(255,255,255,.62);

    box-shadow:
        0 22px 55px rgba(31,70,51,.16);
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-title h1,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-hero h1 {
    color: #ffffff !important;
    font-size: clamp(2.5rem, 4.2vw, 3.7rem) !important;
    line-height: 1.05;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-title p,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-hero p {
    color: rgba(255,255,255,.94) !important;
    font-size: .98rem !important;
    line-height: 1.6;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-eyebrow {
    padding: 8px 12px !important;

    border: 1px solid rgba(255,255,255,.30) !important;

    background: rgba(11,74,51,.56) !important;

    color: #ffffff !important;

    font-size: .76rem !important;
    font-weight: 900 !important;
}


/* =========================================================
   CARTES STATISTIQUES
   ========================================================= */

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-summary article,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-summary > div {
    border: 1px solid rgba(33,88,66,.16) !important;

    background: rgba(255,255,255,.99) !important;

    box-shadow:
        0 14px 34px rgba(31,76,58,.12) !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-summary span,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-summary span {
    color: #526b62 !important;
    font-size: .82rem !important;
    line-height: 1.35;
    font-weight: 700;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-summary strong,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-summary strong {
    color: #123e31 !important;
    font-size: 1.45rem !important;
    line-height: 1.2;
    font-weight: 900;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-summary small,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-summary small {
    color: #5d726a !important;
    font-size: .76rem !important;
    line-height: 1.4;
}


/* =========================================================
   SECTIONS / CARTES COMPTE
   ========================================================= */

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-section {
    border: 1px solid rgba(33,89,66,.18) !important;

    background:
        linear-gradient(
            135deg,
            rgba(228,239,232,.99) 0%,
            rgba(240,245,240,.99) 55%,
            rgba(246,239,231,.98) 100%
        ) !important;

    box-shadow:
        0 19px 45px rgba(31,72,53,.13) !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-section__heading,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-movement-heading {
    border-bottom:
        1px solid rgba(33,89,66,.12);
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-section__heading span,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-movement-heading span {
    font-size: .78rem !important;
    font-weight: 900 !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-section__heading h2,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-movement-heading h2 {
    color: #143e31 !important;
    font-size: clamp(1.45rem, 2.3vw, 1.9rem) !important;
}


/* Carte dun compte sur la liste */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account {
    border: 1px solid rgba(28,96,68,.22) !important;

    background: #ffffff !important;

    box-shadow:
        0 15px 36px rgba(28,75,55,.15) !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account h3 {
    color: #143e31;
    font-size: 1.10rem;
    line-height: 1.3;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account__bank {
    color: #586f66 !important;
    font-size: .86rem !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account__details dt {
    color: #5b7068;
    font-size: .80rem !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account__details dd {
    color: #173f33;
    font-size: .86rem !important;
    font-weight: 800;
}


/* =========================================================
   DETAIL : FLUX / PERIODE
   ========================================================= */

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow-summary,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.bank-period-panel {
    border: 1px solid rgba(33,88,66,.15) !important;

    box-shadow:
        0 15px 36px rgba(31,76,58,.10) !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow {
    font-size: .88rem !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow strong {
    font-size: 1rem !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.bank-period-navigation,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.bank-period-current,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.bank-period-filters label {
    font-size: .82rem !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.bank-period-filters select,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.bank-period-submit,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.bank-period-reset {
    min-height: 44px;
    font-size: .84rem !important;
}


/* =========================================================
   HISTORIQUE DES OPERATIONS
   ========================================================= */

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-movement {
    min-height: 82px;

    border: 1px solid rgba(31,91,66,.18) !important;

    background: #ffffff !important;

    box-shadow:
        0 10px 27px rgba(28,75,55,.10) !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-movement strong {
    color: #133d31;
    font-size: .92rem !important;
    line-height: 1.35;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-movement small,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-movement span {
    font-size: .76rem !important;
    line-height: 1.4;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 720px) {

    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    > .farm-dashboard__header,
    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    > .banque-header {
        width: calc(100% - 24px) !important;
        align-items: stretch !important;
    }

    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    .banque-title,
    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    .banque-account-hero {
        padding: 24px 20px !important;
    }

    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    .banque-title h1,
    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    .banque-account-hero h1 {
        font-size: 2.1rem !important;
    }

    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    .banque-summary {
        grid-template-columns: 1fr;
    }

    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    .banque-movement {
        padding: 18px !important;
    }
}



/* BANQUE HERO + FORM FIX 2026-08-23 */

/* =========================================================
   BANQUE - HERO CONSULTATION : image visible + texte lisible
   ========================================================= */

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual) .banque-title,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual) .banque-account-hero {
    position: relative;
    overflow: hidden;

    border: 1px solid rgba(255,255,255,.62) !important;
    border-radius: 28px;

    background-image:
        linear-gradient(
            100deg,
            rgba(16,63,43,.68) 0%,
            rgba(23,82,57,.44) 48%,
            rgba(24,82,56,.16) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center !important;

    box-shadow:
        0 22px 55px rgba(31,70,51,.16) !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual) .banque-title h1,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual) .banque-account-hero h1 {
    color: #ffffff !important;
    font-size: clamp(2.4rem, 4vw, 3.5rem) !important;
    line-height: 1.05 !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual) .banque-title p,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual) .banque-account-hero p {
    color: rgba(255,255,255,.94) !important;
    font-size: .98rem !important;
    line-height: 1.6 !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual) .banque-eyebrow {
    padding: 8px 12px !important;
    border: 1px solid rgba(255,255,255,.28) !important;
    background: rgba(12,82,57,.55) !important;
    color: #ffffff !important;
    font-size: .76rem !important;
    font-weight: 900 !important;
}


/* =========================================================
   BANQUE - FORMULAIRES : fond image pleine page
   + suppression du cadre de fond parasite
   ========================================================= */

main.banque-shell.gestion-visual-shell.gestion-form-visual {
    width: 100% !important;
    max-width: none !important;
    min-height: 100vh;

    background-image:
        linear-gradient(
            90deg,
            rgba(247,250,246,.52) 0%,
            rgba(247,250,246,.34) 48%,
            rgba(247,250,246,.26) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center !important;
    background-attachment: fixed !important;
}

/* on neutralise le fond central qui donne l effet cadre en trop */
main.banque-shell.gestion-visual-shell.gestion-form-visual .banque-content,
main.banque-shell.gestion-visual-shell.gestion-form-visual .banque-form-content,
main.banque-shell.gestion-visual-shell.gestion-form-visual .banque-form-shell {
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
}

/* largeur et alignement haut */
main.banque-shell.gestion-visual-shell.gestion-form-visual > .farm-dashboard__header,
main.banque-shell.gestion-visual-shell.gestion-form-visual > .banque-header {
    width: min(1420px, calc(100% - 40px)) !important;
    min-height: 82px;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 14px 0 10px;
    display: flex;
    align-items: center !important;
    justify-content: space-between;
    gap: 18px;
}

/* formulaire : espace propre et cartes bien détachées */
main.banque-shell.gestion-visual-shell.gestion-form-visual .banque-form-layout {
    width: min(1220px, calc(100% - 40px)) !important;
    margin: 28px auto 0 !important;
    display: grid;
    gap: 34px;
}

main.banque-shell.gestion-visual-shell.gestion-form-visual .banque-form-intro,
main.banque-shell.gestion-visual-shell.gestion-form-visual .banque-form-card {
    background: rgba(255,252,247,.93) !important;
    border: 1px solid rgba(255,255,255,.84) !important;
    box-shadow:
        0 22px 56px rgba(28,67,49,.14) !important;
}

/* mobile */
@media (max-width: 720px) {
    main.banque-shell.gestion-visual-shell.gestion-form-visual {
        background-attachment: scroll !important;
    }

    main.banque-shell.gestion-visual-shell.gestion-form-visual > .farm-dashboard__header,
    main.banque-shell.gestion-visual-shell.gestion-form-visual > .banque-header,
    main.banque-shell.gestion-visual-shell.gestion-form-visual .banque-form-layout {
        width: calc(100% - 24px) !important;
    }
}




/* BANQUE HEADER ALIGN + FLOW CARDS 2026-08-23 */


/* =========================================================
   HEADER : ALIGNEMENT VALIDE CONSERVE
   ========================================================= */

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
> .farm-dashboard__header,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
> .banque-header {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    align-items: center !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
> .farm-dashboard__header
.farm-dashboard__brand,
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
> .farm-dashboard__header
.farm-dashboard__header-actions {
    align-self: center;
}


/* =========================================================
   SOLDES / A TRAITER
   CARTES CONFORMES MA FERME PEI
   ========================================================= */

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-summary {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 18px !important;
    margin-bottom: 18px !important;

    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-summary article {
    min-height: 145px;

    padding: 23px 24px !important;

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;

    border:
        1px solid rgba(33, 88, 66, 0.15) !important;

    border-radius: 24px !important;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 1) 0%,
            rgba(247, 250, 247, 0.99) 100%
        ) !important;

    box-shadow:
        0 15px 36px rgba(29, 72, 53, 0.11) !important;
}


/* Petit libelle */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-summary article > span {
    display: inline-flex;
    width: fit-content;

    padding: 6px 10px;

    border-radius: 999px;

    background: rgba(35, 143, 99, 0.09);

    color: #356654 !important;

    font-size: 0.78rem !important;
    line-height: 1.2;
    font-weight: 850;
}


/* Carte A traiter légèrement chaude */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-summary article:nth-child(3) > span {
    background: rgba(196, 141, 66, 0.11);
    color: #79602d !important;
}


/* Montants */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-summary article > strong {
    margin: 13px 0 7px !important;

    color: #123f31 !important;

    font-size: 1.65rem !important;
    line-height: 1.08;

    font-weight: 900 !important;
}


/* Explications */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-account-summary article > small {
    color: #5b7168 !important;

    font-size: 0.80rem !important;
    line-height: 1.45;

    font-weight: 600;
}


/* =========================================================
   ENTREES / SORTIES / VARIATION
   MEME FAMILLE VISUELLE
   ========================================================= */

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow-summary {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 18px !important;

    margin-bottom: 30px !important;

    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}


main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow-summary .banque-flow {
    min-height: 125px;

    padding: 22px 24px !important;

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;

    gap: 0;

    border:
        1px solid rgba(33, 88, 66, 0.15) !important;

    border-radius: 24px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f7faf7 100%
        ) !important;

    box-shadow:
        0 15px 36px rgba(29, 72, 53, 0.11) !important;

    color: #264e3f !important;
}


/* On supprime totalement lancien trait vertical */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow-summary .banque-flow::before {
    content: none !important;
}


/* Labels sous forme de badges sobres */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow-summary .banque-flow > span {
    display: inline-flex;
    width: fit-content;

    padding: 6px 10px;

    border-radius: 999px;

    font-size: 0.78rem !important;
    line-height: 1.2;
    font-weight: 850 !important;
}


/* Entrees */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow--credit {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #eef8f3 100%
        ) !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow--credit > span {
    background: rgba(35, 143, 99, 0.10);
    color: #277153 !important;
}


/* Sorties */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow--debit {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fff5f1 100%
        ) !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow--debit > span {
    background: rgba(195, 94, 67, 0.10);
    color: #9c4f3c !important;
}


/* Variation */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow--variation {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f4f7f4 100%
        ) !important;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow--variation > span {
    background: rgba(91, 126, 108, 0.10);
    color: #526c5f !important;
}


/* Montants des trois cartes */
main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow-summary .banque-flow > strong {
    margin-top: 13px;

    color: #123f31 !important;

    font-size: 1.45rem !important;
    line-height: 1.08;

    font-weight: 900 !important;

    white-space: nowrap;
}

main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
.banque-flow--debit > strong {
    color: #b34e37 !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 720px) {

    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    > .farm-dashboard__header,
    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    > .banque-header {
        width: 100% !important;
    }

    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    .banque-account-summary,
    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    .banque-flow-summary {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    .banque-account-summary article,
    main.banque-shell.gestion-visual-shell:not(.gestion-form-visual)
    .banque-flow-summary .banque-flow {
        min-height: 112px;
        padding: 20px !important;
        border-radius: 22px !important;
    }
}



/* BANQUE FORM DESKTOP TWO COLUMNS 2026-08-23 */


/* =========================================================
   PHOTO DE FOND : BEAUCOUP MOINS DE VOILE
   ========================================================= */

main.banque-shell.gestion-visual-shell.gestion-form-visual {
    min-height: 100vh;

    background-image:
        linear-gradient(
            90deg,
            rgba(241, 247, 242, 0.20) 0%,
            rgba(245, 247, 240, 0.10) 48%,
            rgba(248, 244, 233, 0.06) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}


/*
 * Le voile générique de gestion-form-visual blanchissait
 * une deuxième fois la photographie.
 */
main.banque-shell.gestion-visual-shell.gestion-form-visual::before {
    background:
        linear-gradient(
            90deg,
            rgba(245, 249, 245, 0.08) 0%,
            rgba(245, 249, 245, 0.03) 50%,
            rgba(245, 249, 245, 0.02) 100%
        ) !important;
}


/* =========================================================
   HEADER : MEMES BORDS QUE LES DEUX COLONNES
   ========================================================= */

main.banque-shell.gestion-visual-shell.gestion-form-visual
> .farm-dashboard__header,
main.banque-shell.gestion-visual-shell.gestion-form-visual
> .banque-header {
    width: min(1220px, calc(100% - 40px)) !important;
    max-width: 1220px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    align-items: center !important;
}


/* =========================================================
   DESKTOP : TITRE A GAUCHE / FORMULAIRE A DROITE
   ========================================================= */

main.banque-shell.gestion-visual-shell.gestion-form-visual
.banque-form-layout {
    width: min(1220px, calc(100% - 40px)) !important;
    max-width: 1220px !important;

    margin: 28px auto 0 !important;

    display: grid !important;

    grid-template-columns:
        minmax(0, 0.82fr)
        minmax(560px, 1.18fr) !important;

    gap: 36px !important;

    align-items: start !important;
}


/* =========================================================
   PANNEAU TITRE
   ========================================================= */

main.banque-shell.gestion-visual-shell.gestion-form-visual
.banque-form-intro {
    box-sizing: border-box;

    padding: clamp(32px, 4vw, 52px) !important;

    border:
        1px solid rgba(255,255,255,.82) !important;

    border-radius: 28px !important;

    background:
        rgba(255, 252, 246, 0.91) !important;

    box-shadow:
        0 22px 56px rgba(27, 67, 48, 0.16) !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}


main.banque-shell.gestion-visual-shell.gestion-form-visual
.banque-form-intro h1 {
    color: #123f31 !important;

    font-size:
        clamp(2.4rem, 4.3vw, 3.8rem) !important;

    line-height: 1.04 !important;
}


main.banque-shell.gestion-visual-shell.gestion-form-visual
.banque-form-intro p {
    color: #45675a !important;

    font-size: 0.96rem !important;
    line-height: 1.65 !important;
}


/* =========================================================
   CARTE FORMULAIRE
   ========================================================= */

main.banque-shell.gestion-visual-shell.gestion-form-visual
.banque-form-card {
    box-sizing: border-box;

    padding: clamp(26px, 3vw, 38px) !important;

    border:
        1px solid rgba(255,255,255,.86) !important;

    border-radius: 28px !important;

    background:
        rgba(255, 255, 255, 0.96) !important;

    box-shadow:
        0 24px 60px rgba(27, 67, 48, 0.17) !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}


/* Champs confortables et lisibles */
main.banque-shell.gestion-visual-shell.gestion-form-visual
.banque-form-card label {
    color: #315847;

    font-weight: 800;
}


main.banque-shell.gestion-visual-shell.gestion-form-visual
.banque-form-card input,
main.banque-shell.gestion-visual-shell.gestion-form-visual
.banque-form-card select,
main.banque-shell.gestion-visual-shell.gestion-form-visual
.banque-form-card textarea {
    min-height: 48px;

    font-size: 0.92rem;
}


/* =========================================================
   TABLETTE / MOBILE
   ========================================================= */

@media (max-width: 950px) {

    main.banque-shell.gestion-visual-shell.gestion-form-visual
    .banque-form-layout {
        grid-template-columns: 1fr !important;
    }
}


@media (max-width: 720px) {

    main.banque-shell.gestion-visual-shell.gestion-form-visual {
        box-sizing: border-box;

        padding-bottom: 130px !important;

        background-attachment: scroll !important;

        background-image:
            linear-gradient(
                rgba(242, 247, 243, 0.25),
                rgba(244, 247, 241, 0.20)
            ),
            var(--gestion-family-image) !important;
    }


    main.banque-shell.gestion-visual-shell.gestion-form-visual
    > .farm-dashboard__header,
    main.banque-shell.gestion-visual-shell.gestion-form-visual
    > .banque-header,
    main.banque-shell.gestion-visual-shell.gestion-form-visual
    .banque-form-layout {
        width: calc(100% - 24px) !important;
        max-width: none !important;
    }


    main.banque-shell.gestion-visual-shell.gestion-form-visual
    .banque-form-layout {
        margin-top: 18px !important;
        gap: 22px !important;
    }


    main.banque-shell.gestion-visual-shell.gestion-form-visual
    .banque-form-intro,
    main.banque-shell.gestion-visual-shell.gestion-form-visual
    .banque-form-card {
        border-radius: 24px !important;
    }


    main.banque-shell.gestion-visual-shell.gestion-form-visual
    .banque-form-intro {
        padding: 26px 22px !important;
    }


    main.banque-shell.gestion-visual-shell.gestion-form-visual
    .banque-form-intro h1 {
        font-size: 2.05rem !important;
    }


    main.banque-shell.gestion-visual-shell.gestion-form-visual
    .banque-form-card {
        padding: 24px 20px 30px !important;
        margin-bottom: 26px !important;
    }
}


/* DEPENSES INDEX VISUAL UX 2026-08-23 */

/*
 * Page Dépenses :
 * largeur généreuse, photographie plus lumineuse,
 * hiérarchie plus nette et typographie réellement lisible.
 */

body.expense-page {
    background:
        radial-gradient(
            circle at 8% 5%,
            rgba(206, 231, 214, .62),
            transparent 34%
        ),
        radial-gradient(
            circle at 94% 22%,
            rgba(231, 214, 177, .42),
            transparent 31%
        ),
        linear-gradient(
            145deg,
            #edf5ef 0%,
            #f6f4eb 52%,
            #eef4ee 100%
        ) !important;
}

main.expense-shell.gestion-visual-shell {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 0 76px !important;

    background-image:
        linear-gradient(
            180deg,
            rgba(239, 247, 240, .91) 0%,
            rgba(246, 245, 238, .94) 54%,
            rgba(238, 245, 239, .96) 100%
        ),
        var(--gestion-family-image) !important;
    background-size: cover !important;
    background-position: center !important;
    background-attachment: fixed !important;
}


/* ==========================================================
   HEADER
   ========================================================== */

main.expense-shell.gestion-visual-shell
> .expense-header {
    box-sizing: border-box;
    width: min(1420px, calc(100% - 40px)) !important;
    min-height: 92px;
    margin: 0 auto 14px !important;
    padding: 18px 0 12px !important;

    display: flex;
    align-items: center !important;
    justify-content: space-between;
    gap: 24px;
}

main.expense-shell.gestion-visual-shell
.expense-brand {
    display: inline-flex;
    align-items: center;
    gap: 14px;

    padding: 9px 16px 9px 9px;

    border: 1px solid rgba(255, 255, 255, .78);
    border-radius: 22px;

    background: rgba(255, 253, 247, .95);
    color: #123f2e;
    text-decoration: none;

    box-shadow:
        0 12px 32px rgba(31, 70, 49, .11);

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

main.expense-shell.gestion-visual-shell
.expense-brand__icon,
main.expense-shell.gestion-visual-shell
.expense-brand .brand__icon {
    width: 58px !important;
    height: 58px !important;
    flex: 0 0 58px !important;

    display: grid;
    place-items: center;

    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            #23885f,
            #146f51
        ) !important;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .20),
        0 8px 20px rgba(24, 103, 72, .18);
}

main.expense-shell.gestion-visual-shell
.expense-brand__icon svg,
main.expense-shell.gestion-visual-shell
.expense-brand .brand__icon svg {
    width: 36px !important;
    height: 36px !important;
}

main.expense-shell.gestion-visual-shell
.expense-brand strong {
    font-size: 1.08rem !important;
    line-height: 1.15;
}

main.expense-shell.gestion-visual-shell
.expense-brand small {
    font-size: .75rem !important;
    line-height: 1.25;
}

main.expense-shell.gestion-visual-shell
.expense-header__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 11px;
}

main.expense-shell.gestion-visual-shell
.expense-header-button {
    min-height: 48px !important;
    padding: 12px 18px !important;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(31, 87, 61, .13) !important;
    border-radius: 15px !important;

    background: rgba(255, 255, 255, .94) !important;
    color: #24533e !important;

    font-size: .88rem !important;
    font-weight: 850 !important;
    line-height: 1.2;

    text-decoration: none;

    box-shadow:
        0 10px 25px rgba(31, 74, 53, .09);
}

main.expense-shell.gestion-visual-shell
.expense-header__actions
.expense-header-button:last-child {
    border-color: rgba(26, 129, 88, .18) !important;

    background:
        linear-gradient(
            135deg,
            #25845f,
            #22a579
        ) !important;

    color: #fff !important;

    box-shadow:
        0 12px 27px rgba(30, 132, 91, .22);
}


/* ==========================================================
   LARGEUR CONTENU
   ========================================================== */

main.expense-shell.gestion-visual-shell
.expense-content {
    width: min(1420px, calc(100% - 40px)) !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 0 0 20px !important;
}


/* ==========================================================
   HERO DEPENSES
   ========================================================== */

main.expense-shell.gestion-visual-shell
.expense-hero.gestion-visual-hero,
main.expense-shell.gestion-visual-shell
.expense-hero {
    box-sizing: border-box;

    min-height: 310px !important;
    margin-bottom: 24px !important;
    padding: clamp(34px, 4.2vw, 52px) !important;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 38px;

    border: 1px solid rgba(255, 255, 255, .66) !important;
    border-radius: 30px !important;

    background-image:
        linear-gradient(
            100deg,
            rgba(15, 62, 42, .67) 0%,
            rgba(21, 78, 53, .46) 43%,
            rgba(28, 89, 62, .16) 72%,
            rgba(28, 89, 62, .07) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center 48% !important;

    box-shadow:
        0 22px 55px rgba(28, 65, 46, .17) !important;
}

main.expense-shell.gestion-visual-shell
.expense-hero .expense-badge {
    padding: 8px 13px !important;

    border: 1px solid rgba(255, 255, 255, .32) !important;
    border-radius: 999px !important;

    background: rgba(10, 65, 43, .56) !important;
    color: #fff !important;

    font-size: .75rem !important;
    font-weight: 900 !important;
    letter-spacing: .07em;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

main.expense-shell.gestion-visual-shell
.expense-hero h1 {
    margin: 16px 0 11px !important;

    color: #fff !important;

    font-size: clamp(2.8rem, 4.5vw, 4.35rem) !important;
    line-height: .98 !important;
    letter-spacing: -.035em;

    text-shadow:
        0 2px 18px rgba(9, 42, 28, .20);
}

main.expense-shell.gestion-visual-shell
.expense-hero p {
    max-width: 680px !important;
    margin: 0 !important;

    color: rgba(255, 255, 255, .95) !important;

    font-size: 1rem !important;
    font-weight: 650 !important;
    line-height: 1.62 !important;

    text-shadow:
        0 1px 12px rgba(10, 43, 30, .20);
}


/* ==========================================================
   COMPTEURS HERO
   ========================================================== */

main.expense-shell.gestion-visual-shell
.expense-summary {
    min-width: 500px !important;

    display: grid !important;
    grid-template-columns: repeat(3, minmax(145px, 1fr)) !important;
    gap: 12px !important;
}

main.expense-shell.gestion-visual-shell
.expense-summary > * {
    min-height: 116px;

    padding: 18px 17px !important;

    display: flex;
    flex-direction: column;
    justify-content: center;

    border: 1px solid rgba(255, 255, 255, .85) !important;
    border-radius: 21px !important;

    background: rgba(255, 253, 248, .96) !important;

    box-shadow:
        0 14px 34px rgba(14, 54, 37, .18) !important;

    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
}

main.expense-shell.gestion-visual-shell
.expense-summary span,
main.expense-shell.gestion-visual-shell
.expense-summary small {
    color: #577064 !important;

    font-size: .76rem !important;
    font-weight: 850 !important;
    line-height: 1.35;
}

main.expense-shell.gestion-visual-shell
.expense-summary strong {
    margin-top: 7px;

    color: #12583e !important;

    font-size: clamp(1.35rem, 2vw, 1.75rem) !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
}


/* ==========================================================
   INFO
   ========================================================== */

main.expense-shell.gestion-visual-shell
.expense-info {
    margin-bottom: 24px !important;
    padding: 19px 22px !important;

    border: 1px solid rgba(53, 113, 76, .14) !important;
    border-radius: 21px !important;

    background:
        linear-gradient(
            135deg,
            rgba(229, 243, 234, .98),
            rgba(248, 244, 231, .97)
        ) !important;

    color: #345646 !important;

    font-size: .91rem !important;
    line-height: 1.58 !important;

    box-shadow:
        0 11px 30px rgba(42, 76, 56, .08) !important;
}


/* ==========================================================
   FILTRES PERIODE
   ========================================================== */

main.expense-shell.gestion-visual-shell
.expense-period-panel {
    margin-bottom: 27px !important;
    padding: 22px 24px !important;

    border: 1px solid rgba(43, 91, 62, .14) !important;
    border-radius: 23px !important;

    background: rgba(255, 253, 249, .97) !important;

    box-shadow:
        0 15px 38px rgba(34, 72, 51, .10) !important;
}

main.expense-shell.gestion-visual-shell
.expense-period-current small {
    margin-bottom: 6px !important;

    color: #66776d !important;

    font-size: .74rem !important;
    font-weight: 900 !important;
    letter-spacing: .10em;
}

main.expense-shell.gestion-visual-shell
.expense-period-current strong {
    color: #173f30 !important;

    font-size: 1.28rem !important;
    line-height: 1.2;
}

main.expense-shell.gestion-visual-shell
.expense-period-arrow {
    color: #246c4f !important;

    font-size: .87rem !important;
    font-weight: 850 !important;
}

main.expense-shell.gestion-visual-shell
.expense-period-filters {
    gap: 14px !important;
    margin-top: 20px !important;
    padding-top: 19px !important;

    border-top-color: rgba(42, 91, 62, .13) !important;
}

main.expense-shell.gestion-visual-shell
.expense-period-filters label > span {
    margin-bottom: 2px;

    color: #52675b !important;

    font-size: .78rem !important;
    font-weight: 850 !important;
}

main.expense-shell.gestion-visual-shell
.expense-period-filters select {
    min-height: 46px !important;
    height: 46px !important;

    padding-left: 14px !important;

    border: 1px solid #cbd9d0 !important;
    border-radius: 12px !important;

    background-color: #fff !important;
    color: #253f33 !important;

    font-size: .88rem !important;
    font-weight: 650;
}

main.expense-shell.gestion-visual-shell
.expense-period-submit {
    min-height: 46px !important;
    height: 46px !important;

    padding: 0 21px !important;

    border-radius: 12px !important;

    background:
        linear-gradient(
            135deg,
            #25845f,
            #22a579
        ) !important;

    font-size: .88rem !important;
    font-weight: 850 !important;

    box-shadow:
        0 9px 21px rgba(34, 132, 95, .18);
}

main.expense-shell.gestion-visual-shell
.expense-period-reset {
    height: 46px !important;

    color: #526a5d !important;

    font-size: .82rem !important;
    font-weight: 850 !important;
}

main.expense-shell.gestion-visual-shell
.expense-period-result {
    margin-top: 15px !important;

    color: #67776e !important;

    font-size: .82rem !important;
    line-height: 1.45;
}

main.expense-shell.gestion-visual-shell
.expense-period-result strong {
    color: #214735 !important;
}


/* ==========================================================
   LISTE DES DEPENSES
   ========================================================== */

main.expense-shell.gestion-visual-shell
.expense-section {
    padding: 26px !important;

    border: 1px solid rgba(42, 91, 62, .13) !important;
    border-radius: 25px !important;

    background:
        linear-gradient(
            145deg,
            rgba(237, 246, 240, .98),
            rgba(250, 247, 239, .98)
        ) !important;

    box-shadow:
        0 17px 42px rgba(33, 70, 50, .11) !important;
}

main.expense-shell.gestion-visual-shell
.expense-section__heading {
    margin-bottom: 20px !important;
}

main.expense-shell.gestion-visual-shell
.expense-section__heading h2 {
    color: #163e2e !important;

    font-size: 1.65rem !important;
    line-height: 1.15;
}

main.expense-shell.gestion-visual-shell
.expense-section__heading p,
main.expense-shell.gestion-visual-shell
.expense-section__heading span {
    color: #607268 !important;

    font-size: .86rem !important;
    line-height: 1.5;
}

main.expense-shell.gestion-visual-shell
.expense-list {
    gap: 13px !important;
}

main.expense-shell.gestion-visual-shell
.expense-card {
    padding: 20px 22px !important;

    border: 1px solid rgba(42, 91, 62, .13) !important;
    border-radius: 20px !important;

    background: rgba(255, 255, 253, .98) !important;

    box-shadow:
        0 10px 26px rgba(31, 68, 48, .085) !important;
}

main.expense-shell.gestion-visual-shell
.expense-card:hover {
    transform: translateY(-2px);

    box-shadow:
        0 17px 38px rgba(31, 68, 48, .13) !important;
}

main.expense-shell.gestion-visual-shell
.expense-card__text h3,
main.expense-shell.gestion-visual-shell
.expense-card__text strong {
    color: #173f30 !important;

    font-size: 1.02rem !important;
    line-height: 1.35;
}

main.expense-shell.gestion-visual-shell
.expense-card__labels {
    gap: 7px !important;
}

main.expense-shell.gestion-visual-shell
.expense-origin,
main.expense-shell.gestion-visual-shell
.expense-duplicate {
    font-size: .73rem !important;
    font-weight: 850 !important;
}

main.expense-shell.gestion-visual-shell
.expense-card__meta,
main.expense-shell.gestion-visual-shell
.expense-card__meta span,
main.expense-shell.gestion-visual-shell
.expense-card__meta small {
    color: #65766c !important;

    font-size: .82rem !important;
    line-height: 1.5 !important;
}

main.expense-shell.gestion-visual-shell
.expense-card__amount small {
    margin-bottom: 5px !important;

    color: #66776d !important;

    font-size: .76rem !important;
    font-weight: 850 !important;
}

main.expense-shell.gestion-visual-shell
.expense-card__amount strong {
    color: #153f2e !important;

    font-size: 1.24rem !important;
    font-weight: 900 !important;
}

main.expense-shell.gestion-visual-shell
.expense-card__actions a {
    color: #207052 !important;

    font-size: .86rem !important;
    font-weight: 850 !important;
}

main.expense-shell.gestion-visual-shell
.expense-card__actions span {
    color: #7c8981 !important;

    font-size: .80rem !important;
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width: 1100px) {

    main.expense-shell.gestion-visual-shell
    .expense-hero {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    main.expense-shell.gestion-visual-shell
    .expense-summary {
        width: 100% !important;
        min-width: 0 !important;
    }
}


@media (max-width: 900px) {

    main.expense-shell.gestion-visual-shell
    > .expense-header,
    main.expense-shell.gestion-visual-shell
    .expense-content {
        width: min(100% - 28px, 1420px) !important;
    }

    main.expense-shell.gestion-visual-shell
    .expense-hero {
        min-height: auto !important;
        padding: 28px 24px !important;
        border-radius: 24px !important;
    }

    main.expense-shell.gestion-visual-shell
    .expense-section {
        padding: 22px !important;
    }
}


@media (max-width: 760px) {

    main.expense-shell.gestion-visual-shell {
        padding-bottom: 110px !important;
        background-attachment: scroll !important;
    }

    main.expense-shell.gestion-visual-shell
    > .expense-header {
        align-items: stretch !important;
        flex-direction: column !important;
        gap: 13px !important;
    }

    main.expense-shell.gestion-visual-shell
    .expense-brand {
        align-self: flex-start;
    }

    main.expense-shell.gestion-visual-shell
    .expense-brand__icon,
    main.expense-shell.gestion-visual-shell
    .expense-brand .brand__icon {
        width: 50px !important;
        height: 50px !important;
        flex-basis: 50px !important;
    }

    main.expense-shell.gestion-visual-shell
    .expense-brand__icon svg,
    main.expense-shell.gestion-visual-shell
    .expense-brand .brand__icon svg {
        width: 31px !important;
        height: 31px !important;
    }

    main.expense-shell.gestion-visual-shell
    .expense-header__actions {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    main.expense-shell.gestion-visual-shell
    .expense-header-button {
        flex: 1 1 190px;
    }

    main.expense-shell.gestion-visual-shell
    .expense-hero h1 {
        font-size: clamp(2.45rem, 12vw, 3.55rem) !important;
    }

    main.expense-shell.gestion-visual-shell
    .expense-summary {
        grid-template-columns: 1fr !important;
    }

    main.expense-shell.gestion-visual-shell
    .expense-summary > * {
        min-height: 88px;
    }

    main.expense-shell.gestion-visual-shell
    .expense-period-panel,
    main.expense-shell.gestion-visual-shell
    .expense-section {
        padding: 19px !important;
        border-radius: 21px !important;
    }

    main.expense-shell.gestion-visual-shell
    .expense-card {
        padding: 18px !important;
    }

    main.expense-shell.gestion-visual-shell
    .expense-card__amount,
    main.expense-shell.gestion-visual-shell
    .expense-card__actions {
        text-align: left !important;
    }
}


/* SUPPLIER PAYMENT FORM VISUAL UX 2026-08-23 */

/* =========================================================
   PAGE / PHOTO DE FOND
   ========================================================= */

.supplier-payment-form-page
.supplier-invoice-shell.gestion-form-visual {
    width: 100% !important;
    max-width: none !important;
    min-height: 100vh;

    background-image:
        linear-gradient(
            105deg,
            rgba(236, 246, 239, .18) 0%,
            rgba(246, 246, 237, .10) 48%,
            rgba(249, 241, 229, .08) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

.supplier-payment-form-page
.supplier-invoice-shell.gestion-form-visual::before {
    background:
        linear-gradient(
            105deg,
            rgba(242, 248, 243, .08) 0%,
            rgba(247, 247, 239, .03) 52%,
            rgba(249, 244, 235, .02) 100%
        ) !important;
}


/* =========================================================
   HEADER : MEMES BORDS QUE LE CONTENU
   ========================================================= */

.supplier-payment-form-page
.supplier-invoice-shell
> .farm-dashboard__header.gestion-top-header {
    width: min(1320px, calc(100% - 40px)) !important;
    max-width: 1320px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    min-height: 84px;

    align-items: center !important;
}

.supplier-payment-form-page
.supplier-invoice-shell
> .farm-dashboard__header
.farm-dashboard__brand {
    padding: 10px 15px !important;
    border-radius: 18px !important;
}

.supplier-payment-form-page
.supplier-invoice-shell
> .farm-dashboard__header
.brand__icon {
    width: 46px !important;
    height: 46px !important;
}

.supplier-payment-form-page
.supplier-invoice-shell
> .farm-dashboard__header
.brand__text strong {
    font-size: 1.05rem !important;
}

.supplier-payment-form-page
.supplier-invoice-shell
> .farm-dashboard__header
.brand__text small {
    font-size: .72rem !important;
}

.supplier-payment-form-page
.supplier-invoice-shell
> .farm-dashboard__header
.supplier-header-button {
    min-height: 46px;
    padding: 0 19px !important;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    font-size: .86rem !important;
    font-weight: 850 !important;

    border-radius: 14px !important;
}


/* =========================================================
   DESKTOP : INTRO / SOLDE A GAUCHE - FORMULAIRE A DROITE
   ========================================================= */

.supplier-payment-form-page
.supplier-payment-form-content {
    box-sizing: border-box;

    width: min(1320px, calc(100% - 40px)) !important;
    max-width: 1320px !important;

    margin: 26px auto 0 !important;
    padding: 0 0 76px !important;

    display: grid;
    grid-template-columns:
        minmax(0, .90fr)
        minmax(560px, 1.16fr);
    gap: 28px;

    align-items: stretch;
}


/* =========================================================
   PANNEAU INTRODUCTION
   ========================================================= */

.supplier-payment-form-page
.supplier-payment-form-hero {
    box-sizing: border-box;

    min-width: 0;
    min-height: 520px;
    margin: 0 !important;

    padding: clamp(34px, 3.4vw, 48px) !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-items: stretch !important;

    border: 1px solid rgba(255,255,255,.82) !important;
    border-radius: 30px !important;

    background:
        linear-gradient(
            145deg,
            rgba(255, 253, 247, .94) 0%,
            rgba(244, 249, 242, .90) 100%
        ) !important;

    box-shadow:
        0 26px 64px rgba(27, 67, 48, .17) !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.supplier-payment-form-page
.supplier-payment-form-hero h1 {
    max-width: 620px;

    margin: 18px 0 12px !important;

    color: #113f30 !important;

    font-size:
        clamp(2.55rem, 4vw, 3.75rem) !important;

    line-height: 1.03 !important;
    letter-spacing: -.035em;
}

.supplier-payment-form-page
.supplier-payment-form-hero p {
    color: #47685a !important;

    font-size: 1rem !important;
    line-height: 1.6 !important;

    font-weight: 650;
}

.supplier-payment-form-page
.supplier-payment-form-hero
.supplier-badge {
    padding: 8px 12px !important;

    font-size: .76rem !important;
    font-weight: 900 !important;

    letter-spacing: .045em;
}


/* =========================================================
   COMPTEURS FINANCIERS
   ========================================================= */

.supplier-payment-form-page
.supplier-payment-form-balance {
    width: 100% !important;
    min-width: 0 !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 12px !important;

    margin-top: 34px;
}

.supplier-payment-form-page
.supplier-payment-form-balance > div {
    min-width: 0;
    min-height: 108px;

    padding: 18px 16px !important;

    display: flex;
    flex-direction: column;
    justify-content: center;

    border:
        1px solid rgba(31, 87, 63, .10);

    border-radius: 20px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f2f6f1 100%
        ) !important;

    box-shadow:
        0 12px 28px rgba(34, 73, 54, .09);
}

.supplier-payment-form-page
.supplier-payment-form-balance
> div:nth-child(2) {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f7f6ef 100%
        ) !important;
}

.supplier-payment-form-page
.supplier-payment-form-balance
> .supplier-payment-form-balance__remaining {
    background:
        linear-gradient(
            145deg,
            #eff8ea 0%,
            #dfeeda 100%
        ) !important;

    border-color:
        rgba(51, 119, 78, .16) !important;
}

.supplier-payment-form-page
.supplier-payment-form-balance small {
    margin-bottom: 9px !important;

    color: #687970 !important;

    font-size: .72rem !important;
    line-height: 1.25;

    font-weight: 900 !important;
}

.supplier-payment-form-page
.supplier-payment-form-balance strong {
    color: #123f31 !important;

    font-size: 1.28rem !important;
    line-height: 1.1;

    font-weight: 900 !important;
}


/* =========================================================
   CARTE FORMULAIRE
   ========================================================= */

.supplier-payment-form-page
.supplier-payment-form-card {
    box-sizing: border-box;

    min-width: 0;
    margin: 0 !important;

    padding:
        clamp(30px, 3vw, 42px) !important;

    border:
        1px solid rgba(255,255,255,.86) !important;

    border-radius: 30px !important;

    background:
        rgba(255, 253, 249, .95) !important;

    box-shadow:
        0 26px 64px rgba(27, 67, 48, .18) !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.supplier-payment-form-page
.supplier-payment-form-grid {
    gap: 23px 18px !important;
}

.supplier-payment-form-page
.supplier-payment-form-field label {
    color: #315847 !important;

    font-size: .86rem !important;
    font-weight: 850 !important;
}

.supplier-payment-form-page
.supplier-payment-form-field input,
.supplier-payment-form-page
.supplier-payment-form-field select,
.supplier-payment-form-page
.supplier-payment-form-field textarea {
    min-height: 52px !important;

    padding: 12px 14px !important;

    border:
        1px solid rgba(65, 94, 73, .20) !important;

    border-radius: 14px !important;

    background: rgba(255,255,255,.88) !important;

    color: #263e34 !important;

    font-size: .94rem !important;

    box-shadow:
        inset 0 1px 2px rgba(37, 66, 49, .035);
}

.supplier-payment-form-page
.supplier-payment-form-field textarea {
    min-height: 124px !important;
}

.supplier-payment-form-page
.supplier-payment-form-field > small {
    color: #6c7b72 !important;

    font-size: .78rem !important;
}

.supplier-payment-form-page
.supplier-payment-form-actions {
    margin-top: 30px !important;
    padding-top: 25px !important;

    border-top:
        1px solid rgba(52, 83, 62, .12) !important;
}

.supplier-payment-form-page
.supplier-payment-form-actions
.supplier-secondary-button,
.supplier-payment-form-page
.supplier-payment-form-actions
.supplier-primary-button {
    min-height: 48px;

    padding-left: 18px !important;
    padding-right: 18px !important;

    font-size: .87rem !important;
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 1100px) {

    .supplier-payment-form-page
    .supplier-payment-form-content {
        grid-template-columns: 1fr !important;
        max-width: 920px !important;
    }

    .supplier-payment-form-page
    .supplier-payment-form-hero {
        min-height: auto;
    }

    .supplier-payment-form-page
    .supplier-payment-form-balance {
        margin-top: 28px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .supplier-payment-form-page
    .supplier-invoice-shell.gestion-form-visual {
        padding-bottom: 110px !important;

        background-attachment: scroll !important;
    }

    .supplier-payment-form-page
    .supplier-invoice-shell
    > .farm-dashboard__header.gestion-top-header,
    .supplier-payment-form-page
    .supplier-payment-form-content {
        width: calc(100% - 24px) !important;
        max-width: none !important;
    }

    .supplier-payment-form-page
    .supplier-payment-form-content {
        margin-top: 16px !important;
        gap: 20px;
        padding-bottom: 40px !important;
    }

    .supplier-payment-form-page
    .supplier-payment-form-hero,
    .supplier-payment-form-page
    .supplier-payment-form-card {
        padding: 25px 21px !important;
        border-radius: 24px !important;
    }

    .supplier-payment-form-page
    .supplier-payment-form-hero h1 {
        font-size: 2.15rem !important;
    }

    .supplier-payment-form-page
    .supplier-payment-form-balance {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .supplier-payment-form-page
    .supplier-payment-form-balance > div {
        min-height: 92px;
    }

    .supplier-payment-form-page
    .supplier-payment-form-grid {
        grid-template-columns: 1fr !important;
    }

    .supplier-payment-form-page
    .supplier-payment-form-field--wide {
        grid-column: auto !important;
    }

    .supplier-payment-form-page
    .supplier-payment-form-actions {
        flex-direction: column-reverse !important;
    }

    .supplier-payment-form-page
    .supplier-payment-form-actions > * {
        width: 100% !important;
    }
}


/* COOPERATIVE DIRECTORY VISUAL UX 2026-08-23 */

/* =========================================================
   FOND GENERAL
   ========================================================= */

.cooperative-page
.cooperative-shell {
    width: 100% !important;
    max-width: none !important;
    min-height: 100vh;

    background:
        radial-gradient(
            circle at 8% 14%,
            rgba(72, 156, 111, .25),
            transparent 34%
        ),
        radial-gradient(
            circle at 92% 18%,
            rgba(131, 102, 170, .15),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #dfede5 0%,
            #f2f4ec 54%,
            #f3ebe2 100%
        ) !important;
}


/* =========================================================
   HEADER / LOGO OFFICIEL
   ========================================================= */

.cooperative-page
.cooperative-shell
> .cooperative-header {
    box-sizing: border-box;

    width: min(1360px, calc(100% - 40px)) !important;
    max-width: 1360px !important;

    min-height: 90px;

    margin-left: auto !important;
    margin-right: auto !important;

    padding: 14px 0 10px !important;

    align-items: center !important;
}

.cooperative-page
.cooperative-brand {
    gap: 12px !important;

    padding: 9px 16px 9px 9px !important;

    border:
        1px solid rgba(255,255,255,.88) !important;

    border-radius: 21px !important;

    background:
        rgba(255, 253, 247, .96) !important;

    box-shadow:
        0 13px 34px rgba(31,72,52,.13) !important;
}

.cooperative-page
.cooperative-brand
.cooperative-brand__icon {
    width: 52px !important;
    height: 52px !important;

    flex: 0 0 52px;

    display: grid !important;
    place-items: center !important;

    border-radius: 16px !important;

    background: #17855f !important;
}

.cooperative-page
.cooperative-brand
.cooperative-brand__icon svg {
    width: 31px;
    height: 31px;

    fill: none;
    stroke: #ffffff;
    stroke-width: 2.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.cooperative-page
.cooperative-brand
.brand__text {
    display: block;
}

.cooperative-page
.cooperative-brand
.brand__text strong {
    display: block;

    color: #123f31 !important;

    font-size: 1.08rem !important;
    line-height: 1.15;

    font-weight: 900 !important;
}

.cooperative-page
.cooperative-brand
.brand__text small {
    display: block;

    margin-top: 3px !important;

    color: #557267 !important;

    font-size: .72rem !important;
    line-height: 1.2;

    font-weight: 700;
}

.cooperative-page
.cooperative-header__actions {
    align-items: center;
}

.cooperative-page
.cooperative-header
.supplier-header-button {
    min-height: 46px;

    padding: 0 18px !important;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 14px !important;

    font-size: .86rem !important;
}


/* =========================================================
   CONTENU
   ========================================================= */

.cooperative-page
.cooperative-shell
> .supplier-content {
    box-sizing: border-box;

    width: min(1360px, calc(100% - 40px)) !important;
    max-width: 1360px !important;

    padding-top: 18px !important;
    padding-bottom: 72px !important;
}


/* =========================================================
   HERO AVEC PHOTO RECOLTES
   ========================================================= */

.cooperative-page
.cooperative-shell
.supplier-hero {
    box-sizing: border-box;

    min-height: 330px !important;

    padding:
        clamp(38px, 4.6vw, 62px) !important;

    border:
        1px solid rgba(255,255,255,.62) !important;

    border-radius: 30px !important;

    background-image:
        linear-gradient(
            100deg,
            rgba(13, 58, 39, .76) 0%,
            rgba(19, 74, 50, .58) 42%,
            rgba(24, 82, 56, .26) 68%,
            rgba(24, 82, 56, .08) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center 52% !important;
    background-repeat: no-repeat !important;

    box-shadow:
        0 24px 58px rgba(30,70,51,.18) !important;
}

.cooperative-page
.cooperative-shell
.supplier-hero__content {
    max-width: 720px;
}

.cooperative-page
.cooperative-shell
.supplier-hero
.supplier-badge {
    padding: 8px 13px !important;

    border:
        1px solid rgba(255,255,255,.30) !important;

    background:
        rgba(93, 66, 126, .52) !important;

    color: #ffffff !important;

    font-size: .77rem !important;
    font-weight: 900 !important;

    box-shadow:
        0 8px 20px rgba(18,45,33,.09);
}

.cooperative-page
.cooperative-shell
.supplier-hero h1 {
    max-width: 720px;

    margin: 20px 0 13px !important;

    color: #ffffff !important;

    font-size:
        clamp(2.9rem, 5vw, 4.45rem) !important;

    line-height: 1.01 !important;
    letter-spacing: -.035em;

    text-shadow:
        0 2px 10px rgba(8,35,24,.18);
}

.cooperative-page
.cooperative-shell
.supplier-hero p {
    max-width: 650px;

    color:
        rgba(255,255,255,.96) !important;

    font-size: 1.03rem !important;
    line-height: 1.65 !important;

    font-weight: 600;

    text-shadow:
        0 1px 5px rgba(8,35,24,.16);
}


/* =========================================================
   COMPTEUR
   ========================================================= */

.cooperative-page
.cooperative-shell
.supplier-hero__counter {
    width: 245px !important;
    min-width: 245px !important;

    padding: 25px 26px !important;

    border:
        1px solid rgba(255,255,255,.80) !important;

    border-radius: 24px !important;

    background:
        rgba(255, 253, 249, .94) !important;

    box-shadow:
        0 18px 42px rgba(18,55,39,.20) !important;

    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
}

.cooperative-page
.cooperative-shell
.supplier-hero__counter small {
    color: #536e63 !important;

    font-size: .81rem !important;
    line-height: 1.35;

    font-weight: 800 !important;
}

.cooperative-page
.cooperative-shell
.supplier-hero__counter strong {
    margin-top: 12px !important;

    color: #684d86 !important;

    font-size: 2.65rem !important;
    line-height: 1;

    font-weight: 900 !important;
}

.cooperative-page
.cooperative-shell
.supplier-hero__counter-detail {
    margin-top: 10px !important;

    color: #5c7067 !important;

    font-size: .79rem !important;
    line-height: 1.45 !important;

    font-weight: 650 !important;
}


/* =========================================================
   RECHERCHE / FILTRES
   ========================================================= */

.cooperative-page
.cooperative-shell
.supplier-directory-filters {
    margin-top: 20px;

    padding: 24px 26px !important;

    border:
        1px solid rgba(36,91,68,.15) !important;

    border-radius: 24px !important;

    background:
        rgba(255, 253, 249, .96) !important;

    box-shadow:
        0 16px 38px rgba(31,72,53,.12) !important;
}

.cooperative-page
.cooperative-shell
.supplier-directory-form {
    gap: 16px !important;
}

.cooperative-page
.cooperative-shell
.supplier-directory-form label > span {
    margin-bottom: 7px;

    color: #315847 !important;

    font-size: .83rem !important;
    font-weight: 850 !important;
}

.cooperative-page
.cooperative-shell
.supplier-directory-form input,
.cooperative-page
.cooperative-shell
.supplier-directory-form select {
    min-height: 48px !important;

    border:
        1px solid rgba(58,92,72,.18) !important;

    border-radius: 13px !important;

    background: #ffffff !important;

    font-size: .91rem !important;
}

.cooperative-page
.cooperative-shell
.supplier-directory-submit {
    min-height: 48px !important;

    padding-left: 18px !important;
    padding-right: 18px !important;

    border-radius: 13px !important;

    font-size: .87rem !important;
}

.cooperative-page
.cooperative-shell
.supplier-directory-result {
    margin-top: 14px !important;

    color: #597066 !important;

    font-size: .83rem !important;
}


/* =========================================================
   SECTION PARTENAIRES
   ========================================================= */

.cooperative-page
.cooperative-shell
.supplier-section {
    margin-top: 28px !important;

    overflow: hidden;

    border:
        1px solid rgba(40,91,69,.16) !important;

    border-radius: 28px !important;

    background:
        linear-gradient(
            145deg,
            rgba(237,245,240,.98) 0%,
            rgba(248,247,241,.98) 52%,
            rgba(244,237,231,.97) 100%
        ) !important;

    box-shadow:
        0 19px 46px rgba(30,72,53,.13) !important;
}

.cooperative-page
.cooperative-shell
.supplier-section__heading {
    padding: 25px 28px 21px !important;

    align-items: center !important;

    border-bottom:
        1px solid rgba(39,91,70,.11);

    background:
        rgba(255,255,255,.38) !important;
}

.cooperative-page
.cooperative-shell
.supplier-section__heading span {
    color: #725297 !important;

    font-size: .77rem !important;
    font-weight: 900 !important;
}

.cooperative-page
.cooperative-shell
.supplier-section__heading h2 {
    margin-top: 7px !important;

    color: #123f31 !important;

    font-size:
        clamp(1.75rem, 2.7vw, 2.25rem) !important;
}

.cooperative-page
.cooperative-shell
.supplier-section
.supplier-primary-button {
    min-height: 46px;

    padding-left: 18px !important;
    padding-right: 18px !important;

    border-radius: 13px !important;

    font-size: .86rem !important;

    box-shadow:
        0 11px 25px rgba(29,130,91,.21) !important;
}


/* =========================================================
   GRILLE : AUTO-FIT POUR EVITER LE GRAND VIDE
   ========================================================= */

.cooperative-page
.cooperative-shell
.supplier-grid {
    padding: 0 28px 28px !important;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(min(100%, 430px), 1fr)
        ) !important;

    gap: 22px !important;
}


/* =========================================================
   CARTE COOPERATIVE
   ========================================================= */

.cooperative-page
.cooperative-shell
.supplier-card {
    min-height: 285px !important;

    padding: 27px 28px !important;

    border:
        1px solid rgba(55,95,76,.19) !important;

    border-radius: 23px !important;

    background:
        rgba(255,255,255,.995) !important;

    box-shadow:
        0 15px 36px rgba(28,75,55,.13) !important;
}

.cooperative-page
.cooperative-shell
.supplier-card:hover {
    transform: translateY(-2px);

    border-color:
        rgba(91,73,130,.25) !important;

    box-shadow:
        0 21px 44px rgba(28,75,55,.17) !important;
}

.cooperative-page
.cooperative-shell
.supplier-card__icon {
    width: 52px !important;
    height: 52px !important;

    border-radius: 16px !important;

    background:
        linear-gradient(
            145deg,
            #eee6f7,
            #f6f0fa
        ) !important;

    font-size: 1.45rem !important;
}

.cooperative-page
.cooperative-shell
.supplier-card__status {
    padding: 7px 10px !important;

    font-size: .70rem !important;
}

.cooperative-page
.cooperative-shell
.supplier-card__eyebrow {
    margin-top: 21px !important;

    color: #725297 !important;

    font-size: .75rem !important;
}

.cooperative-page
.cooperative-shell
.supplier-card h3 {
    margin: 7px 0 17px !important;

    color: #123f31 !important;

    font-size: 1.32rem !important;
    line-height: 1.3 !important;

    font-weight: 900 !important;
}

.cooperative-page
.cooperative-shell
.supplier-card__details {
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px 22px !important;

    color: #506b60 !important;

    font-size: .88rem !important;
    line-height: 1.5 !important;
}

.cooperative-page
.cooperative-shell
.supplier-card__footer {
    margin-top: 22px !important;

    padding-top: 17px !important;

    border-top:
        1px solid rgba(39,91,70,.12) !important;
}

.cooperative-page
.cooperative-shell
.supplier-card__footer > span {
    color: #6e7d76 !important;

    font-size: .82rem !important;
}

.cooperative-page
.cooperative-shell
.supplier-card__actions {
    gap: 14px !important;
}

.cooperative-page
.cooperative-shell
.supplier-card__actions a,
.cooperative-page
.cooperative-shell
.supplier-card__actions button {
    font-size: .83rem !important;
    font-weight: 850 !important;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 900px) {

    .cooperative-page
    .cooperative-shell
    .supplier-hero {
        min-height: auto !important;

        align-items: flex-start !important;
        flex-direction: column !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-hero__counter {
        width: 100% !important;
        min-width: 0 !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-card__details {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 650px) {

    .cooperative-page
    .cooperative-shell
    > .cooperative-header,
    .cooperative-page
    .cooperative-shell
    > .supplier-content {
        width: calc(100% - 24px) !important;
        max-width: none !important;
    }

    .cooperative-page
    .cooperative-shell
    > .cooperative-header {
        align-items: stretch !important;
    }

    .cooperative-page
    .cooperative-header__actions {
        display: grid !important;

        width: 100%;

        grid-template-columns: 1fr 1fr;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-hero {
        padding: 29px 22px !important;

        border-radius: 24px !important;

        background-position: 58% center !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-hero h1 {
        font-size: 2.35rem !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-directory-filters {
        padding: 21px !important;

        border-radius: 21px !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-section {
        border-radius: 23px !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-section__heading {
        padding: 22px 20px 18px !important;

        align-items: stretch !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-grid {
        padding: 0 20px 20px !important;

        grid-template-columns: 1fr !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-card {
        min-height: 0 !important;

        padding: 22px 20px !important;

        border-radius: 20px !important;
    }
}


/* COOPERATIVE DIRECTORY FINAL BALANCE 2026-08-23 */

/* =========================================================
   LOGO : neutralise .supplier-brand > span sur le texte
   ========================================================= */

.cooperative-page
.cooperative-brand
> .brand__text {
    width: auto !important;
    height: auto !important;
    min-width: max-content !important;

    display: grid !important;
    place-items: initial !important;

    padding: 0 !important;

    border-radius: 0 !important;
    background: transparent !important;

    box-shadow: none !important;
}

.cooperative-page
.cooperative-brand
.brand__text strong,
.cooperative-page
.cooperative-brand
.brand__text small {
    width: auto !important;

    white-space: nowrap !important;
}

.cooperative-page
.cooperative-brand {
    width: auto !important;
    min-width: 238px;

    flex: 0 0 auto !important;
}


/* =========================================================
   SECTION COOPERATIVES : PLUS DE GRAND CADRE VIDE
   ========================================================= */

.cooperative-page
.cooperative-shell
.supplier-section {
    overflow: visible !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;

    box-shadow: none !important;
}

.cooperative-page
.cooperative-shell
.supplier-section__heading {
    margin-bottom: 20px !important;

    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;
}


/* =========================================================
   GRILLE : CARTE GENERUSE MAIS PAS ETIREE
   ========================================================= */

.cooperative-page
.cooperative-shell
.supplier-grid {
    padding: 0 !important;

    grid-template-columns:
        repeat(
            auto-fill,
            minmax(
                min(100%, 430px),
                560px
            )
        ) !important;

    justify-content: start !important;

    gap: 22px !important;
}


/* =========================================================
   CARTE : INFORMATIONS REGROUPEES
   ========================================================= */

.cooperative-page
.cooperative-shell
.supplier-card {
    width: 100% !important;
    max-width: 560px !important;

    min-height: 310px !important;
}

.cooperative-page
.cooperative-shell
.supplier-card__details {
    grid-template-columns: 1fr !important;

    gap: 8px !important;
}

.cooperative-page
.cooperative-shell
.supplier-card__footer {
    gap: 16px;

    align-items: flex-end !important;
}

.cooperative-page
.cooperative-shell
.supplier-card__actions {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: flex-end !important;

    gap: 12px !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .cooperative-page
    .cooperative-brand {
        min-width: 0;
        max-width: 100%;
    }

    .cooperative-page
    .cooperative-brand
    > .brand__text {
        min-width: 0 !important;
    }

    .cooperative-page
    .cooperative-brand
    .brand__text strong,
    .cooperative-page
    .cooperative-brand
    .brand__text small {
        white-space: normal !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-grid {
        grid-template-columns: 1fr !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-card {
        max-width: none !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-card__footer {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    .cooperative-page
    .cooperative-shell
    .supplier-card__actions {
        justify-content: flex-start !important;
    }
}


/* COOPERATIVE FORM VISUAL UX 2026-08-23 */

/* =========================================================
   PHOTO DE FOND PLEINE PAGE
   ========================================================= */

.cooperative-form-page
.cooperative-form-shell {
    box-sizing: border-box;

    width: 100% !important;
    max-width: none !important;

    min-height: 100vh;

    color: #173f31;

    background-image:
        linear-gradient(
            100deg,
            rgba(239, 247, 241, .20) 0%,
            rgba(247, 247, 239, .10) 48%,
            rgba(249, 242, 232, .07) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}


/* =========================================================
   HEADER
   ========================================================= */

.cooperative-form-page
.cooperative-form-shell
> .cooperative-form-header {
    box-sizing: border-box;

    width: min(1240px, calc(100% - 40px)) !important;
    max-width: 1240px !important;

    min-height: 88px;

    margin-left: auto !important;
    margin-right: auto !important;

    padding: 14px 0 10px !important;

    align-items: center !important;
}


/* =========================================================
   LOGO OFFICIEL
   Neutralise l ancienne regle .supplier-brand > span
   ========================================================= */

.cooperative-form-page
.cooperative-form-brand {
    width: auto !important;
    min-width: 238px;

    flex: 0 0 auto !important;

    gap: 12px !important;

    padding: 9px 16px 9px 9px !important;

    border:
        1px solid rgba(255,255,255,.88) !important;

    border-radius: 21px !important;

    background:
        rgba(255, 253, 247, .96) !important;

    box-shadow:
        0 13px 34px rgba(31,72,52,.13) !important;
}

.cooperative-form-page
.cooperative-form-brand
> .cooperative-form-brand__icon {
    width: 52px !important;
    height: 52px !important;

    flex: 0 0 52px !important;

    display: grid !important;
    place-items: center !important;

    padding: 0 !important;

    border-radius: 16px !important;

    background: #17855f !important;
}

.cooperative-form-page
.cooperative-form-brand
> .cooperative-form-brand__icon svg {
    width: 31px;
    height: 31px;

    fill: none;
    stroke: #ffffff;
    stroke-width: 2.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.cooperative-form-page
.cooperative-form-brand
> .brand__text {
    width: auto !important;
    height: auto !important;
    min-width: max-content !important;

    display: grid !important;
    place-items: initial !important;

    padding: 0 !important;

    border-radius: 0 !important;
    background: transparent !important;
}

.cooperative-form-page
.cooperative-form-brand
.brand__text strong {
    display: block;

    color: #123f31 !important;

    font-size: 1.08rem !important;
    line-height: 1.15;

    font-weight: 900 !important;

    white-space: nowrap !important;
}

.cooperative-form-page
.cooperative-form-brand
.brand__text small {
    display: block;

    margin-top: 3px !important;

    color: #557267 !important;

    font-size: .72rem !important;
    line-height: 1.2;

    font-weight: 700;

    white-space: nowrap !important;
}

.cooperative-form-page
.cooperative-form-header
.supplier-header-button {
    min-height: 46px;

    padding: 0 18px !important;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 14px !important;

    background:
        rgba(255,253,249,.95) !important;

    font-size: .86rem !important;

    box-shadow:
        0 10px 26px rgba(31,72,52,.10);
}


/* =========================================================
   LAYOUT DESKTOP
   ========================================================= */

.cooperative-form-page
.cooperative-form-layout {
    box-sizing: border-box;

    width: min(1240px, calc(100% - 40px)) !important;
    max-width: 1240px !important;

    margin: 27px auto 0 !important;

    display: grid !important;

    grid-template-columns:
        minmax(0, .88fr)
        minmax(560px, 1.12fr) !important;

    gap: 30px !important;

    align-items: stretch !important;

    padding-bottom: 76px;
}


/* =========================================================
   PANNEAU INTRODUCTION
   ========================================================= */

.cooperative-form-page
.cooperative-form-intro {
    box-sizing: border-box;

    min-width: 0;

    padding:
        clamp(36px, 4vw, 52px) !important;

    border:
        1px solid rgba(255,255,255,.84) !important;

    border-radius: 30px !important;

    background:
        linear-gradient(
            145deg,
            rgba(255,253,247,.94) 0%,
            rgba(240,248,242,.90) 100%
        ) !important;

    box-shadow:
        0 25px 62px rgba(28,68,49,.17) !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.cooperative-form-page
.cooperative-form-intro
.supplier-badge {
    padding: 8px 13px !important;

    border:
        1px solid rgba(113,79,150,.10);

    background:
        rgba(235,225,247,.96) !important;

    color: #705194 !important;

    font-size: .77rem !important;
    font-weight: 900 !important;
}

.cooperative-form-page
.cooperative-form-intro h1 {
    max-width: 540px;

    margin: 20px 0 14px !important;

    color: #113f30 !important;

    font-size:
        clamp(2.75rem, 4.2vw, 4rem) !important;

    line-height: 1.02 !important;
    letter-spacing: -.035em;
}

.cooperative-form-page
.cooperative-form-intro
> p {
    max-width: 500px;

    color: #47685a !important;

    font-size: 1rem !important;
    line-height: 1.65 !important;

    font-weight: 600;
}


/* =========================================================
   CONSEIL
   ========================================================= */

.cooperative-form-page
.cooperative-form-intro
.supplier-form-tip {
    margin-top: 32px !important;

    padding: 21px !important;

    border:
        1px solid rgba(41,111,78,.11);

    border-radius: 19px !important;

    background:
        rgba(230,244,235,.91) !important;

    box-shadow:
        0 10px 26px rgba(34,76,56,.07);
}

.cooperative-form-page
.cooperative-form-intro
.supplier-form-tip > span {
    font-size: 1.25rem;
}

.cooperative-form-page
.cooperative-form-intro
.supplier-form-tip strong {
    color: #174b38;

    font-size: .93rem;
}

.cooperative-form-page
.cooperative-form-intro
.supplier-form-tip p {
    color: #557066 !important;

    font-size: .88rem !important;
    line-height: 1.6 !important;
}


/* =========================================================
   CARTE FORMULAIRE
   ========================================================= */

.cooperative-form-page
.cooperative-form-card {
    box-sizing: border-box;

    min-width: 0;

    padding:
        clamp(29px, 3vw, 40px) !important;

    border:
        1px solid rgba(255,255,255,.87) !important;

    border-radius: 30px !important;

    background:
        rgba(255,253,249,.96) !important;

    box-shadow:
        0 25px 62px rgba(28,68,49,.18) !important;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.cooperative-form-page
.cooperative-form-card
.supplier-form-grid {
    gap: 16px !important;
}

.cooperative-form-page
.cooperative-form-card
label {
    margin-bottom: 7px !important;

    color: #315847 !important;

    font-size: .83rem !important;
    line-height: 1.3;

    font-weight: 850 !important;
}

.cooperative-form-page
.cooperative-form-card
input,
.cooperative-form-page
.cooperative-form-card
select,
.cooperative-form-page
.cooperative-form-card
textarea {
    min-height: 49px !important;

    padding: 12px 14px !important;

    border:
        1px solid rgba(57,91,71,.19) !important;

    border-radius: 13px !important;

    background:
        rgba(255,255,255,.90) !important;

    color: #263e34 !important;

    font-size: .91rem !important;

    box-shadow:
        inset 0 1px 2px rgba(37,66,49,.035);
}

.cooperative-form-page
.cooperative-form-card
textarea {
    min-height: 108px !important;
}

.cooperative-form-page
.cooperative-form-card
small,
.cooperative-form-page
.cooperative-form-card
.form-text {
    color: #687a70 !important;

    font-size: .77rem !important;
    line-height: 1.45;
}


/* =========================================================
   ACTIONS
   ========================================================= */

.cooperative-form-page
.cooperative-form-card
.supplier-form-actions {
    margin-top: 27px !important;

    padding-top: 23px;

    border-top:
        1px solid rgba(52,83,62,.12);
}

.cooperative-form-page
.cooperative-form-card
.supplier-secondary-button,
.cooperative-form-page
.cooperative-form-card
.supplier-primary-button {
    min-height: 47px;

    padding-left: 18px !important;
    padding-right: 18px !important;

    border-radius: 13px !important;

    font-size: .86rem !important;
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 950px) {

    .cooperative-form-page
    .cooperative-form-layout {
        max-width: 880px !important;

        grid-template-columns: 1fr !important;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .cooperative-form-page
    .cooperative-form-shell {
        padding-bottom: 110px !important;

        background-attachment: scroll !important;

        background-position: 58% center !important;
    }

    .cooperative-form-page
    .cooperative-form-shell
    > .cooperative-form-header,
    .cooperative-form-page
    .cooperative-form-layout {
        width: calc(100% - 24px) !important;
        max-width: none !important;
    }

    .cooperative-form-page
    .cooperative-form-shell
    > .cooperative-form-header {
        align-items: stretch !important;
    }

    .cooperative-form-page
    .cooperative-form-brand {
        min-width: 0;
        max-width: 100%;
    }

    .cooperative-form-page
    .cooperative-form-brand
    > .brand__text {
        min-width: 0 !important;
    }

    .cooperative-form-page
    .cooperative-form-brand
    .brand__text strong,
    .cooperative-form-page
    .cooperative-form-brand
    .brand__text small {
        white-space: normal !important;
    }

    .cooperative-form-page
    .cooperative-form-layout {
        margin-top: 18px !important;

        gap: 20px !important;

        padding-bottom: 40px;
    }

    .cooperative-form-page
    .cooperative-form-intro,
    .cooperative-form-page
    .cooperative-form-card {
        padding: 25px 21px !important;

        border-radius: 24px !important;
    }

    .cooperative-form-page
    .cooperative-form-intro h1 {
        font-size: 2.25rem !important;
    }

    .cooperative-form-page
    .cooperative-form-card
    .supplier-form-grid {
        grid-template-columns: 1fr !important;
    }

    .cooperative-form-page
    .cooperative-form-card
    .supplier-form-actions {
        flex-direction: column-reverse !important;
    }

    .cooperative-form-page
    .cooperative-form-card
    .supplier-form-actions > * {
        width: 100% !important;
    }
}


/* COOPERATIVE FORM INTRO NATURAL HEIGHT 2026-08-23 */

/*
 * Le panneau d introduction ne doit pas prendre
 * artificiellement toute la hauteur du formulaire.
 */
.cooperative-form-page
.cooperative-form-layout {
    align-items: start !important;
}

.cooperative-form-page
.cooperative-form-intro {
    align-self: start !important;
    min-height: 0 !important;
    height: auto !important;
}


/* PILOTAGE VISUAL UX 2026-08-23 */

.pilotage-page {
    background:
        radial-gradient(
            circle at 8% 4%,
            rgba(221,240,229,.82),
            transparent 30%
        ),
        radial-gradient(
            circle at 94% 8%,
            rgba(235,226,248,.68),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #f4f7ef 0%,
            #faf7ee 52%,
            #f4eee8 100%
        ) !important;
}

.pilotage-page .pilotage-shell {
    width: min(1320px, calc(100% - 40px)) !important;

    padding: 0 0 78px !important;
}


/* HEADER + LOGO */

.pilotage-page .pilotage-topbar {
    min-height: 92px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 13px 0 11px;
}

.pilotage-page .pilotage-brand {
    display: inline-flex;
    align-items: center;

    gap: 12px;

    padding: 9px 16px 9px 9px;

    border: 1px solid rgba(255,255,255,.90);
    border-radius: 21px;

    background: rgba(255,253,247,.97);

    color: #123f31;
    text-decoration: none;

    box-shadow:
        0 13px 34px rgba(31,72,52,.13);
}

.pilotage-page .pilotage-brand__icon {
    width: 52px;
    height: 52px;

    flex: 0 0 52px;

    display: grid;
    place-items: center;

    border-radius: 16px;

    background: #17855f;
}

.pilotage-page .pilotage-brand__icon svg {
    width: 31px;
    height: 31px;

    fill: none;
    stroke: #ffffff;
    stroke-width: 2.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.pilotage-page .pilotage-brand__text {
    display: grid;
}

.pilotage-page .pilotage-brand__text strong {
    color: #123f31;

    font-size: 1.08rem;
    line-height: 1.15;

    font-weight: 900;

    white-space: nowrap;
}

.pilotage-page .pilotage-brand__text small {
    margin-top: 3px;

    color: #557267;

    font-size: .72rem;
    line-height: 1.2;

    font-weight: 700;

    white-space: nowrap;
}

.pilotage-page .pilotage-topbar .pilotage-back {
    min-height: 46px;

    padding: 0 18px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(41,89,68,.14);
    border-radius: 14px;

    background: rgba(255,253,249,.96);

    color: #174f3a;

    font-size: .86rem;
    font-weight: 850;

    text-decoration: none;

    box-shadow:
        0 10px 26px rgba(31,72,52,.10);
}


/* HERO */

.pilotage-page .pilotage-header {
    min-height: 290px;

    margin-bottom: 22px !important;

    padding:
        clamp(38px, 4.8vw, 60px) !important;

    display: flex !important;
    align-items: center !important;

    border: 1px solid rgba(255,255,255,.62) !important;
    border-radius: 30px !important;

    background-image:
        linear-gradient(
            98deg,
            rgba(13,58,39,.82) 0%,
            rgba(18,72,49,.61) 42%,
            rgba(22,81,55,.24) 70%,
            rgba(22,81,55,.07) 100%
        ),
        var(--pilotage-hero-image) !important;

    background-size: cover !important;
    background-position: center 50% !important;
    background-repeat: no-repeat !important;

    box-shadow:
        0 24px 58px rgba(30,70,51,.18) !important;
}

.pilotage-page .pilotage-header > div {
    max-width: 760px !important;
}

.pilotage-page .pilotage-eyebrow {
    width: fit-content;

    margin-bottom: 13px !important;

    padding: 8px 12px;

    border: 1px solid rgba(255,255,255,.27);
    border-radius: 999px;

    background: rgba(91,65,126,.48);

    color: #ffffff !important;

    font-size: .74rem !important;
}

.pilotage-page .pilotage-header h1 {
    color: #ffffff !important;

    font-size:
        clamp(2.9rem, 5vw, 4.35rem) !important;

    line-height: 1.02 !important;

    letter-spacing: -.035em;

    text-shadow:
        0 2px 10px rgba(8,35,24,.18);
}

.pilotage-page .pilotage-header p {
    max-width: 690px;

    margin-top: 15px !important;

    color: rgba(255,255,255,.96) !important;

    font-size: 1.03rem !important;
    line-height: 1.65 !important;

    font-weight: 600;

    text-shadow:
        0 1px 5px rgba(8,35,24,.17);
}


/* PERIODE */

.pilotage-page .pilotage-period {
    min-height: 78px;

    margin-bottom: 16px !important;

    padding: 16px 22px !important;

    border: 1px solid rgba(43,92,69,.15) !important;
    border-radius: 20px !important;

    background:
        linear-gradient(
            145deg,
            rgba(237,247,241,.98),
            rgba(249,247,239,.97)
        ) !important;

    box-shadow:
        0 12px 28px rgba(30,72,52,.08);
}

.pilotage-page .pilotage-period small {
    color: #718077 !important;

    font-size: .62rem !important;
}

.pilotage-page .pilotage-period strong {
    color: #174f3a !important;

    font-size: 1.18rem !important;
}

.pilotage-page .pilotage-period a {
    color: #245b41 !important;

    font-size: .82rem !important;
}


/* SELECTION DU MOIS */

.pilotage-page .pilotage-month-form {
    min-height: 72px;

    margin-bottom: 16px !important;

    padding: 14px 18px !important;

    border: 1px solid rgba(43,92,69,.14) !important;
    border-radius: 18px !important;

    background: rgba(255,253,249,.96) !important;

    box-shadow:
        0 10px 24px rgba(30,72,52,.07);
}

.pilotage-page .pilotage-month-form label {
    color: #526c60 !important;

    font-size: .77rem !important;
}

.pilotage-page .pilotage-month-form input {
    min-height: 45px !important;

    border: 1px solid rgba(43,92,69,.20) !important;
    border-radius: 12px !important;

    background: #ffffff !important;
}

.pilotage-page .pilotage-month-form button {
    min-height: 45px !important;

    padding: 0 20px !important;

    border-radius: 12px !important;

    background:
        linear-gradient(
            135deg,
            #24724f,
            #185b3e
        ) !important;

    box-shadow:
        0 8px 18px rgba(31,94,64,.18);
}


/* NOTE */

.pilotage-page .pilotage-note {
    margin-bottom: 31px !important;

    padding: 15px 18px !important;

    border: 1px solid rgba(48,95,72,.12);
    border-radius: 16px !important;

    background: rgba(245,249,246,.92) !important;

    color: #5b7166 !important;
}

.pilotage-page .pilotage-note strong {
    color: #315f49 !important;
}


/* TITRES SECTIONS */

.pilotage-page .pilotage-section {
    margin-bottom: 36px !important;
}

.pilotage-page .pilotage-section__heading {
    margin-bottom: 16px !important;
}

.pilotage-page .pilotage-section__heading span {
    color: #63776d !important;

    font-size: .68rem !important;
}

.pilotage-page .pilotage-section__heading h2 {
    margin-top: 5px !important;

    color: #173f31 !important;

    font-size: 1.55rem !important;

    letter-spacing: -.015em;
}


/* CARTES */

.pilotage-page .pilotage-grid {
    gap: 18px !important;
}

.pilotage-page .pilotage-card {
    min-height: 215px !important;

    padding: 24px !important;

    border: 1px solid rgba(42,92,70,.15) !important;
    border-radius: 23px !important;

    background:
        linear-gradient(
            150deg,
            rgba(255,255,255,.99),
            rgba(247,249,246,.97)
        ) !important;

    box-shadow:
        0 15px 34px rgba(28,75,55,.10) !important;

    transition:
        transform .16s ease,
        box-shadow .16s ease;
}

.pilotage-page .pilotage-card:hover {
    transform: translateY(-2px);

    box-shadow:
        0 20px 42px rgba(28,75,55,.13) !important;
}

.pilotage-page .pilotage-card--positive {
    background:
        linear-gradient(
            150deg,
            rgba(255,255,255,.99),
            rgba(236,247,240,.97)
        ) !important;
}

.pilotage-page .pilotage-card--negative {
    background:
        linear-gradient(
            150deg,
            rgba(255,255,255,.99),
            rgba(252,242,238,.97)
        ) !important;
}

.pilotage-page .pilotage-card--highlight {
    background:
        linear-gradient(
            150deg,
            rgba(255,255,255,.99),
            rgba(237,244,238,.98)
        ) !important;
}

.pilotage-page .pilotage-card--bank {
    background:
        linear-gradient(
            150deg,
            rgba(255,255,255,.99),
            rgba(233,244,238,.98)
        ) !important;
}

.pilotage-page .pilotage-card--warning {
    background:
        linear-gradient(
            150deg,
            rgba(255,255,255,.99),
            rgba(255,247,231,.98)
        ) !important;
}

.pilotage-page .pilotage-card__icon {
    width: 45px !important;
    height: 45px !important;

    margin-bottom: 15px;

    border: 1px solid rgba(44,91,70,.10);
    border-radius: 14px !important;

    background:
        rgba(238,245,240,.96) !important;

    font-size: 1.18rem !important;
}

.pilotage-page .pilotage-card small {
    color: #61746a !important;

    font-size: .68rem !important;
}

.pilotage-page .pilotage-card strong {
    margin-top: 9px !important;

    color: #143e30 !important;

    font-size: 2rem !important;
    line-height: 1.05 !important;
}

.pilotage-page .pilotage-card p {
    color: #6c7e75 !important;

    font-size: .78rem !important;
    line-height: 1.5 !important;
}

.pilotage-page .pilotage-card a {
    color: #286849 !important;

    font-size: .79rem !important;
}


/* ALERTES */

.pilotage-page .pilotage-alerts {
    gap: 11px !important;
}

.pilotage-page .pilotage-alert {
    padding: 15px 17px !important;

    border: 1px solid rgba(45,91,70,.10);
    border-radius: 15px !important;

    box-shadow:
        0 8px 20px rgba(31,72,52,.055);
}


/* RESPONSIVE */

@media (max-width: 1000px) {

    .pilotage-page .pilotage-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 650px) {

    .pilotage-page .pilotage-shell {
        width: min(100% - 24px, 1320px) !important;
    }

    .pilotage-page .pilotage-topbar {
        flex-direction: column;
        align-items: stretch;

        gap: 10px;
    }

    .pilotage-page .pilotage-brand {
        align-self: flex-start;
    }

    .pilotage-page .pilotage-topbar .pilotage-back {
        width: 100%;
    }

    .pilotage-page .pilotage-header {
        min-height: auto;

        padding: 30px 23px !important;

        background-position: 60% center !important;
    }

    .pilotage-page .pilotage-header h1 {
        font-size:
            clamp(2.35rem, 12vw, 3.15rem) !important;
    }

    .pilotage-page .pilotage-period {
        grid-template-columns: 1fr !important;

        gap: 12px;
    }

    .pilotage-page .pilotage-month-form {
        align-items: stretch !important;

        flex-direction: column !important;
    }

    .pilotage-page .pilotage-grid,
    .pilotage-page .pilotage-grid--three {
        grid-template-columns: 1fr !important;
    }

    .pilotage-page .pilotage-note {
        flex-direction: column;
    }
}


/* PILOTAGE READABILITY FIX 2026-08-23 */

.pilotage-page .pilotage-period small {
    font-size: .72rem !important;
}

.pilotage-page .pilotage-period strong {
    font-size: 1.32rem !important;
}

.pilotage-page .pilotage-period a {
    font-size: .92rem !important;
}

.pilotage-page .pilotage-month-form label {
    font-size: .88rem !important;
}

.pilotage-page .pilotage-month-form input,
.pilotage-page .pilotage-month-form button {
    font-size: .93rem !important;
}

.pilotage-page .pilotage-note {
    font-size: .88rem !important;
    line-height: 1.5 !important;
}

.pilotage-page .pilotage-note strong {
    font-size: .9rem !important;
}

.pilotage-page .pilotage-section__heading span {
    font-size: .76rem !important;
}

.pilotage-page .pilotage-section__heading h2 {
    font-size: 1.72rem !important;
}

.pilotage-page .pilotage-card {
    min-height: 225px !important;
}

.pilotage-page .pilotage-card small {
    font-size: .78rem !important;
    line-height: 1.35 !important;
}

.pilotage-page .pilotage-card strong {
    font-size: 2.12rem !important;
}

.pilotage-page .pilotage-card p {
    font-size: .9rem !important;
    line-height: 1.55 !important;
}

.pilotage-page .pilotage-card a {
    font-size: .9rem !important;
}

.pilotage-page .pilotage-alert {
    font-size: .9rem !important;
    line-height: 1.5 !important;
}

@media (max-width: 650px) {

    .pilotage-page .pilotage-card small {
        font-size: .8rem !important;
    }

    .pilotage-page .pilotage-card p,
    .pilotage-page .pilotage-card a,
    .pilotage-page .pilotage-note,
    .pilotage-page .pilotage-alert {
        font-size: .92rem !important;
    }
}


/* COMPTABLE PAGE SCALE READABILITY 2026-08-23 */

/* =========================================================
   LARGEUR GENERALE
   ========================================================= */

body.comptable-page
main.comptable-shell.gestion-visual-shell {
    width: min(1420px, calc(100% - 40px)) !important;
    max-width: 1420px !important;

    padding-top: 0 !important;
    padding-bottom: 82px !important;
}

body.comptable-page
main.comptable-shell.gestion-visual-shell
> .farm-dashboard__header {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* =========================================================
   HERO
   ========================================================= */

body.comptable-page
.comptable-header.gestion-visual-hero {
    width: 100% !important;

    min-height: 285px !important;

    align-items: center !important;

    padding:
        clamp(38px, 4.5vw, 58px) !important;

    border-radius: 30px !important;

    box-shadow:
        0 24px 58px rgba(30,70,51,.17) !important;
}

body.comptable-page
.comptable-header
> div:first-child {
    max-width: 770px !important;
}

body.comptable-page
.comptable-eyebrow {
    margin-bottom: 12px !important;

    font-size: .78rem !important;
    line-height: 1.2;
}

body.comptable-page
.comptable-header h1 {
    font-size:
        clamp(2.8rem, 4.8vw, 4.15rem) !important;

    line-height: 1.03 !important;

    letter-spacing: -.035em;
}

body.comptable-page
.comptable-header p {
    margin-top: 15px !important;

    font-size: 1.02rem !important;
    line-height: 1.65 !important;

    font-weight: 600;
}

body.comptable-page
.comptable-header__actions {
    gap: 11px !important;
}

body.comptable-page
.comptable-settings-link,
body.comptable-page
.comptable-back {
    min-height: 45px !important;

    padding: 10px 16px !important;

    font-size: .88rem !important;
}


/* =========================================================
   PERIODE
   ========================================================= */

body.comptable-page
.comptable-period {
    min-height: 78px;

    margin-bottom: 16px !important;

    padding: 17px 22px !important;

    border-radius: 20px !important;

    box-shadow:
        0 12px 28px rgba(30,72,52,.08) !important;
}

body.comptable-page
.comptable-period small {
    font-size: .71rem !important;
}

body.comptable-page
.comptable-period strong {
    font-size: 1.3rem !important;
}

body.comptable-page
.comptable-period a {
    font-size: .91rem !important;
}


/* =========================================================
   SELECTEUR DE MOIS
   ========================================================= */

body.comptable-page
.comptable-month-form {
    min-height: 72px;

    margin-bottom: 18px !important;

    padding: 14px 18px !important;

    border-radius: 18px !important;

    box-shadow:
        0 10px 24px rgba(30,72,52,.07);
}

body.comptable-page
.comptable-month-form label {
    font-size: .86rem !important;
}

body.comptable-page
.comptable-month-form input,
body.comptable-page
.comptable-month-form button {
    min-height: 45px !important;

    font-size: .91rem !important;
}

body.comptable-page
.comptable-month-form input {
    border-radius: 12px !important;
}

body.comptable-page
.comptable-month-form button {
    padding: 0 20px !important;

    border-radius: 12px !important;

    box-shadow:
        0 8px 18px rgba(31,94,64,.17);
}


/* =========================================================
   ALERTES
   ========================================================= */

body.comptable-page
.comptable-ready,
body.comptable-page
.comptable-warning {
    margin-bottom: 20px !important;

    padding: 17px 20px !important;

    border-radius: 17px !important;

    font-size: .9rem !important;
    line-height: 1.5 !important;

    box-shadow:
        0 9px 23px rgba(31,72,52,.055);
}

body.comptable-page
.comptable-warning strong {
    font-size: .92rem !important;
}

body.comptable-page
.comptable-warning li {
    font-size: .88rem !important;
}


/* =========================================================
   SIX CARTES
   ========================================================= */

body.comptable-page
.comptable-grid {
    gap: 18px !important;

    margin-bottom: 30px !important;
}

body.comptable-page
.comptable-card {
    min-height: 205px !important;

    padding: 25px !important;

    border-radius: 23px !important;

    background:
        linear-gradient(
            150deg,
            rgba(255,255,255,.99),
            rgba(246,249,246,.97)
        ) !important;

    box-shadow:
        0 15px 34px rgba(28,75,55,.10) !important;
}

body.comptable-page
.comptable-card:nth-child(1),
body.comptable-page
.comptable-card:nth-child(4) {
    background:
        linear-gradient(
            150deg,
            rgba(255,255,255,.99),
            rgba(235,247,240,.97)
        ) !important;
}

body.comptable-page
.comptable-card:nth-child(5) {
    background:
        linear-gradient(
            150deg,
            rgba(255,255,255,.99),
            rgba(251,242,238,.97)
        ) !important;
}

body.comptable-page
.comptable-card:nth-child(6) {
    background:
        linear-gradient(
            150deg,
            rgba(255,255,255,.99),
            rgba(235,244,239,.97)
        ) !important;
}

body.comptable-page
.comptable-card
> span:first-child {
    color: #5d7166 !important;

    font-size: .78rem !important;
    line-height: 1.35 !important;

    font-weight: 900 !important;
}

body.comptable-page
.comptable-card
> strong {
    margin-top: 16px !important;

    color: #143e30 !important;

    font-size: 2.55rem !important;
}

body.comptable-page
.comptable-card
> b {
    margin-top: 9px !important;

    font-size: 1.2rem !important;
    line-height: 1.3;
}

body.comptable-page
.comptable-card
> small {
    padding-top: 17px !important;

    color: #687b71 !important;

    font-size: .88rem !important;
    line-height: 1.5 !important;
}


/* =========================================================
   EXPORT MENSUEL
   ========================================================= */

body.comptable-page
.comptable-zip {
    gap: 34px !important;

    margin-bottom: 30px;

    padding: 30px 32px !important;

    border-radius: 25px !important;

    box-shadow:
        0 17px 42px rgba(33,70,50,.10) !important;
}

body.comptable-page
.comptable-zip
.comptable-eyebrow {
    font-size: .75rem !important;
}

body.comptable-page
.comptable-zip h2 {
    font-size: 1.72rem !important;
}

body.comptable-page
.comptable-zip p {
    max-width: 820px !important;

    font-size: .92rem !important;
    line-height: 1.6 !important;
}

body.comptable-page
.comptable-zip button {
    min-height: 47px !important;

    padding: 0 21px !important;

    border-radius: 13px !important;

    font-size: .88rem !important;
}


/* =========================================================
   HISTORIQUE
   ========================================================= */

body.comptable-page
.comptable-history {
    padding: 29px 30px !important;

    border-radius: 26px !important;

    box-shadow:
        0 18px 44px rgba(33,70,50,.10) !important;
}

body.comptable-page
.comptable-history__heading {
    gap: 22px;

    margin-bottom: 22px !important;
}

body.comptable-page
.comptable-history__heading
.comptable-eyebrow {
    font-size: .75rem !important;
}

body.comptable-page
.comptable-history__heading h2 {
    font-size: 1.7rem !important;

    line-height: 1.2;
}

body.comptable-page
.comptable-history__heading p {
    font-size: .9rem !important;
    line-height: 1.55 !important;
}

body.comptable-page
.comptable-history__count {
    font-size: .82rem !important;
}

body.comptable-page
.comptable-history-list {
    gap: 13px !important;
}

body.comptable-page
.comptable-history-item {
    min-height: 112px;

    padding: 18px 19px !important;

    border-radius: 20px !important;

    box-shadow:
        0 9px 24px rgba(31,68,48,.07) !important;
}

body.comptable-page
.comptable-history-item__version {
    min-width: 52px;
    min-height: 52px;

    font-size: .84rem !important;
}

body.comptable-page
.comptable-history-item__title strong {
    font-size: .97rem !important;
}

body.comptable-page
.comptable-history-item__content
> p,
body.comptable-page
.comptable-history-item__content
> small {
    font-size: .82rem !important;
    line-height: 1.5 !important;
}

body.comptable-page
.comptable-history-item__meta {
    gap: 9px !important;

    font-size: .8rem !important;
    line-height: 1.45 !important;
}

body.comptable-page
.comptable-history-status,
body.comptable-page
.comptable-history-warning,
body.comptable-page
.comptable-history-ok {
    font-size: .76rem !important;
}

body.comptable-page
.comptable-history-item__actions {
    gap: 9px !important;
}

body.comptable-page
.comptable-history-item__actions a {
    min-height: 41px;

    padding: 8px 12px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 11px;

    font-size: .8rem !important;
    font-weight: 850 !important;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1000px) {

    body.comptable-page
    main.comptable-shell.gestion-visual-shell {
        width: calc(100% - 28px) !important;
    }

    body.comptable-page
    .comptable-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {

    body.comptable-page
    main.comptable-shell.gestion-visual-shell {
        width: calc(100% - 24px) !important;

        padding-bottom: 110px !important;
    }

    body.comptable-page
    .comptable-header.gestion-visual-hero {
        min-height: auto !important;

        padding: 28px 23px !important;

        border-radius: 24px !important;
    }

    body.comptable-page
    .comptable-header h1 {
        font-size:
            clamp(2.35rem, 12vw, 3.25rem) !important;
    }

    body.comptable-page
    .comptable-header__actions {
        width: 100%;

        justify-content: flex-start !important;
    }

    body.comptable-page
    .comptable-period {
        grid-template-columns: 1fr !important;

        gap: 12px;

        text-align: center;
    }

    body.comptable-page
    .comptable-period a,
    body.comptable-page
    .comptable-period a:last-child {
        text-align: center !important;
    }

    body.comptable-page
    .comptable-month-form {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    body.comptable-page
    .comptable-grid {
        grid-template-columns: 1fr !important;
    }

    body.comptable-page
    .comptable-zip {
        align-items: stretch !important;
        flex-direction: column !important;

        padding: 23px !important;
    }

    body.comptable-page
    .comptable-history {
        padding: 22px 19px !important;
    }
}


/* COMPTABLE HERO LIGHTEN 2026-08-23 */

body.comptable-page
.comptable-header.gestion-visual-hero {
    background-image:
        linear-gradient(
            98deg,
            rgba(13,58,39,.52) 0%,
            rgba(18,72,49,.38) 40%,
            rgba(22,81,55,.16) 68%,
            rgba(22,81,55,.04) 100%
        ),
        var(--gestion-family-image) !important;
}

body.comptable-page
.comptable-header h1,
body.comptable-page
.comptable-header p {
    text-shadow:
        0 1px 4px rgba(8,35,24,.12) !important;
}


/* COMPTABLE MOBILE WIDTH FIX 2026-08-23 */

@media (max-width: 720px) {

    body.comptable-page
    main.comptable-shell.gestion-visual-shell {
        width: calc(100% - 24px) !important;
        max-width: calc(100% - 24px) !important;
        min-width: 0 !important;

        margin-left: auto !important;
        margin-right: auto !important;
    }

    body.comptable-page
    main.comptable-shell.gestion-visual-shell
    > * {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.comptable-page
    main.comptable-shell.gestion-visual-shell
    > .farm-dashboard__header,
    body.comptable-page
    .comptable-header,
    body.comptable-page
    .comptable-period,
    body.comptable-page
    .comptable-month-form,
    body.comptable-page
    .comptable-ready,
    body.comptable-page
    .comptable-warning,
    body.comptable-page
    .comptable-grid,
    body.comptable-page
    .comptable-zip,
    body.comptable-page
    .comptable-history {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.comptable-page
    .comptable-header
    > div,
    body.comptable-page
    .comptable-header__actions,
    body.comptable-page
    .comptable-grid
    > *,
    body.comptable-page
    .comptable-card,
    body.comptable-page
    .comptable-zip
    > *,
    body.comptable-page
    .comptable-history
    > *,
    body.comptable-page
    .comptable-history-list,
    body.comptable-page
    .comptable-history-item,
    body.comptable-page
    .comptable-history-item__content,
    body.comptable-page
    .comptable-history-item__actions {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.comptable-page
    .comptable-header__actions {
        display: flex !important;
        flex-wrap: wrap !important;
    }

    body.comptable-page
    .comptable-header__actions
    > a {
        max-width: 100% !important;

        white-space: normal !important;

        text-align: center;
    }

    body.comptable-page
    .comptable-month-form
    label,
    body.comptable-page
    .comptable-month-form
    input,
    body.comptable-page
    .comptable-month-form
    button {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.comptable-page
    .comptable-grid {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    body.comptable-page
    .comptable-card {
        width: 100% !important;
    }

    body.comptable-page
    .comptable-zip form {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.comptable-page
    .comptable-zip button {
        width: 100% !important;
        max-width: 100% !important;

        white-space: normal !important;
    }

    body.comptable-page
    .comptable-history-item {
        grid-template-columns:
            minmax(0, 1fr) !important;

        gap: 14px !important;
    }

    body.comptable-page
    .comptable-history-item__version {
        width: 52px !important;
        min-width: 0 !important;
    }

    body.comptable-page
    .comptable-history-item__meta {
        display: flex !important;
        flex-wrap: wrap !important;

        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.comptable-page
    .comptable-history-item__actions {
        width: 100% !important;

        display: flex !important;
        flex-wrap: wrap !important;

        justify-content: flex-start !important;
    }

    body.comptable-page
    .comptable-history-item__actions
    a {
        flex: 1 1 180px;

        max-width: 100% !important;
        min-width: 0 !important;

        white-space: normal !important;

        text-align: center;
    }

    body.comptable-page
    .comptable-history-item__content,
    body.comptable-page
    .comptable-history-item__content *,
    body.comptable-page
    .comptable-zip p {
        overflow-wrap: anywhere;
    }
}


/* COMPTABLE SETTINGS VISUAL UX 2026-08-23 */

/* =========================================================
   PAGE / LARGEUR
   ========================================================= */

body.comptable-page
main.comptable-settings-shell {
    width: min(1260px, calc(100% - 40px)) !important;
    max-width: 1260px !important;

    min-height: 100vh;

    margin: 0 auto !important;

    padding: 0 0 76px !important;

    background-image:
        linear-gradient(
            180deg,
            rgba(243,248,244,.36) 0%,
            rgba(248,247,239,.70) 56%,
            rgba(248,247,239,.94) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

body.comptable-page
main.comptable-settings-shell::before {
    background:
        linear-gradient(
            180deg,
            rgba(247,250,246,.06) 0%,
            rgba(247,249,243,.22) 62%,
            rgba(248,247,239,.86) 100%
        ) !important;
}


/* =========================================================
   HEADER
   ========================================================= */

body.comptable-page
main.comptable-settings-shell
> .farm-dashboard__header {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    padding: 15px 0 12px !important;
}


/* =========================================================
   HERO
   ========================================================= */

body.comptable-page
main.comptable-settings-shell
.comptable-header.gestion-visual-hero {
    width: 100% !important;

    min-height: 245px !important;

    margin: 8px 0 24px !important;

    padding:
        clamp(34px, 4vw, 50px) !important;

    align-items: center !important;

    border-radius: 29px !important;

    background-image:
        linear-gradient(
            100deg,
            rgba(16,65,45,.48) 0%,
            rgba(23,82,57,.31) 46%,
            rgba(26,88,61,.10) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center 46% !important;

    box-shadow:
        0 22px 52px rgba(29,69,51,.15) !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-header
> div:first-child {
    max-width: 720px !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-eyebrow {
    padding: 7px 11px !important;

    color: #ffffff !important;

    font-size: .76rem !important;

    background:
        rgba(91,65,126,.42) !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-header h1 {
    color: #ffffff !important;

    font-size:
        clamp(2.65rem, 4.5vw, 3.85rem) !important;

    line-height: 1.04 !important;

    letter-spacing: -.03em;

    text-shadow:
        0 2px 8px rgba(8,35,24,.16) !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-header p {
    max-width: 650px;

    color:
        rgba(255,255,255,.96) !important;

    font-size: 1rem !important;
    line-height: 1.6 !important;

    font-weight: 650;

    text-shadow:
        0 1px 4px rgba(8,35,24,.14) !important;
}


/* =========================================================
   NOTICE SECURITE
   ========================================================= */

body.comptable-page
main.comptable-settings-shell
.comptable-settings-notice {
    margin: 0 0 24px !important;

    padding: 19px 21px !important;

    gap: 15px !important;

    border-radius: 20px !important;

    background:
        rgba(246,251,248,.96) !important;

    box-shadow:
        0 12px 30px rgba(31,72,52,.08) !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-notice
> span {
    font-size: 1.35rem !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-notice strong {
    font-size: .96rem !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-notice p {
    margin-top: 6px !important;

    color: #587066 !important;

    font-size: .88rem !important;
    line-height: 1.55 !important;
}


/* =========================================================
   FORMULAIRE : DEUX PANNEAUX DESKTOP
   ========================================================= */

body.comptable-page
main.comptable-settings-shell
.comptable-settings-form {
    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 24px !important;

    align-items: start;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-card {
    min-width: 0;

    padding:
        clamp(26px, 2.7vw, 34px) !important;

    border-radius: 26px !important;

    background:
        rgba(255,253,249,.96) !important;

    box-shadow:
        0 18px 44px rgba(30,69,51,.12) !important;

    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
}


/* =========================================================
   TITRES DES CARTES
   ========================================================= */

body.comptable-page
main.comptable-settings-shell
.comptable-settings-card__title {
    gap: 15px !important;

    margin-bottom: 25px !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-card__title
> span {
    width: 48px !important;
    height: 48px !important;

    flex-basis: 48px !important;

    border-radius: 15px !important;

    font-size: 1.15rem;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-card__title small {
    margin-bottom: 5px !important;

    color: #687c72 !important;

    font-size: .74rem !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-card__title h2 {
    color: #123f31 !important;

    font-size: 1.42rem !important;
    line-height: 1.2;

    font-weight: 900;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-card__title p {
    margin-top: 7px !important;

    color: #60736a !important;

    font-size: .86rem !important;
    line-height: 1.52 !important;
}


/* =========================================================
   CHAMPS
   ========================================================= */

body.comptable-page
main.comptable-settings-shell
.comptable-settings-grid {
    gap: 18px !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-form label {
    margin-bottom: 7px !important;

    color: #294f43 !important;

    font-size: .86rem !important;
    font-weight: 850 !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-form
input[type="text"],
body.comptable-page
main.comptable-settings-shell
.comptable-settings-form
input[type="email"],
body.comptable-page
main.comptable-settings-shell
.comptable-settings-form
input[type="number"] {
    min-height: 50px !important;

    padding: 11px 13px !important;

    border-radius: 13px !important;

    font-size: .92rem !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-form
.help-text,
body.comptable-page
main.comptable-settings-shell
.comptable-settings-form
.form-text,
body.comptable-page
main.comptable-settings-shell
.comptable-settings-form
div
> small {
    margin-top: 7px !important;

    color: #667a70 !important;

    font-size: .79rem !important;
    line-height: 1.5 !important;
}


/* =========================================================
   CASES / AUTOMATISATION
   ========================================================= */

body.comptable-page
main.comptable-settings-shell
.comptable-settings-check {
    margin-top: 19px !important;

    padding: 16px 17px !important;

    border: 1px solid rgba(45,103,75,.10);

    border-radius: 15px !important;

    background:
        rgba(245,249,246,.94) !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-check label {
    font-size: .84rem !important;
    line-height: 1.45;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-day {
    max-width: 360px !important;

    margin-top: 20px !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-check--secure {
    background:
        rgba(237,248,242,.96) !important;
}


/* =========================================================
   ACTIONS
   ========================================================= */

body.comptable-page
main.comptable-settings-shell
.comptable-settings-actions {
    grid-column: 1 / -1;

    margin-top: 2px;

    padding: 19px 21px;

    border: 1px solid rgba(43,92,69,.12);
    border-radius: 19px;

    background:
        rgba(255,253,249,.95);

    box-shadow:
        0 12px 30px rgba(31,72,52,.08);
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-actions a {
    min-height: 46px;

    padding: 0 17px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(41,89,68,.15);
    border-radius: 13px;

    background: #ffffff;

    color: #365f4d !important;

    font-size: .86rem !important;
}

body.comptable-page
main.comptable-settings-shell
.comptable-settings-actions button {
    min-height: 46px;

    padding: 0 20px !important;

    border-radius: 13px !important;

    background:
        linear-gradient(
            135deg,
            #21805b,
            #15916a
        ) !important;

    font-size: .86rem !important;

    box-shadow:
        0 10px 23px rgba(31,126,89,.19);
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 950px) {

    body.comptable-page
    main.comptable-settings-shell {
        width: min(880px, calc(100% - 28px)) !important;
    }

    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-form {
        grid-template-columns: 1fr !important;
    }

    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-actions {
        grid-column: auto;
    }
}

@media (max-width: 720px) {

    body.comptable-page
    main.comptable-settings-shell {
        width: calc(100% - 24px) !important;
        max-width: calc(100% - 24px) !important;
        min-width: 0 !important;

        padding-bottom: 105px !important;

        background-attachment: scroll !important;
    }

    body.comptable-page
    main.comptable-settings-shell
    > .farm-dashboard__header,
    body.comptable-page
    main.comptable-settings-shell
    .comptable-header,
    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-notice,
    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-form,
    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-card,
    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-actions {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.comptable-page
    main.comptable-settings-shell
    .comptable-header.gestion-visual-hero {
        min-height: auto !important;

        padding: 28px 23px !important;

        border-radius: 23px !important;
    }

    body.comptable-page
    main.comptable-settings-shell
    .comptable-header h1 {
        font-size:
            clamp(2.25rem, 11vw, 3.05rem) !important;
    }

    body.comptable-page
    main.comptable-settings-shell
    .comptable-header__actions {
        width: 100% !important;
    }

    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-grid {
        grid-template-columns: 1fr !important;
    }

    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-full {
        grid-column: auto !important;
    }

    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-card {
        padding: 23px 19px !important;
    }

    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-actions {
        align-items: stretch !important;
        flex-direction: column-reverse !important;
    }

    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-actions a,
    body.comptable-page
    main.comptable-settings-shell
    .comptable-settings-actions button {
        width: 100% !important;
    }
}


/* COMPTABLE SETTINGS FULL PAGE BACKGROUND 2026-08-23 */

/*
 * La photographie devient un vrai fond de page.
 * Le shell central ne dessine plus un grand rectangle photo.
 */

body.comptable-page
main.comptable-settings-shell {
    position: relative;
    isolation: isolate;

    background: transparent !important;
}


/* PHOTO PLEIN ECRAN */

body.comptable-page
main.comptable-settings-shell::before {
    content: "";

    position: fixed;
    z-index: -2;

    inset: 0;

    width: 100vw;
    height: 100vh;

    background-image:
        linear-gradient(
            105deg,
            rgba(239,247,241,.72) 0%,
            rgba(248,247,239,.78) 52%,
            rgba(248,241,233,.76) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;

    pointer-events: none;
}


/* LEGER VOILE GLOBAL POUR LA LISIBILITE */

body.comptable-page
main.comptable-settings-shell::after {
    content: "";

    position: fixed;
    z-index: -1;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(248,250,246,.08) 0%,
            rgba(248,248,242,.18) 58%,
            rgba(249,247,240,.38) 100%
        );

    pointer-events: none;
}


/* SUPPRESSION DE L EFFET GRAND CADRE EN BAS */

body.comptable-page
main.comptable-settings-shell
.comptable-settings-actions {
    margin-bottom: 0 !important;
}


/* MOBILE */

@media (max-width: 720px) {

    body.comptable-page
    main.comptable-settings-shell::before {
        position: fixed;

        background-position: 58% center !important;
    }

    body.comptable-page
    main.comptable-settings-shell::after {
        background:
            linear-gradient(
                180deg,
                rgba(247,250,246,.20),
                rgba(249,247,240,.50)
            );
    }
}


/* COMPTABLE TRANSMISSION VISUAL UX 2026-08-23 */


/* =========================================================
   PAGE / PHOTO EN VRAI FOND
   ========================================================= */

body.comptable-page
main.comptable-transmission-shell {
    position: relative;
    isolation: isolate;

    width: min(1260px, calc(100% - 40px)) !important;
    max-width: 1260px !important;

    min-height: 100vh;

    margin: 0 auto !important;

    padding: 0 0 80px !important;

    background: transparent !important;
}

body.comptable-page
main.comptable-transmission-shell::before {
    content: "";

    position: fixed;
    z-index: -2;

    inset: 0;

    width: 100vw;
    height: 100vh;

    background-image:
        linear-gradient(
            105deg,
            rgba(239,247,241,.72) 0%,
            rgba(248,247,239,.77) 52%,
            rgba(248,241,233,.75) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;

    pointer-events: none;
}

body.comptable-page
main.comptable-transmission-shell::after {
    content: "";

    position: fixed;
    z-index: -1;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(248,250,246,.08),
            rgba(249,247,240,.36)
        );

    pointer-events: none;
}


/* =========================================================
   HEADER
   ========================================================= */

body.comptable-page
main.comptable-transmission-shell
> .farm-dashboard__header {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    padding: 15px 0 12px !important;
}


/* =========================================================
   HERO
   ========================================================= */

body.comptable-page
main.comptable-transmission-shell
.comptable-header.gestion-visual-hero {
    width: 100% !important;

    min-height: 250px !important;

    margin: 8px 0 25px !important;

    padding:
        clamp(35px, 4vw, 51px) !important;

    align-items: center !important;

    border-radius: 29px !important;

    background-image:
        linear-gradient(
            100deg,
            rgba(14,62,43,.53) 0%,
            rgba(21,78,54,.34) 47%,
            rgba(25,86,59,.10) 100%
        ),
        var(--gestion-family-image) !important;

    background-size: cover !important;
    background-position: center 46% !important;

    box-shadow:
        0 22px 52px rgba(29,69,51,.15) !important;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-header
> div:first-child {
    max-width: 720px !important;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-eyebrow {
    padding: 7px 11px !important;

    color: #ffffff !important;

    font-size: .76rem !important;

    background:
        rgba(91,65,126,.43) !important;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-header h1 {
    color: #ffffff !important;

    font-size:
        clamp(2.7rem, 4.6vw, 4rem) !important;

    line-height: 1.04 !important;

    letter-spacing: -.035em;

    text-shadow:
        0 2px 8px rgba(8,35,24,.16) !important;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-header p {
    margin-top: 13px !important;

    color:
        rgba(255,255,255,.96) !important;

    font-size: .98rem !important;
    line-height: 1.55 !important;

    font-weight: 650;

    text-shadow:
        0 1px 4px rgba(8,35,24,.14) !important;
}


/* =========================================================
   DOSSIER A TRANSMETTRE
   ========================================================= */

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card {
    margin-bottom: 22px;

    padding:
        clamp(26px, 3vw, 35px) !important;

    border-radius: 26px !important;

    background:
        rgba(255,253,249,.97) !important;

    box-shadow:
        0 18px 44px rgba(30,69,51,.12) !important;

    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
}

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card__title {
    gap: 15px !important;

    margin-bottom: 24px !important;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card__title
> span {
    width: 49px !important;
    height: 49px !important;

    flex-basis: 49px !important;

    border-radius: 15px !important;

    font-size: 1.16rem;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card__title small {
    margin-bottom: 5px !important;

    color: #687c72 !important;

    font-size: .74rem !important;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card__title h2 {
    color: #123f31 !important;

    font-size: 1.5rem !important;

    font-weight: 900;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card__title p {
    margin-top: 7px !important;

    color: #62776c !important;

    font-size: .86rem !important;

    overflow-wrap: anywhere;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card
> p {
    margin: 10px 0 !important;

    color: #506b5e !important;

    font-size: .91rem !important;
    line-height: 1.55 !important;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card
> p strong {
    color: #173f31 !important;
}


/* =========================================================
   ALERTES / STATUTS
   ========================================================= */

body.comptable-page
main.comptable-transmission-shell
.comptable-ready,
body.comptable-page
main.comptable-transmission-shell
.comptable-warning {
    margin-bottom: 20px !important;

    padding: 19px 21px !important;

    border-radius: 19px !important;

    font-size: .9rem !important;
    line-height: 1.55 !important;

    box-shadow:
        0 11px 28px rgba(31,72,52,.08);
}

body.comptable-page
main.comptable-transmission-shell
.comptable-warning strong,
body.comptable-page
main.comptable-transmission-shell
.comptable-ready strong {
    display: block;

    margin-bottom: 7px;

    font-size: .96rem !important;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-warning p,
body.comptable-page
main.comptable-transmission-shell
.comptable-ready p {
    margin: 6px 0 !important;

    font-size: .88rem !important;
    line-height: 1.55 !important;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-warning a {
    display: inline-flex;

    margin-top: 8px;

    color: #25684a;

    font-size: .86rem;
    font-weight: 850;
}


/* =========================================================
   CONFIRMATION ET BOUTON DE TRANSMISSION
   ========================================================= */

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card form {
    display: grid;

    gap: 17px;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card form
> p {
    margin: 0 !important;

    padding: 17px 18px;

    border: 1px solid rgba(49,103,76,.12);
    border-radius: 15px;

    background:
        rgba(245,249,246,.96);
}

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card form label {
    color: #365d4c;

    font-size: .9rem !important;
    line-height: 1.5;

    font-weight: 700;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card form
input[type="checkbox"] {
    width: 18px;
    height: 18px;

    margin-right: 8px;

    vertical-align: middle;
}

body.comptable-page
main.comptable-transmission-shell
.comptable-settings-card form
button {
    min-height: 48px;

    width: fit-content;

    padding: 0 21px;

    border: 0;
    border-radius: 13px;

    background:
        linear-gradient(
            135deg,
            #21805b,
            #15916a
        );

    color: #ffffff;

    font: inherit;
    font-size: .88rem;
    font-weight: 900;

    box-shadow:
        0 10px 23px rgba(31,126,89,.20);

    cursor: pointer;
}


/* =========================================================
   RAPPORT DE CONTROLE
   ========================================================= */

body.comptable-page
main.comptable-transmission-shell
> p:last-of-type {
    margin: 0;

    padding: 18px 20px;

    border: 1px solid rgba(43,92,69,.12);
    border-radius: 18px;

    background:
        rgba(255,253,249,.95);

    box-shadow:
        0 11px 28px rgba(31,72,52,.08);
}

body.comptable-page
main.comptable-transmission-shell
> p:last-of-type
a {
    color: #236649;

    font-size: .88rem;
    font-weight: 850;

    text-decoration: none;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 720px) {

    body.comptable-page
    main.comptable-transmission-shell {
        width: calc(100% - 24px) !important;
        max-width: calc(100% - 24px) !important;

        min-width: 0 !important;

        padding-bottom: 105px !important;
    }

    body.comptable-page
    main.comptable-transmission-shell
    > *,
    body.comptable-page
    main.comptable-transmission-shell
    .comptable-settings-card,
    body.comptable-page
    main.comptable-transmission-shell
    .comptable-ready,
    body.comptable-page
    main.comptable-transmission-shell
    .comptable-warning {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.comptable-page
    main.comptable-transmission-shell
    .comptable-header.gestion-visual-hero {
        min-height: auto !important;

        padding: 28px 23px !important;

        border-radius: 23px !important;
    }

    body.comptable-page
    main.comptable-transmission-shell
    .comptable-header h1 {
        font-size:
            clamp(2.25rem, 11vw, 3.05rem) !important;
    }

    body.comptable-page
    main.comptable-transmission-shell
    .comptable-settings-card {
        padding: 23px 19px !important;
    }

    body.comptable-page
    main.comptable-transmission-shell
    .comptable-settings-card form
    button {
        width: 100%;

        white-space: normal;
    }
}


/* GESTION HOME CONTRAST READABILITY 2026-08-23 */


/* =========================================================
   FOND GENERAL : PLUS AGRICOLE, MOINS DELAVE
   ========================================================= */

body.gestion-page
main.gestion-shell {
    background:
        radial-gradient(
            circle at 5% 16%,
            rgba(101, 187, 132, .32) 0%,
            rgba(101, 187, 132, .13) 24%,
            transparent 43%
        ),
        radial-gradient(
            circle at 92% 18%,
            rgba(137, 115, 183, .16) 0%,
            transparent 34%
        ),
        radial-gradient(
            circle at 72% 82%,
            rgba(220, 178, 102, .20) 0%,
            transparent 38%
        ),
        linear-gradient(
            135deg,
            #edf6ee 0%,
            #f8f5e9 49%,
            #f3eee4 100%
        ) !important;
}


/* =========================================================
   LARGEUR / RESPIRATION
   ========================================================= */

body.gestion-page
.gestion-content {
    padding-top: 30px !important;
    padding-bottom: 72px !important;
}


/* =========================================================
   HERO : UN PEU PLUS PRESENT
   ========================================================= */

body.gestion-page
.gestion-hero {
    min-height: 350px !important;

    border:
        1px solid rgba(255,255,255,.62) !important;

    border-radius: 30px !important;

    box-shadow:
        0 25px 62px rgba(25,67,46,.20) !important;
}

body.gestion-page
.gestion-hero__overlay {
    background:
        linear-gradient(
            100deg,
            rgba(10,49,33,.76) 0%,
            rgba(16,62,42,.55) 43%,
            rgba(18,73,48,.20) 72%,
            rgba(18,73,48,.05) 100%
        ) !important;
}

body.gestion-page
.gestion-badge {
    padding: 8px 13px !important;

    border:
        1px solid rgba(255,255,255,.29);

    border-radius: 999px;

    background:
        rgba(126,82,50,.48) !important;

    color: #ffffff !important;

    font-size: .78rem !important;

    backdrop-filter: blur(7px);
}

body.gestion-page
.gestion-hero h1 {
    font-size:
        clamp(3rem, 4.6vw, 4.45rem) !important;

    line-height: 1.01 !important;

    letter-spacing: -.035em;

    text-shadow:
        0 2px 14px rgba(7,35,23,.20);
}

body.gestion-page
.gestion-hero p {
    max-width: 700px !important;

    margin-top: 17px !important;

    color:
        rgba(255,255,255,.96) !important;

    font-size: 1.04rem !important;
    line-height: 1.65 !important;

    font-weight: 650;
}


/* =========================================================
   TITRE AU-DESSUS DES CARTES
   ========================================================= */

body.gestion-page
.gestion-heading {
    margin-top: 33px !important;
    margin-bottom: 20px !important;
}

body.gestion-page
.gestion-heading__eyebrow {
    color: #7653a0 !important;

    font-size: .76rem !important;
    font-weight: 900 !important;

    letter-spacing: .075em;
}

body.gestion-page
.gestion-heading h2 {
    margin-top: 7px !important;

    color: #123f31 !important;

    font-size: 1.85rem !important;
    line-height: 1.16;

    letter-spacing: -.02em;
}

body.gestion-page
.gestion-heading p {
    margin-top: 7px !important;

    color: #506c60 !important;

    font-size: .96rem !important;
    line-height: 1.55 !important;
}


/* =========================================================
   GRILLE
   ========================================================= */

body.gestion-page
.gestion-grid {
    gap: 20px !important;
}


/* =========================================================
   CARTES : PLUS NETTES ET PLUS CHALEUREUSES
   ========================================================= */

body.gestion-page
.gestion-card {
    min-height: 275px !important;

    padding: 25px !important;

    border:
        1px solid rgba(37,91,63,.16) !important;

    border-radius: 23px !important;

    background:
        linear-gradient(
            150deg,
            rgba(255,255,252,.99) 0%,
            rgba(245,249,245,.98) 100%
        ) !important;

    box-shadow:
        0 16px 38px rgba(28,70,50,.12) !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

body.gestion-page
.gestion-card:nth-child(2),
body.gestion-page
.gestion-card:nth-child(6) {
    background:
        linear-gradient(
            150deg,
            #fffefd 0%,
            #f3eff9 100%
        ) !important;
}

body.gestion-page
.gestion-card:nth-child(4),
body.gestion-page
.gestion-card:nth-child(7) {
    background:
        linear-gradient(
            150deg,
            #fffefd 0%,
            #edf7f1 100%
        ) !important;
}

body.gestion-page
.gestion-card:nth-child(5),
body.gestion-page
.gestion-card:nth-child(8) {
    background:
        linear-gradient(
            150deg,
            #fffefd 0%,
            #faf3e6 100%
        ) !important;
}

body.gestion-page
.gestion-card:hover {
    transform: translateY(-4px) !important;

    border-color:
        rgba(34,126,88,.24) !important;

    box-shadow:
        0 23px 48px rgba(28,70,50,.17) !important;
}


/* =========================================================
   ICONES
   ========================================================= */

body.gestion-page
.gestion-card__icon {
    width: 48px !important;
    height: 48px !important;

    display: grid !important;
    place-items: center !important;

    border:
        1px solid rgba(92,67,130,.08);

    border-radius: 15px !important;

    background:
        linear-gradient(
            145deg,
            #f2ebf9,
            #ece5f4
        ) !important;

    font-size: 1.25rem !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.80);
}


/* =========================================================
   STATUTS
   ========================================================= */

body.gestion-page
.gestion-card__status {
    padding: 6px 10px !important;

    border-radius: 999px !important;

    font-size: .73rem !important;
    line-height: 1.2;

    font-weight: 900 !important;
}

body.gestion-page
.gestion-card__status--ready {
    border:
        1px solid rgba(38,132,87,.10);

    background:
        #e4f5e9 !important;

    color:
        #27714d !important;
}

body.gestion-page
.gestion-card__status--test {
    border:
        1px solid rgba(112,76,157,.10);

    background:
        #f0e7f8 !important;

    color:
        #70499b !important;
}


/* =========================================================
   TYPOGRAPHIE CARTES
   ========================================================= */

body.gestion-page
.gestion-card h3 {
    margin:
        21px 0 10px !important;

    color: #123f31 !important;

    font-size: 1.32rem !important;
    line-height: 1.2 !important;

    font-weight: 900 !important;

    letter-spacing: -.015em;
}

body.gestion-page
.gestion-card p {
    margin-bottom: 23px !important;

    color: #4f685d !important;

    font-size: .96rem !important;
    line-height: 1.58 !important;

    font-weight: 560;
}

body.gestion-page
.gestion-card__link {
    color: #6e459a !important;

    font-size: .91rem !important;
    line-height: 1.35;

    font-weight: 900 !important;

    text-decoration: none !important;
}

body.gestion-page
.gestion-card__link span {
    font-size: 1rem;
}

body.gestion-page
.gestion-card__future {
    color: #6f716d !important;

    font-size: .88rem !important;
    font-weight: 800 !important;
}


/* =========================================================
   BLOC INFORMATION FINAL
   ========================================================= */

body.gestion-page
.gestion-info {
    margin-top: 30px !important;

    padding: 22px 24px !important;

    border:
        1px solid rgba(43,110,77,.16) !important;

    border-radius: 20px !important;

    background:
        linear-gradient(
            145deg,
            rgba(231,247,239,.98),
            rgba(242,249,245,.98)
        ) !important;

    box-shadow:
        0 13px 31px rgba(31,72,52,.10);
}

body.gestion-page
.gestion-info__icon {
    font-size: 1.5rem !important;
}

body.gestion-page
.gestion-info strong {
    color: #195c40 !important;

    font-size: .98rem !important;
    font-weight: 900 !important;
}

body.gestion-page
.gestion-info p {
    margin-top: 6px !important;

    color: #526d60 !important;

    font-size: .9rem !important;
    line-height: 1.55 !important;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    body.gestion-page
    .gestion-grid {
        grid-template-columns:
            repeat(2, minmax(0,1fr)) !important;
    }
}

@media (max-width: 680px) {

    body.gestion-page
    .gestion-content {
        width:
            calc(100% - 24px) !important;

        max-width:
            calc(100% - 24px) !important;
    }

    body.gestion-page
    .gestion-hero {
        min-height: 390px !important;

        padding: 29px 23px !important;

        border-radius: 24px !important;
    }

    body.gestion-page
    .gestion-hero h1 {
        font-size:
            clamp(2.5rem, 12vw, 3.5rem) !important;
    }

    body.gestion-page
    .gestion-heading h2 {
        font-size: 1.55rem !important;
    }

    body.gestion-page
    .gestion-grid {
        grid-template-columns: 1fr !important;

        gap: 15px !important;
    }

    body.gestion-page
    .gestion-card {
        min-height: 0 !important;

        padding: 22px !important;
    }

    body.gestion-page
    .gestion-card p {
        font-size: .94rem !important;
    }
}



/* ANIMAL RECORD MOBILE HEADER STACK 2026-08-23 */

@media (max-width: 600px) {

    .animal-record-page > .farm-dashboard__header {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 14px !important;
    }

    .animal-record-page
    > .farm-dashboard__header
    .farm-dashboard__brand {
        width: fit-content !important;
        max-width: 100% !important;
        align-self: flex-start !important;
        box-sizing: border-box !important;
    }

    .animal-record-page
    > .farm-dashboard__header
    .farm-dashboard__header-actions {
        display: grid !important;
        width: 100% !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .animal-record-page
    > .farm-dashboard__header
    .farm-dashboard__header-actions
    > .dashboard-header-button:first-child {
        grid-column: 1 / -1 !important;
    }

    .animal-record-page
    > .farm-dashboard__header
    .dashboard-header-button {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    .animal-record-page
    > .farm-dashboard__header
    .record-delete-form {
        width: 100% !important;
        margin: 0 !important;
    }

    .animal-record-page
    > .farm-dashboard__header
    .record-main-delete {
        width: 100% !important;
        justify-content: center !important;
    }
}



/* BILLING SETTINGS REAL PHOTO BACKGROUND 2026-08-23 */

.billing-settings-page {
    position: relative !important;
    min-height: 100vh !important;
    isolation: isolate !important;
    background: transparent !important;
}

.billing-settings-page::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    width: 100vw;
    height: 100vh;
    background-image:
        linear-gradient(
            100deg,
            rgba(236, 247, 242, 0.72) 0%,
            rgba(246, 250, 248, 0.56) 45%,
            rgba(255, 247, 239, 0.68) 100%
        ),
        url("../images/gestion/hero-gestion-facturation-SCaJ52v.webp");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    pointer-events: none;
}

.billing-settings-page::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(
            180deg,
            rgba(248, 251, 249, 0.10),
            rgba(250, 246, 240, 0.34)
        );
    pointer-events: none;
}

.billing-settings-page > .farm-dashboard__header,
.billing-settings-flashes,
.billing-settings-layout {
    position: relative;
    z-index: 1;
}

.billing-settings-page > .farm-dashboard__header {
    width: min(1120px, calc(100% - 40px)) !important;
    max-width: 1120px !important;
    margin: 0 auto !important;
    padding: 18px 0 10px !important;
    box-sizing: border-box !important;
    align-items: flex-start !important;
}

.billing-settings-page .farm-dashboard__brand {
    padding: 9px 16px 9px 9px !important;
    border: 1px solid rgba(255, 255, 255, 0.88) !important;
    border-radius: 22px !important;
    background: rgba(255, 252, 245, 0.92) !important;
    box-shadow: 0 12px 30px rgba(31, 67, 51, 0.10) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}

.billing-settings-page .farm-dashboard__brand .brand__text strong {
    color: #123d32 !important;
}

.billing-settings-page .farm-dashboard__brand .brand__text small {
    color: #527469 !important;
    font-weight: 650 !important;
}

.billing-settings-page .dashboard-header-button {
    background: rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

.billing-settings-intro h1,
.billing-settings-intro > p {
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.75);
}

.billing-identity-card,
.billing-settings-tip,
.billing-settings-card,
.billing-settings-flash {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

@media (max-width: 900px) {
    .billing-settings-page::before {
        background-position: center center;
    }
}

@media (max-width: 620px) {
    .billing-settings-page::before,
    .billing-settings-page::after {
        position: absolute;
        height: 100%;
    }

    .billing-settings-page > .farm-dashboard__header {
        padding-top: 16px !important;
    }
}



/* BILLING SETTINGS LEFT COLUMN READABILITY ALIGN 2026-08-23 */

.billing-settings-page .billing-settings-layout {
    align-items: start !important;
}

.billing-settings-page .billing-settings-intro {
    box-sizing: border-box !important;
    padding: 30px !important;
    border: 1px solid rgba(255, 255, 255, 0.84) !important;
    border-radius: 26px !important;
    background: rgba(255, 253, 249, 0.86) !important;
    box-shadow: 0 20px 48px rgba(31, 72, 52, 0.12) !important;
    backdrop-filter: blur(9px) !important;
    -webkit-backdrop-filter: blur(9px) !important;
}

.billing-settings-page .billing-settings-intro h1 {
    margin-top: 18px !important;
    color: #123f31 !important;
    font-size: clamp(2rem, 3vw, 2.65rem) !important;
    line-height: 1.12 !important;
    font-weight: 900 !important;
    text-shadow: none !important;
}

.billing-settings-page .billing-settings-intro > p {
    max-width: 470px !important;
    color: #355c4d !important;
    font-size: 0.98rem !important;
    line-height: 1.65 !important;
    font-weight: 600 !important;
    text-shadow: none !important;
}

.billing-settings-page .billing-identity-card,
.billing-settings-page .billing-settings-tip {
    background: rgba(255, 255, 255, 0.94) !important;
    box-shadow: 0 12px 30px rgba(31, 72, 52, 0.09) !important;
}

.billing-settings-page .billing-identity-card small {
    color: #5b756a !important;
    font-size: 0.68rem !important;
}

.billing-settings-page .billing-identity-card strong {
    color: #14563f !important;
    font-size: 1.05rem !important;
}

.billing-settings-page .billing-identity-card span {
    color: #506b60 !important;
    font-size: 0.78rem !important;
}

.billing-settings-page .billing-settings-tip p {
    color: #506b60 !important;
    font-size: 0.78rem !important;
}

@media (max-width: 900px) {
    .billing-settings-page .billing-settings-intro {
        padding: 25px 22px !important;
    }
}



/* BILLING SETTINGS FORM TYPOGRAPHY 2026-08-23 */

.billing-settings-page .billing-settings-layout {
    align-items: start !important;
}

.billing-settings-page .billing-settings-intro,
.billing-settings-page .billing-settings-card {
    align-self: start !important;
}

.billing-settings-page .billing-settings-card__heading > span {
    font-size: 0.76rem !important;
    letter-spacing: 0.04em;
}

.billing-settings-page .billing-settings-card__heading h2 {
    margin: 7px 0 8px !important;
    color: #153f33 !important;
    font-size: 1.65rem !important;
    line-height: 1.2 !important;
    font-weight: 900 !important;
}

.billing-settings-page .billing-settings-card__heading p {
    color: #5e756b !important;
    font-size: 0.9rem !important;
    line-height: 1.55 !important;
}

.billing-settings-page .billing-settings-section {
    margin-top: 32px !important;
}

.billing-settings-page .billing-settings-section__title {
    grid-template-columns: 40px minmax(0, 1fr) !important;
    gap: 12px !important;
    margin-bottom: 17px !important;
}

.billing-settings-page .billing-settings-section__title > span {
    width: 38px !important;
    height: 38px !important;
    font-size: 0.76rem !important;
}

.billing-settings-page .billing-settings-section__title strong {
    font-size: 0.98rem !important;
    line-height: 1.3 !important;
}

.billing-settings-page .billing-settings-section__title small {
    margin-top: 2px !important;
    color: #667d73 !important;
    font-size: 0.78rem !important;
    line-height: 1.4 !important;
}

.billing-settings-page .billing-settings-grid {
    gap: 17px !important;
}

.billing-settings-page .billing-settings-field label {
    margin-bottom: 7px !important;
    color: #244f40 !important;
    font-size: 0.84rem !important;
    line-height: 1.35 !important;
    font-weight: 850 !important;
}

.billing-settings-page .billing-settings-field input,
.billing-settings-page .billing-settings-field select,
.billing-settings-page .billing-readonly-value {
    min-height: 50px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    color: #254a3d !important;
    font-size: 0.9rem !important;
    line-height: 1.4 !important;
}

.billing-settings-page .billing-readonly-value {
    color: #526b61 !important;
}

.billing-settings-page .billing-unit-field span {
    right: 14px !important;
    color: #526b61 !important;
    font-size: 0.78rem !important;
}

.billing-settings-page .billing-settings-field small,
.billing-settings-page .billing-settings-field > p {
    color: #62786f !important;
    font-size: 0.76rem !important;
    line-height: 1.5 !important;
}

@media (max-width: 620px) {
    .billing-settings-page .billing-settings-field label {
        font-size: 0.86rem !important;
    }

    .billing-settings-page .billing-settings-field input,
    .billing-settings-page .billing-settings-field select,
    .billing-settings-page .billing-readonly-value {
        font-size: 0.92rem !important;
    }
}



/* STOCK FORMS STACKING REAL ALIGN 2026-08-23 */

/*
 * La photo et son voile sont au niveau 0/1.
 * Le vrai contenu des formulaires Stock doit rester au-dessus.
 */
.stock-form-page-visual
> .stock-page {
    position: relative !important;
    z-index: 2 !important;

    min-height: 100vh !important;

    background: transparent !important;
}


/* DESKTOP : header et contenu sur les memes verticales */
@media (min-width: 981px) {

    .stock-form-page-visual
    > .stock-page
    > .farm-dashboard__header {
        width: min(calc(100% - 56px), 1380px) !important;
        max-width: 1380px !important;

        margin: 18px auto 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }

    .stock-form-page-visual
    > .stock-page
    > .stock-form-layout {
        width: min(calc(100% - 56px), 1380px) !important;
        max-width: 1380px !important;

        margin: 24px auto 28px !important;

        box-sizing: border-box !important;
    }
}


/* MOBILE : meme logique, avec 12 px de marge */
@media (max-width: 980px) {

    .stock-form-page-visual
    > .stock-page
    > .farm-dashboard__header {
        width: calc(100% - 24px) !important;
        max-width: none !important;

        margin: 10px 12px 0 !important;
        padding: 0 !important;
    }

    .stock-form-page-visual
    > .stock-page
    > .stock-form-layout {
        width: calc(100% - 24px) !important;
        max-width: none !important;

        margin-left: 12px !important;
        margin-right: 12px !important;
    }
}



/* STOCK FORMS FINAL RIGHT PANEL VISUAL 2026-08-23 */

/* Carte droite plus chaude et plus nette, sans toucher aux controles */
.stock-form-page-visual
> .stock-page
.parcel-form-card {
    background:
        linear-gradient(
            145deg,
            rgba(255, 253, 247, 0.98) 0%,
            rgba(248, 244, 234, 0.97) 100%
        ) !important;

    border:
        1px solid rgba(45, 94, 70, 0.22) !important;

    box-shadow:
        0 24px 58px rgba(22, 59, 41, 0.18) !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}


/* En-tete plus present */
.stock-form-page-visual
> .stock-page
.parcel-form-card__heading > span {
    color: #176247 !important;
    font-weight: 900 !important;
}

.stock-form-page-visual
> .stock-page
.parcel-form-card__heading h2 {
    color: #123f30 !important;
    font-size: 1.72rem !important;
    line-height: 1.18 !important;
    font-weight: 900 !important;
}

.stock-form-page-visual
> .stock-page
.parcel-form-card__heading p {
    color: #496256 !important;
    font-size: 0.90rem !important;
    line-height: 1.5 !important;
    font-weight: 600 !important;
}


/* Labels et champs : contours plus francs */
.stock-form-page-visual
> .stock-page
.parcel-form-card label,
.stock-form-page-visual
> .stock-page
.stock-movement-type legend {
    color: #193f30 !important;
    font-weight: 800 !important;
}

.stock-form-page-visual
> .stock-page
.parcel-form-card input:not([type="radio"]),
.stock-form-page-visual
> .stock-page
.parcel-form-card select,
.stock-form-page-visual
> .stock-page
.parcel-form-card textarea {
    border-color:
        rgba(41, 96, 71, 0.24) !important;

    background:
        rgba(255, 255, 252, 0.96) !important;
}


/* Alignement vertical desktop des deux zones principales */
@media (min-width: 981px) {
    .stock-form-page-visual
    > .stock-page
    > .stock-form-layout {
        align-items: start !important;
    }

    .stock-form-page-visual
    > .stock-page
    .parcel-form-card {
        align-self: start !important;
    }
}


/* LEGAL1 PUBLIC PAGES + FOOTER 2026-08-24 */

.site-footer__meta {
    display: grid;
    justify-items: end;
    gap: 7px;
    text-align: right;
}

.site-footer__meta > strong {
    color: var(--green-800);
    font-size: 14px;
    font-weight: 800;
}

.site-footer__links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px 16px;
}

.site-footer__links a {
    color: var(--green-800);
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}

.site-footer__links a:hover {
    text-decoration: underline;
}

.legal-body {
    margin: 0;
    background: #f3f7f3;
    color: #1c3028;
}

.legal-page {
    min-height: 100vh;
    background:
        radial-gradient(
            circle at 8% 4%,
            rgba(40, 185, 130, 0.13),
            transparent 26%
        ),
        radial-gradient(
            circle at 92% 14%,
            rgba(216, 180, 91, 0.14),
            transparent 25%
        ),
        linear-gradient(
            180deg,
            #f8fbf7 0%,
            #eef5f0 100%
        );
}

.legal-header {
    padding: 20px 0;
    border-bottom: 1px solid rgba(23, 106, 88, 0.12);
    background: rgba(255, 255, 255, 0.86);
    backdrop-filter: blur(15px);
}

.legal-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.legal-brand {
    text-decoration: none;
}

.legal-main {
    padding-top: 64px;
    padding-bottom: 80px;
}

.legal-hero {
    max-width: 850px;
    margin-bottom: 30px;
}

.legal-hero h1 {
    margin: 13px 0 16px;
    color: #173d32;
    font-size: clamp(2.4rem, 5vw, 4.3rem);
    line-height: 0.98;
    letter-spacing: -0.045em;
}

.legal-hero p {
    max-width: 780px;
    margin: 0;
    color: #52675f;
    font-size: 1.08rem;
    line-height: 1.75;
}

.legal-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 28px;
}

.legal-nav a {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 9px 15px;
    border: 1px solid rgba(23, 106, 88, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.76);
    color: #176a58;
    font-size: 0.86rem;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 8px 25px rgba(33, 76, 61, 0.05);
}

.legal-nav a:hover {
    background: #ffffff;
    border-color: rgba(23, 106, 88, 0.35);
}

.legal-card {
    max-width: 980px;
    padding: clamp(30px, 5vw, 62px);
    border: 1px solid rgba(23, 106, 88, 0.13);
    border-radius: 32px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow:
        0 28px 80px rgba(29, 65, 53, 0.10),
        0 3px 10px rgba(29, 65, 53, 0.04);
}

.legal-section {
    position: relative;
    padding: 0 0 34px 52px;
    margin-bottom: 34px;
    border-bottom: 1px solid #e4ece7;
}

.legal-section:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0;
}

.legal-section__number {
    position: absolute;
    top: 2px;
    left: 0;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 12px;
    background: #e6f5ed;
    color: #176a58;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.06em;
}

.legal-section h2 {
    margin: 0 0 16px;
    color: #183c32;
    font-size: clamp(1.35rem, 2vw, 1.75rem);
    line-height: 1.2;
}

.legal-section p,
.legal-section li {
    color: #4a6058;
    font-size: 1rem;
    line-height: 1.8;
}

.legal-section p {
    margin: 0 0 14px;
}

.legal-section p:last-child {
    margin-bottom: 0;
}

.legal-section ul {
    padding-left: 22px;
    margin: 14px 0 18px;
}

.legal-section li + li {
    margin-top: 8px;
}

.legal-section a {
    color: #176a58;
    font-weight: 750;
}

.legal-highlight {
    padding: 18px 20px;
    border: 1px solid rgba(23, 106, 88, 0.14);
    border-radius: 18px;
    background: #f3faf6;
}

.legal-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.legal-info-grid p {
    padding: 18px 20px;
    margin: 0;
    border: 1px solid #e4ece7;
    border-radius: 18px;
    background: #fbfdfb;
}

.legal-price {
    display: inline-flex;
    padding: 14px 20px;
    border-radius: 16px;
    background: #e7f7f0;
}

.legal-price strong {
    font-size: 1.3rem;
}

.legal-footer {
    padding: 28px 0 36px;
    border-top: 1px solid rgba(23, 106, 88, 0.12);
    background: rgba(247, 251, 248, 0.92);
}

.legal-footer__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.legal-footer p {
    margin: 0;
    color: #5c6e67;
    font-size: 0.86rem;
}

.legal-footer nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px 16px;
}

.legal-footer a {
    color: #176a58;
    font-size: 0.82rem;
    font-weight: 750;
    text-decoration: none;
}

.legal-footer a:hover {
    text-decoration: underline;
}

@media (max-width: 760px) {
    .site-footer__meta {
        justify-items: start;
        text-align: left;
    }

    .site-footer__links {
        justify-content: flex-start;
    }

    .legal-header__inner {
        align-items: flex-start;
    }

    .legal-back {
        padding-inline: 12px;
        font-size: 0.78rem;
    }

    .legal-main {
        padding-top: 42px;
        padding-bottom: 55px;
    }

    .legal-card {
        padding: 28px 20px;
        border-radius: 24px;
    }

    .legal-section {
        padding-left: 0;
        padding-top: 48px;
    }

    .legal-section__number {
        top: 0;
    }

    .legal-info-grid {
        grid-template-columns: 1fr;
    }

    .legal-footer__inner {
        flex-direction: column;
        align-items: flex-start;
    }

    .legal-footer nav {
        justify-content: flex-start;
    }
}


.legal-section p.legal-price {
    color: #176a58;
}


/* LEGAL1 FINAL READABILITY 2026-08-24 */

.legal-brand .brand__icon {
    width: 48px;
    height: 48px;
    border-radius: 15px;
}

.legal-brand .brand__icon svg {
    width: 30px;
    height: 30px;
}

.legal-brand .brand__text strong {
    font-size: 17px;
}

.legal-brand .brand__text small {
    font-size: 11px;
}

.legal-nav a {
    min-height: 44px;
    padding: 10px 17px;
    font-size: 0.92rem;
}

.legal-section p,
.legal-section li {
    font-size: 1.06rem;
    line-height: 1.84;
}

.legal-section h2 {
    font-size: clamp(1.45rem, 2vw, 1.85rem);
}

.legal-section__number {
    width: 38px;
    height: 38px;
    font-size: 0.76rem;
}

.legal-highlight,
.legal-info-grid p {
    font-size: 1.03rem;
}

@media (max-width: 760px) {
    .legal-brand .brand__icon {
        width: 45px;
        height: 45px;
    }

    .legal-brand .brand__text strong {
        font-size: 16px;
    }

    .legal-nav {
        gap: 8px;
    }

    .legal-nav a {
        min-height: 42px;
        padding: 9px 14px;
        font-size: 0.86rem;
    }

    .legal-section p,
    .legal-section li {
        font-size: 1rem;
        line-height: 1.78;
    }
}


/* LEGAL1 SUBSCRIPTION TERMS 2026-08-24 */

.subscription-legal-acceptance {
    margin-bottom: 18px;
    padding: 16px 18px;
    border: 1px solid rgba(23, 106, 88, 0.22);
    border-radius: 16px;
    background: rgba(238, 249, 245, 0.92);
}

.subscription-legal-acceptance__label {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    font-weight: 700;
    color: #173e35;
    cursor: pointer;
}

.subscription-legal-acceptance__label input {
    width: 19px;
    height: 19px;
    margin-top: 2px;
    flex: 0 0 auto;
    accent-color: #176a58;
}

.subscription-legal-acceptance p {
    margin: 9px 0 0 30px;
    line-height: 1.55;
    color: #52665f;
}

.subscription-legal-acceptance a {
    color: #176a58;
    font-weight: 750;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.subscription-legal-acceptance--accepted {
    border-color: rgba(40, 185, 130, 0.32);
    background: rgba(232, 248, 240, 0.95);
}

.subscription-legal-acceptance--accepted strong {
    color: #176a58;
}

@media (max-width: 760px) {
    .subscription-legal-acceptance {
        padding: 14px;
    }

    .subscription-legal-acceptance p {
        margin-left: 0;
    }
}


/* LEGAL1 SUBSCRIPTION MANAGEMENT 2026-08-24 */

.subscription-management {
    display: block;
    width: 100%;
}

.subscription-cancellation-panel {
    width: 100%;
    padding: 18px 20px;
    border: 1px solid rgba(153, 101, 42, 0.22);
    border-radius: 17px;
    background: rgba(255, 249, 239, 0.96);
    color: #43372b;
}

.subscription-cancellation-panel > strong {
    display: block;
    margin-top: 8px;
    font-size: 1.02rem;
    color: #463424;
}

.subscription-cancellation-panel p {
    margin: 8px 0 0;
    line-height: 1.62;
    color: #665748;
}

.subscription-cancellation-panel__badge {
    display: inline-flex;
    align-items: center;
    min-height: 29px;
    padding: 5px 10px;
    border-radius: 999px;
    background: #fff0d8;
    color: #855821;
    font-size: 0.78rem;
    font-weight: 850;
}

.subscription-cancellation-panel__notice {
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.72);
    font-size: 0.9rem;
}

.subscription-cancellation-panel form {
    width: 100%;
    margin-top: 15px;
}

.subscription-cancellation-button {
    display: inline-flex;
    width: 100%;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 11px 18px;
    border: 1px solid rgba(151, 74, 48, 0.28);
    border-radius: 13px;
    background: #fff;
    color: #994f38;
    font: inherit;
    font-weight: 850;
    cursor: pointer;
    transition:
        border-color .16s ease,
        background .16s ease,
        transform .16s ease;
}

.subscription-cancellation-button:hover {
    transform: translateY(-1px);
    border-color: rgba(151, 74, 48, 0.48);
    background: #fff7f3;
}

.subscription-cancellation-panel--scheduled {
    border-color: rgba(40, 185, 130, 0.30);
    background: rgba(233, 249, 241, 0.96);
}

.subscription-cancellation-panel--scheduled
.subscription-cancellation-panel__badge {
    background: #daf4e8;
    color: #176a58;
}

.subscription-cancellation-panel--scheduled > strong {
    color: #176a58;
}

.subscription-cancellation-panel--readonly {
    border-color: rgba(76, 103, 95, 0.16);
    background: rgba(246, 249, 248, 0.96);
}

.subscription-cancellation-panel--readonly
.subscription-cancellation-panel__badge {
    background: #eaf0ee;
    color: #50675f;
}

@media (max-width: 760px) {
    .subscription-cancellation-panel {
        padding: 16px;
    }

    .subscription-cancellation-button {
        min-height: 50px;
        padding-inline: 14px;
    }
}