/* Fonts */
@font-face {
    font-family: "Outfit";
    src: url("../fonts/Outfit.503761edaa25.ttf") format("truetype");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
}

/* Variables */
:root {
    /* Colors */
    --base-old:#f7f8f7;
    --base:#ffffff;
    --white: #ffffff;
    --black: #111111;
    --red: #dc3545;

    --topbar-height: 50px;
    --leftbar-width: 225px;
    --leftbar-collapsed-width: 50px;
    --leftbar-toggle-size: 36px;
    --leftbar-padding-top: 0.25rem;

    --color-green-900: #0B1916;
    --color-green-800: #1C3B34;
    --color-green-700: #2C5E53;
    --color-green-600: #3C8172;
    --color-green-500: #4DA390;
    --color-green-400: #6AB9A8;
    --color-green-300: #8DC9BC;
    --color-green-200: #AFDAD0;
    --color-green-100: #D2EAE5;
    --color-green-50: #E3F2EF;

    --color-yellow-500: #FFAC0F;
    --color-yellow-400: #FFBE42;
    --color-yellow-300: #FFD075;
    --color-yellow-200: #FFE1A8;
    --color-yellow-100: #FFF3DB;

    --color-red-50: #f4dedf;
    --color-red-100: #e9bebf;
    --color-red-200: #E5B3B4;
    --color-red-300: #D88D8E;
    --color-red-400: #CB6769;
    --color-red-500: #BE4143;
    --color-red-600: #983436;
    --color-red-700: #722728;
    --color-red-800: #4C1A1B;
    
    --color-purple-50: #F2E3E7;
    --color-purple-100: #EAD2D8;
    --color-purple-200: #DAAFB9;
    --color-purple-300: #C98D9B;
    --color-purple-400: #B96A7D;
    --color-purple-500: #A34D61;
    --color-purple-600: #813C4D;
    --color-purple-700: #5e2c38;
    --color-purple-800: #3B1C23;
    --color-purple-900: #190B0F;

    --color-grey-50: #F9F9F9;
    --color-grey-100: #EDEDED;
    --color-grey-200: #D3D3D3;
    --color-grey-300: #BABABA;
    --color-grey-400: #A0A0A0;
    --color-grey-500: #878787;
    --color-grey-600: #6D6D6D;
    --color-grey-700: #535353;
    --color-grey-800: #3A3A3A;
    --color-grey-900: #202020;

    --color-blue-50: #F6FBFD;
    --color-blue-100: #E2F1F8;
    --color-blue-200: #B8DEEF;
    --color-blue-300: #8ECAE6;
    --color-blue-400: #64B6DD;
    --color-blue-500: #3AA3D4;
    --color-blue-600: #2887B3;
    --color-blue-700: #1E678A;
    --color-blue-800: #154860;
    --color-blue-900: #0C2936;

    --color-brown-10: #FFFBF9;
    --color-brown-50: #FAF6F4;
    --color-brown-100: #F2E6E3;
    --color-brown-200: #E2C7C0;
    --color-brown-300: #D2A89D;
    --color-brown-400: #C1897B;
    --color-brown-500: #B16A58 ;
    --color-brown-600: #925444;
    --color-brown-700: #6F4034;
    --color-brown-800: #4C2C24;
    --color-brown-900: #2A1813;

    --primary-color: var(--color-green-700);
    --secondary-color: var(--color-brown-400);
    --color-success: var(--color-green-400);
    --color-danger: var(--color-red-500);
    --color-warning: var(--color-brown-500)!important;
    --color-warning-hover: var(--secondary-color)!important;

    /* Spacing */
    --standard-padding: 16px;
    
    /* Border radius */
    --border-radius: 0.375rem;
    
    /* Typography */
    --body-font: Arial, Helvetica, sans-serif;
    --body-font-size: 15px;
    --fs-3xs: calc(var(--body-font-size) * 0.625);
    --fs-2xs: calc(var(--body-font-size) * 0.75);
    --fs-xs:  calc(var(--body-font-size) * 0.875);
    --fs-sm:  calc(var(--body-font-size) * 0.9375);
    --fs-md:  var(--body-font-size);
    --fs-lg:  calc(var(--body-font-size) * 1.125);
    --fs-xl:  calc(var(--body-font-size) * 1.265625);
    --fs-2xl: calc(var(--body-font-size) * 1.423828125);
    --lh-tight: 1.2;
    --lh-normal: 1.5;
    --lh-loose: 1.75;

    --dtcc-search-input_background: transparent;
}

@media (max-width: 1920px) {
    :root {
      --body-font-size: 14px;
    }
}

/* Font-size utilities */
.fs-3xs { font-size: var(--fs-3xs) !important; }
.fs-2xs { font-size: var(--fs-2xs) !important; }
.fs-xs  { font-size: var(--fs-xs)  !important; }
.fs-sm  { font-size: var(--fs-sm)  !important; }
.fs-md  { font-size: var(--fs-md)  !important; }
.fs-lg  { font-size: var(--fs-lg)  !important; }
.fs-xl  { font-size: var(--fs-xl)  !important; }
.fs-2xl { font-size: var(--fs-2xl) !important; }

/* Line-height utilities */
.lh-tight  { line-height: var(--lh-tight)  !important; }
.lh-normal { line-height: var(--lh-normal) !important; }
.lh-loose  { line-height: var(--lh-loose)  !important; }

/* Base Styles */
html, 
body {
  font-family: var(--body-font) !important;
  font-size: var(--body-font-size) !important;
  scrollbar-color: var(--primary-color) transparent;
}

h1 {
    font-size: var(--fs-2xl);
    font-weight: 600;
}

h2 {
    font-size: var(--fs-xl);
    font-weight: 600;
}

h3 {
    font-size: var(--fs-lg);
    font-weight: 600;
}

h4, h5, h6 {
    font-size: var(--fs-md);
    font-weight: 600;
}

body {
    margin: 0;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    padding-bottom: 0 !important;
}

.form-control,
textarea.form-control {
  font-size: var(--body-font-size);
  font-family: var(--body-font);
}

.search-input {
    background-color: transparent !important;
}


/* Layout Components */

/* Main content */
main { 
    flex: 1;
    display: flex;
    flex-direction: column;
    padding-bottom: 0 !important;
}

.main-content {
    width: 100%;
    height: 100vh;
    padding-left: 0.5rem;
    padding-right: 0rem;
    background: var(--base);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: margin-left 0.2s ease, padding-left 0.2s ease;
}

/* Disable transitions when restoring state to avoid animations on load */
.left-bar.no-animate,
html.leftbar-preload #left-bar { transition: none !important; }
.main-content.no-animate { transition: none !important; }

.main-content-body {
    padding-top: 0.5rem;
    padding-bottom: 1rem;
    width: 100%;
    height: 100vh;
    overflow-y: hidden;
}

.main-content-body-top-bar {
    padding-top: 0.5rem;
    padding-bottom: 1rem;
    width: 100%;
    height: var(--topbar-height, 50px);
}

.main-content-body-top-bar-reduced {
    padding-top: 2%;
    padding-bottom: 1rem;
    width: 100%;
    height: var(--topbar-height, 50px);
    max-width: 1200px;
    margin: 0 auto;
}

.main-content-body-content {
    padding-top: 0.75rem;
    width: 100%;
    height: calc(100vh - var(--topbar-height, 50px));
    overflow-y: hidden;
    overflow-x: auto;
    scrollbar-width: none;
}

/* Workspaces page: flex layout so only the content area scrolls */
.workspaces-layout {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.main-content-body-content-reduced {
    padding-top: 0.75rem;
    padding-bottom: 1rem;
    width: 100%;
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    max-width: 1200px;
    margin: 0 auto;
}

/* Left sidebar ------------------------------------------------------------ */
.left-bar {
    width: var(--leftbar-width);
    height: 100vh;
    position: sticky;
    top: 0;
    border-right: 1px solid var(--color-grey-200);
    color: var(--black);
    padding-top: var(--leftbar-padding-top);
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    transition: width 0.2s ease, transform 0.2s ease;
    z-index: 1020;
    display: flex;
    flex-direction: column;
}

.left-bar::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.05;
    z-index: -1;
}

/* Collapsed layout helpers */
html.leftbar-collapsed #left-bar,
.left-bar.collapsed {
    width: var(--leftbar-collapsed-width);
}

html.leftbar-collapsed #left-bar .navbar-brand,
.left-bar.collapsed .navbar-brand {
    display: none;
}

html.leftbar-collapsed #left-bar .left-bar-top-content,
html.leftbar-collapsed #left-bar .left-bar-bottom-content,
.left-bar.collapsed .left-bar-top-content,
.left-bar.collapsed .left-bar-bottom-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
}

html.leftbar-collapsed #left-bar .left-bar-header,
.left-bar.collapsed .left-bar-header {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
}

html.leftbar-collapsed #left-bar #toggle-leftbar,
.left-bar.collapsed #toggle-leftbar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--leftbar-toggle-size);
    height: var(--leftbar-toggle-size);
    padding: 0;
}

html.leftbar-collapsed #left-bar .menu-nav-link,
.left-bar.collapsed .menu-nav-link {
    padding: 0.5rem;
    justify-content: center;
    font-size: 0;
    border-left: 0px solid transparent;
}

html.leftbar-collapsed #left-bar .menu-nav-link i,
.left-bar.collapsed .menu-nav-link i {
    font-size: var(--fs-md);
    margin-right: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
}

html.leftbar-collapsed #left-bar .pending-notification-badge,
.left-bar.collapsed .pending-notification-badge {
    display: none !important;
}

.left-bar-header {
    display: flex;
    gap: 0.25rem;
    align-items: center;
    margin-bottom: 0.5rem;
    height: 48px;
    margin-left: -0.5rem;
    margin-right: -0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.left-bar-active-space-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0;
    overflow: hidden;
    padding-left: 0.5rem;
}

html.leftbar-collapsed #left-bar .left-bar-active-space-info,
.left-bar.collapsed .left-bar-active-space-info {
    display: none !important;
}

.left-bar-top-content {
    flex: 1 1 auto;
    overflow-y: auto;
    scrollbar-width: thin;
    margin-top: 1rem;
    margin-left: -0.5rem;
    margin-right: -0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    scrollbar-width: none;
}

.left-bar-bottom-content {
    margin-top: auto;
    padding-bottom: 1rem;
    margin-left: -0.5rem;
    margin-right: -0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.left-bar.collapsed .left-bar-top-content,
html.leftbar-collapsed #left-bar .left-bar-top-content,
.left-bar.collapsed .left-bar-bottom-content,
html.leftbar-collapsed #left-bar .left-bar-bottom-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
}

/* Left bar account rows */
.left-bar-account-row {
    margin-top: 1rem;
}

/* Processing column */
.processingColumn {
    position: fixed; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    width: 450px; 
    max-width: 450px; 
    background: var(--base); 
    z-index: 1040; 
    overflow-y: auto; 
    box-shadow: -2px 0 10px rgba(0,0,0,0.2); 
    transition: transform 0.3s ease-in-out; 
    transform: translateX(100%);
}

/* Navigation */
.navbar-brand {
    color: #000;
    font-weight: 500;
    font-size: var(--fs-xl);
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.navbar-brand:hover {
    color: var(--primary-color);
}

.nav-link {
    font-size: var(--fs-xs);
    padding: 0.2rem 0.5rem;
    color: var(--black); 
    margin-bottom: 0.5rem;
    border: 1px solid var(--color-grey-200)!important;
    border-radius: 0px;
}

.nav-link:hover {
    color: var(--white);
    background-color: var(--secondary-color);
    border: 1px solid var(--color-grey-200)!important;
}

.nav-link.active {
    color: var(--white)!important;
    background-color: var(--primary-color)!important;
    border: 1px solid var(--primary-color)!important;
}

.page-link {
    color: var(--primary-color);
}

.page-link:hover {
    color: var(--secondary-color);
}

.page-item.active .page-link {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: var(--white) !important;
}

.menu-nav-link {
    display: flex;
    align-items: center;
    padding: 0.25rem 0.5rem;
    text-decoration: none;
    color: var(--black); 
    margin-bottom: 0.5rem;
    border-radius: 5px;
    font-size: var(--fs-sm);
    transition: all 0.2s ease;
}

.menu-nav-link:hover {
    color: var(--black);
    background-color: var(--color-brown-100);
}


/* Links */
.a {
    color: var(--black)!important;
}

.a:hover {
    color: var(--color-green-500)!important;
}

.a:active {
    color: var(--color-green-500)!important;
}

/* Tables */
.table td {
    vertical-align: middle;
}

.table a {
    color: #303C46;
    text-decoration: none;
}

.table a:hover {
    color: #612F59;
    text-decoration: underline;
}

.table thead {
    border: 0px!important;
}

.table tbody {
    border-top: None!important;
}

/* Table row hover (toutes les tables avec .table-hover) */
.table-hover tbody tr:hover {
    background-color: var(--color-brown-100);
}

/* Cards */
.card-body {
    word-wrap: break-word;
}

.card {
    background-color: var(--base);
}

/* List Group */

.list-group-item {
    border: none;
    background-color: transparent;
    padding: 0.25rem 0.25rem;
}

/* Buttons */

.btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
}

.btn-sm {
    padding: 0.25rem 0.5rem;
    font-size: var(--fs-xs);
    border-radius: 5px;
}

.btn-xs {
    padding: 0.25rem 0.5rem;
    font-size: var(--fs-xs);
}


/* Primary buttons */
.btn-primary {
    background-color: var(--primary-color)!important;
    color: var(--white)!important;
    border-color: transparent!important;
}

.btn-primary:hover {
    background-color: var(--secondary-color)!important;
}

.btn-outline-primary {
    background-color: var(--base)!important;
    color: var(--primary-color)!important;
    border-color: var(--primary-color)!important;
}

.btn-outline-primary:hover {
    background-color: var(--secondary-color)!important;
    border-color: var(--secondary-color)!important;
    color: var(--white)!important;
}

/* Secondary buttons */
.btn-secondary {
    background-color: var(--secondary-color)!important;
    color: var(--white)!important;
    border-color: transparent!important;
}

.btn-secondary:hover {
    background-color: var(--primary-color)!important;
    border-color: var(--primary-color)!important;
}


.btn-outline-secondary {
    background-color: var(--white)!important;
    color: var(--secondary-color)!important;
    border-color: var(--secondary-color)!important;
}

.btn-outline-secondary:hover {
    background-color: var(--secondary-color)!important;
    border-color: var(--secondary-color)!important;
    color: var(--white)!important;
}


.btn-black {
    background-color: var(--black)!important;
    color: var(--white)!important;
    border-color: transparent!important;
}

.btn-black:hover {
    background-color: var(--white)!important;
    color: var(--black)!important;
}

.btn-white {
    background-color: var(--white)!important;
    color: var(--black)!important;
    border-color: transparent!important;
}

.btn-white:hover {
    background-color: var(--black)!important;
    color: var(--white)!important;
}

/* Success buttons */
.btn-success {
    background-color: var(--color-green-600)!important;
    border-color: var(--color-green-600)!important;
    color: var(--white)!important;
}

.btn-success:hover {
    background-color: var(--color-green-500)!important;
    border-color: var(--color-green-500)!important;
    color: var(--white)!important;
}

/* Danger buttons */
.btn-outline-danger {
    border-color: var(--color-danger)!important;
    color: var(--color-danger)!important;
}

.btn-outline-danger:hover {
    background-color: var(--color-danger)!important;
    border-color: var(--color-danger)!important;
    color: var(--white)!important;
}

.btn-danger {
    background-color: var(--color-danger)!important;
    border-color: var(--color-danger)!important;
    color: var(--white)!important;
}

.btn-danger:hover {
    background-color: var(--secondary-color)!important;
    border-color: transparent!important;
    color: var(--white)!important;
}

.btn-warning {
    background-color: var(--color-warning)!important;
    border-color: var(--color-warning)!important;
    color: var(--white)!important;
}

.btn-warning:hover {
    background-color: var(--color-warning-hover)!important;
    border-color: var(--color-warning)!important;
    color: var(--white)!important;
}

/* Disabled bulk action buttons on Contracts page */
#bulkAddToFolderButton[disabled],
#bulkAddToDataroomsButton[disabled] {
    cursor: not-allowed;
    opacity: 0.55;
    box-shadow: none !important;
}

.no-shadow {    
    box-shadow: none!important;
}

.no-shadow:focus {
    box-shadow: none!important;
}

/* Badges */
.badge {
    display: inline-block;
    padding: 0.4em 0.4em;
    font-size: var(--fs-sm);
    font-weight: 500;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
    margin-bottom: 0.25rem;
}

/* Backgrounds */
.bg-white {
    background-color: var(--white)!important;
}

.bg-black {
    background-color: var(--black)!important;
}

.bg-transparent {
    background-color: transparent!important;
}

.bg-base {
    background-color: var(--base)!important;
}

.bg-primary {
    color: var(--white)!important;
    background-color: var(--primary-color)!important;
}

.alert-info {
    background-color: var(--color-brown-100)!important;
    border-color: var(--color-brown-300)!important;
    color: var(--color-brown-700)!important;
}

.bg-secondary {
    background-color: var(--secondary-color)!important;
    color: var(--white)!important;
}

.bg-grey-50 {
    background-color: var(--color-grey-50)!important;
}

.bg-grey-100 {
    background-color: var(--color-grey-100)!important;
}

.bg-grey-200 {
    background-color: var(--color-grey-200)!important;
}

.bg-grey-300 {
    background-color: var(--color-grey-300)!important;
}

.bg-grey-400 {
    background-color: var(--color-grey-400)!important;
}

.bg-grey-500 {
    background-color: var(--color-grey-500)!important;
}

.bg-grey-600 {
    background-color: var(--color-grey-600)!important;
}

.bg-grey-700 {
    background-color: var(--color-grey-700)!important;
}

.bg-grey-800 {
    background-color: var(--color-grey-800)!important;
}

.bg-grey-900 {
    background-color: var(--color-grey-900)!important;
}

.bg-green-50 {
    background-color: var(--color-green-50)!important;
}

.bg-green-100 {
    background-color: var(--color-green-100)!important;
}

.bg-green-200 {
    background-color: var(--color-green-200)!important;
}

.bg-green-300 {
    background-color: var(--color-green-300)!important;
}

.bg-green-400 {
    background-color: var(--color-green-400)!important;
}

.bg-green-500 {
    background-color: var(--color-green-500)!important;
}

.bg-green-600 {
    background-color: var(--color-green-600)!important;
}

.bg-green-700 {
    background-color: var(--color-green-700)!important;
}


.bg-blue-100 {
    background-color: var(--color-blue-100)!important;
}

.bg-blue-200 {
    background-color: var(--color-blue-200)!important;
}

.bg-blue-300 {
    background-color: var(--color-blue-300)!important;
}

.bg-blue-400 {
    background-color: var(--color-blue-400)!important;
}

.bg-blue-500 {
    background-color: var(--color-blue-500)!important;
}

.bg-purple-50 {
    background-color: var(--color-purple-50)!important;
}

.bg-purple-100 {
    background-color: var(--color-purple-100)!important;
}

.bg-purple-200 {
    background-color: var(--color-purple-200)!important;
}

.bg-purple-300 {
    background-color: var(--color-purple-300)!important;
}

.bg-purple-400 {
    background-color: var(--color-purple-400)!important;
}

.bg-purple-500 {
    background-color: var(--color-purple-500)!important;
}

.bg-purple-600 {
    background-color: var(--color-purple-600)!important;
}

.bg-purple-700 {
    background-color: var(--color-purple-700)!important;
}

.bg-purple-800 {
    background-color: var(--color-purple-800)!important;
}

.bg-purple-900 {
    background-color: var(--color-purple-900)!important;
}

.bg-yellow-100 {
    background-color: var(--color-yellow-100)!important;
}

.bg-yellow-200 {
    background-color: var(--color-yellow-200)!important;
}

.bg-yellow-300 {
    background-color: var(--color-yellow-300)!important;
}

.bg-yellow-400 {
    background-color: var(--color-yellow-300)!important;
}

.bg-yellow-500 {
    background-color: var(--color-yellow-500)!important;
}

.bg-brown-50 {
    background-color: var(--color-brown-50)!important;
}

.bg-brown-100 {
    background-color: var(--color-brown-100)!important;
}

.bg-brown-200 {
    background-color: var(--color-brown-200)!important;
}

.bg-brown-300 {
    background-color: var(--color-brown-300)!important;
}

.bg-brown-400 { 
    background-color: var(--color-brown-400)!important;
}

/* Text Truncation Utilities */
.text-ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.text-ellipsis-multiline {
    display: -webkit-box;
    display: -moz-box;
    -webkit-line-clamp: 2;
    -moz-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    overflow: hidden;
}

.text-ellipsis-multiline-3 {
    display: -webkit-box;
    display: -moz-box;
    -webkit-line-clamp: 3;
    -moz-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    overflow: hidden;
}

/* Utility Classes */
.logout-container {
    position: sticky;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 0.5rem;
    background-color: #f8f9fa;
    border-top: 1px solid #dee2e6;
}

.contract-details-left {
    position: sticky;
    top: 0;
    min-width: 400px;
    padding: 0rem 0.5rem 0rem 0.5rem;
}

.contract-sidebar {
    height: 100vh;
    overflow-y: auto;
    position: sticky;
    top: 0;
    transition: right 0.3s ease-in-out;
    min-width: 400px;
    max-width: 450px;
}

/* Contract Status */
.contract-status {
    display: flex;
    align-items: center;
    justify-content: center;
    word-break: break-all;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    gap: 0.5rem;
    padding: 0.25rem 0.5rem;
    border-radius: 5px;
    text-align: center;
    font-size: var(--fs-xs);
    min-width: 100px;
    border: 1px solid var(--color-grey-300)!important;
}



.text-draft,
.text-pending-analysis {
    color: var(--color-blue-200);
}

.text-blue-500 {
    color: var(--color-blue-500);
}

.text-blue-400,
.text-queued {
    color: var(--color-blue-400);
}

.text-pending {
    color: var(--color-green-200);
}

.text-private,
.text-analyzing {
    color: var(--color-blue-600);
}

.text-shared,
.text-workspace {
    color: var(--color-brown-300);
}

.text-restricted {
    color: var(--color-purple-500);
}

.text-green-700,
.text-active,
.text-published,
.text-analyzed,
.text-effective {
    color: var(--color-green-600);
}

.text-failed {
    color: var(--color-red-500);
}

.text-terminated {
    color: var(--color-grey-800);
}

.text-archived,
.text-void {
    color: var(--color-grey-600);
}

.text-grey-200,
.text-disabled,
.text-none {
    color: var(--color-grey-200);
}

.text-needs_review {
    color: var(--color-yellow-300);
}

.text-expiring_soon {
    color: var(--color-purple-500);
}

.text-renewal_soon {
    color: var(--color-blue-500);
}

.span-general {
    color: var(--black)!important;
    border: 1px solid var(--color-grey-500)!important;
    border-radius: 5px;
    padding: 0.25rem 0.5rem;
    text-align: center;
    font-size: var(--fs-sm);
    min-width: 100px;
    display: inline-block;
    margin: 0.125rem;
    /* truncation */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.label-party {
    border: 1px solid var(--color-grey-100);
    border-radius: 5px;
    padding: 0.05rem 0.5rem;
    text-align: center;
    font-size: var(--fs-sm);
    margin: 0.2rem 0.1rem;
    display: inline-block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: top;
}


/* Toast */
.toast-container {
    z-index: 1099;
}

.toast.bg-warning {
    background-color: var(--color-brown-50) !important;
    color: var(--color-brown-700) !important;
    border-color: var(--color-brown-700) !important;
}   

/* Borders */
.border-primary {
    border-color: var(--primary-color)!important;
}

/* Text Colors */
.text-primary {
    color: var(--primary-color)!important;
}

.text-secondary {
    color: var(--secondary-color)!important;
}

.bold {
    font-weight: bold;
}

.text-small {
    font-size: var(--fs-xs);
}

.text-smaller {
    font-size: var(--fs-2xs);
}

.text-medium {
    font-size: var(--fs-md);
}

.text-large {
    font-size: var(--fs-lg);
}

/* Loading Animations */
/* Progressive bar */
#loading-container {
    position: fixed; /* ou absolute si besoin */
    left: 200px;
    bottom: 0px;
    height: 25px;
    width: 100%;
    overflow: hidden; /* S'assurer que rien ne dépasse */
    /* Optionnel: background-color pour la barre */
  }
  
#loading-canvas {
    display: block; /* Éviter l'espace blanc sous le canvas */
    height: 100%;
}

/* Animations */
/* Animation arc-en-ciel */
@keyframes rainbow {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* Animated background class */
.bg-animated {
    position: relative;
    background: linear-gradient(
      45deg, 
      var(--color-brown-500), 
      var(--color-brown-400), 
      var(--color-green-500),
      var(--color-green-600)
    );
    background-size: 400% 800%;
    animation: rainbow 12s ease infinite;
    transition: all 0.5s ease;
    color: var(--white);
}


/* Modals */

.modal-content {
    background-color: var(--base);
    padding: 0rem;
    border-radius: 10px;
    border: 4px solid transparent;
}

.modal-header {
    background-color: transparent;
    border: none;
    padding: 1rem 1rem 0 1rem;
}

.modal-title {
    font-size: var(--fs-md)!important;
    font-weight: 600;
}


.modal-body {
    padding: 1rem;
    font-family: var(--body-font)!important;
    font-size: var(--fs-md);
}

.modal-footer {
    border: none;
    padding: 0.5rem;
}

/* BTN CLOSE */

.btn-close {
    font-size: var(--fs-xs);
    color: var(--color-grey-500);
}
/* Accordion Components */
.accordion-button {
  background-color: var(--color-grey-50);
  border: 1px solid var(--color-grey-200);
  color: var(--black);
  padding-top: 0.75rem;
  font-weight: bold;
  box-shadow: none;
  transition: background-color 120ms ease, color 120ms ease;
}

.accordion-button:hover {
  background-color: var(--color-grey-50);
  box-shadow: none;
}

.accordion-button:not(.collapsed) {
  background-color: var(--color-grey-50);
  color: var(--black);
  box-shadow: none;
}

.accordion-button.collapsed {
  background-color: var(--color-grey-50);
  box-shadow: none;
}

.accordion-body {
  background-color: var(--color-brown-50);
  border: 1px solid var(--color-grey-200);
  border-top: 0;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  padding-bottom: 0.25rem;
  box-shadow: none;
  transition: background-color 120ms ease;
}

.accordion-button:focus {
  box-shadow: none;
  background-color: var(--color-grey-50);
  border: 1px solid var(--color-grey-200);
  color: var(--black);
  box-shadow: none;
  font-weight: bold;
}


.accordion-item {
    overflow: hidden;
    border: none;
}
  
/* Contract Details Accordion */
.contract-details-accordion {
    border: none;
    margin-bottom: 1rem;
}

.contract-details-accordion-item {
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    margin-bottom: 0.5rem;
    background-color: var(--base);
    overflow: hidden;
}

.contract-details-accordion-header {
    min-height: 40px;
    height: auto;
    margin: 0;
    border-bottom: 1px solid #dee2e6;
    flex-wrap: nowrap;
    background-color: var(--color-grey-50);
}

.contract-details-accordion-button {
    position: relative;
    display: flex;
    align-items: center;
    min-width: 0;
    flex: 1 1 auto;
    width: 100%;
    padding: 0.25rem 1rem 0.25rem 0rem;
    font-size: var(--fs-md);
    color: var(--black);
    text-align: left;
    background-color: var(--base);
    border: 0;
    border-radius: 0;
    overflow: hidden;
    overflow-anchor: none;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;
}

.contract-details-accordion-button .small-caps {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.contract-details-accordion-button:not(.collapsed) {
    color: var(--black);
    background-color: var(--base);
}

.contract-details-accordion-button:focus {
    outline: 0;
}

.contract-details-accordion-actions {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    white-space: nowrap;
}

.cd-action-btn {
    padding: 0.25rem 0.5rem;
    font-size: var(--fs-xs);
    line-height: 1.0;
}

.contract-details-accordion-button .cd-accordion-icon-open {
    display: inline-block;
}

.contract-details-accordion-button .cd-accordion-icon-closed {
    display: none;
}

.contract-details-accordion-button.collapsed .cd-accordion-icon-open {
    display: none;
}

.contract-details-accordion-button.collapsed .cd-accordion-icon-closed {
    display: inline-block;
}

.contract-details-accordion-collapse {
    border-top: 0;
}

.contract-details-accordion-body {
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    background-color: var(--base);
    font-size: var(--fs-sm);
}

.contract-details-accordion-body-notes {
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 1rem;
    background-color: var(--base);
    font-size: var(--fs-sm);
}

/* Checkboxes */
input[type="checkbox"]:checked {
    accent-color: var(--primary-color);
}

.pdf-pages-wrapper {
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 1rem 1rem;
    scrollbar-color: var(--primary-color) transparent;
    scrollbar-width: thin;
    text-align: center;
    touch-action: none;
    cursor: grab;
    height: 100%;
}

.pdf-pages-wrapper canvas {
    display: block;
    max-width: none;
}

.page-container {
    background-color: var(--white);
    display: inline-flex;
    justify-content: center;
    margin: 0 auto 1rem;
    width: max-content;
    border: 1px solid var(--color-grey-200);
}

.pdf-controls-wrapper {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    width: 100%;
    box-sizing: border-box;
    justify-content: flex-end;
    padding: 0.5rem 0.75rem;
    background: rgba(255, 255, 255, 0.01);
    border-radius: 0 0 0 0.5rem;
    display: none;
}

.border-black-1 {
    border: 1px solid var(--black);
}

.border-primary-1 {
    border: 1px solid var(--primary-color);
}

.bg-transparent {
    background-color: transparent!important;
}

.bg-outline-transparent-300 {
    border: 1px solid var(--primary-color)!important;
    background-color: transparent!important;
}

.bg-outline-transparent-500 {
    border: 1px solid var(--primary-color)!important;
    background-color: transparent!important;
}

.break-words {
    overflow-wrap: break-word;
}

.w-200 {
    width: 200px;
}

.circle-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  line-height: 1;
  font-size: var(--fs-2xs);
}

.contract-section-content {
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.25rem;
}

.contract-section-content p {
  margin-bottom: 0.5rem;
}

.contract-text-content {
    padding-left: 1rem;
    padding-right: 1rem;
}

.contract-text-content p {
    margin-bottom: 0.5rem;
}

.btn:focus {
    box-shadow: none;
}

tbody.spacious-rows tr > td,
tbody.spacious-rows tr > th {
  padding: 0.5rem 0.25rem;
}

.table {
    margin-bottom: 0rem;
}

/* Contracts page layout */
#contracts-layout {
    display: flex;
    flex-direction: row;
}

#contracts-layout #mainContentCol {
    width: 100%;
    transition: width 0.2s ease-in-out;
}

#contracts-layout #rightColumn {
    width: 0;
    overflow: hidden;
    opacity: 0;
    transition: width 0.2s ease-in-out, opacity 0.2s linear;
}

#contracts-layout.right-column-visible #mainContentCol {
    width: 80%;
    padding-right: 1rem;
}

#contracts-layout.right-column-visible #mainContentCol .main-content-body-content {
    padding-right: 1rem;
}

#contracts-layout.right-column-visible #rightColumn {
    width: 25%;
    max-width: 420px;
    opacity: 1;
}

/* Filter column — same flex-rail pattern, mutually exclusive with stats column */
#contracts-layout #filterColumn {
    width: 0;
    overflow: hidden;
    opacity: 0;
    transition: width 0.2s ease-in-out, opacity 0.2s linear;
}

#contracts-layout.filter-column-visible #mainContentCol {
    width: 75%;
    padding-right: 1rem;
}

#contracts-layout.filter-column-visible #mainContentCol .main-content-body-content {
    padding-right: 1rem;
}

#contracts-layout.filter-column-visible #filterColumn {
    width: 25%;
    max-width: 420px;
    opacity: 1;
}

/* Tagify overrides inside filter panel */
#filterColumn .tagify {
    width: 100%;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    padding: 0.25rem 0.375rem;
    font-size: 0.875rem;
    background: #fff;
    min-height: calc(1.5em + 0.5rem + 2px);
}

#filterColumn .tagify__tag {
    margin: 2px;
}

#filterColumn .tagify__input {
    margin: 2px;
}

/* Active filter badge on the Filters button */
.filter-active-badge {
    font-size: 0.7rem;
    padding: 0.15em 0.4em;
    line-height: 1;
}

.home-tile {
    width: 100%;
    border: 1px solid var(--color-brown-200);
    background-color: var(--color-brown-50);
    padding: 2rem 2rem 1rem 2rem;
    height: 100%;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.small-caps {
  font-variant: small-caps;
}

.session-checkbox,
.contract-checkbox {
  width: 14px;
  height: 14px;
  transform: scale(1.0);
}

.small-label {
    padding: 0.10rem 0.5rem;
    border-radius: 4px;
    background-color: var(--color-brown-100);
    font-size: var(--fs-xs);
}


.policy-label-playbook {
    display: inline-block;
    padding: 0.10rem 0.5rem;
    border-radius: 4px;
    background-color: var(--color-green-600);
    color: var(--white);
    font-size: var(--fs-xs);
}

.policy-label-guidelines {
    display: inline-block;
    padding: 0.10rem 0.5rem;
    border-radius: 4px;
    background-color: var(--color-brown-500);
    color: var(--white);
    font-size: var(--fs-xs);
}

.policy-label-template {
    display: inline-block;
    padding: 0.10rem 0.5rem;
    border-radius: 4px;
    background-color: var(--color-purple-500);
    color: var(--white);
    font-size: var(--fs-xs);
}           

.alert-success {
    background-color: var(--color-green-50);
    color: var(--color-green-700);
    border-color: var(--color-green-300);
}

.alert-warning {
    background-color: var(--color-brown-50);
    color: var(--color-brown-700);
    border-color: var(--color-brown-300);
}           

.alert-danger {
    background-color: var(--color-red-50);
    color: var(--color-red-700);
    border-color: var(--color-red-300);
}

.trial-card {
    border: 1px solid var(--color-brown-300);
    border-radius: 4px;
    padding: 0.5rem;
    background-color: var(--color-brown-50);
}

.bg-info {
    background-color: var(--color-brown-500)!important;
}

/* Processing state: queued (dotted rotating circle) - shared session/information processing */
.loader-queued {
    width: 48px;
    height: 48px;
    border: 5px dotted #FFF;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    animation: loader-queued-rotation 2s linear infinite;
}

.loader-queued-sm {
    width: 1rem;
    height: 1rem;
    border-width: 2px;
    border-style: dotted;
    border-color: currentColor;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    animation: loader-queued-rotation 2s linear infinite;
    vertical-align: middle;
}

@keyframes loader-queued-rotation {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.notification-card {
    padding: 0.5rem 1rem 0.25rem 1rem;
    margin-bottom: 0.5rem;
    position: relative;
    font-size: var(--fs-sm);
    border: 1px solid var(--color-grey-200);
    border-radius: 5px;
    word-wrap: break-word;
}

/* Pending notification badge */
.pending-notification-badge {
    width: 8px;
    height: 8px;
    min-width: 8px;
    display: inline-block;
    border-radius: 50%;
    background-color: var(--color-brown-500);
    margin: 0 0.5rem;
}

/* =============================================================================
   Global Search Modal
   ============================================================================= */

/* Dialog width */
.global-search-modal-dialog {
    max-width: 1000px;
    width: 100%;
}

/* Results scrollable panel */
.global-search-results-panel {
    max-height: calc(60vh - 80px);
    overflow-y: auto;
    scrollbar-width: thin;
}

/* Individual result row */
.global-search-result {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.45rem 0.6rem;
    border-radius: 4px;
    text-decoration: none;
    color: inherit;
    transition: background-color 0.12s ease;
}

.global-search-result:hover,
.global-search-result:focus {
    background-color: var(--color-grey-100, #f3f4f6);
    color: inherit;
    text-decoration: none;
}

/* Icon column */
.global-search-result-icon {
    font-size: 1rem;
    line-height: 1.4;
}

/* Filename */
.global-search-result-name {
    font-size: var(--fs-sm, 0.875rem);
    font-weight: 500;
}

/* Breadcrumb / meta row */
.global-search-result-meta {
    margin-top: 0.1rem;
    line-height: 1.3;
}

/* Type filter button group */
#globalSearchTypeFilter .global-search-type-btn {
    font-size: var(--fs-2xs, 0.7rem);
    padding: 0.15rem 0.55rem;
    border-color: var(--color-grey-300, #d1d5db);
    background: transparent;
    color: var(--color-grey-600, #6b7280);
    transition: background 0.1s, color 0.1s;
}

#globalSearchTypeFilter .global-search-type-btn:hover {
    background: var(--color-grey-100, #f3f4f6);
    color: var(--color-grey-700, #374151);
}

#globalSearchTypeFilter .global-search-type-btn.active {
    background: var(--primary-color, #2c5e53);
    border-color: var(--primary-color, #2c5e53);
    color: #fff;
}

/* Sort button group */
#globalSearchSortGroup .global-search-sort-btn {
    font-size: var(--fs-2xs, 0.7rem);
    padding: 0.1rem 0.45rem;
    border-color: var(--color-grey-300, #d1d5db);
    background: transparent;
    color: var(--color-grey-600, #6b7280);
}

#globalSearchSortGroup .global-search-sort-btn.active {
    background: var(--primary-color, #2c5e53);
    border-color: var(--primary-color, #2c5e53);
    color: #fff;
}

.badge-workspace {
    color: var(--color-green-500);
    border: 1px solid var(--color-green-500);
    background-color: transparent;
    padding: 0.15rem 0.5rem;
    border-radius: 8px;
    font-size: var(--fs-xs);
    white-space: nowrap;
}

.badge-restricted {
    color: var(--color-purple-500);
    border: 1px solid var(--color-purple-500);
    background-color: transparent;
    padding: 0.15rem 0.5rem;
    border-radius: 8px;
    font-size: var(--fs-xs);
    white-space: nowrap;
}

.badge-private, .badge-no_alerts {
    color: var(--color-grey-600);
    border: 1px solid var(--color-grey-300);
    background-color: transparent;
    padding: 0.15rem 0.5rem;
    border-radius: 8px;
    font-size: var(--fs-xs);
    white-space: nowrap;
}

.badge-renewal_soon {
    color: var(--color-blue-500);
    border: 1px solid var(--color-blue-500);
    background-color: transparent;
    padding: 0.15rem 0.5rem;
    border-radius: 8px;
    font-size: var(--fs-xs);
    white-space: nowrap;
}

.badge-expiring_soon {
    color: var(--color-purple-500);
    border: 1px solid var(--color-purple-500);
    background-color: transparent;
    padding: 0.15rem 0.5rem;
    border-radius: 8px;
    font-size: var(--fs-xs);
    white-space: nowrap;
}

.badge-needs_review {
    color: var(--color-red-500);
    border: 1px solid var(--color-red-500);
    background-color: transparent;
    padding: 0.15rem 0.5rem;
    border-radius: 8px;
    font-size: var(--fs-xs);
    white-space: nowrap;
}