:root {
	/* auto font-size */
	--text-scale-ratio: 1.25;
    --text-xs: calc((var(--text-md) / var(--text-scale-ratio)) / var(--text-scale-ratio));
    --text-sm: calc(var(--text-md) / var(--text-scale-ratio));
    --text-md: clamp(1.125rem, 0.765vw + 0.847rem, 1.5rem);
    --text-lg: calc(var(--text-md) * var(--text-scale-ratio));
    --text-xl: calc(var(--text-lg) * var(--text-scale-ratio));
    --text-xxl: calc(var(--text-xl) * var(--text-scale-ratio));
    --text-xxxl: calc(var(--text-xxl) * var(--text-scale-ratio));
    /* --text-xxxxl: calc(var(--text-xxxl) * var(--text-scale-ratio));    */
	
	/* auto spaces */
	--space-unit: 1rem;
	/* --space-xxxxs: calc(0.1875 * var(--space-unit)); */
    /* --space-xxxs: calc(0.375 * var(--space-unit)); */
    --space-xxs: calc(0.5625 * var(--space-unit)); 
    --space-xs: calc(0.75 * var(--space-unit));
    --space-sm: calc(1.125 * var(--space-unit));
    --space-md: calc(2 * var(--space-unit));
    --space-lg: calc(3.125 * var(--space-unit));
    --space-xl: calc(5.125 * var(--space-unit));
    --space-xxl: calc(8.25 * var(--space-unit));  
    /* --space-xxxl: calc(13.25 * var(--space-unit));  */
    /* --space-xxxxl: calc(21.5 * var(--space-unit));  */
	
	/* element radius, shadow and simple animation */
	--radius: 8px; /* 8 px */
	--radius-sm: calc(var(--radius, 0.25em)/2);
    --radius-md: var(--radius, 0.25em);
    --radius-lg: calc(var(--radius, 0.25em)*2);
    --shadow-xs: 0 0.1px 0.3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.12);
    --shadow-sm: 0 0.3px 0.4px rgba(0, 0, 0, 0.025), 0 0.9px 1.5px rgba(0, 0, 0, 0.05), 0 3.5px 6px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 0.9px 1.5px rgba(0, 0, 0, 0.03), 0 3.1px 5.5px rgba(0, 0, 0, 0.08), 0 14px 25px rgba(0, 0, 0, 0.12);
    --shadow-lg: 0 1.2px 1.9px -1px rgba(0, 0, 0, 0.014), 0 3.3px 5.3px -1px rgba(0, 0, 0, 0.038), 0 8.5px 12.7px -1px rgba(0, 0, 0, 0.085), 0 30px 42px -1px rgba(0, 0, 0, 0.15);
    --shadow-xl: 0 1.5px 2.1px -6px rgba(0, 0, 0, 0.012), 0 3.6px 5.2px -6px rgba(0, 0, 0, 0.035), 0 7.3px 10.6px -6px rgba(0, 0, 0, 0.07), 0 16.2px 21.9px -6px rgba(0, 0, 0, 0.117), 0 46px 60px -6px rgba(0, 0, 0, 0.2);
    /* --ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
    --ease-in: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    --ease-out: cubic-bezier(0.215, 0.61, 0.355, 1);
    --ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);	*/
	
	/* icon sizes */
    /*--icon-xxxs: 8px;
    --icon-xxs: 12px; */
    --icon-xs: 16px;
    --icon-sm: 24px;
    --icon-md: 32px;
    --icon-lg: 48px;
    --icon-xl: 64px;
    /* --icon-xxl: 96px;
    --icon-xxxl: 128px;	*/
	
	/* button styles */
    --btn-font-size: 1em;
    --btn-padding-x: var(--space-sm);
    --btn-padding-y: var(--space-xxs);
    --btn-radius: var(--radius-md);	
}

.content-flex {
    width: 80%;
}

@media screen and (max-width: 400px) {
    .content-flex {
    width: 90%;
}
}

.content-grid {
    width: 80%;
}

@media screen and (max-width: 400px) {
    .content-grid {
    width: 90%;
}
}

/* Status Badges */
.status-badge { 
    padding: 3px 8px; 
    border-radius: 12px; 
    font-size: 12px; 
    font-weight: 500; 
    white-space: nowrap;
}

.prospect-to-contact { background: #fff3cd; color: #856404; }
.prospect-interested { background: #d4edda; color: #155724; }
.prospect-not-interested { background: #f8d7da; color: #721c24; }
.prospect-highly-interested { background: #cce5ff; color: #004085; }

.pipeline-under-nego { background: #cce5ff; color: #004085; }
.pipeline-proposal { background: #e2e3e5; color: #383d41; }
.pipeline-reserved { background: #fff3cd; color: #856404; }
.pipeline-verbal-booking { background: #d1ecf1; color: #0c5460; }
.pipeline-booked { background: #d4edda; color: #155724; }
.pipeline-declined { background: #f8d7da; color: #721c24; }

.be_table {
    border-collapse: collapse;
}

.be_table td {
    height: 40px;
    padding-left: 10px;
}

.be_table thead {
    background-color: white;
    line-height: 1.1em;
    height: 49px;
    border-top: 1px solid #c7c7c7;
    border-bottom: 1px solid #c7c7c7;
}

.be_table tbody tr:nth-child(odd) {
  background-color: #EBF6FF;
}

.be_table tbody tr:nth-child(even) {
  background-color: var(--bricks-color-tdmijq);
}

/* datatable css */
.dt-filters label,
.dataTables_length label,
.dataTables_filter label {
    color: #666!important;
}

.dt-controls {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    margin-bottom: 1rem;
}
.dt-filters {
    display: flex;
    gap: 1rem;
    margin: 0 1rem;
}

.dataTables_length,
.dataTables_filter {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.dt-filters select,
.dt-filters input,
.dataTables_length select,
.dataTables_filter input {
    height: 35px;
    color: #666!important;
    border: 1px solid #ccc !important;
    border-radius: 0px !important;  
    padding: 0px 10px !important;
}

/* Search box text alignment*/
.dataTables_filter {
    text-align: left!important;
}

.dataTables_filter input {
    margin-left: 0 !important;
}

table.dataTable thead th.sorting::after,
table.dataTable thead th.sorting::before {
    color: #000000 !important;
    opacity: 0.2 !important;
}

/* Ascending arrow */
table.dataTable thead th.sorting_asc::after {
    color: #000000 !important;
    opacity: 1 !important;
}

/* Descending arrow */
table.dataTable thead th.sorting_desc::before {
    color: #000000 !important;
    opacity: 1 !important;
}