/* WordPress / WooCommerce glue for the « Précis » design system.
   Uses approved tokens only; no new colours, radii or type sizes. */
body { margin: 0; background: var(--gi-surface, #FFFFFF); }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block: 0; }
.gi-l-main { padding-block-end: var(--gi-sp-12); }
.gi-l-notices { display: grid; gap: var(--gi-sp-2); margin-block: var(--gi-sp-3); }

/* Local prototype bar (WP_ENVIRONMENT_TYPE = local only) */
.gi-l-devbar { background: var(--gi-c-steel); color: var(--gi-c-white); font: 600 12px/1.6 var(--gi-font-latin); text-align: center; padding: 2px var(--gi-sp-3); }

/* Top-bar popovers: country + currency, language (native <details>) */
.gi-l-pop { position: relative; }
.gi-l-pop > summary { list-style: none; cursor: pointer; }
.gi-l-pop > summary::-webkit-details-marker { display: none; }
.gi-l-pop__panel { position: absolute; inset-inline-end: 0; top: 100%; z-index: 50; min-width: 260px; display: grid; gap: var(--gi-sp-3); color: var(--gi-text); background: var(--gi-surface); }
.gi-l-langs { list-style: none; margin: 0; padding: var(--gi-sp-2); gap: 0; min-width: 160px; }
.gi-l-langs a { display: flex; align-items: center; min-height: var(--gi-target-min); padding-inline: var(--gi-sp-2); color: var(--gi-text); }
.gi-l-langs a[aria-current="true"] { font-weight: var(--gi-fw-bold); }

/* Mobile / tablet (≤ 1024 px, DR-2): the menu bar is replaced by the ☰ drawer (component gi-drawer in a <dialog>) */
@container gi (max-width: 1024px) {
  .gi-nav { display: none; }
}
.gi-l-drawer { padding: 0; border: 0; margin: 0; inset-inline-start: 0; inset-inline-end: auto; height: 100%; max-height: 100%; width: min(360px, 100%); max-width: 100%; background: var(--gi-surface); overflow: auto; }
.gi-l-drawer .gi-drawer { border: 0; border-radius: 0; max-width: none; min-height: 100%; }
.gi-l-drawer::backdrop { background: var(--gi-ix-overlay); }
.gi-langbar[hidden] { display: none; }

/* ------------------------------------------------------------------
   WooCommerce classic cart / checkout / account — Phase 7.
   Markup comes from the theme overrides (woocommerce/*) using the approved components
   (gi-cartline, gi-summary, gi-steps, gi-rcard, gi-fgrid, gi-field…). Approved tokens only.
   ------------------------------------------------------------------ */
.woocommerce-notices-wrapper:empty { display: none; }
.gi-l-cartlines { display: grid; }
.gi-l-rcards { display: grid; gap: var(--gi-sp-2); }
.gi-l-linkbtn { border-color: transparent; text-decoration: underline; min-height: var(--gi-target-min); gap: var(--gi-sp-1); }
.gi-l-checkout .gi-summary, .gi-l-cart .gi-summary { max-width: none; }

/* WooCommerce form-row → gi-field (label above, full-width control, hint, error) */
.woocommerce form .form-row { display: grid; gap: var(--gi-sp-1); margin: 0; padding: 0; width: auto; float: none; }
.woocommerce form .form-row .woocommerce-input-wrapper { display: block; }
.woocommerce form .form-row .gi-input, .woocommerce form .form-row .gi-select, .woocommerce form .form-row .gi-textarea { width: 100%; box-sizing: border-box; }
.woocommerce form .form-row .description { font-size: var(--gi-fs-caption); color: var(--gi-text-muted); margin: 0; }
.woocommerce form .form-row.woocommerce-invalid .gi-input, .woocommerce form .form-row.woocommerce-invalid .gi-select { border-color: var(--gi-state-error); }
.woocommerce form .form-row.gi-l-invoicebox label { display: flex; gap: var(--gi-sp-2); align-items: center; min-height: var(--gi-target-min); }
.gi-l-fieldset > .form-row + .form-row, .gi-l-fieldset > .gi-fgrid + .form-row { margin-block-start: var(--gi-sp-3); }
/* Company + ICE only when « Facture au nom d'une société » is ticked (no script needed) */
.gi-l-form:has(#gi_invoice_company:not(:checked)) [data-gi-company] { display: none; }
#order_comments { min-height: calc(var(--gi-target-min) * 2); }

/* WooCommerce errors → error summary (gi-errsum) */
.woocommerce-NoticeGroup, .woocommerce-notices-wrapper { display: grid; gap: var(--gi-sp-2); margin-block-end: var(--gi-sp-3); }
.woocommerce-error { list-style: none; margin: 0; border: var(--gi-bw-strong) solid var(--gi-state-error); border-inline-start-width: var(--gi-bw-accent); border-radius: var(--gi-radius); padding: var(--gi-sp-3) var(--gi-sp-4); display: grid; gap: var(--gi-sp-1); }
.woocommerce-error li { color: var(--gi-text); }
.woocommerce-message, .woocommerce-info { border: var(--gi-bw-hair) solid var(--gi-line-strong); border-radius: var(--gi-radius); padding: var(--gi-sp-3) var(--gi-sp-4); background: var(--gi-surface-info); }

/* Account (mockup compte.html): tables, forms, order details */
.woocommerce table.shop_table, .woocommerce-orders-table, .woocommerce-table { width: 100%; border-collapse: collapse; font-size: var(--gi-fs-table); }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { border-block-end: var(--gi-bw-hair) solid var(--gi-line); padding: var(--gi-sp-2); text-align: start; }
.woocommerce .button, .woocommerce button.button, .woocommerce a.button { display: inline-flex; align-items: center; justify-content: center; min-height: var(--gi-target-min); padding: 0 var(--gi-sp-4); border: 0; border-radius: var(--gi-radius); background: var(--gi-c-black); color: var(--gi-c-white); font: inherit; font-weight: var(--gi-fw-semibold); cursor: pointer; text-decoration: none; }
.woocommerce .button:hover, .woocommerce button.button:hover { background: var(--gi-ix-black-hover); }
.gi-l-account .woocommerce-MyAccount-content { display: grid; gap: var(--gi-sp-4); min-width: 0; }
.gi-l-account address { font-style: normal; font-size: var(--gi-fs-small); }
/* Other WooCommerce account forms (account details, lost password…): fields styled like gi-input */
.woocommerce form .input-text:not(.gi-input), .woocommerce form select:not(.gi-select) { width: 100%; box-sizing: border-box; min-height: var(--gi-target-min); padding: 0 var(--gi-sp-3); border: var(--gi-bw-hair) solid var(--gi-field-border); border-radius: var(--gi-radius); background: var(--gi-field-bg); color: var(--gi-text); font: inherit; }
.woocommerce form fieldset { border: var(--gi-bw-hair) solid var(--gi-line); border-radius: var(--gi-radius); padding: var(--gi-sp-4); margin: 0; display: grid; gap: var(--gi-sp-3); }
.woocommerce form fieldset legend { font-weight: var(--gi-fw-bold); padding-inline: var(--gi-sp-2); }

@container gi (max-width: 760px) {
  .gi-cartline { grid-template-columns: 56px minmax(0, 1fr); }
  .gi-cartline .gi-qty, .gi-cartline .gi-cartline__total { grid-column: 2; justify-self: start; text-align: start; }
  .woocommerce table.shop_table_responsive thead { display: none; }
  .woocommerce table.shop_table_responsive tr { display: grid; border-block-end: var(--gi-bw-hair) solid var(--gi-line); padding-block: var(--gi-sp-2); }
  .woocommerce table.shop_table_responsive td { display: flex; justify-content: space-between; gap: var(--gi-sp-3); border: 0; padding: var(--gi-sp-1) 0; text-align: end; }
  .woocommerce table.shop_table_responsive td::before { content: attr(data-title); font-weight: var(--gi-fw-semibold); text-align: start; }
}
.gi-l-drawer-ship { display: grid; gap: var(--gi-sp-2); padding-block: var(--gi-sp-2); }

/* WooCommerce « show password » button (added by woocommerce.js, translated aria-label): line eye icon
   in the Phase 4 icon style (24 px grid, 1.8 stroke, black #111111), inside the field at the end side. */
.woocommerce .password-input { position: relative; display: block; }
.woocommerce .password-input input { padding-inline-end: var(--gi-target-min); }
.show-password-input { position: absolute; inset-inline-end: 0; top: 0; width: var(--gi-target-min); height: var(--gi-target-min); border: 0; background: transparent no-repeat center / 20px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111111' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
.show-password-input.display-password { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111111' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M4 4l16 16'/%3E%3C/svg%3E"); }
.show-password-input:focus-visible { outline: var(--gi-focus-width) solid var(--gi-focus-color); outline-offset: calc(-1 * var(--gi-focus-width)); }