@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,500&family=Poppins:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,500&display=swap');

:root {
  --font-scale:1; font-style:normal; font-optical-sizing:auto;
  --font-family:"Fira Sans",system-ui,sans-serif;  --font-title-family:"Poppins","Fira Sans",system-ui,sans-serif;

  /* ===============----->>>   palette colors   <<<-----=============== */
    --body-bg-rgb:244, 244, 233;   --body-bg:#f4f4e9;      --body-bg-80:#f6f6ed;     --body-bg-48:#fafaf4;     --body-bg-32:#fbfbf8;     --body-bg-20:#fdfdfb;
    --on-body:#646656;      --on-body-80:#818273;       --on-body-48:#afb0a3;  --on-body-38:#c4c5bf;     --on-body-22:#d4d5c9;   --on-body-16:#ddddd1;
    --on-container:#3e3e3d; --on-container-80:#656564;  --on-container-48:#a3a3a2;   --on-container-38:#b6b6b5;    --on-container-22:#d5d5d4;    --on-container-16:#e0e0e0;    
    --on-container-12:#e8e8e8;  --on-container-8:#f0f0f0;   --on-container-4:#f7f7f7;
    --container-bg:white;   --container-bg-48:#f9f9f4;  
        
    --yellow:#f2da5f;       --yellow-38:#faf1c2;   --yellow-24:#fcf6d9;    --yellow-22:#fcf7dc;    --yellow-16:#fdf9e5;
    --green:#7cb496;        --green-38:#cde2d7;    --green-24:#e0ede6;     --green-22:#e2efe8;     --green-16:#eaf3ee;
    --red:#d8635b;          --red-38:#f0c4c1;      --red-24:#f6dad8;       --red-22:#f6dddb;       --red-16:#f9e6e5;       --red-12:#faeceb;     --red-08:#fcf3f2;
    --blue:#4ba6bf;         --blue-38:#4ba6bf;     --blue-24:#d4eaf0;      --blue-22:#d7ebf1;      --blue-16:#e2f1f5;
    
    --error:var(--red);       --on-color:#ffffff;
    --btn-bg:var(--blue);     --on-btn:var(--on-color);     --btn-fab-bg:var(--yellow);      --on-btn-fab:var(--on-color);  
  /* -------------------------------------------------------------------------- */
}


/*.tetris-db { display:none!important; }*/

#search-shortcut.tetris-db { padding-block:12px 4px; padding-inline:24px; display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:center; column-gap:12px; }
#search-shortcut.tetris-db > div { height:48px; padding-inline:24px; display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:center; column-gap:8px; border-radius:24px; font:var(--titleM); letter-spacing:var(--titleM-spacing); line-height:48px; }

header:has(.tetris-db) { height:84px!important; }
header:has(.tetris-db) search[role=menuitem][aria-expanded=true] { width:440px; }
body:has([role=complementary][aria-expanded=true]) header:has(.tetris-db) search[role=menuitem][aria-expanded=true] { width:48px; contain:content; }
#availabilities.tetris-db { display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:center; column-gap:12px; }
#availabilities.tetris-db > .user-input { width:148px; height:44px; background-color:rgba(255,255,255,.36); }
#availabilities.tetris-db > .user-input > label { background-color:var(--body-bg); }
#availabilities.tetris-db > .user-input > input[type=date] { text-align:center; }
#availabilities.tetris-db > .user-input > input:invalid:not(:placeholder-shown) { color:inherit!important; }

#item-condition.tetris-db { flex:.5; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; column-gap:12px; row-gap:0; }
#item-condition.tetris-db > label { height:30px; font:var(--titleS); }

[role=complementary] > [data-type='product-card'] div[role=group].reservation-infos.tetris-db { display:none; margin-block:auto 36px; flex-flow:column nowrap; justify-content:flex-start; align-items: flex-start; row-gap:4px; }
[role=complementary] > [data-type='product-card'] div[role=group].reservation-infos.tetris-db > h5 { margin-inline:30px auto; }

[role=complementary] > [data-type='product-card'] > header > [data-key=stock] { z-index:2; height:52px; text-align:right; font:var(--displayS); letter-spacing:var(--displayS-spacing); align-items:center; gap:0; }
[role=complementary] > [data-type='product-card'] > header > [data-key=stock]::after { min-width:26px; }
[role=complementary] > [data-type='product-card'] > header > [data-key=stock] > svg { margin-block:auto 8px; }
[role=complementary] > [data-type='product-card'] > header > [data-key=stock][data-value]:not([data-value=''])::after { content:attr(data-value); padding-inline:6px; }
[role=complementary] > [data-type='product-card'] [data-key=qtt_booked][data-value=''] { display:none; }

[role=complementary] > [data-type='product-card'] [data-key=qtt_booked][data-value]::after { content:attr(data-value) " assignées sur "; }
[role=complementary] > [data-type='product-card'] [data-key=qtt_booked][data-value='1']::after { content:attr(data-value) " assignée sur "; }

[role=complementary] > [data-type='product-card'] [data-key=booking_num][data-value=''] { display:none; }
[role=complementary] > [data-type='product-card'] [data-key=booking_num][data-value]::after { content:attr(data-value) " réservations"; }
[role=complementary] > [data-type='product-card'] [data-key=booking_num][data-value='1']::after { content:attr(data-value) " réservation"; }

[role=complementary] > [data-type='product-card'] [data-key=available_qtt] { z-index:2; height:48px; text-align:right; font:var(--headlineL); letter-spacing:var(--headlineL-spacing); align-items:center; gap:0; }
[role=complementary] > [data-type='product-card'] [data-key=available_qtt]::after { content:attr(data-value)!important; }


[role=complementary] > [data-type='product-card']:has([data-key=qtt_booked][data-value]:not([data-value=''])) > header > [data-key=stock]::after { text-decoration:line-through; }
[role=complementary] > [data-type='product-card']:has([data-key=qtt_booked][data-value]:not([data-value=''])) > header > [data-key=available_qtt] { display:none; }

[data-key="reservation_maxDate"][data-value]::after { content:attr(data-value)!important; }
