/* Échec de l'agrandissement. Renvoi du contenu non agrandi. (2,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (6,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (515,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (516,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (517,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (518,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (519,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (520,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (521,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (522,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (523,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (524,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (525,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (526,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (527,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (532,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (560,28): run-time error CSS1039: Token not allowed after unary operator: '-color-border' (619,36): run-time error CSS1039: Token not allowed after unary operator: '-header-extra-offset' (620,29): run-time error CSS1039: Token not allowed after unary operator: '-header-extra-offset' (679,41): run-time error CSS1039: Token not allowed after unary operator: '-color-border' (774,40): run-time error CSS1039: Token not allowed after unary operator: '-color-border' (911,28): run-time error CSS1039: Token not allowed after unary operator: '-header-height' (911,51): run-time error CSS1039: Token not allowed after unary operator: '-header-extra-offset' (915,32): run-time error CSS1039: Token not allowed after unary operator: '-header-extra-offset' (919,40): run-time error CSS1039: Token not allowed after unary operator: '-header-height' (919,63): run-time error CSS1039: Token not allowed after unary operator: '-header-extra-offset' (920,41): run-time error CSS1039: Token not allowed after unary operator: '-header-height' (920,64): run-time error CSS1039: Token not allowed after unary operator: '-header-extra-offset' (924,35): run-time error CSS1039: Token not allowed after unary operator: '-header-height' (925,36): run-time error CSS1039: Token not allowed after unary operator: '-header-height' (942,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (959,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (991,22): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-4' (999,21): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1014,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1018,21): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1022,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1034,22): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-4' (1035,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1043,21): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1060,22): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1061,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (1069,22): run-time error CSS1039: Token not allowed after unary operator: '-color-light-2' (1070,17): run-time error CSS1039: Token not allowed after unary operator: '-color-light-1' (1071,28): run-time error CSS1039: Token not allowed after unary operator: '-color-border' (1101,28): run-time error CSS1039: Token not allowed after unary operator: '-color-info-1' (1151,17): run-time error CSS1039: Token not allowed after unary operator: '-main-secondary-color' (1155,17): run-time error CSS1039: Token not allowed after unary operator: '-main-secondary-color' (1176,28): run-time error CSS1039: Token not allowed after unary operator: '-color-border' (1199,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1303,28): run-time error CSS1039: Token not allowed after unary operator: '-main-secondary-color' (1384,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1419,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1425,62): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1433,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1443,32): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-2' (1444,84): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1466,32): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1476,25): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1480,24): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1481,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1486,24): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (1487,28): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (1492,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1501,17): run-time error CSS1039: Token not allowed after unary operator: '-main-secondary-color' (1577,17): run-time error CSS1039: Token not allowed after unary operator: '-color-light-1' (1635,22): run-time error CSS1039: Token not allowed after unary operator: '-main-secondary-color' (1642,22): run-time error CSS1039: Token not allowed after unary operator: '-main-secondary-color' (1649,22): run-time error CSS1039: Token not allowed after unary operator: '-main-primary-color' (1677,17): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (1684,17): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (1691,17): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (1692,34): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (1703,24): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (1704,28): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (1804,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primary' (1810,27): run-time error CSS1039: Token not allowed after unary operator: '-font-primary' (1816,17): run-time error CSS1039: Token not allowed after unary operator: '-color-light-1' (1890,39): run-time error CSS1039: Token not allowed after unary operator: '-color-border' (1897,21): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (1926,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (1944,17): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (1952,17): run-time error CSS1039: Token not allowed after unary operator: '-color-light-1' (2141,32): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (2163,17): run-time error CSS1039: Token not allowed after unary operator: '-color-light-1' (2178,28): run-time error CSS1039: Token not allowed after unary operator: '-main-primary-color' (2361,22): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (2366,22): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (2371,22): run-time error CSS1039: Token not allowed after unary operator: '-color-light-2' (2376,22): run-time error CSS1039: Token not allowed after unary operator: '-color-green-2' (2391,22): run-time error CSS1039: Token not allowed after unary operator: '-color-red-1' (2438,17): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (2447,21): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (2468,22): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (2523,22): run-time error CSS1039: Token not allowed after unary operator: '-color-red-1' (2609,31): run-time error CSS1039: Token not allowed after unary operator: '-header-height' (2609,54): run-time error CSS1039: Token not allowed after unary operator: '-header-extra-offset' (2610,32): run-time error CSS1039: Token not allowed after unary operator: '-header-height' (2610,55): run-time error CSS1039: Token not allowed after unary operator: '-header-extra-offset' (2670,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (2678,26): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (2725,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (2734,26): run-time error CSS1039: Token not allowed after unary operator: '-color-light-2' (2780,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (2789,26): run-time error CSS1039: Token not allowed after unary operator: '-color-light-2' (2916,29): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (3115,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (3137,22): run-time error CSS1039: Token not allowed after unary operator: '-color-light-2' (3138,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (3170,21): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (3207,22): run-time error CSS1039: Token not allowed after unary operator: '-color-light-2' (3351,26): run-time error CSS1039: Token not allowed after unary operator: '-color-light-2' (3352,21): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (3820,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3821,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3824,35): run-time error CSS1039: Token not allowed after unary operator: '-header-height' (3824,58): run-time error CSS1039: Token not allowed after unary operator: '-header-extra-offset' (3824,87): run-time error CSS1039: Token not allowed after unary operator: '-br-chat-page-footer-height' (3824,123): run-time error CSS1039: Token not allowed after unary operator: '-br-chat-page-footer-gap' (3826,29): run-time error CSS1039: Token not allowed after unary operator: '-br-chat-page-footer-gap' (4534,22): run-time error CSS1039: Token not allowed after unary operator: '-color-green-1' (4691,21): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (4693,35): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (4818,28): run-time error CSS1039: Token not allowed after unary operator: '-color-border' (4916,17): run-time error CSS1039: Token not allowed after unary operator: '-main-text' (4926,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primary' (5047,23): run-time error CSS1039: Token not allowed after unary operator: '-font-primary' (5176,21): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (5184,32): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (5488,28): run-time error CSS1039: Token not allowed after unary operator: '-color-border' (5489,33): run-time error CSS1039: Token not allowed after unary operator: '-color-border' (5493,29): run-time error CSS1039: Token not allowed after unary operator: '-color-red-1' (5497,29): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (5614,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (5811,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (5818,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (5825,17): run-time error CSS1039: Token not allowed after unary operator: '-color-light-1' (6006,26): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (6017,32): run-time error CSS1039: Token not allowed after unary operator: '-header-extra-offset' (6123,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (6175,21): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (6189,26): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (6240,21): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (6246,26): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (6268,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (6364,21): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (6432,17): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' (6470,17): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (6477,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (6551,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (6606,21): run-time error CSS1039: Token not allowed after unary operator: '-color-dark-1' (6767,22): run-time error CSS1039: Token not allowed after unary operator: '-color-light-3' (6772,22): run-time error CSS1039: Token not allowed after unary operator: '-color-light-3' (6904,22): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (6923,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (6927,35): run-time error CSS1039: Token not allowed after unary operator: '-header-height' (7000,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7005,24): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7086,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7108,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7119,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7213,31): run-time error CSS1039: Token not allowed after unary operator: '-header-height' (7555,22): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7702,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7718,26): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7726,24): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7728,38): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7792,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7814,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7834,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7839,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (7900,31): run-time error CSS1039: Token not allowed after unary operator: '-header-height' (8079,17): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (8084,24): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (8114,24): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (8119,24): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (8147,21): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (8171,28): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (8175,32): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (8200,22): run-time error CSS1039: Token not allowed after unary operator: '-color-yellow-1' (8448,26): run-time error CSS1039: Token not allowed after unary operator: '-color-blue-1' */ :root { --main-secondary-color: #1E1C43; --main-primary-color: #cc4145; --main-smalltext: #898e97; --main-text: #424242; --bg-layout: #F8F8F8; } .p0 { padding: 0 !important; } .p5 { padding: 5px !important; } .p10 { padding: 10px !important; } .height-auto { height: auto !important; } .font-italic { font-style: italic !important; } .align-center { text-align: center !important; } .float-right{ float:right; } .align-left { text-align: left !important; } .align-right { text-align: right !important; } .display-inline { display: inline !important; } .display-none { display: none !important; } .display-block { display: block !important; } .position-inherit { position: inherit !important; } .visibility-hidden { visibility: hidden !important; } .pl10 { padding-left: 10px !important; } .pl25 { padding-left: 25px !important; } .pr10 { padding-right: 10px !important; } .cursor-move { cursor: move !important; } .cursor-pointer { cursor: pointer !important; } .cursor-default { cursor: default !important; } .pr0 { padding-right: 0 !important; } .pl0 { padding-left: 0 !important; } .clear { clear: both !important; } .mr5 { margin-right: 5px; } .ml5 { margin-left: 5px; } .mr15 { margin-right: 15px; } .ml20 { margin-left: 20px; } .ml50 { margin-left: 50px; } .mr0 { margin-right: 0 !important } .mb0 { margin-bottom: 0 !important } .mb8 { margin-bottom: 8px !important } .mb16 { margin-bottom: 16px !important } .mb24 { margin-bottom: 24px !important } .mb30 { margin-bottom: 30px !important } .mb32 { margin-bottom: 32px !important } .mb40 { margin-bottom: 40px !important } .mb48 { margin-bottom: 48px !important } .mb5 { margin-bottom: 5px !important } .mb56 { margin-bottom: 56px !important } .mb64 { margin-bottom: 64px !important } .mb72 { margin-bottom: 72px !important } .mb80 { margin-bottom: 80px !important } .mb88 { margin-bottom: 88px !important } .mb96 { margin-bottom: 96px !important } .mb104 { margin-bottom: 104px !important } .mb112 { margin-bottom: 112px !important } .mb120 { margin-bottom: 120px !important } .mb160 { margin-bottom: 160px !important } .mt0 { margin-top: 0 !important } .mt8 { margin-top: 8px !important } .mt16 { margin-top: 16px !important } .mt22 { margin-top: 22px !important } .mt24 { margin-top: 24px !important } .mt32 { margin-top: 32px !important } .mt40 { margin-top: 40px !important } .mt48 { margin-top: 48px !important } .mt56 { margin-top: 56px !important } .mt64 { margin-top: 64px !important } .mt72 { margin-top: 72px !important } .mt80 { margin-top: 80px !important } .mt88 { margin-top: 88px !important } .mt96 { margin-top: 96px !important } .mt104 { margin-top: 104px !important } .mt112 { margin-top: 112px !important } .mt120 { margin-top: 120px !important } .mt160 { margin-top: 160px !important } .mt260 { margin-top: 260px !important } .p32 { padding: 0 32px !important } .p24 { padding: 24px !important } .p0 { padding: 0 !important } .pt0 { padding-top: 0 !important } .pt8 { padding-top: 8px !important } .pt15 { padding-top: 15px !important } .pt16 { padding-top: 16px !important } .pt24 { padding-top: 24px !important } .pt32 { padding-top: 32px !important } .pt40 { padding-top: 40px !important } .pt48 { padding-top: 48px !important } .pt64 { padding-top: 64px !important } .pt72 { padding-top: 72px !important } .pt80 { padding-top: 80px !important } .pt88 { padding-top: 88px !important } .pt96 { padding-top: 96px !important } .pt104 { padding-top: 104px !important } .pt112 { padding-top: 112px !important } .pt120 { padding-top: 120px !important } .pt160 { padding-top: 160px !important } .pt180 { padding-top: 180px !important } .pt240 { padding-top: 240px !important } .pb0 { padding-bottom: 0 !important } .pb8 { padding-bottom: 8px !important } .pb15 { padding-bottom: 15px !important } .pb16 { padding-bottom: 16px !important } .pb24 { padding-bottom: 24px !important } .pb32 { padding-bottom: 32px !important } .pb40 { padding-bottom: 40px !important } .pb48 { padding-bottom: 48px !important } .pb56 { padding-bottom: 56px !important } .pb64 { padding-bottom: 64px !important } .pb72 { padding-bottom: 72px !important } .pb80 { padding-bottom: 80px !important } .pb88 { padding-bottom: 88px !important } .pb96 { padding-bottom: 96px !important } .pb104 { padding-bottom: 104px !important } .pb112 { padding-bottom: 112px !important } .pb120 { padding-bottom: 120px !important } .pb160 { padding-bottom: 160px !important } .pb180 { padding-bottom: 180px !important } .pb240 { padding-bottom: 240px !important } .mr20 { margin-right: 20px !important; } .pl0 { padding-left: 0 !important; } .pl15 { padding-left: 15px !important; } .pr15 { padding-right: 15px !important; } .pr0 { padding-right: 0 !important; } .fs-13 { font-size: 13px !important; } .fs-15 { font-size: 15px !important; } .full-width { width: 100% !important; } .font-bold { font-weight: bold !important; } .w-100 { width: 100% !important; } @media (min-width: 576px) { .w-sm-auto { width: auto !important; } } @media (min-width: 768px) { .w-md-auto { width: auto !important; } } @media (min-width: 992px) { .w-lg-auto { width: auto !important; } } @media (min-width: 1200px) { .w-xl-auto { width: auto !important; } } .w-100p { width: 100px; max-width: 100%; } :root { --main-primary-color: #10293F; --main-secondary-color: #D89E30; --main-smalltext: #898e97; --main-text: #424242; --bg-layout: #F8F8F8; --error: #cc4145; --color-blue-1: #10293F !important; --color-blue-2: #466173 !important; --color-info-1: #C5D0D8 !important; --color-dark-1: #10293F !important; --color-yellow-1: #D89E30; --header-height: 80px; --header-extra-offset: 20px; } @media (max-width: 767.98px) { body.layout-edit-house { --header-height: 50px; } body.layout-edit-house .header.-dashboard { height: 50px; } body.layout-edit-house .header.-dashboard .header__container { min-height: 50px; height: 50px; } body.layout-edit-house .header .header-logo img, body.layout-edit-house .header .-left-side img { max-height: 34px; width: auto; } } #axeptio_overlay { z-index: 100 !important; } /* SEARCH BAR */ /* ========================= Mobile trigger (toggle) ========================= */ .br-mobile-search-toggle { border: 1px solid var(--color-border); text-align: left; } #MobileSearchToggle { height: 57px; } #MobileSearchToggle, #MobileSearchContent .SearchBarContainer, #LayoutMobileSearchContent .SearchBarContainer { transition: border-radius .15s ease, box-shadow .15s ease; } .br-mobile-search-chevron { transition: transform .15s ease; } .search-small-mode.is-open .br-mobile-search-chevron { transform: rotate(180deg); } .search-small-mode.is-open #MobileSearchToggle { border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; box-shadow: 0 -4px 10px rgba(0,0,0,.06); } .search-small-mode.is-open #MobileSearchContent .SearchBarContainer .mainSearch, .search-small-mode.is-open #LayoutMobileSearchContent .SearchBarContainer .mainSearch { border-top-left-radius: 0 !important; border-top-right-radius: 0 !important; box-shadow: 0 6px 12px rgba(0,0,0,.08); } @media (min-width: 992px) { #MobileSearchToggle { display: none !important; } } /* ========================= Containers (layout) ========================= */ .search-small-mode { display: none; } .search-large-mode { display: block; } .text-search { display: none; } @media (max-width: 1499px) { .search-small-mode { display: block !important; margin-top: calc(-1 * var(--header-extra-offset)); margin-bottom: var(--header-extra-offset); } .search-large-mode { display: none !important; } } .search-home-reduced-target { display: none !important; } @media (min-width: 1500px) { .search-home-reduced-target.search-large-mode { display: block !important; min-width: 0; opacity: 0; padding-left: 0 !important; padding-right: 0 !important; pointer-events: none; width: 0; } body.search-home-reduced .search-home-reduced-target.search-large-mode { min-width: 900px; opacity: 1; pointer-events: auto; width: 900px; } } .SearchBarContainer { transition: opacity .18s ease; } .SearchBarContainer.is-home-search-switching { opacity: 0; pointer-events: none; } /* ========================= MainSearch grid ========================= */ .mainSearch { position: relative; z-index: 20; } .mainSearch .button-item { border: none !important; } .mainSearch .button-grid { display: grid; align-items: center; } /* Séparateurs entre colonnes */ .mainSearch .button-grid > * + * { border-left: 1px solid var(--color-border); } #SearchBar.search-unified--home .search-unified__desktop-type-select + .searchMenu-loc, #SearchBar.search-unified--desktop-expanded .search-unified__desktop-type-select + .searchMenu-loc { border-left: 0 !important; } /* Largeur globale */ .mainSearch.-w-900 { width: 900px; } /* Logement : lieu / dates / voyageurs / bouton */ #SearchBar[data-search-type="logement"] .mainSearch .button-grid { grid-template-columns: minmax(0, 1fr) 250px 290px auto; } #SearchBar.search-unified--inner[data-search-type="logement"] .mainSearch .button-grid { grid-template-columns: 52px minmax(0, 1fr) 250px 290px auto; } #SearchBar.search-unified--inner.search-unified--desktop-expanded[data-search-type="logement"] .mainSearch .button-grid { grid-template-columns: minmax(0, 1fr) 250px 290px auto; } /* Formation : lieu / dates / profession / bouton */ #SearchBar[data-search-type="formation"] .mainSearch .button-grid { grid-template-columns: minmax(0, 1fr) 250px 290px auto; } #SearchBar.search-unified--inner[data-search-type="formation"] .mainSearch .button-grid { grid-template-columns: 52px minmax(0, 1fr) 250px 290px auto; } #SearchBar.search-unified--inner.search-unified--desktop-expanded[data-search-type="formation"] .mainSearch .button-grid { grid-template-columns: minmax(0, 1fr) 250px 290px auto; } /* Opportunité : lieu / dates / profession / type / bouton */ #SearchBar[data-search-type="opportunite"] .mainSearch .button-grid { grid-template-columns: minmax(0, 1fr) 180px 220px 180px auto; } #SearchBar.search-unified--inner[data-search-type="opportunite"] .mainSearch .button-grid { grid-template-columns: 52px minmax(0, 1fr) 180px 220px 180px auto; } #SearchBar.search-unified--inner.search-unified--desktop-expanded[data-search-type="opportunite"] .mainSearch .button-grid { grid-template-columns: minmax(0, 1fr) 180px 220px 180px auto; } @media (max-width: 1499px) { .mainSearch.-w-900 { max-width: 900px; width: 100%; } } @media (max-width: 1199px) { #SearchBar[data-search-type="logement"] .mainSearch .button-grid, #SearchBar[data-search-type="formation"] .mainSearch .button-grid { grid-template-columns: minmax(0, 1fr) 220px 240px auto; } #SearchBar.search-unified--inner[data-search-type="logement"] .mainSearch .button-grid, #SearchBar.search-unified--inner[data-search-type="formation"] .mainSearch .button-grid { grid-template-columns: 52px minmax(0, 1fr) 220px 240px auto; } #SearchBar.search-unified--inner.search-unified--desktop-expanded[data-search-type="logement"] .mainSearch .button-grid, #SearchBar.search-unified--inner.search-unified--desktop-expanded[data-search-type="formation"] .mainSearch .button-grid { grid-template-columns: minmax(0, 1fr) 220px 240px auto; } #SearchBar[data-search-type="opportunite"] .mainSearch .button-grid { grid-template-columns: minmax(0, 1fr) 160px 190px 160px auto; } #SearchBar.search-unified--inner[data-search-type="opportunite"] .mainSearch .button-grid { grid-template-columns: 52px minmax(0, 1fr) 160px 190px 160px auto; } #SearchBar.search-unified--inner.search-unified--desktop-expanded[data-search-type="opportunite"] .mainSearch .button-grid { grid-template-columns: minmax(0, 1fr) 160px 190px 160px auto; } } @media (max-width: 991px) { .mainSearch .button-grid { grid-template-columns: 1fr !important; } .mainSearch .button-grid > * + * { border-left: 0; border-top: 1px solid var(--color-border); } .mainSearch__submit { border-radius: 4px !important; } #MobileSearchContent, #LayoutMobileSearchContent { display: block !important; } #MobileSearchContent .mainSearch, #LayoutMobileSearchContent .mainSearch { display: none; } } /* ========================= Autocomplete / fields (mobile) ========================= */ @media (max-width: 991px) { .searchMenu-location .ui-autocomplete { width: 100% !important; top: 0 !important; } .searchMenu-location { width: auto !important; left: 0 !important; right: 0 !important; } .searchMenu-guests__field { width: 100% !important; left: 0 !important; right: 0 !important; } .searchMenu-date__field { left: 0 !important; right: 0 !important; } } @media (max-width: 575px) { .searchMenu-location .ui-autocomplete { width: 100% !important; top: 0 !important; } } /* ========================= Dropdown panels (loc/date/guests) ========================= */ .searchMenu-loc, .searchMenu-date, .searchMenu-guests { position: relative; } .searchMenu-loc__field, .searchMenu-date__field, .searchMenu-guests__field { position: absolute; top: 100%; left: 0; z-index: 5; max-width: 100vw; margin-top: 30px; transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); pointer-events: none; opacity: 0; } .searchMenu-loc__field { z-index: 20; } .searchMenu-loc__field { width: 500px; } .searchMenu-date__field { width: 900px; box-shadow: 0 10px 60px 0 #0510360D; transform: translateX(-31%); } .searchMenu-guests__field { width: 400px; box-shadow: 0 10px 60px 0 #0510360D; } .searchMenu-loc__field.-is-active, .searchMenu-date__field.-is-active, .searchMenu-guests__field.-is-active { pointer-events: auto; opacity: 1; } .searchMenu-date.-left .searchMenu-date__field { transform: none !important; } .searchMenu-date.-right .searchMenu-date__field { left: unset; right: 0; transform: none !important; } @media (max-width: 991px) { .searchMenu-loc__field, .searchMenu-date__field, .searchMenu-guests__field { width: auto; left: -20px; right: -20px; transform: none; } } @media (max-width: 575px) { .searchMenu-loc__field, .searchMenu-date__field, .searchMenu-guests__field { left: -35px; right: -35px; } } .searchMenu-loc .-link:hover { background-color: rgba(53, 84, 209, 0.05) !important; } /* END SEARCH BAR */ .page-content { padding-top: calc(var(--header-height) + var(--header-extra-offset)); } .top-section-background-color { margin-top: calc(-1 * var(--header-extra-offset)); } .full-height { min-height: calc(100vh - calc(var(--header-height) + var(--header-extra-offset))); min-height: calc(100svh - calc(var(--header-height) + var(--header-extra-offset))); } .top-section-background-color.full-height { min-height: calc(100vh - var(--header-height)); min-height: calc(100svh - var(--header-height)); } button.section-slider-nav:disabled, button.section-slider-nav[disabled] { background-color: #fff !important; color: #666666 !important; border-color: #fff !important; } button.section-slider-nav:hover:disabled { background-color: #fff !important; color: #666666 !important; border-color: #fff !important; } .icon-menu-2:hover { color: var(--color-yellow-1); } .citiesCard.-type-3 .citiesCard__image img { padding: 20px; } .cardFormation > img { -o-object-fit: contain !important; object-fit: contain !important; } .section-bg__item.-video-left { width: 50vw !important; } .icon-close:hover { color: var(--color-yellow-1); } .waiting-div { height: 100%; display: flex; align-items: center; justify-content: center; max-height: calc(100vh - 200px); width: 100% !important; min-height: calc(40vh - 200px); } /* DASHBOARD */ .brd-dashboard-empty { background: #f8fafc; border: 1px dashed #dbe4ee; color: #5f6f82; } /* Grille stats Logements / Opportunités */ .brd-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(70px, 1fr)); gap: 8px; } /* Icône de titre de section */ .brd-section-icon { width: 36px; height: 36px; border-radius: 8px; background: var(--color-yellow-4); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .brd-section-icon i { color: var(--color-yellow-1); font-size: 15px; } /* Watch cards */ .brd-watch-card { min-height: 100px; } .brd-watch-card__icon { width: 42px; height: 42px; } .brd-watch-card__icon-border { border: 2px solid var(--color-yellow-1); } .brd-watch-card__icon-border i { color: var(--color-yellow-1); } .brd-watch-card__count { color: var(--color-yellow-1); } /* À venir — icône contextuel */ .brd-upcoming-item__date { min-width: 58px; } .brd-upcoming-icon { width: 28px; height: 28px; border-radius: 6px; background: var(--color-yellow-4); border: 1px solid var(--color-yellow-1); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .brd-upcoming-icon i { color: var(--color-yellow-1); font-size: 12px; } /* Discussions */ .brd-discussion-item__date { white-space: nowrap; } .brd-discussion-item__badge { background: #e7f1ff; color: #1d4ed8; } /* Abonnement */ .brd-plan-badge { display: inline-block; background: var(--color-yellow-1); color: var(--color-dark-1); font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 12px; } .brd-plan-badge--visitor { background: var(--color-light-2); color: var(--color-light-1); border: 1px solid var(--color-border); } .brd-benefit-label { color: #059669; font-weight: 600; font-size: 14px; } .brd-badge-pill { display: inline-block; padding: 3px 8px; font-size: 13px; border-radius: 20px; background: #f5f5f5; color: #555; font-weight: 500; } /* Pour Chrome et Safari */ ::-webkit-scrollbar { width: 7px; /* Largeur de la scrollbar */ } ::-webkit-scrollbar-track { background: white; } ::-webkit-scrollbar-thumb { border-radius: 4px; background-color: var(--color-info-1); -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5); } .transition { transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1); } .fs100 { font-size: 100px !important; } .w-30px { width: 30px !important; } .size-15 { flex-shrink: 0; width: 15px; height: 15px; } .mt-46 { margin-top: 46px; } .h-30px { height: 30px !important; } .h-300px { height: 300px !important; } .h-100pct { height: 100% !important; } .text-11 { font-size: 11px !important; } .rounded-25 { border-radius: 25px; } a:hover { color: var(--main-secondary-color) !important; } .tabs.-underline .tabs__controls .tabs__button:hover { color: var(--main-secondary-color) !important; } .text-justify { text-align: justify !important; } .justify-content-between { justify-content: space-between !important; } .replacement-day { color: maroon !important; } .display-flex-center { display: flex; align-items: center; } .select2-selection { border: 1px solid var(--color-border); border-radius: 4px; padding: 0 15px; padding-top: 30px; min-height: 70px; transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); } .subText { color: #717171; font-size: 0.75rem; line-height: 1rem; } .ml2 { margin-left: 2px; } .form-input textarea:focus ~ label, .form-input textarea:valid ~ label, .form-input input:focus ~ label, .form-input input:valid ~ label, .form-input input:disabled ~ label { transform: translateY(-10px); } .slider-scrollbar .swiper-scrollbar-drag { background-color: var(--color-yellow-1); } .list-disc-none { list-style-type: none !important; } .cardProfil { position: absolute; bottom: 10px; right: 10px; border: 2px solid white; border-radius: 40px; } .cardImage__wishlist { position: absolute; top: 10px; right: 10px; } .sidebar.-dashboard .sidebar__button { height: 35px !important; } .searchMenu-date__field { position: absolute; margin-top: 5px !important; top: 100%; left: 0; z-index: 5; width: 100%; max-width: 100vw; box-shadow: 0px 10px 60px 0px #0510360D; transform: none !important; transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); pointer-events: none; border: none !important; } .searchMenu-guests__field { width: 395px; margin-top: 10px !important; } .searchMenu-guests__field { position: absolute; margin-top: 5px !important; top: 100%; right: 0; left: inherit; z-index: 5; width: 394px; max-width: 100vw; box-shadow: 0px 10px 60px 0px #0510360D; transform: none !important; transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); pointer-events: none; border: none !important; } .searchMenu-location { position: absolute; margin-top: 10px; top: 100%; left: -5px; z-index: 20; width: 505px; max-width: 100vw; } .searchMenu-location .ui-autocomplete { width: 100% !important; left: 0 !important; top: 0 !important; } /* Overlay derrière les dropdowns de recherche */ .br-search-overlay { display: none; position: fixed; inset: 0; background: rgba(0, 0, 0, 0.35); z-index: 4; transition: opacity 0.2s ease; opacity: 0; } .br-search-overlay.is-visible { display: block; opacity: 1; } /********** Header **************/ .masthead.-type-1 .masthead__bg::after { background: #10293F; opacity: 1; } .header .header-logo img { width: 235px; } .tabs.-underline .tabs__controls .tabs__button::after { background-color: var(--main-secondary-color); } .small-header { height: auto; } .first-section { margin-top: 160px; } .masthead__scroll { position: absolute; bottom: 30px; right: 50px; } .masthead__scroll .-icon { position: relative; } .masthead__scroll .-icon > *:nth-child(1) { width: 28px; height: 40px; border: 1px solid white; border-radius: 200px; } .masthead__scroll .-icon > *:nth-child(2) { position: absolute; top: 8px; left: 10px; width: 8px; height: 8px; border: 1px solid white; border-radius: 100%; transition: all 0.5s ease; } .masthead__scroll:hover .-icon > *:nth-child(2) { transform: translateY(16px); } /******* Formulaire *********/ .form-input textarea.input-validation-error:focus, .form-input input.input-validation-error:focus { border: 2px solid #C13515 !important; } input.input-validation-error { border: 1px solid #C13515 !important; background-color: #FFF8F6 !important; } input.input-validation-error + label { color: #C13515 !important; } .error-text span::before { font-family: 'FontAwesome'; content: "\f06a"; display: inline-block; padding-right: 5px; font-weight: 900; } .error-text { display: flex; align-items: center; color: #C13515; font-size: 0.75rem; line-height: 1rem; -webkit-letter-spacing: normal; -moz-letter-spacing: normal; -ms-letter-spacing: normal; letter-spacing: normal; font-weight: 400; margin-top: 3px; } /******** Icon *********/ .accordion.-simple .accordion__item.is-active .accordion__icon { background-color: var(--color-yellow-1) !important; color: white !important; } .mh50vh { min-height: 50vh !important; } /******* Contact *********/ .contact-content { background-image: url(/Content/images/Destinations/Provence.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; } .list-lh30 li { line-height: 30px !important; } .lspo li { list-style-position: outside; } .little-input { padding-top: 0 !important; padding-bottom: 0 !important; min-height: 40px !important; width: auto !important; } .manage-house.selected-house .activityCard__title span, .manage-chat-request.selected-house .activityCard__title span { color: var(--color-yellow-1) !important; background-size: 100% !important; } .manage-house.selected-house .activityCard__title span, .manage-chat-request.selected-house .activityCard__title span { background-image: linear-gradient(transparent 24px, var(--color-yellow-1) 20px); background-size: 0; background-repeat: no-repeat; transition: background-size 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s; } .dropzone { min-height: 200px !important; border: 2px solid var(--color-yellow-1) !important; padding: 20px 20px !important; border-radius: 4px !important; color: #FFF !important; background: url("/Content/images/upload.png") center center no-repeat #F5F5F5 !important; background-size: 150px !important; transition: background 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s; } .dropzone:hover { border: 2px solid var(--color-blue-2) !important; background: url("/Content/images/upload.png") center center no-repeat var(--color-yellow-1) !important; background-size: 200px !important; } .dz-default.dz-message { display: none !important; } .flex-direction-column { flex-direction: column !important; } .col-bed img, .col-room img { width: 50px; } .equipments-list .equipment { width: 90%; padding: 10px; } .equipments-list .equipment:hover, .equipments-list .selected-equipment { border: 1px solid var(--color-yellow-1); border-radius: 4px; cursor: pointer; } .equipments-list .selected-equipment img { filter: invert(92%) sepia(15%) saturate(7216%) hue-rotate(334deg) brightness(89%) contrast(89%); } .equipments-list .selected-equipment .equipment-item-text, .equipments-list .equipment:hover { color: var(--color-yellow-1) !important; } .button.btn-favorite-blue:hover { border-color: var(--color-yellow-1); background-color: var(--color-yellow-1) !important; color: white !important; } .button.btn-favorite-blue.liked:hover { border-color: var(--color-blue-1); background-color: var(--color-blue-1) !important; color: white !important; } .button.btn-favorite:hover i { color: var(--color-yellow-1); } .button.btn-favorite-blue:hover i { color: white; } .liked i, .liked i:focus { color: var(--main-secondary-color); } .liked { -webkit-animation: pulse 0.5s linear; -moz-animation: pulse 0.5s linear; -ms-animation: pulse 0.5s linear; animation: pulse 0.5s linear; } @keyframes pulse { 0% { -moz-transform: scale(1); transform: scale(1); } 50% { -moz-transform: scale(0.8); transform: scale(0.8); } 100% { -moz-transform: scale(1); transform: scale(1); } } .w-500px { width: 500px !important; } /* JQUERY DATERANGE */ .w-400 { width: 400px !important; } .calendar table.month td.day .day-content { padding-top: 10px !important; padding-bottom: 5px !important; padding-left: 12px !important; padding-right: 12px !important; } .calendar .months-container .month-container { margin-bottom: 15px; } .calendar .calendar-header { border: none !important; } .calendar .calendar-header table th { font-size: 16px !important; } .calendar .calendar-header table th:hover { background: none !important; } .calendar .calendar-header table th span { font-size: 20px !important; } /***************** TOOLTIP ***************/ /* Tooltip container */ .tooltip-custom { position: relative; display: inline-block; } /* Tooltip text */ .tooltiptext { visibility: hidden; width: 150px; background-color: #fff; color: var(--color-light-1); text-align: center; padding: 5px 5px; border-radius: 6px; /* Position the tooltip text */ position: absolute; z-index: 1; bottom: 100%; left: 50%; margin-left: -75px; /* Fade in tooltip */ opacity: 0; transition: opacity 0.3s; word-break: normal; word-spacing: normal; word-wrap: normal; white-space: normal; -webkit-box-shadow: 0 0 4px #b3b3b3; box-shadow: 0 0 4px #b3b3b3; } /* Show the tooltip text when you mouse over the tooltip container */ .tooltip-custom:hover .tooltiptext { visibility: visible; opacity: 1; } .showTooltip { visibility: visible; opacity: 1; } .overflow-visible { overflow: visible !important; } /* Show the tooltip text when you mouse over the tooltip container */ .tooltip-custom:hover .tooltiptext { visibility: visible; opacity: 1; } #Pictures .cardImage__leftBadge { bottom: 20px; top: auto !important; } .select-allowed-jobs .select2-selection__rendered { margin-top: 5px !important; } .select-allowed-jobs .select2-search__field { min-width: 150px !important; min-height: auto !important; padding-top: 0 !important; } .day-content-first { background: var(--main-secondary-color); cursor: pointer; color: #FFF; border-radius: 4px 0px 0px 4px; } .day-content-last { background: var(--main-secondary-color); cursor: pointer; color: #FFF; border-radius: 0px 4px 4px 0px; } .day-content-fake { background: var(--main-primary-color); cursor: pointer; color: #FFF; } /* TOASTR */ #toast-container > div { opacity: 1 !important; min-width: 320px; max-width: 480px; width: auto; box-shadow: none !important; border-radius: 6px !important; padding: 12px 30px 12px 60px; line-height: 1.4; } #toast-container .toast-message { white-space: normal; word-break: break-word; font-size: 14px; } button.toast-close-button { color: grey; } #toast-container > .toast-success { color: var(--color-blue-1); border-left: 12px solid #46D664; background: url('/Content/images/check.png') no-repeat 15px center #fff !important; background-origin: content-box; } #toast-container > .toast-error { color: var(--color-blue-1); border-left: 12px solid #FF345A; background: url('/Content/images/close.png') no-repeat 15px center #fff !important; background-origin: content-box; } #toast-container > .toast-info { color: var(--color-blue-1); border-left: 12px solid var(--color-yellow-1); background: url('/Content/images/information.png') no-repeat 15px center #fff !important; background-origin: content-box; } /* FIN TOASTR */ .opacity1 { opacity: 1 !important; } .selected-count { border-color: var(--color-blue-1) !important; background-color: var(--color-blue-1) !important; color: white !important; } /* CUSTOM PAGINATION */ .pagination { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; } /* .pagination > * { margin: 10px; }*/ .pagination li { display: flex; justify-content: center; align-items: center; } .houses-pagination, .hotels-pagination, .cities-pagination, .opportunities-pagination, .formations-pagination { /* si point commun plus tard */ } .houses-pagination .pagination, .hotels-pagination .pagination, .cities-pagination .pagination, .opportunities-pagination .pagination, .formations-pagination .pagination { margin: 0; } .houses-pagination .page-item, .hotels-pagination .page-item, .cities-pagination .page-item, .opportunities-pagination .page-item, .formations-pagination .page-item { margin: 12px; } /* Neutralise les styles Bootstrap/theme sur les liens de pagination uniquement pour les paginations Baroad */ .houses-pagination .page-link, .hotels-pagination .page-link, .cities-pagination .page-link, .opportunities-pagination .page-link, .formations-pagination .page-link { background: transparent; border: 0; padding: 0; margin: 0; box-shadow: none; line-height: normal; color: inherit; } .houses-pagination .page-link:focus, .hotels-pagination .page-link:focus, .cities-pagination .page-link:focus, .opportunities-pagination .page-link:focus, .formations-pagination .page-link:focus { box-shadow: none; outline: none; } .houses-pagination .page-link:hover, .hotels-pagination .page-link:hover, .cities-pagination .page-link:hover, .opportunities-pagination .page-link:hover, .formations-pagination .page-link:hover { background: transparent; border: 0; } /* Taille des boutons numériques (exclut first/prev/next/last) */ .houses-pagination li:not(.first):not(.prev):not(.next):not(.last), .hotels-pagination li:not(.first):not(.prev):not(.next):not(.last), .cities-pagination li:not(.first):not(.prev):not(.next):not(.last), .opportunities-pagination li:not(.first):not(.prev):not(.next):not(.last), .formations-pagination li:not(.first):not(.prev):not(.next):not(.last) { width: 40px; height: 40px; margin: 5px; } .ui-autocomplete { box-shadow: 0px 10px 35px 0px #0510361A; /*transform: translateX(-31%);*/ /* transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); */ z-index: 5; padding-top: 5px !important; padding-bottom: 5px !important; padding-left: 5px !important; padding-right: 5px !important; border-radius: 4px; font-family: var(--font-primary); /* margin-left: -10px; margin-top: 5px;*/ } .ui-autocomplete button { font-family: var(--font-primary) !important; } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover { border: none !important; background-color: rgba(53, 84, 209, 0.05) !important; color: var(--color-light-1); border-radius: 4px; } .ui-menu .ui-state-focus, .ui-menu .ui-state-active { margin: 0px; } .ui-widget-content { border: none !important; z-index: 1000 !important; } .content-popup { max-height: 100%; overflow-y: auto; } .langMenu { padding-top: 80px !important; } @media (max-width: 767px) { .langMenu { padding-top: 10px !important; } } /* REQUECT CHAT */ .chat-closed { opacity: 0.6; } .display-flex-column { flex-direction: column; display: flex; } #MobileSideBar #BookingSearchFilters { display: flex; justify-content: start; flex-wrap: wrap; align-items: flex-start; } #MobileSideBar #BookingSearchFilters .sidebar__item { padding-top: 0px; padding-right: 10px; padding-left: 10px; width: 100%; /*border: none !important;*/ } .br-mobile-filter-header { display: none; } @media (max-width: 991px) { .filterPopup .sidebar { padding-top: 66px; } .br-mobile-filter-header { position: fixed; top: 0; left: 0; right: 0; z-index: 2; min-height: 62px; padding: 12px 20px; display: flex; align-items: center; justify-content: space-between; background: #fff; border-bottom: 1px solid var(--color-border); } .br-mobile-filter-close, .br-mobile-filter-clear { border: none; background: transparent; color: var(--color-dark-1); cursor: pointer; } .br-mobile-filter-close { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; padding: 0; font-size: 18px; } .br-mobile-filter-clear { padding: 0; font-size: 14px; font-weight: 600; } .filterPopup .sidebar__item > .js-house-filters-clear, .filterPopup .sidebar__item > .js-formation-filters-clear, .filterPopup .sidebar__item > .js-opportunity-filters-clear { display: none !important; } } /* STAR CUSTOM */ .rating-container .empty-stars { color: var(--color-dark-1); } .rating-lg { font-size: 30px; } .rating-container .star { display: inline-block; margin: 0 4px; text-align: center; } .rating-container .filled-stars { position: absolute; left: 0; top: 0; margin: auto; color: var(--color-blue-1) !important; white-space: nowrap; overflow: hidden; -webkit-text-stroke: initial !important; text-shadow: none !important; } .rating-container .clear-rating { color: var(--color-light-1); cursor: not-allowed; display: inline-block; vertical-align: middle; font-size: 50%; padding-right: 5px; } .clear-rating-active:hover { color: #843534 !important; } #TableReceived_wrapper, #TableSent_wrapper { padding: 0px !important; } .overflow-hidden { overflow: hidden !important; } @media (max-width: 1430px) { section .masthead.-type-1 { padding-top: 100px !important; } } @media (max-width: 1199px) { .xl\:h-40 { height: 40px !important; } .xl\:overflow-hidden { height: 40px !important; } } @media (max-width: 991px) { .masthead__scroll { display: none; } .lg\:w-30px { width: 30px !important; } .lg\:h-100pct { height: 100% !important; } .lg\:h-40 { height: 40px !important; } } @media (max-width: 767px) { .md-hide { display: none !important; } .md-text-center { text-align: center; } .md-justify-center { justify-content: center !important; } .md-mt-0 { margin-top: 0px !important; } .md-flex-column-center { display: flex; flex-direction: column; align-items: center; } .md-column { flex-direction: column !important; } .md\:h-40 { height: 40px !important; } .first-section { margin-top: 160px; } .md\:text-search { display: block; } .container-map { min-height: 250px; } .md\:pt-0 { padding-top: 0px !important; } .langMenu__content { height: 100% !important; } .content-popup { max-height: 80% !important; } .dashboard__sidebar { width: 100% !important; } .rating-container-update > div { margin-top: 20px; } } .rating-container-update > label { font-size: 16px !important; padding-left: 0px; } @media (max-width: 575px) { .sm\:h-40 { height: 40px !important; } .sm\:pt-120 { padding-top: 120px !important; } .table-responsive { overflow-x: scroll; } } .rating-container.theme-krajee-fa { /*margin-left: 10px;*/ max-height: 50px; } .form-input label.rate-label { top: -7px !important; } .button-disabled { opacity: 0.7 !important; } @media (max-width: 767.98px) { .client-help-button { width: 42px !important; min-width: 42px !important; height: 42px !important; padding: 0 !important; border-radius: 50% !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; align-self: center; flex: 0 0 42px; font-size: 0 !important; line-height: 1 !important; box-shadow: 0 8px 18px rgba(16, 41, 63, 0.18); margin-right: 10px; } .client-help-button::before { content: "?"; font-size: 18px; font-weight: 600; line-height: 1; } .client-help-button > * { display: none !important; } .client-help-button--top { margin-top: 10px; } } .client-help-button--top { align-self: flex-start !important; } .bt-yellow { border-top: 1px solid var(--color-yellow-1) } .fw-wrap { flex-wrap: wrap !important; } .fd-rr { flex-direction: row-reverse; } .w-60p { width: 60px !important; } .disabled-days table.month td.day .day-content:hover { background: none !important; cursor: default !important; } .tabs.-underline-2 .tabs__controls .tabs__button.button-disabled:hover { color: var(--color-light-1) !important; } .incomplete-choice { color: red; font-weight: bold; } .swipper-wrapper-custom { display: flex; align-items: baseline; justify-content: center; } .count-unreaded-items { background-color: var(--main-primary-color); color: #FFF !important; padding: 5px 10px; border-radius: 20px; margin-left: 10px; } .t20px { top: 20px !important; } .r10px { right: 10px !important; } .cardImage__content > img.contain { -o-object-fit: contain !important; object-fit: contain !important; } /*.select2-container { z-index: 999 !important; }*/ .indicateur { width: 80%; height: 4px; border-radius: 6px; margin: 0 auto; position: relative; top: -5px; } .textbox-border { border: black !important; border-style: solid !important; border-width: 1px !important; } @media (max-width: 768px) { #RequestButtonRow a, #RequestButtonRow button { width: 100% !important; margin-right: 0px !important; margin-bottom: 7px !important; } } /* DASHBOARD */ .sidebar__section-title { padding: 8px 15px 4px 15px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: #7b7b7b; } .sidebar__item--child .sidebar__button { padding-left: 18px; } .sidebar__item--child .w-30px { width: 24px; } .sidebar__item--child { position: relative; } .sidebar__item--child::before { content: ""; position: absolute; left: 10px; top: 0; bottom: 0; width: 2px; border-radius: 2px; background-color: rgba(0, 0, 0, 0.04); } /* HOUSES PAGE */ .br-houses-empty { max-width: 900px; margin-left: auto; margin-right: auto; } /* HOUSE ROW DASHBOARD */ .br-house-row { margin-bottom: 14px; } .br-house-row__inner { display: flex; align-items: stretch; justify-content: space-between; gap: 14px; background: #fff; border-radius: 14px; padding: 12px; box-shadow: 0 6px 16px rgba(0,0,0,.05); } .br-house-row__content { display: flex; flex-direction: column; gap: 10px; flex: 1 1 auto; min-width: 0; } /* ------------------------------------------------------------ Main clickable zone ------------------------------------------------------------ */ .br-house-row__main { display: flex; gap: 14px; align-items: center; flex: 1 1 auto; min-width: 0; text-decoration: none !important; color: inherit !important; } /* ------------------------------------------------------------ Media ------------------------------------------------------------ */ .br-house-row__media { position: relative; width: 220px; height: 220px; flex: 0 0 220px; border-radius: 12px; overflow: hidden; background: #f5f5f5; } .br-house-row__media img { width: 100%; height: 100%; object-fit: cover; display: block; } .br-house-row__media-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: #F4F6F9; color: #b0bec5; font-size: 40px; } /* ------------------------------------------------------------ Badges / status ------------------------------------------------------------ */ .br-badge { display: inline-block; padding: 4px 10px; border-radius: 10px; font-size: 11px; font-weight: 600; letter-spacing: .02em; line-height: 1.2; text-transform: uppercase; } .br-house-row__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; } .br-house-row__status { display: flex; flex-wrap: wrap; gap: 8px; } .br-badge--published { background: var(--color-yellow-1); color: #fff; } .br-badge--unpublished { background: var(--color-dark-1); color: #fff; } .br-badge--draft { background: var(--color-light-2); color: #111; } .br-badge--completed { background: var(--color-green-2); color: #fff; } .br-badge--archived { background: #9e9e9e; color: #fff; } .br-badge--expired { background: #e57c2b; color: #fff; } .br-badge--nodispo { background: var(--color-red-1); color: #fff; } /* ------------------------------------------------------------ Info ------------------------------------------------------------ */ .br-house-row__info { min-width: 0; } .br-house-row__location { color: #7b8794; font-size: 13px; line-height: 1.2; margin-bottom: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .br-house-row__title { font-size: 18px; font-weight: 600; color: #0f2233; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color .2s ease; } .br-house-row__meta { font-size: 13px; color: #7b8794; margin-top: 6px; } .opportunity-row-opinion { border-top: 1px solid #edf0f3; margin-top: 10px; padding-top: 10px; } .opportunity-row-opinion__toggle { border: 0; background: transparent; color: var(--color-blue-1); font-size: 13px; font-weight: 500; padding: 0; margin-left: 6px; text-decoration: underline; } .opportunity-row-opinion__toggle:hover { color: var(--color-yellow-1); } /* Draft progress */ .br-house-row__progress-label { font-size: 13px; color: #7b8794; margin-bottom: 6px; } .br-progress { width: 100%; height: 8px; border-radius: 999px; background: rgba(0,0,0,.08); overflow: hidden; } .br-progress__bar { height: 100%; border-radius: 999px; background: var(--color-yellow-1); } .br-house-row__actions { display: flex; flex-direction: column; justify-content: space-between; align-items: stretch; gap: 10px; min-width: 0; } .br-house-row__actions-top { width: 100%; display: flex; justify-content: flex-end; align-items: center; } .br-house-row__actions-line { width: 100%; display: flex; justify-content: end; align-items: center; gap: 10px; flex-wrap: wrap; } .br-house-row__actions-bottom { width: 100%; display: flex; justify-content: flex-end; align-items: center; gap: 10px; } .br-house-row__lastupdate { text-align: right; } .br-house-row__actions-bottom-delete { display: none; } .br-btn-icon { width: 40px; height: 40px; padding: 0; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; } .br-btn-danger { background: var(--color-red-1); color: #fff; } /* ------------------------------------------------------------ Responsive ------------------------------------------------------------ */ @media (max-width: 767.98px) { .br-house-row__inner { flex-direction: column; align-items: stretch; } .br-house-row__main { flex-direction: column; align-items: stretch; } .br-house-row__media { width: 100%; height: auto; aspect-ratio: 16 / 9; flex: 0 0 auto; } .br-house-row__info { width: 100%; } .br-house-row__actions-top { display: none; } .br-house-row__actions-bottom-delete { display: flex; } .br-house-row__actions-line { justify-content: center; } .br-house-row__actions-bottom { justify-content: space-between; align-items: center; } .br-house-row__lastupdate { text-align: left; } .br-house-row__status { justify-content: flex-start; } } /* FRONTHOUSE CALENDAR */ .bo-day-disabled { cursor: not-allowed !important; pointer-events: none; position: relative; opacity: 0.6; } .bo-day-disabled:after { content: ""; position: absolute; left: 10%; right: 10%; top: 50%; height: 2px; background: currentColor; transform: translateY(-50%); border-radius: 2px; } .bo-day-disabled:hover, .bo-day-disabled:focus, .bo-day-disabled:active { background: transparent !important; box-shadow: none !important; } /* CLIENTHOUSE CALENDAR */ .br-cal { display: flex; flex-direction: column; height: calc(100vh - var(--header-height) - var(--header-extra-offset)); height: calc(100svh - var(--header-height) - var(--header-extra-offset)); min-height: 0; overflow: hidden; } .br-cal + .footer.-dashboard { display: none; } .br-cal__header { flex: 0 0 auto; z-index: 20; background: #fff; padding: 14px 16px; border-bottom: 1px solid rgba(0,0,0,.06); } .br-cal__header-left { padding-left: 56px; } .br-cal__header-titles { min-width: 0; } .br-cal__controls { flex: 0 0 auto; z-index: 19; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 10px; padding: 1px 16px 12px 16px; border-bottom: 1px solid rgba(0,0,0,.06); } .br-cal__controls-right { display: flex; align-items: center; justify-self: end; gap: 12px; min-width: 0; } .br-cal__view-switch { display: inline-flex; align-items: center; justify-self: start; padding: 3px; border: 1px solid rgba(0,0,0,.08); border-radius: 8px; background: #fff; } .br-cal__view-button { height: 34px; padding: 0 14px; border: 0; border-radius: 6px; background: transparent; color: var(--color-dark-1); font-size: 14px; font-weight: 500; line-height: 1; cursor: pointer; } .br-cal__view-button.is-active { background: var(--color-yellow-1); color: #fff; } .br-cal__month-picker { position: relative; display: inline-block; max-width: 100%; } .br-cal__current-month { min-width: 155px; max-width: 220px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: capitalize; } .br-cal__month-menu { position: absolute; top: calc(100% + 6px); right: 0; z-index: 40; display: none; width: 240px; max-height: 320px; padding: 6px; overflow-y: auto; background: #fff; border: 1px solid rgba(0,0,0,.08); border-radius: 8px; box-shadow: 0 10px 28px rgba(0,0,0,.12); } .br-cal__month-menu.is-open { display: block; } .br-cal__month-option { display: block; width: 100%; height: 36px; padding: 0 10px; border: 0; border-radius: 6px; background: transparent; color: var(--color-dark-1); font-size: 14px; line-height: 36px; text-align: left; cursor: pointer; } .br-cal__month-option:hover, .br-cal__month-option.is-active { background: var(--color-light-2); } .br-cal__month-option.is-active { font-weight: 600; } .br-cal__actions { position: relative; display: inline-flex; align-items: center; justify-self: center; flex: 0 0 auto; } .br-cal__actions-button { min-width: 96px; } .br-cal__actions-menu { position: absolute; top: calc(100% + 6px); left: 50%; z-index: 45; display: none; width: 230px; padding: 6px; background: #fff; border: 1px solid rgba(0,0,0,.08); border-radius: 8px; box-shadow: 0 10px 28px rgba(0,0,0,.12); transform: translateX(-50%); } .br-cal__actions-menu.is-open { display: block; } .br-cal__actions-option { display: block; width: 100%; height: 38px; padding: 0 10px; border: 0; border-radius: 6px; background: transparent; color: var(--color-dark-1); font-size: 14px; line-height: 38px; text-align: left; cursor: pointer; } .br-cal__actions-option:hover, .br-cal__actions-option:focus { background: var(--color-light-2); } .br-cal__body { flex: 1 1 auto; gap: 16px; padding: 16px; align-items: flex-start; min-height: 0; overflow: hidden; } .br-cal__grid { flex: 1 1 auto; width: 100%; min-width: 0; height: 100%; min-height: 0; display: flex; flex-direction: column; overflow: hidden; } .br-cal__scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding-right: 4px; } .br-cal__months { display: grid; gap: 16px; align-items: flex-start; } .br-cal.is-view-month .br-cal__months { grid-template-columns: minmax(0, 1fr); } .br-cal.is-view-year .br-cal__months { grid-template-columns: repeat(3, minmax(0, 1fr)); } .br-month { min-width: 0; background: #fff; box-shadow: 0 6px 16px rgba(0,0,0,.05); padding: 12px; } .br-cal.is-view-month .br-month { padding: 16px; } .br-month__dow { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-bottom: 6px; } .br-month__dow div { font-size: 11px; color: #7b8794; text-align: center; } .br-month__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; } .br-day { height: 80px; border-radius: 10px; border: 1px solid rgba(0,0,0,.06); padding: 6px; cursor: pointer; user-select: none; position: relative; background: #fff; display: flex; flex-direction: column; } .br-cal.is-view-month .br-day { height: 104px; } .br-cal.is-view-year .br-day { height: 74px; } .br-day.is-passed { opacity: .35; cursor: not-allowed; } .br-day.is-out { opacity: .35; } .br-day.is-booked { background: rgba(217, 48, 37, .35); cursor: not-allowed; } .br-day.is-unavailable { background: rgba(216, 158, 48, .25); } .br-day.is-unavailable:hover { background: rgba(216, 158, 48, .50); } .br-day.is-available { background: rgba(0, 128, 0, .10); } .br-day.is-available:hover { background: rgba(0, 128, 0, .30); } .br-day.is-selected { outline: 2px solid var(--color-yellow-1); outline-offset: 0px; } .br-day__footer { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 6px; line-height: 1; min-height: 14px; } .br-day__mode { font-size: 12px; color: #7b8794; display: flex; align-items: center; gap: 4px; } .br-day__price { font-size: 11px; color: #7b8794; text-align: right; white-space: nowrap; } .br-cal__panel { width: 350px; flex: 0 0 350px; align-self: flex-start; max-height: 100%; overflow-y: auto; overscroll-behavior: contain; } .br-cal__panel-card { background: #fff; border-radius: 14px; box-shadow: 0 6px 16px rgba(0,0,0,.05); padding: 12px; } .br-cal__panel-head { display: block; } .br-cal__panel-close { display: none; } .br-cal__panel-actions { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; } .br-cal__action:disabled, .br-cal__action[disabled], .br-cal__action:disabled:hover, .br-cal__action[disabled]:hover, .br-cal__action:disabled:focus, .br-cal__action[disabled]:focus, .br-cal__action:disabled:active, .br-cal__action[disabled]:active { background-color: #e5e7eb !important; border-color: #d1d5db !important; color: #8a94a6 !important; cursor: not-allowed !important; opacity: 1; pointer-events: auto; box-shadow: none !important; transform: none !important; } .br-cal__panel-hint { font-size: 12px; color: #7b8794; min-height: 16px; } .br-cal__legend { margin-top: 12px; font-size: 14px; color: #7b8794; display: flex; flex-direction: column; gap: 6px; } .br-cal__legend--mobile { display: none; } .br-cal__legend-short { display: none; } .br-cal-dot { display: inline-block; width: 12px; height: 12px; border-radius: 999px; margin-right: 8px; vertical-align: middle; } .br-cal-dot.is-available { background: rgba(0, 128, 0, .5); } .br-cal-dot.is-unavailable { background: rgba(216, 158, 48, .7); } .br-cal-dot.is-booked { background: rgba(217, 48, 37,.5); } .br-dot { display: inline-block; width: 10px; height: 10px; border-radius: 999px; margin-right: 8px; vertical-align: middle; } .br-legend-icon { display: inline-flex; width: 10px; height: 10px; margin-right: 8px; align-items: center; justify-content: center; vertical-align: middle; } .br-legend-icon i { font-size: 13px; line-height: 1; } .br-dot.is-available { background: rgba(0, 128, 0, .35); } .br-dot.is-unavailable { background: rgba(216, 158, 48, .5); } .br-dot.is-booked { background: rgba(217, 48, 37,.35); } .br-cal-modal { position: fixed; inset: 0; z-index: 1300; display: none; align-items: center; justify-content: center; padding: 16px; } .br-cal-modal.is-open { display: flex; } .br-cal-modal__overlay { position: absolute; inset: 0; background: rgba(15, 34, 51, .45); } .br-cal-modal__dialog { position: relative; z-index: 1; width: min(100%, 430px); max-height: calc(100svh - 32px); overflow-y: auto; background: #fff; border-radius: 14px; box-shadow: 0 18px 48px rgba(0,0,0,.20); } .br-cal-modal__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 16px 12px; border-bottom: 1px solid rgba(0,0,0,.06); } .br-cal-modal__title { color: var(--color-dark-1); font-size: 18px; font-weight: 600; line-height: 1.2; } .br-cal-modal__text { margin-top: 4px; color: #7b8794; font-size: 13px; line-height: 1.35; } .br-cal-modal__close { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; flex: 0 0 auto; border: 0; border-radius: 999px; background: var(--color-light-2); color: var(--color-dark-1); cursor: pointer; } .br-cal-modal__body { display: grid; gap: 12px; padding: 14px 16px; } .br-cal-modal__field { min-width: 0; } .br-cal-modal__label { display: block; margin-bottom: 5px; color: #7b8794; font-size: 13px; } .br-cal-modal__periods { display: grid; gap: 7px; } .br-cal-modal__periods label { display: inline-flex; align-items: center; justify-content: flex-start; gap: 4px; margin: 0; color: var(--color-dark-1); font-size: 14px; line-height: 1.25; text-align: left; cursor: pointer; } .br-cal-modal__periods input[type="radio"] { flex: 0 0 auto; width: 14px; height: 14px; margin: 0; position: static; } .br-cal-modal__custom, .br-cal-modal__available-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .br-cal-modal__custom { display: none; } .br-cal-modal__custom.is-visible { display: grid; } .br-cal-modal__available-fields.is-hidden { display: none; } .br-cal-modal__note { padding: 10px 12px; border-radius: 8px; background: var(--color-light-2); color: #7b8794; font-size: 13px; line-height: 1.35; } .br-cal-modal__actions { display: flex; justify-content: flex-end; gap: 10px; padding: 12px 16px 16px; border-top: 1px solid rgba(0,0,0,.06); } #calendarModalInput input { border: 1px solid #ced4da !important; outline: 0 !important; background-color: #fff !important; } @media (max-width: 1500px) { .br-cal.is-view-year .br-cal__months { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 1146px) { .br-cal__body { flex-direction: column; } .br-cal__grid { height: auto; } .br-cal__panel { width: 100%; flex: 0 0 auto; max-height: 42%; overflow-y: auto; } .br-cal.is-view-year .br-cal__months { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 767.98px) { .br-cal__header { padding-top: 0; } .edit-house-mobile-header { padding-top: 0; } .br-cal__controls { display: flex; justify-content: center; padding: 6px 8px 8px; } .br-cal__view-switch, .br-cal__controls-right { display: none; } .br-cal__actions-button { height: 36px !important; min-width: 92px; padding: 0 14px !important; font-size: 13px; } .br-cal__actions-menu { width: 220px; } .br-cal__body { padding: 2px 0 0 0; } .br-cal__grid, .br-cal__scroll, .br-cal__months { width: 100%; } .br-cal__scroll { padding-right: 0; } .br-cal__legend--desktop { display: none; } .br-cal__legend--mobile { display: flex; flex: 0 0 auto; margin: 8px 0 0; padding: 0 8px 8px; } .br-cal__panel { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1100; margin: 0; width: 100%; max-height: calc(100svh - 60px); padding: 8px 8px; overflow-y: auto; background: transparent; } .br-cal.has-selection:not(.is-mobile-panel-dismissed) .br-cal__panel { display: block; } .br-cal__panel-card { padding: 12px; border-radius: 14px; box-shadow: 0 -10px 28px rgba(0,0,0,.6); } .br-cal__panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 8px; } .br-cal__panel-close { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 0; border-radius: 999px; background: var(--color-light-2); color: var(--color-dark-1); cursor: pointer; flex: 0 0 auto; } .br-cal__panel-title { margin-bottom: 2px !important; font-size: 14px !important; } .br-cal__summary { margin-bottom: 8px !important; font-size: 12px !important; } .br-cal__panel-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-items: start; } .br-cal__panel-form > .d-block { margin-bottom: 0 !important; } .br-cal__field--availability { grid-column: 1 / -1; grid-row: 1; display: flex !important; justify-content: center; } .br-cal__field--mode { grid-column: 1; grid-row: 2; } .br-cal__field--price { grid-column: 2; grid-row: 2; } .br-cal__panel-form label { margin-bottom: 2px; font-size: 12px; } .br-cal__panel-form .form-control { height: 38px; padding: 6px 8px; font-size: 13px; } .br-cal__panel-form .br-toggle { width: auto; min-width: 150px; height: auto; justify-content: center; padding: 0px; gap: 6px; border: none; } .br-cal__panel-form .br-toggle__label { font-size: 12px; line-height: 1.1; } .br-cal__panel-hint, .br-cal__panel-actions { grid-column: 1 / -1; } .br-cal__panel-hint { display: none; } .br-cal__panel-actions { margin-top: 0 !important; gap: 8px; } .br-cal__panel-actions .button { height: 38px !important; padding: 0 12px !important; font-size: 13px; } .br-cal.is-view-month .br-cal__months, .br-cal.is-view-year .br-cal__months { grid-template-columns: minmax(0, 1fr); } .br-month { padding: 12px 8px; border-radius: 12px; } .br-month__dow, .br-month__grid { gap: 3px; } .br-cal.is-view-month .br-day, .br-cal.is-view-year .br-day, .br-day { height: 56px; padding: 3px; border-radius: 6px; } .br-day__footer { flex-direction: column; align-items: flex-start; gap: 1px; min-height: auto; } .br-day__mode { font-size: 10px; } .br-day__price { font-size: 10px; text-align: left; white-space: nowrap; } .br-cal__legend { padding-left: 0; font-size: 12px; flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 6px 10px; } .br-cal__legend > div { display: inline-flex; align-items: center; white-space: nowrap; } .br-cal__legend-full { display: none; } .br-cal__legend-short { display: inline; } .br-cal-dot, .br-legend-icon { margin-right: 4px; } .br-cal-modal { align-items: flex-end; padding: 10px; } .br-cal-modal__dialog { width: 100%; max-height: calc(100svh - 20px); border-radius: 14px; } .br-cal-modal__custom, .br-cal-modal__available-fields { grid-template-columns: minmax(0, 1fr); } .br-cal-modal__actions { justify-content: stretch; } .br-cal-modal__actions .button { flex: 1 1 0; height: auto !important; min-height: 40px; padding: 0 10px !important; font-size: 13px; line-height: 1.1; white-space: normal; } } #calendarPriceInput input { border: 1px solid #ced4da !important; outline: 0 !important; background-color: #fff !important; } /* TOGGLE */ .br-toggle { border: 1px solid rgba(0,0,0,.08); background: #fff; border-radius: 12px; padding: 8px 10px; display: inline-flex; align-items: center; gap: 10px; cursor: pointer; user-select: none; } .br-toggle[disabled] { opacity: .5; cursor: not-allowed; } .br-toggle__track { width: 44px; height: 24px; border-radius: 999px; background: rgba(0,0,0,.10); position: relative; flex: 0 0 auto; } .br-toggle__thumb { width: 18px; height: 18px; border-radius: 999px; background: #fff; position: absolute; top: 3px; left: 3px; transition: transform .15s ease; box-shadow: 0 2px 8px rgba(0,0,0,.12); } .br-toggle__label { font-size: 13px; color: #7b8794; } /* ON */ .br-toggle.is-on .br-toggle__track { background: rgba(0, 128, 0,.5); } .br-toggle.is-on .br-toggle__thumb { transform: translateX(20px); } .br-toggle.is-on .br-toggle__label { color: #0f2233; font-weight: 600; } /* OFF */ .br-toggle.is-off .br-toggle__track { background: rgba(216, 158, 48,.5); } .br-toggle.is-off .br-toggle__label { color: #0f2233; font-weight: 600; } /* MIXED */ .br-toggle.is-mixed .br-toggle__track { background: rgba(0,0,0,.10); } .br-toggle.is-mixed .br-toggle__label { color: #7b8794; } /* CHATS */ .br-requestChatPage, .br-opportunityChatPage { min-height: 0; } .br-inbox { display: flex; flex-direction: column; height: 100%; } .br-inbox__header { padding: 8px 8px 10px; } .br-inbox__title { font-size: 18px; font-weight: 700; line-height: 22px; } /* List */ .br-threadList { display: flex; flex-direction: column; gap: 6px; } .br-threadList__empty { padding: 14px 12px; background: rgba(0,0,0,.03); color: rgba(0,0,0,.65); font-weight: 600; } .br-thread { position: relative; display: flex; gap: 12px; padding: 10px; border: 1px solid rgba(0,0,0,.08); background: #fff; text-decoration: none; color: inherit; transition: background .12s ease, border-color .12s ease; align-items: flex-start; } .br-thread:hover { background: rgba(0,0,0,.03); border-color: rgba(0,0,0,.12); } .br-thread.is-closed { opacity: .62; } .br-thread.is-completed { opacity: .62; background: rgba(34,197,94,.10); } .br-thread.is-active { background: rgba(0,0,0,.04) !important; border-color: rgba(0,0,0,.18) !important; } /* Unread bubble top-right */ .br-thread__unread { min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px; background: #111; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; line-height: 1; } .br-thread__right { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; padding-left: 10px; min-width: 44px; } /* Left thumb */ .br-thread__left { flex: 0 0 auto; display: flex; align-items: center; } .br-thread__thumb { position: relative; width: 64px; height: 64px; overflow: visible; background: #f2f2f2; } .br-thread__homeImgWrap { width: 64px; height: 64px; overflow: hidden; background: #f2f2f2; } .br-thread__homeImg { width: 100%; height: 100%; object-fit: cover; display: block; } /* User avatar bubble on top of home photo */ .br-thread__avatar { position: absolute; right: -6px; bottom: -6px; width: 28px; height: 28px; border-radius: 999px; object-fit: cover; background: #fff; border: 2px solid #fff; box-shadow: 0 2px 8px rgba(0,0,0,.18); } /* Content */ .br-thread__content { flex: 1 1 auto; min-width: 0; } .br-thread__name { font-size: 14px; font-weight: 750; line-height: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .br-thread__date { flex: 0 0 auto; font-size: 12px; font-weight: 600; line-height: 1; } /* Last message preview */ .br-thread__preview { font-size: 13px; line-height: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* Booking dates + city */ .br-thread__meta { margin-top: 2px; font-size: 12px; line-height: 16px; display: flex; align-items: center; gap: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .br-thread__metaSep { opacity: .6; } .br-thread__metaText { overflow: hidden; text-overflow: ellipsis; } .br-thread.is-active .br-thread__unread { display: none; } @media (min-width: 1200px) { .br-requestChatPage, .br-opportunityChatPage { --br-chat-page-footer-height: 54px; --br-chat-page-footer-gap: 16px; display: flex; flex-direction: column; height: calc(100vh - var(--header-height) - var(--header-extra-offset) - var(--br-chat-page-footer-height) - var(--br-chat-page-footer-gap)); min-height: 0; margin-bottom: var(--br-chat-page-footer-gap); overflow: hidden; } .br-requestChatHeader, .br-opportunityChatHeader { flex: 0 0 auto; padding-bottom: 20px !important; } .br-requestChatLayout, .br-opportunityChatLayout { flex: 1 1 auto; min-height: 0; padding-bottom: 0 !important; overflow: hidden; align-items: stretch !important; } .br-requestChatLayout__threads, .br-requestChatLayout__chat, .br-opportunityChatLayout__threads, .br-opportunityChatLayout__chat { display: flex; flex-direction: column; height: 100%; min-height: 0; } .br-requestChatLayout__threads .br-inbox, .br-opportunityChatLayout__threads .br-inbox { min-height: 0; } .br-requestChatLayout__threads .br-threadList, .br-opportunityChatLayout__threads .br-threadList { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding-right: 4px; } .br-requestChatLayout__chat .br-chat, .br-opportunityChatLayout__chat .br-chat { height: 100%; max-height: 100%; min-height: 0; } .br-requestChatLayout__chat .br-bookingCard, .br-opportunityChatLayout__chat .br-bookingCard { position: relative; top: auto; height: 100%; max-height: 100%; min-height: 0; } } /* Container global : colonne chat + panneau réservation */ /* ========================= Layout global (chat + side) ========================= */ .br-chat { display: flex; height: calc(100vh - 290px); min-height: 520px; } @media (max-width: 1400px) { .br-chat { height: calc(100vh - 170px); max-height: calc(100vh - 170px); } } /* Colonne discussion */ .br-chat__main { /*flex: 1 1 auto;*/ display: flex; flex-direction: column; min-width: 0; height: 100%; padding-right: 0 !important; } .br-chat__main > .br-chatCard { flex: 1 1 auto; height: auto; min-height: 0; } /* Panneau réservation */ .br-chat__side { height: 100%; padding-left: .5rem !important; min-height: 0; } .br-manage__header { flex: 0 0 auto; display: flex; padding: 12px 14px; border-bottom: 1px solid rgba(0, 0, 0, .06); justify-content: space-between; } .br-manage-exchange__header { padding: 12px 14px; border-bottom: 1px solid rgba(0, 0, 0, .06); } .br-manage__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 14px; } .br-manage__details { max-width: 600px; margin-left: auto; margin-right: auto; } .br-manage__media { width: 100%; height: clamp(260px, 45vh, 420px); overflow: hidden; } #manage__mapid { width: 100%; height: 100%; } .br-manage__homeImg { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; } .br-manage__caption { margin-top: 10px; } .br-manage__homeTitle { font-size: 18px; font-weight: 800; margin-bottom: 0; color: rgba(0, 0, 0, .85); } .br-manage__map-link { display: table; } .br-manage__map-link i, .br-manage__map-link span { display: table-cell; vertical-align: middle; } .br-manage__discussionbutton { display: flex; align-items: center; padding: 10px; gap: 12px; } .br-manage__discussiontext { flex: 1; } .br-manage__chevron { transition: transform 0.15s ease, opacity 0.15s ease; } .br-manage__discussionbutton:hover { background: rgba(0, 0, 0, .04); } .br-manage__discussionbutton i { flex-shrink: 0; } /* Flèche au milieu */ .br-exchange__arrows { display: flex; align-items: center; justify-content: center; padding: 0; } .br-exchange__arrows i { transform: rotate(90deg); } .br-manage__discussiontext span { display: block; } .br-manage__homeStatus { font-size: 20px; font-weight: 800; margin-bottom: 12px; color: rgba(0, 0, 0, .85); } .br-manage__Dates { display: flex; align-items: stretch; background: rgba(0, 0, 0, .04); border-radius: 16px; padding: 14px 12px; margin-top: 12px; } .br-manage__Info__header { font-size: 16px; font-weight: 800; color: rgba(0, 0, 0, .85); } .br-manage__Info { display: flex; flex-direction: column; } .br-manage__Info__title { font-size: 15px; font-weight: 800; color: rgba(0, 0, 0, .85); } .br-manage__Info__value { font-size: 15px; font-weight: 600; color: rgba(0, 0, 0, .65); } .br-bookingCard { position: sticky; top: 12px; width: 100%; height: calc(100vh - 290px); max-height: calc(100vh - 290px); min-height: 100%; display: flex; flex-direction: column; border: 1px solid rgba(0,0,0,.08); background: #fff; overflow: hidden; } @media (max-width: 1400px) { .br-bookingCard { height: calc(100vh - 200px); max-height: calc(100vh - 200px); } } .br-bookingCard__header { flex: 0 0 auto; padding: 14px; border-bottom: 1px solid rgba(0,0,0,.06); } .br-bookingCard__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 14px; } .br-bookingCard__title { font-size: 16px; font-weight: 800; margin-bottom: 8px; } .br-bookingCard__homeTitle { font-size: 18px; font-weight: 800; margin-bottom: 12px; line-height: 1.4; } .br-bookingCard__homeStatus { font-size: 16px; font-weight: 800; margin-bottom: 12px; line-height: 1.2; } .br-bookingCard__homeImgWrap { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; } .br-bookingCard__homeImg { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; } .br-bookingCard__row { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid rgba(0,0,0,.06); } .br-bookingInfo__header { margin-top: 12px; font-size: 16px; font-weight: 800; color: rgba(0,0,0,.85); } .br-bookingInfo { display: flex; flex-direction: column; } .br-bookingInfo__title { font-size: 13px; font-weight: 800; color: rgba(0,0,0,.85); } .br-bookingInfo__value { font-size: 13px; font-weight: 600; color: rgba(0,0,0,.65); } .br-bookingDates { display: flex; align-items: stretch; background: rgba(0,0,0,.04); border-radius: 16px; padding: 14px 12px; margin-top: 12px; } .br-bookingDates__col { flex: 1 1 0; display: flex; flex-direction: column; gap: 2px; align-items: center; } .br-bookingDates__label { font-size: 12px; font-weight: 700; color: rgba(0,0,0,.55); } .br-bookingDates__date { font-size: 14px; font-weight: 800; color: rgba(0,0,0,.85); } .br-bookingDates__time { font-size: 12px; font-weight: 600; color: rgba(0,0,0,.55); } .br-bookingDates__separator { width: 1px; background: rgba(0,0,0,.12); margin: 0 12px; } /* ========================= Carte chat (header/body/footer) ========================= */ .br-chatCard { display: flex; flex-direction: column; height: 100%; border: 1px solid rgba(0,0,0,.08); background: #fff; overflow: hidden; } .br-chatCard__header { flex: 0 0 auto; display: flex; align-items: center; padding: 12px 14px; border-bottom: 1px solid rgba(0,0,0,.06); min-height: 55px; } .br-chatHeader { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; } .br-chatHeader__title { min-width: 0; } .br-chatHeader__actions { display: flex; align-items: center; justify-content: flex-end; gap: 16px; margin-left: auto; } .br-chatActions { display: flex; align-items: center; gap: 14px; } .br-chatActions--desktop { display: none; } .br-chatActions--desktop .button, .br-chatActions--mobile .button { white-space: nowrap; } .br-chatHeader__name { font-size: 16px; font-weight: 800; line-height: 18px; } .br-chatHeader__sub { font-size: 12px; color: rgba(0,0,0,.55); font-weight: 600; margin-top: 2px; } .br-chatCard__body { flex: 1 1 auto; min-height: 0; /* crucial for inner scroll */ padding: 0; /* Airbnb laisse le body “full” */ } .br-chatCard__footer { flex: 0 0 auto; border-top: 1px solid rgba(0,0,0,.06); padding: 12px 14px; background: #fff; } @media (min-width: 992px) { .br-chatActions--desktop { display: flex; } .br-chatActions--mobile { display: none !important; } } @media (max-width: 991px) { .br-chatActions--mobile { flex-direction: column; justify-content: center; gap: 8px; } .br-chatActions--mobile .button { width: fit-content; max-width: 100%; } #ChatModalBody.br-mobileModal__body { overflow: hidden; } #ChatModalBody .br-chat { height: 100%; min-height: 0; max-height: none; } #ChatModalBody .br-chatCard__body { overflow: hidden; } } /* ========================= Historique scrollable ========================= */ .messages-container { height: 100%; overflow-y: auto; padding: 14px 0; } /* Colonne centrée type Airbnb */ .br-msgCol { /*max-width: 820px;*/ margin: 0 auto; padding: 0 16px; } /* Liste de messages */ .messages { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 5px; } /* ========================= Séparateur de date ========================= */ .br-dateDivider { display: flex; justify-content: center; margin: 8px 0 2px; } .br-dateDivider__text { font-size: 12px; font-weight: 800; color: rgba(0,0,0,.70); padding: 6px 10px; } /* ========================= Messages (Airbnb-like) ========================= */ .br-chatEmpty { margin: 10px; } /* Chaque item gère son alignement gauche/droite */ .br-msgRow { display: flex; justify-content: flex-start; /* theirs */ } /* Tes messages à droite */ .br-msgRow.is-mine { justify-content: flex-end; } /* Wrap = heure + bulle (ensemble) */ .br-msgWrap { width: 100%; max-width: 520px; /* largeur max des bulles */ display: flex; flex-direction: column; gap: 6px; } /* Heure au-dessus */ .br-msgTime { font-size: 11px; font-weight: 700; color: rgba(0,0,0,.45); line-height: 1; padding: 0 2px; /* alignement visuel avec la bulle */ } /* Bulle (mine) */ .br-msgRow.is-mine .br-msgBubble { margin-left: auto; background: #111; color: #fff; border-color: #111; } /* Heure à droite pour is-mine */ .br-msgRow.is-mine .br-msgTime { align-self: flex-end; text-align: right; width: auto; align-items: flex-end; } /* Bulle (theirs) */ .br-msgBubble { display: inline-block; width: fit-content; max-width: 100%; padding: 10px 12px; border-radius: 16px; font-size: 13px; line-height: 18px; background: #f3f3f3; /* Airbnb “theirs” */ color: rgba(0,0,0,.85); border: 1px solid rgba(0,0,0,.06); /* longues lignes */ word-wrap: break-word; overflow-wrap: anywhere; } .br-msgRow.is-mine .br-msgBubble { border-radius: 18px 18px 2px 18px; } .br-msgRow.is-theirs .br-msgBubble { border-radius: 18px 18px 18px 2px; } .br-msgReadLabel { margin-top: -5px; font-size: 11px; font-weight: 600; color: rgba(0,0,0,.45); } .br-msgRow.is-mine .br-msgReadLabel { text-align: right; } /* ========================= Composer (textarea + bouton) ========================= */ .br-chatComposer { display: flex; gap: 12px; align-items: flex-end; } .br-chatComposer__input { flex: 1 1 auto; min-width: 0; } .br-chatComposer__input textarea { display: block; width: 100%; resize: none; border: 1px solid rgba(0,0,0,.12); padding: 10px 12px; font-size: 13px; line-height: 18px; outline: none; margin: 0; border-radius: 12px; } .br-chatComposer__input textarea:focus { border-color: rgba(0,0,0,.25); } .br-btnSend { height: 40px; padding: 0 14px; border: 0; border-radius: 12px; background: #111; color: #fff; font-weight: 800; font-size: 13px; cursor: pointer; } .br-btnSend__icon { margin-left: 8px; } /* ========================= Discussion clôturée ========================= */ .br-chatClosed { padding: 10px 12px; border-radius: 12px; background: rgba(255,193,7,.20); color: rgba(0,0,0,.75); font-weight: 700; font-size: 13px; } .br-chatCompleted { padding: 10px 12px; border-radius: 12px; background: var(--color-green-1); color: rgba(0,0,0,.75); font-weight: 700; font-size: 13px; } /* MODAL RESERVATION */ .br-bookingModal { max-height: calc(100vh - 40px); display: flex; flex-direction: column; overflow: hidden; } .br-bookingModal__body { overflow-y: auto; min-height: 0; } .br-mobileModal { width: min(720px, calc(100vw - 24px)); max-height: calc(100vh - 100px); display: flex; flex-direction: column; overflow: hidden; } .br-mobileModal__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; } .br-opinionPopup.langMenu { box-sizing: border-box; padding: 24px 12px !important; overflow-y: auto; } .br-opinionPopup .langMenu__content { width: min(700px, 100%); max-width: 700px; height: auto !important; max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); overflow: hidden; } .br-opinionPopup__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; } .br-opinionForm { max-width: 100%; padding-left: 0; padding-right: 0; } .br-opinionForm__row { gap: 12px; } .br-opinionForm__row > div:first-child { min-width: 0; } .br-opinionForm__row .rating-container { flex: 0 0 auto; } @media (max-width: 575px) { .br-opinionPopup.langMenu { padding: 12px !important; } .br-opinionPopup .langMenu__content { width: calc(100% - 16px); max-width: 100%; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); } .br-opinionPopup__footer { justify-content: stretch !important; } .br-opinionPopup__footer .button { width: 100%; } .br-opinionForm__row { align-items: flex-start !important; flex-direction: column; gap: 6px; } .br-opinionForm .rating-md { font-size: 28px; } .br-opinionForm .rating-container .star { margin: 0 3px; } } #brConfirmModal { z-index: 20000 !important; } body.br-confirm-open .modal-backdrop { z-index: 19990 !important; } .br-bookingDisplay { display: grid; grid-template-columns: 180px minmax(520px, 1fr) minmax(260px, 0.75fr); gap: 20px; align-items: stretch; padding: 5px; } .br-bookingDisplay__media { width: 180px; display: flex; align-items: center; } .br-bookingDisplay__dates { max-width: 400px; padding: 5px 10px !important; } /* ============================================= UNIFIED SEARCH BAR ============================================= */ /* Sélecteur de type */ .search-unified__type-tabs { align-items: flex-end; gap: 32px; margin-bottom: 14px; } .search-unified__type-tab { display: inline-flex; align-items: center; gap: 8px; padding: 0 0 5px 0; background: transparent; border-bottom: 2px solid transparent; color: #ffffff; transition: color .15s ease, border-color .15s ease; } .search-unified__type-tab.is-active { color: var(--color-yellow-1); font-weight: 600; border-bottom-color: var(--color-yellow-1); } .search-unified__type-icon { width: 20px; height: 20px; object-fit: contain; display: block; } .search-unified__panel-mobile-header { display: none; } .search-unified__wizard-close, .search-unified__mobile-steps, .search-unified__mobile-start, .search-unified__mobile-results-summary, .search-unified__desktop-type-select { display: none; } @media (min-width: 992px) { #site-header.search-desktop-expanded-open { height: 180px; align-items: center; } #site-header.search-desktop-expanded-open .header__container { padding-top: 0; padding-bottom: 0; } #site-header.search-desktop-expanded-open .header__container > .row { align-items: center; } body.search-desktop-expanded-open .page-content { padding-top: 200px; } .search-unified--inner .search-unified__type-tabs { display: none !important; } .search-unified--inner.search-unified--desktop-expanded .search-unified__type-tabs { display: flex !important; } .search-unified--inner .search-unified__desktop-type-select { position: relative; display: flex !important; justify-content: center; align-items: center; min-width: 52px; padding: 0; } .search-unified--inner.search-unified--desktop-expanded .search-unified__desktop-type-select { display: none !important; } } .search-unified__desktop-type-current { width: 42px; height: 42px; border: 0; border-radius: 4px; background: #fff; display: inline-flex; justify-content: center; align-items: center; cursor: pointer; } .search-unified__desktop-type-current img { width: 25px; height: 25px; object-fit: contain; } .search-unified__desktop-type-menu { display: none; position: absolute; z-index: 250; top: calc(100% + 10px); left: 0; min-width: 185px; padding: 8px; } .search-unified__desktop-type-menu.is-open { display: block; } .search-unified__desktop-type-option { width: 100%; min-height: 40px; border: 0; border-radius: 4px; background: transparent; display: flex; align-items: center; gap: 10px; padding: 8px 10px; color: #10293F; font-size: 14px; font-weight: 500; cursor: pointer; } .search-unified__desktop-type-option:hover, .search-unified__desktop-type-option.is-active { background: rgba(216, 158, 48, .12); } .search-unified__desktop-type-option img { width: 22px; height: 22px; object-fit: contain; } .search-unified__panel-close { width: 40px; height: 40px; border: 1px solid var(--color-border); border-radius: 4px; background: #fff; color: #10293F; display: inline-flex; align-items: center; justify-content: center; } /* Segments cliquables de la barre compacte */ .search-unified__segment { cursor: pointer; min-width: 0; } .search-unified__segment .js-su-label-lieu { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .js-su-label-lieu.is-placeholder, .js-su-mobile-label-lieu.is-placeholder, .js-su-mobile-results-title.is-placeholder { color: #b4bac2 !important; font-weight: 400 !important; } .search-unified__segment:hover .text-12.fw-500 { text-decoration: underline; } /* Panels */ .search-unified__panel { display: none; position: absolute; z-index: 200; min-width: 800px; max-width: 900px; max-height: 80vh; overflow-y: auto; top: calc(100% + 8px); } .search-unified__panel.is-open { display: block; } #SearchPanelLieu { left: 0; min-width: 520px; min-height: 420px; overflow-x: hidden; } #SearchPanelLieu .searchMenu-location { position: relative !important; top: auto !important; left: auto !important; right: auto !important; width: 100% !important; max-width: none !important; min-height: 320px; margin-top: 12px; display: block !important; z-index: 1; overflow-x: hidden; } #SearchPanelLieu .searchMenu-location .ui-autocomplete { position: static !important; top: auto !important; left: auto !important; width: 100% !important; max-height: 360px; margin: 0 !important; padding: 0 !important; box-shadow: none !important; overflow-y: auto; overflow-x: hidden; } #SearchPanelLieu .searchMenu-location .ui-menu-item, #SearchPanelLieu .searchMenu-location .ui-menu-item-wrapper, #SearchPanelLieu .searchMenu-location .js-search-option { width: 100% !important; max-width: 100% !important; box-sizing: border-box; cursor: pointer; } .searchMenu-location .js-search-option { display: block; width: 100%; border: 0; background: transparent; color: var(--main-text); line-height: normal; user-select: none; -webkit-tap-highlight-color: transparent; } .searchMenu-location.ui-widget, .searchMenu-location .ui-widget, .searchMenu-location .ui-autocomplete, .searchMenu-location .js-search-option { font-family: var(--font-primary) !important; } .searchMenu-location .ui-menu-item-wrapper { padding: 0 !important; border: 0 !important; background: transparent !important; } .searchMenu-location .ui-menu-item-wrapper.ui-state-active .js-search-option, .searchMenu-location .js-search-option:hover { background-color: rgba(53, 84, 209, 0.05) !important; } #SearchPanelLieu .searchMenu-location .ui-state-active, #SearchPanelLieu .searchMenu-location .ui-widget-content .ui-state-active, #SearchPanelLieu .searchMenu-location .ui-menu .ui-state-focus, #SearchPanelLieu .searchMenu-location .ui-menu .ui-state-active, #SearchPanelLieu .searchMenu-location .-link:hover { margin: 0 !important; border: none !important; box-shadow: none !important; transform: none !important; } #SearchPanelDates { left: 0; } #SearchPanelDates.is-no-dates-mode, #SearchPanelDates.is-flexible-dates-mode { min-height: 0; overflow-y: visible; } #SearchPanelDates.is-no-dates-mode .tabs, #SearchPanelDates.is-no-dates-mode .tabs__content, #SearchPanelDates.is-no-dates-mode .tabs__pane, #SearchPanelDates.is-no-dates-mode .sidebar__item, #SearchPanelDates.is-flexible-dates-mode .tabs, #SearchPanelDates.is-flexible-dates-mode .tabs__content, #SearchPanelDates.is-flexible-dates-mode .tabs__pane, #SearchPanelDates.is-flexible-dates-mode .sidebar__item { min-height: 0 !important; height: auto !important; padding-bottom: 10px !important; } #SearchPanelDates.is-no-dates-mode #bookingDateRangePicker, #SearchPanelDates.is-flexible-dates-mode #bookingDateRangePicker { display: none !important; } #SearchPanelDetails { left: 50%; } /* Overlay backdrop */ #SearchUnifiedOverlay { display: none; position: fixed; inset: 0; z-index: 4; background: rgba(0, 0, 0, .35); cursor: pointer; } #SearchUnifiedOverlay.is-visible { display: block; } /* Footer collant en bas du panel */ .search-unified__panel-footer { position: sticky; bottom: 0; background: #fff; min-height: 64px; padding-top: 14px !important; padding-bottom: 14px !important; } /* Input destination dans le panel */ #SearchPanelLieu input[type="search"] { border: none; border-bottom: 1.5px solid #e5e7eb; width: 100%; padding: 10px 4px; font-size: 14px; outline: none; background: transparent; } #SearchPanelLieu input[type="search"]:focus { border-bottom-color: #10293F; } /* Résultats autocomplete dans le panel lieu */ .searchMenu-location .ui-autocomplete { position: static !important; border: none; box-shadow: none; max-height: 300px; overflow-y: auto; } /* Chips job / opp-type */ .su-job-chip.selected-count, .su-opp-type-chip.selected-count { background: #10293F !important; color: #fff !important; border-color: #10293F !important; } .search-unified__profession-search { width: 100%; height: 42px; border: none; border-bottom: 1.5px solid #e5e7eb !important; border-radius: 0; padding: 0 4px; margin-bottom: 12px; font-family: var(--font-primary); font-size: 14px; outline: none; background: transparent; } .search-unified__profession-search:focus { border-bottom-color: #10293F !important; } #SearchPanelMetier .js-su-metier-section { height: auto; } /* Bouton effacer */ .js-clear-this-panel { background: none; border: none; padding: 0; text-decoration: underline; cursor: pointer; } /* ---- MOBILE ---- */ @media (max-width: 991px) { body.search-mobile-wizard-open { overflow: hidden !important; } body.search-mobile-wizard-open > .SearchBarContainer { position: fixed !important; inset: 0; z-index: 10000; } .search-unified__mobile-start { display: inline-flex; align-items: center; justify-content: center; border: none; margin-bottom: 16px; box-shadow: inset 0 2px 4px rgba(0,0,0,0.2), inset 0 -2px 2px rgba(255,255,255,0.3); } #SearchBar.search-unified--results:not(.is-mobile-wizard-open) .search-unified__mobile-start, #SearchBar.search-unified--results:not(.is-mobile-wizard-open) .search-unified__type-tabs { display: none !important; } #SearchBar.search-unified--results:not(.is-mobile-wizard-open) .search-unified__mobile-results-summary { display: inline-flex !important; align-items: center; gap: 10px; border: none; max-width: 100%; min-height: 48px; text-align: left; box-shadow: 0 2px 9px rgba(16,41,63,.12); } .search-unified__mobile-results-icon { width: 25px; height: 25px; flex: 0 0 25px; object-fit: contain; } .search-unified__mobile-results-text { min-width: 0; display: block; } .search-unified__mobile-results-title, .search-unified__mobile-results-subtitle { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 16px; } .search-unified__mobile-results-title { color: #10293F; font-size: 13px; font-weight: 500; } .search-unified__mobile-results-subtitle { color: #424242; font-size: 12px; } #SearchBar.is-mobile-wizard-open .search-unified__mobile-start { display: none !important; } #SearchBar.is-mobile-wizard-open .search-unified__mobile-results-summary { display: none !important; } #SearchBar:not(.is-mobile-wizard-open) .mainSearch, #SearchBar:not(.is-mobile-wizard-open) .search-unified__mobile-steps, #SearchBar:not(.is-mobile-wizard-open) .search-unified__panel, #SearchBar:not(.is-mobile-wizard-open) #SearchUnifiedOverlay { display: none !important; } #SearchBar:not(.is-mobile-wizard-open) .search-unified__type-tab.is-active { color: #10293F; font-weight: 500; border-color: #e5e7eb; background: #fff; } .search-unified__type-tabs { gap: 14px; margin-bottom: 0; } .search-unified__type-tab { flex: 1 1 0; min-width: 0; min-height: 86px; flex-direction: column; justify-content: center; gap: 8px; padding: 10px 6px; border-radius: 4px; color: var(--color-dark-1); background: #fff; font-size: 14px !important; line-height: 18px; box-shadow: inset 0 2px 4px rgba(0,0,0,0.2), inset 0 -2px 2px rgba(255,255,255,0.3); } .search-unified__type-tab.is-active { border-color: var(--color-yellow-1); background: rgba(216, 158, 48, .12); } .search-unified__type-icon { width: 28px; height: 28px; } #SearchBar.is-mobile-wizard-open { position: fixed !important; inset: 0; z-index: 10000; background: #f4f4f4; padding: 14px 10px 88px; overflow-y: auto; -webkit-overflow-scrolling: touch; } #SearchBar.is-mobile-wizard-open .search-unified__type-tabs { max-width: 240px; margin: 0 auto 12px; gap: 10px; } #SearchBar.is-mobile-wizard-open .search-unified__type-tab { min-height: 52px; padding: 0 0 5px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: #666; background: transparent; font-size: 12px; line-height: 14px; gap: 3px; box-shadow: none; } #SearchBar.is-mobile-wizard-open .search-unified__type-tab.is-active { color: #333; border-bottom-color: #333; background: transparent; } #SearchBar.is-mobile-wizard-open .search-unified__type-icon { width: 30px; height: 30px; } #SearchBar.is-mobile-wizard-open .search-unified__wizard-close { display: inline-flex; position: fixed; top: 20px; right: 14px; width: 34px; height: 34px; border: none; border-radius: 50%; background: #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, .12); align-items: center; justify-content: center; color: #333; z-index: 1000; } #SearchBar.is-mobile-wizard-open .mainSearch, #SearchBar.is-mobile-wizard-open #SearchUnifiedOverlay { display: none !important; } #SearchBar.is-mobile-wizard-open .search-unified__mobile-steps { display: flex; flex-direction: column; } .search-unified__mobile-step { width: 100%; min-height: 46px; border: none; border-radius: 12px; background: #fff; margin: 0 0 10px; padding: 0 18px; box-shadow: 0 2px 12px rgba(0, 0, 0, .06); display: flex; align-items: center; justify-content: space-between; gap: 12px; text-align: left; } .search-unified__mobile-step.is-hidden { display: none; } .search-unified__mobile-step.is-active { display: block; width: 0; min-height: 0; height: 0; margin: 0; padding: 0; overflow: hidden; box-shadow: none; } .search-unified__mobile-step-title { font-size: 13px; font-weight: 600; color: #6f6f6f; } .search-unified__mobile-step-value { font-size: 13px; font-weight: 600; color: #333; text-align: right; } .search-unified__panel { position: fixed; inset: 0; width: 100% !important; min-width: unset; max-width: unset; max-height: 100%; border-radius: 0 !important; z-index: 300; overflow-y: auto; } #SearchBar.is-mobile-wizard-open .search-unified__panel { position: static; inset: auto; width: 100% !important; min-width: 0; max-width: none; max-height: none; overflow: visible; border-radius: 16px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, .12) !important; margin: 10px 0 12px; display: none; } #SearchBar.is-mobile-wizard-open .search-unified__panel.is-open { display: block; } #SearchBar.is-mobile-wizard-open .search-unified__panel-mobile-header { display: flex; min-height: 0; padding: 18px 20px 0; border: none; /*background: #fff;*/ align-items: center; justify-content: space-between; position: static; } #SearchBar.is-mobile-wizard-open .search-unified__panel-close { display: none; } .search-unified__panel-footer { position: fixed; left: 0; right: 0; bottom: 0; min-height: 78px; padding: 12px 28px calc(12px + env(safe-area-inset-bottom, 0px)) !important; background: #f4f4f4; z-index: 4; border-top: none !important; } .search-unified__panel-footer .js-clear-this-panel { color: #333; font-weight: 600; text-decoration: none; } #SearchPanelLieu input[type="search"] { height: 46px; border: 1px solid #d8d8d8; border-radius: 4px; padding: 0 14px; } #SearchBar.is-mobile-wizard-open #SearchPanelLieu .searchMenu-location { position: relative !important; top: auto !important; left: auto !important; right: auto !important; width: 100% !important; max-width: none !important; min-height: 330px; margin-top: 12px; z-index: 1; display: block !important; overflow: hidden; } #SearchBar.is-mobile-wizard-open #SearchPanelLieu .searchMenu-location .ui-autocomplete { position: static !important; top: auto !important; left: auto !important; width: 100% !important; max-height: 330px; padding: 0 !important; margin: 0 !important; border: none !important; box-shadow: none !important; overflow-y: auto; background: transparent; } #SearchBar.is-mobile-wizard-open #SearchPanelLieu .searchMenu-location .ui-menu-item { margin-bottom: 8px; } #SearchBar.is-mobile-wizard-open #SearchPanelDates.is-no-dates-mode { min-height: 0; } #SearchBar.is-mobile-wizard-open #SearchPanelDates.is-no-dates-mode .tabs__content, #SearchBar.is-mobile-wizard-open #SearchPanelDates.is-no-dates-mode .tabs__pane, #SearchBar.is-mobile-wizard-open #SearchPanelDates.is-no-dates-mode .sidebar__item { min-height: 0 !important; height: auto !important; padding-bottom: 10px !important; } #SearchBar.is-mobile-wizard-open #SearchPanelDates.is-no-dates-mode #bookingDateRangePicker { display: none !important; } } .br-bookingDisplay__main { min-width: 0; } .br-bookingDisplay__side { display: grid; grid-template-columns: 1fr 110px; /* texte + avatar */ gap: 16px; align-content: start; } .br-bookingDisplay__actions div { gap: 10px; } .br-bookingDisplay__actions, .br-bookingDisplay__ratings { grid-column: 1 / -1; /* prend toute la largeur du panneau de droite */ } .br-bookingDisplay__avatar, .br-bookingDisplay__image { min-height: 100px; min-width: 100px; } .br-bookingDisplay__mobileProfile { bottom: 40px; display: none; } .br-clientTravelDisplay__side, .br-clientBookingDisplay__side { grid-template-rows: 1fr auto; align-content: stretch; } .br-clientTravelDisplay__side .br-bookingDisplay__person, .br-clientBookingDisplay__side .br-bookingDisplay__person { align-self: start; } .br-clientTravelDisplay__side .br-bookingDisplay__actions, .br-clientTravelDisplay__side .br-bookingDisplay__ratings, .br-clientBookingDisplay__side .br-bookingDisplay__actions, .br-clientBookingDisplay__side .br-bookingDisplay__ratings { grid-column: 1; } .br-clientTravelDisplay__side .br-bookingDisplay__avatar, .br-clientBookingDisplay__side .br-bookingDisplay__avatar { grid-column: 2; grid-row: 1 / span 2; align-self: center; display: flex; justify-content: flex-end; } .br-clientTravelClosedItem { display: grid; grid-template-columns: minmax(165px, auto) minmax(0, 1fr) auto auto; gap: 8px 16px; align-items: center; padding: 6px 16px; border: 1px solid var(--color-border); border-left: 3px solid var(--color-border); } .br-clientTravelClosedItem--danger { border-left-color: var(--color-red-1); } .br-clientTravelClosedItem--muted { border-left-color: var(--color-dark-1); } .br-clientTravelClosedItem__badges, .br-clientTravelClosedItem__meta { display: flex; flex-wrap: wrap; } .br-clientTravelClosedItem__badges { gap: 6px; } .br-clientTravelClosedItem__badges span { min-width: 96px; padding-left: 16px !important; padding-right: 16px !important; text-align: center; } .br-clientTravelClosedItem__main { min-width: 0; } .br-clientTravelClosedItem__title { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .br-clientTravelClosedItem__meta { gap: 4px 14px; margin-top: 4px; } .br-clientTravelClosedItem__person { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .br-clientTravelClosedItem__action { width: 34px; min-width: 34px; height: 32px; padding: 0 !important; display: inline-flex; align-items: center; justify-content: center; } .br-clientTravelClosedItem__action i { margin: 0 !important; } /* Mobile */ @media (max-width: 1199px) { .br-bookingDisplay { grid-template-columns: 1fr; } .br-bookingDisplay__media { width: auto; } .br-bookingDisplay__side { grid-template-columns: 1fr 90px; } } @media (max-width: 991px) { .br-bookingDisplay { padding: 15px; } .br-bookingDisplay__mobileProfile { display: block; } .br-clientTravelDisplay__side { grid-template-columns: 1fr; } .br-clientTravelDisplay__side .br-bookingDisplay__avatar { display: none; } .br-clientTravelDisplay__side .br-bookingDisplay__actions { grid-column: 1 / -1; justify-content: center; } .br-clientTravelDisplay__side .br-bookingDisplay__actions > div { justify-content: center; } .br-clientTravelClosedItem { grid-template-columns: minmax(0, 1fr) auto; } .br-clientTravelClosedItem__badges, .br-clientTravelClosedItem__main, .br-clientTravelClosedItem__person { grid-column: 1 / -1; } } /* THUMBNAIL HOME */ .btn-favorite > .favorite-heart, .btn-favorite > .unfavorite-heart { margin-left: -1px; } .rentalCard:hover .rentalCard__title { color: var(--color-yellow-1); } .rentalCard__title { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color .15s ease; } .rentalCard__city { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 70%; } .house-flex-dates { font-weight: 500; padding: 2px 4px; border-radius: 999px; background: #f1f5f9; white-space: nowrap; } /* PAGE DETAILS UTILISATEUR / AVIS */ .opinions-carousel { position: relative; padding: 0 44px; } .opinions-track { display: flex; gap: 20px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-behavior: smooth; -ms-overflow-style: none; scrollbar-width: none; padding: 0 8px; scroll-padding: 0 8px; box-sizing: border-box; } .opinions-track::-webkit-scrollbar { display: none; width: 0; height: 0; } /* mobile: 1 */ .opinions-slide { scroll-snap-align: start; flex: 0 0 100%; } /* tablette + desktop: 2 colonnes */ @media (min-width: 768px) { .opinions-slide { flex: 0 0 calc((100% - 20px) / 2); } } .opinions-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; border-radius: 999px; border: 1px solid rgba(0,0,0,.15); background: #fff; z-index: 2; display: flex; align-items: center; justify-content: center; cursor: pointer; } .opinions-prev { left: 0; } .opinions-next { right: 0; } .opinions-nav:disabled { opacity: .35; cursor: default; } /* Avis - affichage progressif */ .opinion-item.is-hidden { display: none; } /* Avis - commentaire long */ .opinion-comment { overflow: hidden; } .is-hidden { display: none !important; } /* Meta : évite les trucs qui s’écrasent bizarrement */ .opinion-meta { gap: 6px 10px; /* gap vertical/horizontal quand ça wrap */ } .opinion-meta .mr-10 { /* ton span étoiles */ margin-right: 0 !important; white-space: nowrap; /* empêche les étoiles de se casser */ } /* Mobile : layout vertical pour gagner de la largeur utile */ @media (max-width: 576px) { .opinion-item { align-items: center; /* centre avatar + texte */ text-align: center; } .opinion-avatar { width: 100%; display: flex; justify-content: center; } .opinion-content { width: 100%; } .opinion-meta { justify-content: center; /* centre étoiles/note/date */ } .opinion-comment-wrapper, .opinion-comment { text-align: left; /* commentaire lisible */ } .opinion-avatar img { width: 56px; /* au lieu de 70 */ height: 56px; } } /* HOUSE HIGHLIGHT */ /* Encart style Airbnb */ .highlight-badge { display: flex; align-items: stretch; gap: 0; width: 100%; margin-right: auto; margin-left: auto; border: 1px solid #e6e6e6; border-radius: 14px; background: #fff; overflow: hidden; box-shadow: 0 1px 0 rgba(0,0,0,.04); } .highlight-badge__col { display: flex; align-items: center; justify-content: center; flex: 1 1 0; min-width: 0; padding: 16px 18px; min-height: 72px; text-align: center; } .highlight-badge__content { min-width: 0; } .highlight-badge__sep { width: 1px; background: #ececec; } .highlight-badge__icon { width: 36px; height: 36px; border-radius: 999px; border: 1px solid #eee; display: flex; align-items: center; justify-content: center; margin-right: 12px; flex: 0 0 auto; color: var(--color-dark-1); } .highlight-badge__title { font-weight: 700; font-size: 14px; line-height: 18px; color: var(--color-dark-1); } .highlight-badge__subtitle { margin-top: 2px; font-size: 12px; line-height: 16px; color: var(--color-light-1); } /* Responsive */ @media (max-width: 992px) { .highlight-badge { flex-direction: column; } .highlight-badge__sep { width: 100%; height: 1px; } .highlight-badge__col { justify-content: flex-start; text-align: left; } } /* LEGENDE CALENDRIER */ /* ====== WRAPPER ====== */ .availability-legend { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: stretch; padding-top: 16px; } @media (max-width: 767px) { .availability-legend { gap: 0px 0px; } } /* ====== CHIP ====== */ .legend-item { display: flex; align-items: flex-start; gap: 8px; padding: 5px 12px; line-height: 1.2; max-width: 100%; } /* 2 chips par ligne sur mobile */ @media (max-width: 576px) { .legend-item { width: calc(50% - 7px); } } /* ====== ICONES COULEURS ====== */ .legend-dot { width: 12px; height: 12px; border-radius: 50%; flex: 0 0 auto; margin-top: 2px; } .legend-square { width: 12px; height: 12px; border-radius: 2px; flex: 0 0 auto; margin-top: 2px; } .legend-info { font-size: 14px; color: #a1a1a1; } /* ====== LABEL DESKTOP ====== */ .legend-label { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; white-space: nowrap; } /* ====== MOBILE vs DESKTOP SWITCH ====== */ .legend-label--mobile { display: none; } .legend-label--desktop { display: inline-flex; } @media (max-width: 576px) { .legend-label--desktop { display: none; } .legend-label--mobile { display: block; } .legend-label { white-space: normal; } } /* ====== DETAILS / SUMMARY (mobile) ====== */ .legend-details { width: 100%; } .legend-summary { cursor: pointer; list-style: none; /* enlève le triangle sur certains navigateurs */ display: flex; align-items: center; gap: 6px; user-select: none; font-size: 14px; } /* enlève le marker (triangle) sur Chrome/Safari */ .legend-summary::-webkit-details-marker { display: none; } .legend-summary-text { white-space: nowrap; } .legend-details-body { margin-top: 8px; font-size: 13px; color: #6b7280; line-height: 1.3; } .legend-details[open] .legend-details-body { padding-right: 4px; } /* TESTIMONIALS */ .br-testimonials-eq .swiper-wrapper { align-items: stretch; } .br-testimonials-eq .swiper-slide { height: auto; display: flex; } .br-testimonials-eq .swiper-slide > div { width: 100%; height: 100%; display: flex; } .br-testimonials-eq .testimonials { height: 100%; display: flex; flex-direction: column; } .br-testimonials-eq .testimonials .pt-20 { margin-top: auto !important; } .testimonialsPagination { display: flex !important; gap: 8px !important; justify-content: center !important; margin-top: 16px !important; } .testimonialsPagination .pagination__item { width: 8px !important; height: 8px !important; border-radius: 50% !important; background: var(--color-blue-1); opacity: .3 !important; } .testimonialsPagination .pagination__item.is-active { opacity: 1 !important; } /* A PROPOS */ .br-about-hero { padding: 60px 0; margin-top: calc(-1 * var(--header-extra-offset)); } .br-about-hero__card { background: #fff; border-radius: 16px; padding: 22px; box-shadow: 0 8px 24px rgba(0,0,0,.06); } .br-about-hero__card__title { font-weight: 700; margin-bottom: 8px; } .br-about-section { padding: 50px 0; } .br-card { background: #fff; border-radius: 16px; padding: 22px; box-shadow: 0 8px 24px rgba(0,0,0,.06); height: 100%; } .br-card__title { font-weight: 700; margin-bottom: 8px; } .br-profile { background: #fff; border-radius: 16px; padding: 22px; box-shadow: 0 8px 24px rgba(0,0,0,.06); height: 100%; } .br-profile__photo img { width: 100%; border-radius: 100%; display: block; aspect-ratio: 1/1; object-fit: cover; padding: 30px } .br-profile__name { font-weight: 800; font-size: 18px; margin-top: 14px; } .br-profile__role { margin-top: 2px; margin-bottom: 10px; } /* CLIENT PROFILE */ .client-profile-card { overflow: visible; } .client-profile-overview { display: flex; align-items: center; gap: 18px; padding: 18px; margin-bottom: 22px; border: 1px solid #e5e7eb; border-radius: 12px; background: #f8fafc; } .client-profile-overview__avatar { flex: 0 0 auto; width: 84px; height: 84px; border-radius: 50%; overflow: hidden; background: #fff; box-shadow: 0 0 0 4px #fff; } .client-profile-overview__avatar img { width: 100%; height: 100%; object-fit: cover; } .client-profile-overview__body { min-width: 0; flex: 1 1 auto; } .client-profile-overview__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 12px; } .client-profile-overview__name { color: var(--color-dark-1); font-size: 20px; font-weight: 700; line-height: 1.25; } .client-profile-overview__meta { color: #64748b; font-size: 14px; margin-top: 2px; } .client-profile-status { display: inline-flex; align-items: center; flex: 0 0 auto; min-height: 28px; padding: 5px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; } .client-profile-status--success { background: #dcfce7; color: #15803d; } .client-profile-status--warning { background: #fef3c7; color: #92400e; } .client-profile-status--danger { background: #fee2e2; color: #b91c1c; } .client-profile-progress { max-width: 520px; } .client-profile-progress__meta { display: flex; justify-content: space-between; gap: 12px; color: #64748b; font-size: 13px; margin-bottom: 6px; } .client-profile-progress__meta strong { color: var(--color-dark-1); } .client-profile-progress__bar { height: 8px; overflow: hidden; border-radius: 999px; background: #e5e7eb; } .client-profile-progress__bar span { display: block; height: 100%; border-radius: inherit; background: var(--color-yellow-1); } .client-profile-count { display: inline-flex; align-items: center; min-height: 26px; padding: 4px 9px; border-radius: 999px; background: #fff; color: #64748b; font-size: 12px; font-weight: 600; } .client-profile-tabs__controls { display: flex; flex-wrap: nowrap; gap: 8px; padding: 6px; border: 1px solid #e5e7eb; border-radius: 12px; background: #f8fafc; overflow-x: auto; white-space: nowrap; } .client-profile-tabs__item { flex: 1 1 0; min-width: 210px; } .client-profile-tabs__button { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; width: 100%; min-height: 48px; padding: 9px 12px; border: 0; border-radius: 8px; background: transparent; color: #64748b; font-size: 15px; font-weight: 600; line-height: 1.25; text-align: left; transition: background .15s ease, color .15s ease, box-shadow .15s ease; } .client-profile-tabs__button:hover { color: var(--color-dark-1) !important; background: #fff; } .client-profile-tabs__button.is-tab-el-active { color: #fff !important; background: var(--color-blue-1); box-shadow: 0 5px 14px rgba(16, 41, 63, 0.18); } .client-profile-tabs__button.button-disabled { cursor: not-allowed; opacity: .5; } .client-profile-tabs__button.button-disabled:hover { color: #64748b !important; background: transparent; } .client-profile-tabs__icon { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: rgba(16, 41, 63, 0.08); color: var(--color-dark-1); font-size: 12px; } .client-profile-tabs__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; padding: 0 8px; } .client-profile-tabs__status { display: inline-flex; align-items: center; min-height: 22px; padding: 3px 7px; border-radius: 999px; font-size: 11px; font-weight: 700; background: #e5e7eb; color: #475569; } .client-profile-tabs__status--done { background: #dcfce7; color: #15803d; } .client-profile-tabs__status--pending { background: #fef3c7; color: #92400e; } .client-profile-tabs__status--info { background: #e0f2fe; color: #0369a1; } .client-profile-tabs__status--todo { background: #fee2e2; color: #b91c1c; } .client-profile-tabs__button.is-tab-el-active .client-profile-tabs__icon { background: rgba(255, 255, 255, 0.18); color: #fff; } .client-profile-tabs__button.is-tab-el-active .client-profile-tabs__status { background: rgba(255, 255, 255, 0.18); color: #fff; } .client-profile-form { width: 100%; } .client-profile-section { padding: 20px; margin-bottom: 18px; border: 1px solid #e5e7eb; border-radius: 12px; background: #fff; } .client-profile-section__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 18px; } .client-profile-link-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px; border: 1px solid #e5e7eb; border-radius: 10px; background: #f8fafc; } .client-profile-field-note { display: flex; align-items: flex-start; gap: 7px; margin-top: 6px; color: #64748b; font-size: 12px; line-height: 1.35; } .client-profile-field-note i { flex: 0 0 auto; color: var(--color-yellow-1); font-size: 11px; margin-top: 2px; } .client-profile-savebar { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; padding: 16px 0 4px; } .client-profile-save-status { color: #94a3b8; font-size: 13px; font-weight: 600; } .client-profile-save-status.is-dirty { color: #92400e; } .client-profile-submit.button-disabled, .client-profile-submit:disabled { opacity: .55; cursor: not-allowed; } .profile-proof-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .profile-proof-card { padding: 16px; border: 1px solid #e5e7eb; border-radius: 12px; background: #f8fafc; } .profile-proof-card--wide { grid-column: 1 / -1; } .profile-proof-card.has-file { border-color: #bbf7d0; background: #f0fdf4; } .profile-proof-card__head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; } .profile-proof-card__icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%; background: #fff; color: var(--color-blue-1); box-shadow: inset 0 0 0 1px #e5e7eb; } .profile-proof-card__upload { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 14px; } .profile-proof-card__upload .temp-name { min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .profile-destinations-list { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; margin: 0; list-style: none; } .profile-destination-card { display: inline-flex; align-items: center; max-width: 100%; min-height: 42px; padding: 7px 8px 7px 12px; border: 1px solid #e5e7eb; border-radius: 22px; background: #fff; color: var(--color-dark-1); box-shadow: 0 3px 10px rgba(16, 41, 63, 0.06); transition: background .15s ease, border-color .15s ease, opacity .15s ease; } .profile-destination-card__icon { flex: 0 0 auto; color: var(--color-yellow-1); font-size: 14px; margin-right: 8px; } .profile-destination-card__name { min-width: 0; max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: 600; line-height: 1.3; } .profile-destination-card__remove { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 26px; height: 26px; margin-left: 8px; padding: 0; border: none; border-radius: 50%; background: #f3f4f6; color: #6b7280; cursor: pointer; transition: background .15s ease, color .15s ease; } .profile-destination-card__remove:hover { background: #fee2e2; color: #b91c1c; } .profile-destination-card.is-removing { opacity: .55; background: #f9fafb; border-color: #d1d5db; } .profile-destination-card.is-removing .profile-destination-card__name { text-decoration: line-through; } .profile-destination-card.is-removing .profile-destination-card__remove { background: #dcfce7; color: #15803d; } .profile-destinations-empty { display: flex; align-items: center; gap: 10px; padding: 14px; border: 1px dashed #cbd5e1; border-radius: 12px; background: #f8fafc; color: #64748b; font-size: 14px; } .profile-destinations-empty__icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; background: #fff; color: var(--color-yellow-1); } @media (max-width: 575px) { .client-profile-card { padding: 16px !important; margin-left: -10px; margin-right: -10px; } .client-profile-overview { align-items: flex-start; gap: 12px; padding: 14px; } .client-profile-overview__avatar { width: 62px; height: 62px; } .client-profile-overview__top { flex-direction: column; gap: 8px; margin-bottom: 10px; } .client-profile-overview__name { font-size: 17px; } .client-profile-overview__meta, .client-profile-progress__meta { font-size: 12px; } .client-profile-tabs__controls { flex-direction: column; gap: 6px; padding: 8px; overflow: visible; white-space: normal; } .client-profile-tabs__item { flex: 1 1 auto; width: 100%; min-width: 0; } .client-profile-tabs__button { grid-template-columns: 28px minmax(0, 1fr) auto; min-height: 46px; padding: 9px 10px; background: #fff; color: var(--color-dark-1); font-size: 14px; box-shadow: inset 0 0 0 1px #e5e7eb; } .client-profile-tabs__button.is-tab-el-active { box-shadow: 0 5px 14px rgba(16, 41, 63, 0.14); } .client-profile-tabs__icon { width: 28px; height: 28px; } .client-profile-tabs__label { padding-right: 6px; } .client-profile-tabs__status { font-size: 10px; } .client-profile-section { padding: 14px; margin-bottom: 14px; } .client-profile-section__head { flex-direction: column; gap: 8px; margin-bottom: 14px; } .client-profile-link-card, .client-profile-savebar { align-items: stretch; flex-direction: column; } .client-profile-savebar { position: sticky; bottom: 0; z-index: 5; width: calc(100% + 32px); margin: 0 0 -16px -16px; padding: 12px 16px 16px; border-top: 1px solid #e5e7eb; background: #fff; box-shadow: 0 -8px 18px rgba(16, 41, 63, 0.08); box-sizing: border-box; } .client-profile-submit { width: 100%; justify-content: center; } .profile-proof-grid { grid-template-columns: 1fr; } .profile-proof-card--wide { grid-column: auto; } .profile-proof-card__upload { align-items: stretch; flex-direction: column; } .profile-proof-card__upload .button { justify-content: center; width: 100%; } .profile-destination-card { width: 100%; } .profile-destination-card__name { max-width: none; flex: 1 1 auto; } } /* HOUSE DESCRIPTION */ .form-input-house-price .rating-container .caption > span { background-color: transparent !important; color: black !important; box-shadow: none; } /* FILTER PRICE */ #CaptionEstimation > span { background-color: transparent !important; color: black !important; box-shadow: none; } /* TABULATOR */ .tabulator-row .tabulator-responsive-collapse { border: none; padding: 0; } .tabulator-row .tabulator-responsive-collapse > div { border-top: 1px solid #aaa; border-bottom: 1px solid #aaa; box-sizing: border-box; padding: 5px; } .tabulator-row .tabulator-responsive-collapse > div:empty { display: none; border: none; padding: 0; } @media (max-width: 768px) { .tabulator .tabulator-responsive-collapse { max-width: 100%; min-width: 0; overflow-x: hidden; } .tabulator .tabulator-responsive-collapse, .tabulator .tabulator-responsive-collapse * { white-space: normal !important; overflow-wrap: anywhere !important; word-break: break-word !important; } .tabulator .tabulator-responsive-collapse a { display: inline; max-width: 100%; } } /* ECHANGE CASE */ .br-excase { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 10px; align-items: stretch; } .br-excase__separator { display: flex; align-items: center; justify-content: center; width: 54px; min-width: 54px; } .br-excase__separatorIcon { width: 42px; height: 42px; border-radius: 999px; display: flex; align-items: center; justify-content: center; background: var(--color-light-3); border: 1px solid rgba(0,0,0,.06); } .br-excase__panel { background: var(--color-light-3); border: 1px solid rgba(0,0,0,.06); border-radius: 12px; padding: 16px; min-width: 0; display: flex; flex-direction: column; gap: 14px; margin-top: 10px; } .br-excase__media { width: 100%; height: clamp(200px, 45vh, 250px); overflow: hidden; } .br-excase__homeImg { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; } /* Mobile: stack + arrow rotated */ @media (max-width: 768px) { .br-excase { grid-template-columns: 1fr; padding-left: 1px; padding-right: 1px; } .br-excase__separator { width: 100%; min-width: 0; } .br-excase__separatorIcon i { transform: rotate(90deg); } } /* HOME USERBOARD REQUETS */ .br-pendingUser { width: 170px; min-width: 170px; justify-content: flex-start; } .br-pendingUser .lh-15 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .br-pendingBtn { min-width: 190px; justify-content: center; } /* FORMATIONS */ #FormationSearchFilters input { border: 1px solid #ced4da !important; outline: 0 !important; background-color: #fff !important; } .formation-title-clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .formation-description-clamp { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .formation-result-item__actions .button { max-width: 250px; width: 100%; } .formation-result-item__logo { max-width: 200px; } .formation-result-item__logo img { max-height: 85px; } @media (max-width: 991px) { .formation-result-item__logo { max-width: 100%; width: 100%; } .formation-result-item__logo img { max-height: 85px; max-width: 200px; } .formation-result-item__actions { align-items: flex-start !important; } .formation-result-item__actions .button { max-width: 100%; } } @media (min-width: 768px) { .formations-filters-container { display: block !important; } } @media (max-width: 767px) { .formations-filters-container { display: none; margin-top: 15px; } } /* CARTE LOGEMENTS AUTOUR FORMATION */ .formation-marker div { width: 18px; height: 18px; background: var(--color-yellow-1); border-radius: 50% 50% 50% 0; transform: rotate(-45deg); position: relative; } .formation-marker div::after { content: ''; width: 8px; height: 8px; background: white; border-radius: 50%; position: absolute; top: 5px; left: 5px; } /* CREATE HOUSE */ .progress-bar-create-house { background-color: var(--color-yellow-1) !important; } .wizard-create-page { min-height: calc(100vh - var(--header-height)); display: flex; flex-direction: column; } .create-house-step { flex: 1; display: flex; flex-direction: column; padding: 40px 100px 40px 100px; } .wizard-create-form { flex: 1; display: flex; flex-direction: column; } .wizard-create-content { flex: 1; } .wizard-create-footer { margin-top: auto; } @media (max-width: 767px) { .create-house-step { padding: 20px 10px 20px 10px; } } /* STEP TYPE */ .house-type-list { display: flex; flex-direction: column; max-width: 500px; width: 100%; } .house-type-input { position: absolute; opacity: 0; width: 0; height: 0; } .house-type-card { display: block; width: 100%; margin-bottom: 10px; padding: 16px 18px; border-radius: 12px; border: 1px solid rgba(0,0,0,.12); background: #fff; cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease, transform .05s ease; position: relative; } .house-type-card:hover { border: 2px solid rgba(216,158,48); } .house-type-card:active { transform: translateY(1px); } .house-type-icon i { font-size: 22px; } .house-type-input:checked + .house-type-card .house-type-icon i { color: var(--color-yellow-1); } .house-type-input:checked + .house-type-card { border-width: 2px; border-color: var(--color-yellow-1); box-shadow: 0 0 0 4px rgba(216, 158, 48, .18); } .house-type-title { font-weight: 600; font-size: 16px; line-height: 1.2; } .house-type-desc { margin-top: 4px; font-size: 13px; color: rgba(0,0,0,.65); } /* STEP LOCATION */ #addressFormBox select, #addressFormBox input { border: 1px solid #ced4da !important; outline: 0 !important; background-color: #fff !important; } #addressFormBox input[type="checkbox"] { width: revert !important; } .br-marker--house { width: 26px; height: 26px; border-radius: 50%; background: url('/Content/images/accueil.png') center center / contain no-repeat; } /* STEP ROOMS */ #roomsFormBox input { border: 1px solid #ced4da !important; outline: 0 !important; background-color: #fff !important; } .house-room { display: flex; flex-direction: column; max-width: 500px; width: 100%; } /* STEP BEDDING */ #beddingFormBox input { border: 1px solid #ced4da !important; outline: 0 !important; background-color: #fff !important; } .house-bedding { display: flex; flex-direction: column; max-width: 500px; width: 100%; } /* STEP ENVIRONMENT */ .house-environment-list { display: flex; flex-direction: column; max-width: 750px; width: 100%; } .house-environment-card { border: 2px solid #e6e6e6; background: #fff; } .house-environment-card:hover { box-shadow: 0 8px 18px rgba(0,0,0,.06); } .house-environment-card.is-selected { border-color: var(--color-yellow-1); box-shadow: 0 0 0 2px rgba(216,158,48,.25); } /* STEP EQUIPMENT */ .house-equipment-list { display: flex; flex-direction: column; max-width: 750px; width: 100%; } .house-equipment-card { border: 2px solid #e6e6e6; background: #fff; } .house-equipment-card:hover { box-shadow: 0 8px 18px rgba(0,0,0,.06); } .house-equipment-card.is-selected { border-color: var(--color-yellow-1); box-shadow: 0 0 0 2px rgba(216,158,48,.25); } /* STEP PHOTOS */ .house-photos-dropzone { border: 2px dashed #d6d6d6; background: #fff; } .house-photos-dropzone.is-dragover { border-color: var(--color-yellow-1); box-shadow: 0 0 0 2px rgba(216,158,48,.2); } .br-photo-wrapper { position: relative; width: 100%; padding-top: 100%; /* ratio 1:1 */ background: #f5f5f5; } .br-photo-wrapper img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } .br-photo-drag-zone { cursor: move; } .br-photo-drag-zone .br-drag-handle { position: absolute; top: 10px; right: 10px; z-index: 2; width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(0, 0, 0, .72); color: #fff; font-size: 18px; box-shadow: 0 4px 12px rgba(0, 0, 0, .35); pointer-events: none; } .br-photo-drag-zone:hover .br-drag-handle { background: rgba(216, 158, 48, .95); } #br-pictures-grid .shadow-2 { height: 100%; display: flex; flex-direction: column; } #br-pictures-grid .shadow-2 > .br-photo-wrapper { flex-shrink: 0; } /* STEP TITLE / TEXTS / MODALITIES / CANCELLATION */ .house-title { display: flex; flex-direction: column; max-width: 750px; width: 100%; } #titleFormBox input { border: 1px solid #ced4da !important; outline: 0 !important; background-color: #fff !important; } /* STEP RULES */ #rulesFormBox input { border: 1px solid #ced4da !important; outline: 0 !important; background-color: #fff !important; } #rulesFormBox input[type="checkbox"] { width: revert !important; } /* STEP PRICES */ #priceFormBox input { border: 1px solid #ced4da !important; outline: 0 !important; background-color: #fff !important; } #priceFormBox input[type="checkbox"] { width: revert !important; } /* EDIT HOUSE */ .edit-house-split { height: calc(100vh - var(--header-height)); } .edit-house-left, .edit-house-right, .edit-house-right-inner { height: 100%; overflow: hidden; } .edit-house-left-inner { height: 100%; min-height: 100%; } .edit-house-sticky-header { position: sticky; top: 0; z-index: 10; background: #fff; border-bottom: 1px solid rgba(0,0,0,.06); } .edit-house-sticky-footer { position: sticky; bottom: 0; z-index: 20; background: #fff; border-top: 1px solid rgba(0,0,0,.06); } .edit-house-left-scroll-wrap { position: relative; flex: 1 1 auto; overflow: hidden; } .edit-house-left-sticky { position: sticky; top: 0; z-index: 20; background: #fff; } .edit-house-left-scroll { height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-bottom: 90px; } .edit-house-left-footer { position: sticky; bottom: 0; background: #fff; border-top: 1px solid rgba(0,0,0,.06); z-index: 20; } .edit-house-scroll { flex: 1 1 auto; min-height: 0; overflow: auto; -webkit-overflow-scrolling: touch; } .edit-house-header { position: relative; display: flex; align-items: center; justify-content: center; } .edit-house-left-overlay { position: sticky; bottom: 18px; display: flex; justify-content: center; z-index: 30; pointer-events: none; } @media (max-width: 991.98px) { .edit-house-split { height: auto; min-height: 0; } .edit-house-left { display: block; } .edit-house-left, .edit-house-right, .edit-house-right-inner, .edit-house-left-inner { height: auto; min-height: 0; overflow: visible; } .edit-house-scroll, .edit-house-left-scroll { height: auto; overflow: visible; padding-bottom: 0; } .edit-house-left-scroll-wrap { overflow: visible; } .edit-house-sticky-header, .edit-house-sticky-footer, .edit-house-left-sticky, .edit-house-left-footer { background: #fff; } .edit-house-split.mobile-show-menu #editHouseLeft { display: block; } .edit-house-split.mobile-show-menu #editHouseRight { display: none; } .edit-house-split.mobile-show-step #editHouseLeft { display: none; } .edit-house-split.mobile-show-step #editHouseRight { display: block; } .edit-house-mobile-header { position: sticky; top: 0; z-index: 30; background: #fff; padding: 14px 16px; border-bottom: 1px solid rgba(0,0,0,.06); } .edit-house-left a.is-active { border: none !important; } .edit-house-left a.is-active:hover { border-color: rgba(0,0,0,.08) !important; } .edit-house-left-overlay { position: fixed; left: 0; right: 0; bottom: 16px; z-index: 999; pointer-events: none; padding: 0 16px; } .edit-house-left-overlay .btn-preview-pill { width: 100%; max-width: 250px; justify-content: center; } .edit-house-left-scroll { padding-bottom: 90px; } } .edit-house-step-preview-line { display: flex; align-items: center; gap: 8px; } .edit-house-step-preview-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; } .edit-house-step-preview-chip-line { } .edit-house-step-preview-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border-radius: 999px; background: rgba(0,0,0,0.04); font-size: 13px; line-height: 1; } .edit-house-step-preview-chip-icon { width: 14px; height: 14px; object-fit: contain; } .edit-house-step-preview-chip-icon i { font-size: 13px; } .edit-house-step-preview-chips-more { background: rgba(0,0,0,0.08); font-weight: 600; font-style: italic; } .edit-house-step-preview-photo img { width: 100%; height: 220px; object-fit: cover; border-radius: 12px; display: block; margin-top: 10px } .btn-preview-pill { pointer-events: auto; } .header-title { text-align: center; } /* NOS OFFRES */ @media (min-width: 1200px) { .br-plan-card .br-plan-top { min-height: 250px; } .br-plan-card .br-plan-price { min-height: 70px; } .br-plan-card .br-plan-intro { min-height: 90px; } .br-plan-card .br-plan-bottom { min-height: 130px; } } .br-plan-badges { min-width: 120px; } .br-plan-bottom .btn { width: 100%; } /* CLIENT OFFRES */ @media (min-width: 1200px) { .br-offer-plan-card .br-offer-plan-top { min-height: 380px; } .br-offer-plan-card .br-offer-plan-price { min-height: 70px; } .br-offer-plan-card .br-offer-plan-intro { min-height: 90px; } .br-offer-plan-card .br-offer-plan-bottom { min-height: 130px; } } /* HowItWorks */ .howitworks .steps-container { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 20px; } .howitworks .step-item { flex: 1 1 220px; max-width: 260px; } .howitworks .step-arrow { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; } .howitworks .step-arrow img { width: 100px; } @media (max-width: 768px) { .howitworks .step-arrow { display: none; } } .howitworks .step-card { text-align: center; } .howitworks .step-icon { position: relative; width: 100px; height: 100px; margin: 0 auto; border-radius: 50%; background: #EEF6FF; /* équivalent bg-info-1 */ display: flex; align-items: center; justify-content: center; } .howitworks .step-icon img { max-width: 60px; max-height: 60px; } .howitworks .opportunities img { max-width: 70px; max-height: 70px; } .howitworks .step-badge { position: absolute; top: -5px; right: -5px; width: 32px; height: 32px; background: var(--color-yellow-1); color: #fff; font-size: 14px; border-radius: 50%; display: flex; align-items: center; justify-content: center; } .howitworks .step-title { font-weight: 600; font-size: 16px; margin-top: 20px; } .howitworks .step-text { font-size: 14px; margin-top: 10px; } /* ============================================================ USER BADGE CARDS ============================================================ */ .user-badge-list { display: flex; flex-wrap: wrap; gap: 12px; } .user-badge-card { display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; text-align: center; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); } .user-badge-card__icon { font-size: 26px; margin-bottom: 10px; } .user-badge-card__label { font-size: 12px; font-weight: 600; } .user-badge-card__desc { font-size: 11px; opacity: 0.85; line-height: 1.3; } .user-badge-card--member-verified { background-color: #3b82f6; } .user-badge-card--host-verified { background-color: #22c55e; } .user-badge-card--host-ambassador { background-color: #8b5cf6; } .user-badge-card--founder-host { background-color: #f59e0b; } .user-badge-card--founder-member { background-color: #f59e0b; } .user-badge-card--default { background-color: #6b7280; } /* ============================================================ CHECKOUT BOOKING ============================================================ */ .checkout-booking-type-list, .checkout-exchange-home-list, .checkout-payment-list { display: flex; gap: 12px; margin-top: 16px; } .checkout-booking-type-list { flex-wrap: wrap; } .checkout-exchange-home-list, .checkout-payment-list { flex-direction: column; } .checkout-payment-list { margin-top: 10px; /* max-width: 400px;*/ } .checkout-booking-type-item, .checkout-exchange-home-item, .checkout-payment-item { margin: 0; cursor: pointer; } .checkout-booking-type-item { flex: 1 1 220px; } .checkout-exchange-home-item, .checkout-payment-item { flex: 1 1 100%; width: 100%; } .checkout-booking-type-item input[type="radio"], .checkout-exchange-home-item input[type="radio"], .checkout-payment-item input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; } .checkout-booking-type-card, .checkout-exchange-home-card, .checkout-payment-card { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 0 16px; border: 1px solid #d9e2ec; border-radius: 12px; transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease; } .checkout-booking-type-dot, .checkout-exchange-home-dot, .checkout-payment-dot { width: 18px; height: 18px; border: 2px solid var(--color-yellow-1); border-radius: 50%; position: relative; flex: 0 0 18px; } .checkout-booking-type-dot::after, .checkout-exchange-home-dot::after, .checkout-payment-dot::after { content: ""; position: absolute; top: 50%; left: 50%; width: 8px; height: 8px; border-radius: 50%; background: var(--color-yellow-1); transform: translate(-50%, -50%) scale(0); transition: transform .2s ease; } .checkout-booking-type-item input[type="radio"]:checked + .checkout-booking-type-card, .checkout-exchange-home-item input[type="radio"]:checked + .checkout-exchange-home-card, .checkout-payment-item input[type="radio"]:checked + .checkout-payment-card { border-color: var(--color-yellow-1); background: #f5f8fb; box-shadow: inset 0 0 0 1px var(--color-yellow-1); } .checkout-booking-type-item input[type="radio"]:checked + .checkout-booking-type-card .checkout-booking-type-dot::after, .checkout-exchange-home-item input[type="radio"]:checked + .checkout-exchange-home-card .checkout-exchange-home-dot::after, .checkout-payment-item input[type="radio"]:checked + .checkout-payment-card .checkout-payment-dot::after { transform: translate(-50%, -50%) scale(1); } .checkout-payment-list-disabled .checkout-payment-item { opacity: .55; cursor: not-allowed; filter: grayscale(20%); box-shadow: none; } #SubmitCheckoutRequest[disabled] { opacity: .55; cursor: not-allowed; filter: grayscale(20%); box-shadow: none; } .checkout-dates-popup { overflow: hidden; } .checkout-dates-popup__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; } .checkout-dates-popup__footer { flex: 0 0 auto; } @media (max-width: 767px) { .checkout-dates-popup, .checkout-travelers-popup { top: 50%; width: calc(100vw - 24px); max-width: calc(100vw - 24px); height: auto !important; max-height: calc(100vh - 24px); transform: translate(-50%, -50%); } .checkout-travelers-popup { } } /* ========================================== OPPORTUNITY ========================================== */ .br-opportunity-empty { max-width: 900px; margin-left: auto; margin-right: auto; } .progress-bar-create-opportunity { background-color: var(--color-yellow-1) !important; } .create-opportunity-step { flex: 1; display: flex; flex-direction: column; padding: 40px 100px 40px 100px; } @media (max-width: 767px) { .create-opportunity-step { padding: 20px 10px 20px 10px; } } .opportunity-photos-dropzone { border: 2px dashed #d6d6d6; background: #fff; } .opportunity-photos-dropzone.is-dragover { border-color: var(--color-yellow-1); box-shadow: 0 0 0 2px rgba(216,158,48,.2); } .opp-toggle-card { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 0 16px; border: 1px solid #E5E7EB; border-radius: 10px; background: #fff; font-size: 14px; font-weight: 500; cursor: pointer; transition: all .15s ease; } .opp-toggle-card:hover { border-color: var(--color-yellow-1); background: #FFF9F0; } .opp-toggle-card.selected { border-color: var(--color-yellow-1); background: #FFF4E5; color: #111827; } /* EDIT OPPORTUNITY */ .edit-opportunity-step-preview-line { display: flex; align-items: center; gap: 8px; } .edit-opportunity-step-preview-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; } .edit-opportunity-step-preview-chip-line { } .edit-opportunity-step-preview-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border-radius: 999px; background: rgba(0,0,0,0.04); font-size: 13px; line-height: 1; } .edit-opportunity-step-preview-chip-icon { width: 14px; height: 14px; object-fit: contain; } .edit-opportunity-step-preview-chip-icon i { font-size: 13px; } .edit-opportunity-step-preview-chip-more, .edit-opportunity-step-preview-chips-more { background: rgba(0,0,0,0.08); font-weight: 600; font-style: italic; } .edit-opportunity-step-preview-photo img { width: 100%; height: 220px; object-fit: cover; border-radius: 12px; display: block; margin-top: 10px } .edit-opportunity-split { height: calc(100vh - var(--header-height)); } .edit-opportunity-left, .edit-opportunity-right, .edit-opportunity-right-inner { height: 100%; overflow: hidden; } .edit-opportunity-left-inner { height: 100%; min-height: 100%; } .edit-opportunity-sticky-header { position: sticky; top: 0; z-index: 10; background: #fff; border-bottom: 1px solid rgba(0,0,0,.06); } .edit-opportunity-sticky-footer { position: sticky; bottom: 0; z-index: 20; background: #fff; border-top: 1px solid rgba(0,0,0,.06); } .edit-opportunity-left-scroll-wrap { position: relative; flex: 1 1 auto; overflow: hidden; } .edit-opportunity-left-sticky { position: sticky; top: 0; z-index: 20; background: #fff; } .edit-opportunity-left-scroll { height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-bottom: 90px; } .edit-opportunity-scroll { flex: 1 1 auto; min-height: 0; overflow: auto; -webkit-overflow-scrolling: touch; } .edit-opportunity-header { position: relative; display: flex; align-items: center; justify-content: center; } @media (max-width: 991.98px) { .edit-opportunity-split { height: auto; min-height: 0; } .edit-opportunity-left { display: block; } .edit-opportunity-left, .edit-opportunity-right, .edit-opportunity-right-inner, .edit-opportunity-left-inner { height: auto; min-height: 0; overflow: visible; } .edit-opportunity-scroll, .edit-opportunity-left-scroll { height: auto; overflow: visible; padding-bottom: 0; } .edit-opportunity-left-scroll-wrap { overflow: visible; } .edit-opportunity-sticky-header, .edit-opportunity-sticky-footer, .edit-opportunity-left-sticky { background: #fff; } .edit-opportunity-split.mobile-show-menu #editOpportunityLeft { display: block; } .edit-opportunity-split.mobile-show-menu #editOpportunityRight { display: none; } .edit-opportunity-split.mobile-show-step #editOpportunityLeft { display: none; } .edit-opportunity-split.mobile-show-step #editOpportunityRight { display: block; } .edit-opportunity-mobile-header { position: sticky; top: 0; z-index: 30; background: #fff; border-bottom: 1px solid rgba(0,0,0,.06); } .edit-opportunity-left a.is-active { border: none !important; } .edit-opportunity-left a.is-active:hover { border-color: rgba(0,0,0,.08) !important; } .edit-opportunity-left-scroll { padding-bottom: 90px; } } /* TYPE + TITLE */ .opportunity-type-list { display: flex; flex-direction: column; max-width: 700px; width: 100%; } .opportunity-type-input { position: absolute; opacity: 0; width: 0; height: 0; } .opportunity-type-card { display: block; width: 100%; margin-bottom: 10px; padding: 16px 18px; border-radius: 12px; border: 1px solid rgba(0,0,0,.12); background: #fff; cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease, transform .05s ease; position: relative; } .opportunity-type-card:hover { border: 2px solid rgba(216,158,48); } .opportunity-type-card:active { transform: translateY(1px); } .opportunity-type-icon i { font-size: 22px; } .opportunity-type-input:checked + .opportunity-type-card .opportunity-type-icon i { color: var(--color-yellow-1); } .opportunity-type-input:checked + .opportunity-type-card { border-width: 2px; border-color: var(--color-yellow-1); box-shadow: 0 0 0 4px rgba(216, 158, 48, .18); } .opportunity-type-title { font-weight: 600; font-size: 16px; line-height: 1.2; } .opportunity-type-desc { margin-top: 4px; font-size: 13px; color: rgba(0,0,0,.65); } /* JOBS */ .opportunity-jobs-list { display: flex; flex-direction: column; max-width: 700px; width: 100%; } .job-item .card-job { border: 1px solid #E5E7EB; transition: all 0.15s ease; } .card-job:hover { border-color: var(--color-yellow-1); background-color: #FFF9F0; } .card-job.-selected { border-color: var(--color-yellow-1); background-color: #FFF4E5; } .card-job { min-height: 48px; cursor: pointer; } .card-job .text-15 { line-height: 1.3; } .card-job:active { transform: scale(0.98); } .opp-job-check { width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .opp-job-check i { font-size: 18px; color: var(--color-yellow-1); line-height: 1; } /* DATES */ .opportunity-dates { display: flex; flex-direction: column; max-width: 700px; width: 100%; } /* LOCATION+HOUSE */ .housing-card { position: relative; border: 1px solid #E5E7EB; border-radius: 12px; overflow: hidden; cursor: pointer; transition: all 0.2s ease; background: #fff; } .housing-card:hover { border-color: var(--color-yellow-1); } .housing-card.selected { border: 2px solid var(--color-yellow-1); } .housing-img { height: 120px; overflow: hidden; } .housing-img img { width: 100%; height: 100%; object-fit: cover; } .housing-body { padding: 10px; } .housing-check { position: absolute; top: 8px; right: 8px; width: 22px; height: 22px; border-radius: 50%; background: var(--color-yellow-1); display: flex; align-items: center; justify-content: center; opacity: 0; transform: scale(0.8); transition: all 0.15s ease; } .housing-card.selected .housing-check { opacity: 1; transform: scale(1); } .housing-check i { color: #fff; font-size: 12px; } /* REMUNERATION */ .opportunity-remuneration { display: flex; flex-direction: column; max-width: 700px; width: 100%; } /* MODALITES */ .opportunity-modalities { display: flex; flex-direction: column; max-width: 700px; width: 100%; } /* DESCRIPTION */ .opportunity-description { display: flex; flex-direction: column; max-width: 700px; width: 100%; } /* SYSTEM MESSAGE */ .br-msgRow.is-system { justify-content: center; } .br-msgBubble--system { background-color: #f0f0f0; color: #888; font-style: italic; font-size: 12px; text-align: center; border-radius: 8px; padding: 6px 14px; max-width: 420px; } /* HOME INTEREST */ .br-house-interest-popup { display: flex; align-items: center; justify-content: center; padding: 16px !important; } .br-house-interest-popup .br-house-interest-dialog { position: relative; left: auto; width: 720px; max-width: calc(100vw - 32px); max-height: calc(100vh - 32px); overflow: hidden; transform: none; } .br-house-interest-header, .br-house-interest-alert, .br-house-interest-actions { flex: 0 0 auto; } .br-house-interest-form { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; } .br-house-interest-scroll, .br-house-interest-success { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; } .br-house-interest-actions { gap: 10px; background: #fff; } #HouseInterestForm input { border: 1px solid #ced4da !important; outline: 0 !important; background-color: #fff !important; } @supports (height: 100dvh) { .br-house-interest-popup .br-house-interest-dialog { max-height: calc(100dvh - 32px); } } @media (max-width: 767px) { .br-house-interest-popup { padding: 10px !important; } .br-house-interest-popup .br-house-interest-dialog { width: calc(100vw - 20px); max-width: calc(100vw - 20px); max-height: calc(100vh - 20px); } .br-house-interest-actions { justify-content: space-between; } .br-house-interest-actions .button { flex: 1 1 0; min-width: 0; white-space: nowrap; } } @media (max-width: 767px) { @supports (height: 100dvh) { .br-house-interest-popup .br-house-interest-dialog { max-height: calc(100dvh - 20px); } } } /* SAVED SEARCHES */ #SavedSearchesTable .saved-search-mobile-list { display: flex; flex-direction: column; gap: 16px; } #SavedSearchesTable .saved-search-mobile-card { border: 1px solid #e5e7eb; border-radius: 16px; padding: 16px; background: #fff; box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06); } #SavedSearchesTable .saved-search-mobile-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #f1f5f9; } #SavedSearchesTable .saved-search-mobile-row:last-of-type { margin-bottom: 0; } #SavedSearchesTable .saved-search-mobile-alert { min-width: 0; } #SavedSearchesTable .saved-search-mobile-label { color: #64748b; font-size: 13px; flex: 0 0 110px; } #SavedSearchesTable .saved-search-mobile-value { min-width: 0; text-align: right; flex: 1 1 auto; } #SavedSearchesTable .saved-search-mobile-row--toggle .saved-search-mobile-value { display: flex; justify-content: flex-end; } #SavedSearchesTable .saved-search-mobile-actions { display: flex; gap: 10px; margin-top: 14px; } #SavedSearchesTable .saved-search-mobile-action { flex: 1 1 0; justify-content: center; margin: 0 !important; } #SavedSearchesTable .saved-search-mobile-action--disabled { pointer-events: none; opacity: 0.55; } @media (min-width: 769px) { #SavedSearchesTable .saved-search-mobile-list { display: none; } } /* GLightbox : boutons précédent/suivant visibles sur mobile */ @media (max-width: 768px) { .glightbox-clean .gnext, .glightbox-clean .gprev { top: 45%; } .glightbox-clean .gnext { right: 10px; } .glightbox-clean .gprev { left: 10px; } } /* SHARE */ .js-share-button { position: relative; } .js-share-button.is-share-copied::after { content: attr(data-share-feedback); position: absolute; left: 50%; bottom: calc(100% + 8px); z-index: 30; transform: translateX(-50%); padding: 5px 9px; border-radius: 4px; background: var(--color-blue-1); color: #fff; font-size: 12px; line-height: 1; white-space: nowrap; pointer-events: none; box-shadow: 0 6px 18px rgba(0,0,0,.12); } .galleryGrid__share { position: absolute; top: 12px; left: 12px; z-index: 12; width: 42px; height: 42px; min-width: 42px; padding: 0; border-radius: 50%; display: flex; align-items: center; justify-content: center; } .galleryGrid__share.is-share-copied::after { top: calc(100% + 8px); bottom: auto; left: 0; transform: none; } .br-share-icon-button { width: 40px; min-width: 40px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }