html {
    background: #fafafa;
}

body {
    --slds-c-tooltip-font-size: 0.75rem;
    font-family: 'Rubik', sans-serif;

    --green-silver: rgb(211, 211, 211);
    --green-gold: rgb(255, 215, 0);
    --green-platinum: rgb(147, 147, 147);

    --slds-c-toast-radius-border: 1.5rem;

    --color-analytics-300: #bdbdbd;
    --color-help-300: #F27050;
    --color-seller-400: #00519e;
    --color-seller-300: #2496FF;
    --color-seller-100: #c8e5ff;
    --color-correct-300: #05c168;
    --color-correct-400: #11845b;
    --color-correct-100: #def2e6;
    --color-incorrect-400: #dc2b2b;
    --color-incorrect-300: #ff5a65;
    --color-incorrect-100: #ffeff0;
    --color-item-400: #974a02;
    --color-item-300: #FD871A;
    --color-item-100: #fee1c6;
    --color-catalog-400: #cca600;
    --color-catalog-300: #ffd100;
    --color-catalog-100: #fff3bf;
    --color-brand-400: #3000c0;
    --color-brand-300: #9571FF;
    --color-brand-100: #e4dbff;
    --color-official-store-400: #1e8e6a;
    --color-official-store-300: #48D4C8;
    --color-official-store-100: #CAF4F2;
    --slds-c-button-destructive-color-background: #ff5a65;
    --slds-c-button-destructive-color-border: #ff5a65;
    --slds-c-button-success-color-background: #05c168;
    --slds-c-button-success-color-border: #05c168;
    --color-neutral-700: #1D5573;
    --color-neutral-800: #292929;

    --color-salesforce: #389acd;
    --color-pvp: #E5261C;
    --color-price-robot: #FC7B06;
    --color-sharing : #ffa726;
    --number-size: 13px;

    --color-pink: #e73b90;
    --color-search: #008080;
    --color-cbt: #f3f3f3;
    --color-search-listings: #66B1D9;

    --color-tendency: #66BB6A;
    --color-opportunity: #806CBC;

    --color-extreme-low: #8b0000;
    --color-very-low: #b71c1c;
    --color-low: #f4511e;
    --color-mid-low: #fb8c00;
    --color-mid: #fbc02d;
    --color-mid-high: #fdd835;
    --color-high: #c0ca33;
    --color-very-high: #43a047;
    --color-extreme-high: #2e7d32;

    --color-buybox-winning: #66BB6A;
    --color-buybox-competing: #FD871A;
    --color-buybox-sharing-first: #FFD000;
    --color-buybox-listed: #9571FF;
    --color-buybox-total: #48d4c8;

    --color-listing-high-performance: #FFD000;
    --color-listing-new: #9571FF;
    --color-listing-growing: #66BB6A;
    --color-listing-falling: #FD871A;
    --color-listing-stable: #95A5A6;
    --color-listing-without-sales: #2C3E50;
    --color-listing-recent-sales: #48d4c8;

    --color-help: #8C114F;

    --text-xs: 0.75rem;
    --text-sm: 0.85rem;
    --text-med: 1rem;
    --text-lg: 1.5rem;
    --text-xl: 2rem;
}

lightning-button-icon.self {
    --slds-g-color-error-base-50: var(--color-incorrect-300);
}

lightning-combobox {
    --slds-c-input-color-background: var(--color-salesforce);
    --slds-c-input-color-border: var(--color-salesforce);
    --slds-c-input-text-color: white;
    --slds-g-color-neutral-base-50: white;
}

lightning-combobox.item {
    --slds-c-input-color-background: var(--color-item-300);
    --slds-c-input-color-border: var(--color-item-300);
}

lightning-combobox.brand {
    --slds-c-input-color-background: var(--color-brand-300);
    --slds-c-input-color-border: var(--color-brand-300);
}

lightning-combobox.seller {
    --slds-c-input-color-background: var(--color-seller-300);
    --slds-c-input-color-border: var(--color-seller-300);
}

lightning-combobox.catalog {
    --slds-c-input-color-background: var(--color-catalog-300);
    --slds-c-input-color-border: var(--color-catalog-300);
}

lightning-combobox.store {
    --slds-c-input-color-background: var(--color-official-store-300);
    --slds-c-input-color-border: var(--color-official-store-300);
}

lightning-combobox.analytics {
    --slds-c-input-color-background: var(--color-pink);
    --slds-c-input-color-border: var(--color-pink);
}

.slds-listbox__option-icon{
    --slds-c-icon-color-foreground-default: #00a650;
}
/* Colores medallas */
.gold_special lightning-badge , .platinum{
    --slds-c-badge-color-background: rgb(211, 211, 211);
}

.gold_pro lightning-badge , .gold {
    --slds-c-badge-color-background: #FFEC43;
}

.orange lightning-badge, .light_green lightning-badge, .red lightning-badge, .newbie lightning-badge, .green lightning-badge, .yellow lightning-badge {
    --slds-c-badge-color-background: transparent;
    --slds-c-badge-text-color: black;
}

.green_silver lightning-badge {
    --slds-c-badge-color-background: var(--green-silver);
}

.green_gold lightning-badge {
    --slds-c-badge-color-background: var(--green-gold);
}

.green_platinum lightning-badge {
    --slds-c-badge-color-background: var(--green-platinum);
}

.price-status-ok lightning-badge {
    --slds-c-badge-color-background: #05c168;
    --slds-c-badge-text-color: white;
}

.price-status-within lightning-badge {
    --slds-c-badge-color-background: var(--color-mid-high);
    --slds-c-badge-text-color: white;
}

.price-status-below lightning-badge {
    --slds-c-badge-color-background: var(--color-incorrect-300);
    --slds-c-badge-text-color: white;
}

.slds-icon-utility-arrowup, .slds-icon-utility-check{
    --slds-c-icon-color-foreground-default: #11845b;
}

.slds-icon-utility-arrowdown{
    --slds-c-icon-color-foreground-default: #dc2b2b;
}

lightning-icon.arrow-up svg, lightning-icon.arrow-down svg {
    height: calc(var(--number-size) - 2px);
    margin-bottom: calc(var(--number-size) * 0.17);
}

common-arrow-percent lightning-formatted-number {
    font-weight: 700;
    font-size: var(--number-size);
}

.position common-formatted-number{
    font-weight: 700;
    font-size: var(--text-xl);
}

.position common-arrow-percent lightning-formatted-number{
    font-weight: 700;
    font-size: var(--text-sm);   
}

.position div {
    text-align:center;
}

.fulfillment lightning-badge, lightning-badge.fulfillment{
    background-color:transparent !important;
    color: #00a650 !important;
    --slds-c-badge-icon-color-foreground: #00a650 !important;
    text-transform: uppercase;
    font-style: italic;
    font-size: larger;
}

.fulfillment lightning-icon, lightning-icon.fulfillment{
    --slds-c-icon-color-foreground: #00a650 !important;
    --slds-c-icon-color-foreground-default: #00a650 !important;
}

.reputation-medal svg {
    height: 3.5rem !important;
    width: 2.5rem !important;
}

common-table .slds-th__action .slds-truncate{
    overflow: hidden;
    text-overflow: unset;
    white-space: pre-line;
    flex-grow: 1;
    font-size: var(--text-sm);
}

common-table .slds-th__action {
    height: 4rem;
}

common-table .slds-line-height_reset{
    height: 2rem;
}

common-table thead lightning-primitive-header-factory {
    display: flex;
    text-align: center;
}

/* A header column's label span normally centers via the text-align above just fine on its own,
   but once it also carries a lightning-helptext (a column with headerTitle set), the label text
   and the icon sit side by side as two separate items — text-align alone doesn't center that
   *pair* as a unit, only each item's own content, so the combination visibly drifts to the start.
   Only selecting spans that actually contain a helptext icon keeps every other header (the vast
   majority, with no headerTitle) untouched. The label text is wrapped in its own inner
   .slds-truncate span (see common/table/templates/customHeader.html) specifically so a narrow
   column truncates just the text with an ellipsis instead of the whole row silently overflowing
   into the next column — min-width:0 on both the flex row and the truncating child is required
   for that ellipsis to actually engage inside a flex container (flex items default to
   min-width:auto, which never shrinks below content size on its own). The icon gets flex-shrink:0
   so it's never the thing that gets squeezed. */
common-table thead lightning-primitive-header-factory span:has(lightning-helptext) {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
}

common-table thead lightning-primitive-header-factory span:has(lightning-helptext) .slds-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

common-table thead lightning-primitive-header-factory span:has(lightning-helptext) lightning-helptext {
    flex-shrink: 0;
}

.title {
    font-size: 1.5rem;
}

.subtitle {
    font-size: 1.5em;
}

subtitle-medium {
    font-size: 1.3em;
}

.bold{
    font-weight: bold;
}

.text-med {
    font-size: var(--text-med);
}

lightning-badge.badge-xl {
    --slds-c-badge-font-size: var(--text-xl);
}

.card-stats .slds-card__body {
    display: contents;
}

lightning-button-icon.tutorial button,  lightning-button.compare button, lightning-button.tutorial button {
    background-color: var(--color-help) !important;
    border-color: var(--color-help) !important;
}

.fulfillment svg {
    transform: rotate(10deg);
}

.with-discount lightning-badge, lightning-badge.with-discount{
    background-color:transparent;
    color: #515151;
    --slds-c-badge-icon-color-foreground: #515151;
}

.above-reference lightning-badge, lightning-badge.above-reference{
    color: #515151;
    color: var(--color-very-high);
    /* --slds-c-badge-color-background: var(--color-very-high); */
}

.below-reference lightning-badge, lightning-badge.below-reference{
    color: var(--color-low);
    /* --slds-c-badge-color-background: var(--color-low); */
}

.with-discount svg {
    height: 2rem !important;
    width: 2rem !important;
}

.mercado-envios lightning-badge, lightning-badge.mercado-envios{
    background-color:transparent;
    color: #96b44e;
    --slds-c-badge-icon-color-foreground: #96b44e;
}

.mercado-envios lightning-icon{
    --slds-c-icon-color-foreground-default: #96b44e;
}

.mercado-envios svg {
    height: 2rem !important;
    width: 2rem !important;
}

.width{
    width: 100%;
}

.free-shipping  lightning-badge , lightning-badge.free-shipping{
    background-color: transparent;
    color: #00a650;
    font-size: 0.9rem;
}

.flex-custom  lightning-badge , lightning-badge.flex-custom{
    background-color: transparent;
    color: #A7C957;
    text-transform: uppercase;
    font-size:larger;
}

.group {
    overflow-x: auto;
    min-width: 0;
    display: grid;
}

.box, .box-small, .box-medium, common-paginated-table common-table {
    border-radius: 10px;
    border-color: #DDDDDD;
    border-style: solid;
    border-width: 2px;
}

.slds-card {
    border-radius: 10px;
    border:none;
    padding:1px;
}

common-paginated-table, common-paginated-table .slds-table_header-fixed_container {
    border-radius: 10px;
}

common-paginated-table common-table, .slds-card {
    box-shadow: 0px 4px 8px 4px rgba(10, 10, 10, 0.07);
}

common-table {
    min-width: 0;
}

common-tree-grid common-table {
    border-radius: 0px;
    box-shadow: none;
    border-style: none;
}   

common-tree-grid .dt-outer-container{
    border-style: solid;
    border-radius: 10px;
    box-shadow: 0px 4px 8px 4px rgba(20, 20, 20, 0.1);
    border-color: #c9c9c9;
}   

/* .box, .box-small, .box-medium {
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.05);
} */

.box {
    padding: 2rem;
}

.box-small {
    padding: 0.3rem;
}

.box-medium {
    padding: 0.8rem;
}

lightning-button-icon.download button {
    background-color: var(--color-correct-300);
    border-color: var(--color-correct-300);
}

lightning-button-icon.download button:hover {
    background-color: var(--color-correct-400);
    border-color: var(--color-correct-400);
}

lightning-button-icon.download-faux button {
    background-color: var(--color-correct-300);
    border-color: var(--color-correct-300);
}

lightning-button-icon.download-faux button:hover {
    background-color: var(--color-correct-300);
    border-color: var(--color-correct-300);
    cursor:default;
}

.toast-container {
    top: 80px;
}

.slds-theme_info {
    background-color: #2a9bc5;
}

.slds-is-sortable__icon {
    display: inline-block;
}

.slds-is-sorted .slds-is-sortable__icon {
    fill: rgb(1, 118, 211)
}

.card-stats {
    font-size: 1.3em;
    --slds-c-badge-font-size: 1.5em;
    display: flex;
    /* justify-content:space-between; */
    flex-direction:column;
}

.increase , .green{
    color: #11845b;
}

.decrease, .red {
    color: #dc2b2b;
}

.card-stats lightning-layout {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-color: white;
    height: 100%;
    padding: 0.5rem 0;
}

.slds-theme_error {
    background-color: var(--slds-g-color-neutral-base-50);
}

.gray {
    color: gray;
}

.hide *{
    display: none;
}

/*labels de los input, les saco el espacio de arriba*/
label.slds-form-element__label {
    padding-top: 0px;
}

lightning-primitive-input-simple {
    line-height: 0.75rem;
}

/* The actual root cause of the ~2px gap chased through every wrapper level: lightning-primitive-
   input-simple's own template (primitiveInputSimple.html) always renders a trailing
   `<div id="help-message" class="slds-form-element__help ...">` sibling after the real label+
   input container - only its *inner* text is conditional on there being a validation message, the
   div itself is never removed. The real SLDS stylesheet gives that class `margin-top: 0.125rem`
   (2px) unconditionally, so this permanently-empty div silently adds exactly the 2px that kept
   reappearing one level deeper each time a wrapper above it was fixed to fill/match. These filter
   inputs never show a validation message, so it's always dead space here - hide it outright
   (scoped to common-filters so real help-text elsewhere in the app keeps its margin). */
common-filters lightning-primitive-input-simple [data-help-message] {
    display: none;
}

common-page-link button.slds-button_icon-brand, lightning-button[variant="brand"], common-paginated-table button.slds-button_icon-brand, button[title="Borrar filtros"], .blueStyle{
    --slds-c-button-color-background: var(--color-salesforce);
    --slds-c-button-color-border: var(--color-salesforce);
}

.slds-button_icon-brand, .slds-button_icon-brand {
    background-color: var(--color-salesforce);
    border-color: var(--color-salesforce);
}

button.slds-button_neutral{
    border-color: var(--color-salesforce);
    --slds-c-button-text-color :var(--color-salesforce);
}

lightning-tabset{
    --slds-c-tabs-item-color-border-active : var(--color-salesforce);
    --slds-c-tabs-item-color-border-hover: var(--color-salesforce);
}

.oneLineButton{
    min-width: max-content;
}

.winning{
    --slds-c-badge-color-background: var(--color-buybox-winning) ;
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;
}

.green button {
    background-color: var(--color-correct-300);
    border-color: var(--color-correct-300);
}

.green button:hover {
    background-color: var(--color-correct-400);
    border-color: var(--color-correct-400);
}

.green {
    color: var(--color-correct-300);
}

.competing {
    --slds-c-badge-color-background: var(--color-buybox-competing);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;
}

.sharing_first_place {
    --slds-c-badge-color-background: var(--color-buybox-sharing-first);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;
}

.listed {
    --slds-c-badge-color-background: var(--color-buybox-listed);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;
}

.blueColor .slds-form-element__label {
    color: var(--color-salesforce);
}

.blueColor .slds-checkbox_faux {
    border-color: var(--color-salesforce);
}

.tab ul{
    width: fit-content;
    margin: auto;
}
.tab{
    --slds-c-tabs-list-sizing-border : 0px;
}

lightning-button-icon[data-id="accept"] {
    --slds-c-button-color-background: #45c65a;
    --slds-g-color-neutral-base-50: white;
}

lightning-button-icon[data-id="reject"] {
    --slds-c-button-color-background: #ba0517;
    --slds-g-color-neutral-base-50: white;
}

lightning-button-icon[data-id="delete"] {
    --slds-c-button-color-background: var(--color-incorrect-300);
    --slds-g-color-neutral-base-50: white;
    --slds-g-color-border-base-4: var(--color-incorrect-300);
}

/* hacer que rows seleccionadas sigan en blanco
common-table tbody tr:not(:hover) {
    --slds-g-color-neutral-base-95: white;
}
*/

common-table lightning-helptext > div.slds-form-element__icon {
    padding-top: 0px;
    vertical-align: middle;
}

lightning-icon.item svg {
    --slds-c-icon-color-foreground: var(--color-item-300);
}

lightning-icon.seller svg {
    --slds-c-icon-color-foreground: var(--color-seller-300);
}

lightning-icon.brand svg {
    --slds-c-icon-color-foreground: var(--color-brand-300);
}

lightning-icon.store svg {
    --slds-c-icon-color-foreground: var(--color-official-store-300);
}

lightning-icon.pvp svg {
    --slds-c-icon-color-foreground: var(--color-pvp);
}

lightning-icon.price-robot svg {
    --slds-c-icon-color-foreground: var(--color-price-robot);
}

lightning-icon.catalog svg {
    --slds-c-icon-color-foreground: var(--color-catalog-300);
}

lightning-icon.menu svg {
    --slds-c-icon-color-foreground: #546e7a ;
}

lightning-icon.catlog-seller svg {
    --slds-c-icon-color-foreground: var(--color-salesforce);
}

lightning-icon.transparentBG ,lightning-icon.catalog, lightning-icon.brand, lightning-icon.slds-icon-standard-contact,  lightning-icon.slds-icon-standard-catalog, lightning-icon.slds-icon-standard-case {
    --slds-c-icon-color-background: transparent;
}

lightning-icon.analytics svg {
    --slds-c-icon-color-foreground: var(--color-pink);
}

lightning-icon.tendency svg {
    --slds-c-icon-color-foreground: var(--color-tendency);
}

lightning-icon.opportunity svg {
    --slds-c-icon-color-foreground: var(--color-opportunity);
}

lightning-icon.rating svg{
    --slds-c-icon-color-foreground: var(--color-salesforce);
}

.icon svg.catalog {
    fill: var(--color-catalog-300) !important;
}

lightning-icon.category svg {
    --slds-c-icon-color-foreground: var(--color-neutral-700);
}

lightning-icon.most-searched svg {
    --slds-c-icon-color-foreground: var(--color-neutral-700);
}

lightning-icon.tutorial svg {
    --slds-c-icon-color-foreground: var(--color-help);
}

lightning-icon.search svg {
    --slds-c-icon-color-foreground: var(--color-search-listings);
}

lightning-icon.cbt {
    background-color: var(--color-official-store-100) !important;
    padding: 3px;
}

lightning-icon.cbt svg {
    fill: var(--color-salesforce) !important;
}

lightning-icon.official svg {
    fill: var(--color-salesforce) !important;
}

lightning-button.item button.slds-button_brand {
    --slds-c-button-color-background: var(--color-item-300);
    --slds-c-button-color-border: var(--color-item-300);
    --slds-c-button-color-background-hover: var(--color-item-400);
    --slds-c-button-color-border-hover: var(--color-item-400);
    --slds-c-button-text-color : white;
}

lightning-button.item.executed button.slds-button_brand {
    --slds-c-button-color-background: var(--color-item-400);
    --slds-c-button-color-border: var(--color-item-400);
    --slds-c-button-color-background-hover: var(--color-item-400);
    --slds-c-button-color-border-hover: var(--color-item-400);
    --slds-c-button-text-color : white;
}

lightning-button.item button.slds-button_neutral {
    --slds-c-button-color-background: var(--color-item-100);
    --slds-c-button-color-background-hover: var(--color-item-100);
    border-color: var(--color-item-100);
    --slds-c-button-text-color : black;
}

lightning-button.seller button.slds-button_brand {
    --slds-c-button-color-background: var(--color-seller-300);
    --slds-c-button-color-border: var(--color-seller-300);
    --slds-c-button-color-background-hover: var(--color-seller-400);
    --slds-c-button-color-border-hover: var(--color-seller-400);
    --slds-c-button-text-color : white;
}

lightning-button.seller button.slds-button_neutral {
    --slds-c-button-color-background: var(--color-seller-100);
    --slds-c-button-color-background-hover: var(--color-seller-100);
    border-color: var(--color-seller-100);
    --slds-c-button-text-color : black;
}

.unlocked lightning-button button.slds-button_neutral {
    --slds-c-button-color-background: var(--color-correct-100);
    --slds-c-button-color-background-hover: var(--color-correct-100);
    border-color: var(--color-correct-100);
    --slds-c-button-text-color : black;
}

.locked lightning-button button.slds-button_brand {
    --slds-c-button-color-background: var(--color-correct-400);
    --slds-c-button-color-background-hover: var(--color-correct-400);
    border-color: var(--color-correct-400);
    --slds-c-button-text-color : white;
}

lightning-button.brand button.slds-button_brand {
    --slds-c-button-color-background: var(--color-brand-300);
    --slds-c-button-color-border: var(--color-brand-300);
    --slds-c-button-color-background-hover: var(--color-brand-400);
    --slds-c-button-color-border-hover: var(--color-brand-400);
    --slds-c-button-text-color : white;
}

lightning-button.brand button.slds-button_neutral {
    --slds-c-button-color-background: var(--color-brand-100);
    --slds-c-button-color-background-hover: var(--color-brand-100);
    border-color: var(--color-brand-100);
    --slds-c-button-text-color : black;
}

lightning-button.store button.slds-button_brand {
    --slds-c-button-color-background: var(--color-official-store-300);
    --slds-c-button-color-border: var(--color-official-store-300);
    --slds-c-button-color-background-hover: var(--color-official-store-400);
    --slds-c-button-color-border-hover: var(--color-official-store-400);
    --slds-c-button-text-color : white;
}

lightning-button.store button.slds-button_neutral {
    --slds-c-button-color-background: var(--color-official-store-100);
    --slds-c-button-color-background-hover: var(--color-official-store-100);
    border-color: var(--color-official-store-100);
    --slds-c-button-text-color : black;
}

lightning-button.catalog button.slds-button_brand {
    --slds-c-button-color-background: var(--color-catalog-300);
    --slds-c-button-color-background-hover: var(--color-catalog-400); 
    --slds-c-button-color-border: var(--color-catalog-300);
}

lightning-button.catalog-offer button.slds-button_brand {
    --slds-c-button-color-background: var(--color-catalog-300);
    --slds-c-button-color-background-hover: var(--color-catalog-400); 
    --slds-c-button-color-border: var(--color-catalog-300);
    --slds-c-button-text-color : black;
    --slds-c-button-text-color-hover: black;
}

lightning-button[data-id="catalog"] button.slds-button_brand{
    --slds-c-button-color-background: var(--color-catalog-300);
    --slds-c-button-color-background-hover: var(--color-catalog-400); 
    --slds-c-button-color-border: var(--color-catalog-300);
}

lightning-button.catalog button.slds-button_neutral {
    --slds-c-button-color-background: var(--color-catalog-100);
    --slds-c-button-color-background-hover: var(--color-catalog-100);
    border-color: var(--color-catalog-100);
    --slds-c-button-text-color : black;
}

lightning-button.analytics button.slds-button_neutral {
    --slds-c-button-color-background: var(--color-pink);
    --slds-c-button-color-background-hover: var(--color-pink);
    border-color: var(--color-pink);
    --slds-c-button-text-color : white;
}

lightning-button.analytics button.slds-button_brand {
    --slds-c-button-color-background: var(--color-pink);
    --slds-c-button-color-border: var(--color-pink);
    --slds-c-button-color-background-hover: #8C114F;
    --slds-c-button-color-border-hover: #8C114F;
    --slds-c-button-text-color : white;
}

lightning-button.analytics .slds-button_brand:hover{
    background-color: #8C114F;
    border-color: #8C114F;     
}

lightning-button-icon.category .slds-button_icon-brand {
    background-color: var(--color-neutral-700);
    border-color: var(--color-neutral-700);
}

lightning-button-icon.category .slds-button_icon-brand:hover {
    background-color: var(--color-neutral-800);
    border-color: var(--color-neutral-800);
}

lightning-button.category .slds-button_brand{
    background-color: var(--color-neutral-700);
    border-color: var(--color-neutral-700);                
}

lightning-button.category .slds-button_brand:hover{
    background-color: var(--color-neutral-800);
    border-color: var(--color-neutral-800);              
}

lightning-button-icon.item .slds-button_icon-brand {
    background-color: var(--color-item-300);
    border-color: var(--color-item-300);
}

lightning-button-icon.seller .slds-button_icon-brand {
    background-color: var(--color-seller-300);
    border-color: var(--color-seller-300);
}

lightning-button-icon.brand .slds-button_icon-brand {
    background-color: var(--color-brand-300);
    border-color: var(--color-brand-300);
}

lightning-button-icon.store .slds-button_icon-brand {
    background-color: var(--color-official-store-300);
    border-color: var(--color-official-store-300);
}

lightning-button-icon.catalog .slds-button_icon-brand {
    background-color: var(--color-catalog-300);
    border-color: var(--color-catalog-300);
}

lightning-button-icon.alert-activated .slds-button_icon {
    background-color: var(--color-catalog-300);
    border-color: var(--color-catalog-300);
}

lightning-button-icon.pvp .slds-button_icon-brand {
    background-color: var(--color-pvp);
    border-color: var(--color-pvp);
}

lightning-button-icon.seller-catalogs .slds-button_icon-brand {
    background-color: var(--color-salesforce);
    border-color: var(--color-salesforce);
}

lightning-button-icon.opportunity .slds-button_icon-brand {
    background-color: var(--color-opportunity);
    border-color: var(--color-opportunity);
}

lightning-button-icon.tendency .slds-button_icon-brand {
    background-color: var(--color-tendency);
    border-color: var(--color-tendency);
}

lightning-button-icon.tendency .slds-button_icon-brand:hover {
    background-color: var(--color-tendency);
    border-color: var(--color-tendency);
}

lightning-badge.item {
    --slds-c-badge-color-background: var(--color-item-300);
    --slds-c-badge-text-color: white;
}

lightning-badge.catalog {
    --slds-c-badge-color-background: var(--color-catalog-300);
    --slds-c-badge-text-color: white;
}

lightning-badge.analytics {
    --slds-c-badge-color-background: var(--color-pink);
    --slds-c-badge-text-color: white;
}

lightning-badge.tendency {
    --slds-c-badge-color-background: var(--color-tendency);
    --slds-c-badge-text-color: white;
}

lightning-badge.meli{
    --slds-c-badge-color-background: #ffe600;
    --slds-c-badge-text-color: #2d3277;
}

lightning-badge.prices-to-win{
    --slds-c-badge-color-background: #ffe600;
    --slds-c-badge-text-color: black;
}

lightning-badge.search {
    --slds-c-badge-color-background: var(--color-search-listings);
    --slds-c-badge-text-color: white;
}

lightning-badge.store {
    --slds-c-badge-color-background: var(--color-official-store-300);
    --slds-c-badge-text-color: white;
}

lightning-badge.brand {
    --slds-c-badge-color-background: var(--color-brand-300);
    --slds-c-badge-text-color: white;
}

lightning-badge.seller {
    --slds-c-badge-color-background: var(--color-seller-300);
    --slds-c-badge-text-color: white;
}

lightning-badge.ai {
    --slds-c-badge-color-background: var(--color-pink);
    --slds-c-badge-text-color: white;
}

lightning-badge.filter {
    --slds-c-badge-color-background: #05679ac4;
    --slds-c-badge-text-color: white;
    font-weight: normal;
    cursor: pointer;
}
lightning-badge.filter svg{
    fill: white !important;
}

lightning-badge.opportunity {
    --slds-c-badge-color-background: var(--color-opportunity);
    --slds-c-badge-text-color: white;
}

.standardIcon {
    margin-right : -4px; 
    margin-left: -4px;
}

.slds-button_success {
    color: white;
}

/*
.custom-combobox-label {
    font-size: 13px;
}*/
            
button.slds-button_brand {
    --slds-c-button-color-background: var(--color-salesforce);
    --slds-c-button-color-border: var(--color-salesforce);      
}

.slds-popover__body, .slds-popover__header, .slds-popover__footer{
    padding:0.75rem 1rem;
}

.slds-table td.table-right-padding_medium {
    padding-right: 1rem;
}

lightning-confirm p {
    white-space: pre-line;
    text-align: center;
}

.chart-column common-chart-js {
    display: block !important;
}

.follow-buttons {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    display: grid;
    grid-row-gap: 1em;
}

td.follow-column .slds-truncate {
    width: 100%;
}

/*para que ocupen lo que ocupa el texto/el input nomas*/
.slds-combobox.slds-is-open .slds-dropdown_fluid {
    min-width: auto;
    display: inline-table;
}

/*para que no ocupe espacio el icono vacio*/
.slds-listbox__option-icon {
    display: none;
}

lightning-combobox.state span::first-letter {
    text-transform: capitalize;
}

common-expandable-section .icon svg , common-expandable-section h3 {
    fill: white !important;
    color: white;
}

lightning-button.apply-filters button , .expandableSection button {
    --slds-c-button-color-background:#05679a !important;
    --slds-c-button-color-border: #05679a !important;
}

lightning-button-icon.apply-filters button , .expandableSection button{
    background-color:#05679a !important;
    border-color:#05679a !important;
    color: white;
}

.highlightedTable common-table  .buyBoxWinner > *:not(lightning-button, button){
    background-color: var(--color-search-listings) !important;
}

.highlightedTable common-table  .buyBoxWinner *:not(.avoidHighlight *){
    color: white !important;
    --slds-c-icon-color-foreground-default: white ;
}

.highlightedTable common-table  .buyBoxWinner .slds-icon-standard-mercadolider-platinum *{
    fill: white;
}

.highlightedTable common-table .sellerProduct > *:not( lightning-button, button) {
    background-color:  rgb(220, 220, 220)  !important;
    
}
.highlightedTable common-table .sellerProduct *:not(.avoidHighlight * , lightning-badge *) {
    color: black;
}

.highlightedTable  common-table .sellerProduct .fulfillment lightning-badge, .highlightedTable .buyBoxWinner .fulfillment lightning-badge, .highlightedTable .buyBoxWinner lightning-icon {
    color: white ;
    --slds-c-badge-icon-color-foreground: white ;
    
}

.highlightedTable common-table .unlocked-category {
    background-color:  rgba(5, 193, 104, 0.8)  !important;
}

.highlightedTable common-table .wildcard-category {
    background-color:  rgba(253, 216, 53, 0.8)  !important;
}

lightning-breadcrumbs.custom a{
    color:grey;
}

lightning-breadcrumbs.custom .slds-breadcrumb .slds-list__item:before, .slds-breadcrumb .slds-breadcrumb__item:before {
    content: ">";
    position: absolute;
    left: -0.25rem;
    color: grey;
}

lightning-pill.custom span.slds-pill{
    --slds-c-pill-spacing-inline-start: 0.35rem !important;
    --slds-c-pill-spacing-block-start: 0.35rem !important;
    --slds-c-pill-spacing-inline-end: 0.35rem !important;
    --slds-c-pill-spacing-block-end: 0.35rem !important;
    --slds-c-pill-color-border: lightgrey;
    --slds-c-pill-radius-border: 1px;
    color:#666;
}

lightning-checkbox-group.custom .slds-form-element__control .slds-checkbox{
    display: inline-block !important;
}

lightning-radio-group.inline .slds-form-element__control .slds-radio{
    display: inline-block !important;
}

lightning-checkbox-group.custom .slds-checkbox .slds-checkbox__label .slds-form-element__label{
    font-size: 1rem;
}

lightning-checkbox-group.custom .slds-checkbox {
    padding:5px;
}

common-table.catalog-items td.winner,  common-table.catalog-items th.winner{
    background-color:var(--color-catalog-300);
}
common-tree-grid .slds-dropdown-trigger{
    display: none !important;
}
common-tree-grid .slds-th__action{
    padding-right: 0.5rem !important;
}

.item button:hover {
    background-color:  var(--color-item-400);
    border-color: var(--color-item-400);
}

.item button::before, .item button:after {
    background: none !important;
}


.catalog button.slds-button_brand:hover{
    background-color: var(--color-catalog-400);
    border-color: var(--color-catalog-400);
}

.seller button.slds-button_brand:hover{
    background-color: var(--color-seller-400);
    border-color: var(--color-seller-400); 
}

.store button.slds-button_brand:hover{
    background-color: var(--color-official-store-400);
    border-color: var(--color-official-store-400); 
}

.brand button.slds-button_brand:hover{
    background-color: var(--color-brand-400);
    border-color: var(--color-brand-400);
}

lightning-base-combobox span {
    position: relative;
}

lightning-icon.pdf:hover{
    cursor:pointer;
}

div.watermark {
    margin-left: 10px;
    font-size:medium;
    visibility: hidden;
}

img.vs-logo{
    margin-left: 10px;
    margin-top:10px;
    visibility:hidden;
}

th.self, td.self{
    background-color: var(--color-seller-100);
}

th.self-unified, td.self-unified{
    background-color: #FFD4A8;
}

lightning-button.ai button.slds-button_brand {
    --slds-c-button-text-color : white;
    --slds-c-button-color-background: var(--color-pink);
    --slds-c-button-color-border: var(--color-pink);
    --slds-c-icon-color-foreground: white;
}

lightning-button.ai-hide button.slds-button_brand {
    --slds-c-button-text-color : var(--color-pink);
    --slds-c-button-color-background: white;
    --slds-c-button-color-border: var(--color-pink);
    --slds-c-icon-color-foreground: white;
}

lightning-button.ai button.slds-button_neutral {
    --slds-c-button-color-background: white;
    --slds-c-button-color-background-hover: white;
    border-color: var(--color-pink);
    --slds-c-button-text-color : var(--color-pink);
}

.aa-Panel {
    z-index: 9999;
}

.set-name input {
    height: 44px;
}

.high-performance {
    --slds-c-badge-color-background: var(--color-listing-high-performance);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;
}

.new {
    --slds-c-badge-color-background: var(--color-listing-new);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;    
}

.growing {
    --slds-c-badge-color-background: var(--color-listing-growing);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;    
}

.falling {
    --slds-c-badge-color-background: var(--color-listing-falling);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;    
}

.stable {
    --slds-c-badge-color-background: var(--color-listing-stable);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;    
}

.without-sales {
    --slds-c-badge-color-background: var(--color-listing-without-sales);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;    
}

.recent-sales{
    --slds-c-badge-color-background: var(--color-listing-recent-sales);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;                
}

.incoming {
    --slds-c-badge-color-background: var(--color-extreme-high);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;    
}

.outgoing {
    --slds-c-badge-color-background: var(--color-very-low);
    --slds-c-badge-text-color: white;
    --slds-c-badge-font-size: 0.85rem;
}

td.sticky, th.sticky {
    position: sticky !important;
    left: 0;
    z-index: 2;
    background-color: white;
}

/* Only a plain (non-sticky-header) table still carries the vendor's own 2rem padding-top on
   .slds-table_header-fixed_container that this compensates for - a sticky-header table zeroes
   that padding out entirely (see its own rule further below), so applying the same -2rem shift
   there would push the frozen column's own header cell up by 2rem it no longer has to make up
   for, throwing it out of line with the table's other (non-frozen) header cells. */
common-table:not(.sticky-header-table) thead th.sticky {
    transform: translateY(-2rem); /* para arreglar el padding de la tabla que sticky ignora */
}

common-table .slds-scrollable_y {
    overflow: unset;
}

/* Opt-in/out (paginatedTable's `disable-sticky-header` prop): bounds the grid to a max height with
   its own internal vertical scroll, keeping the header row pinned to the top of that scroll area
   instead of scrolling away with the rows - relevant now that showPageSizeSelector can put up to
   100 rows on a page. lightning-datatable already ships this exact mechanism (a max-height/
   overflow-y:auto scroller plus `position: sticky` header cells) but only under a
   `:host([data-render-mode="shadow"])` selector that never matches in this app's synthetic-shadow
   build - same reason the `.sticky` column rules above have to be re-declared here rather than
   relying on the vendor's own copy. No height at all on the host itself - a table with fewer rows
   than fit in 90vh left a big empty gap below its own (shorter) content when the host was forced
   to a fixed height regardless of how much content it actually had. The cap lives on
   `.slds-table_header-fixed_container` below instead, so the host stays its natural auto height,
   only the scroller ever gets taller than its content and then clips/scrolls at 90vh. */
common-table.sticky-header-table {
    display: block;
}

/* `position: sticky` resolves its containing block as a *single* nearest scroll-container ancestor
   (not resolved per-axis) - as soon as this inner div carries ANY non-visible overflow (even only
   on the y axis, as an earlier version of this rule did), it - not `.slds-table_header-fixed_container`
   below, the element that actually scrolls horizontally - becomes that reference for EVERY sticky
   descendant, including a `.sticky` frozen column's `left: 0`, which then drifts out of the viewport
   during horizontal scroll since this inner div itself isn't what's moving. So this stays fully
   overflow:visible - both scrolling and the height cap move to the container below instead, the one
   that already legitimately handles this table's horizontal scroll, so a single ancestor correctly
   serves both a frozen column's `left` and the sticky header's `top` at once. */
common-table.sticky-header-table .slds-scrollable_y {
    overflow: visible !important;
}

common-table.sticky-header-table .slds-table_header-fixed_container,
common-table.sticky-header-table .slds-table--header-fixed_container {
    padding-top: 0;
    background-color: transparent;
    /* Vendor default is overflow-y:hidden (overflow-x:auto is its own, already correct, real
       horizontal scrollbar - left as-is). */
    overflow-y: auto !important;
    /* Belt-and-suspenders against the same kind of JS-driven inline height surprise found on
       `.slds-scrollable_y` above (see git history) - this container's own inline height so far has
       only ever been an innocuous `height: 100%` chain (100% of an auto-height ancestor computes as
       auto, i.e. a no-op), but now that its height actually matters for the scroll/clip cap below,
       force it back to content-driven explicitly rather than assume that stays true. */
    height: auto !important;
    max-height: 90vh;
}

/* A vendor divider (`.slds-scrollable_y::before`, empty block with only a border-bottom) sits right
   before the table, directly above thead - normally blends into the flow, but reads as a stray line
   right above the now-pinned sticky header. */
common-table.sticky-header-table .slds-scrollable_y::before {
    border-bottom: none !important;
}

/* This app already deliberately lets a header's own label wrap to two lines - `.slds-th__action`
   (further up in this file) is explicitly 4rem tall with `white-space: pre-line` for exactly that,
   long Spanish column names included. thead/tr/th themselves don't actually match that 4rem (some
   other height, likely lightning-datatable's own JS-computed header-height for virtualization,
   constrains them instead), so a two-line label simply overflows past the row's own bottom edge -
   harmless normally, but a sticky, opaque, above-content header can't be allowed to spill onto
   whatever's below it, which here is the first tbody row. Matching thead/th to that same 4rem
   (rather than clipping the overflow, which would cut the deliberately-wrapped label down to one
   line for every header, not just the ones that need two) gives it enough room to fit for real. */
common-table.sticky-header-table thead tr {
    height: 4rem;
}

/* Raises the WHOLE header row-group's stacking as one unit above tbody's own frozen (`.sticky`)
   column cells (z-index:2), so the header's corner cell doesn't need its own z-index touched at all
   (which, per the cells' own rules further below, breaks that cell's horizontal stickiness) -
   `thead` has no position/z-index of its own anywhere else, so this is a fresh stacking context
   rather than an override of any existing rule, sidestepping that same issue entirely. */
common-table.sticky-header-table thead {
    position: relative;
    z-index: 4;
}

common-table.sticky-header-table thead th {
    position: sticky;
    top: 0;
    /* No explicit z-index here on purpose - a `.sticky` frozen-column header cell (the corner cell,
       frozen on both axes: `left:0` from `.sticky` further up this file, `top:0` from this rule)
       loses its horizontal stickiness the moment its own z-index is re-declared via a more specific
       selector than that shared rule (confirmed empirically, in both directions). `.sticky`'s own
       z-index:2 is left completely untouched here - the `thead` rule just above already raises the
       whole header row-group's stacking as one unit above tbody's frozen column, so this cell
       doesn't need (and can't safely take) an override of its own to stay above it. Every OTHER
       (non-frozen) header cell, on the other hand, does need its own explicit z-index (plain
       position:sticky with none didn't reliably outrank ordinary tbody cells here) - see the
       `:not(.sticky)` rule right below, safe to add since it's never applied to the one cell that
       can't have its z-index touched. */
    background-color: white;
    height: 4rem;
    /* Cells normally carry their own top border, invisible in the ordinary (non-sticky) header since
       nothing sits above it. Sticky makes the header an opaque overlay pinned above the scrolled
       content, so that same border now reads as a stray line at the header's own top edge. */
    border-top: none;
}

/* Needs to land strictly between "whatever ordinary tbody cells effectively compare as" (no
   z-index of their own) and the frozen corner header cell's z-index:2 (from `.sticky` further up)
   - high enough to stay above ordinary body rows during vertical scroll, but lower than 2 so it
   doesn't slide over the frozen column's own header cell during horizontal scroll (z-index:3 here
   previously did exactly that - outranked the corner cell too, not just ordinary body rows). */
common-table.sticky-header-table thead th:not(.sticky) {
    z-index: 1;
}

/* Adjacent cell borders sit right on the boundary between the sticky thead and the first tbody
   row - since the header is stacked above it, its own bottom border visually overlaps a sliver of
   that row's top border. */
common-table.sticky-header-table tbody tr:first-child td,
common-table.sticky-header-table tbody tr:first-child th {
    border-top: none;
}

/* The column-resize drag guide (`[data-resize-handle]::before`, same element as
   `.slds-resizable__divider`) is always in the DOM - just invisible (opacity: 0) until hovered -
   and is absolutely positioned with an explicit `height: 100vh`, a full-page vertical guideline
   meant to show while actively dragging a column wider/narrower. Harmless when overflow is
   unconstrained (every table before this feature), but `.slds-table_header-fixed_container` now
   actually enforces `overflow-y: auto` above, so the browser has to reserve real scrollable space
   for that invisible 100vh box - reserving it all the way down the page, well past the table's real
   rows. Scoped to sticky-header tables only, since plain tables never needed this. */
common-table.sticky-header-table .slds-resizable__divider::before,
common-table.sticky-header-table .slds-resizable__divider::after {
    height: 100% !important;
}

/* This container (.slds-scrollable_x/.slds-table_header-fixed_container) is genuinely narrower than
   its child .slds-scrollable_y, which is fixed at the table's full rendered width - it's the one
   that actually needs to scroll horizontally, exactly like it already does for every other
   (non-sticky-header) paginated table, so its own overflow-x: auto is left alone here. What's
   redundant is `.group`'s own outer `overflow-x: auto` (below) scrolling that exact same overflow a
   second time one level further out - only one of the two should. */
common-paginated-table.sticky-header-host {
    overflow-x: visible;
}

/* Header-filter mode (see paginatedTable.js's filtersBarClass): the actual top common-filters bar
   stays mounted (it still owns the filter inputs/values/applying logic) but shouldn't be seen or take
   up layout space - this app doesn't ship the standard SLDS utility-class stylesheet that a name like
   'slds-hidden' would normally resolve to, so this has to be a real rule of our own. */
.header-filters-bar-hidden {
    display: none;
}

/* Header-filter mode (see common/table.js's PrimitiveHeaderFactory monkeypatch and its
   customHeader.html) - the icon is declared right in that template, next to the label (as a
   SIBLING of the label span, not nested inside it - that span truncates/wraps text via its own
   overflow handling, which caught a nested icon up in it too: wrapping onto its own line, or
   getting clipped once its popover was open). Styled globally rather than via a scoped .css
   colocated with table.js for the same reason as .sticky above: this markup lives inside
   lightning-datatable's own inherited shadow tree, not a template this package owns a component
   class for. */
.header-filter-icon-wrap {
    display: inline-flex;
    align-items: center;
}

.header-filter-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin-left: 4px;
    border-radius: 50%;
    cursor: pointer;
    color: #706e6b;
    background-color: #f3f2f2;
}

.header-filter-trigger.active {
    background-color: #d3e6fa;
    color: #0176d3;
}

/* Position (fixed, top/left) is set inline in table.js from the icon's own live bounding box and
   appended to document.body - not a child of .header-filter-icon-wrap - specifically to escape
   whatever ancestor's overflow:hidden makes the label span's truncation/wrapping work in the first
   place (nesting the popover inside it, even positioned, got silently clipped). Only visual styling
   belongs here. */
.header-filter-popover {
    z-index: 20;
    background: #fff;
    border: 1px solid #dddbda;
    border-radius: 0.25rem;
    box-shadow: 0 4px 12px rgba(0,0,0,.18);
    padding: 0.75rem;
    min-width: 220px;
    font-weight: normal;
    text-transform: none;
    white-space: normal;
    cursor: default;
}

.header-filter-popover-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
}

.header-filter-clear {
    background: none;
    border: none;
    color: #706e6b;
    font-size: 12px;
    cursor: pointer;
    padding: 4px 0;
}

.header-filter-apply {
    height: 26px;
    padding: 0 14px;
    background: #0176d3;
    color: #fff;
    border: none;
    border-radius: 0.25rem;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

div.data-info{
    font-size: 0.75rem;
    color: #A8A8A8;
}

lightning-icon.excel svg {
    --slds-c-icon-color-foreground: #8FC5E3;
}

lightning-button.excel button.slds-button_brand{
    --slds-c-button-color-background: #8FC5E3;
    --slds-c-button-color-border: #8FC5E3;
    --slds-c-button-color-background-hover: #4A82A9;
    --slds-c-button-color-border-hover: #4A82A9;
    --slds-c-button-text-color : white;
}

lightning-icon.excel:hover {
    cursor:pointer;
}

lightning-icon.favorite {
    transform:translateY(-6px);
}

lightning-icon.favorite:hover {
    cursor:pointer;
}

lightning-button-icon.suggestions .slds-button_icon-brand {
    background-color: var(--color-help);
    border-color: var(--color-help);
}

lightning-button-icon.whatsapp-icon-button .slds-button_icon-brand {
    background-color: #25D366;
    border-color: #25D366;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
}

lightning-button-icon.whatsapp-icon-button .slds-button_icon-brand:hover {
    background-color: #1EBE57;
    border-color: #1EBE57;
}

lightning-button-icon.whatsapp-icon-button .slds-button_icon-border {
    border-color: #25D366;
}

lightning-button-icon.whatsapp-icon-button .slds-button_icon-border:hover {
    border-color: #1EBE57;
}

lightning-button.whatsapp-button button.slds-button_neutral {
    border-color: #25D366;
    color: #25D366;
}

lightning-button.whatsapp-button button.slds-button_neutral:hover {
    border-color: #1EBE57;
    color: #1EBE57;
}

lightning-button.favorite button.slds-button_brand{
    --slds-c-button-color-background: #8FC5E3;
    --slds-c-button-color-border: #8FC5E3;
    --slds-c-button-color-background-hover: #4A82A9;
    --slds-c-button-color-border-hover: #4A82A9;
    --slds-c-button-text-color : white;
}

.slds-tabs_default__link[tabindex="0"]:focus, .slds-tabs--default__link[tabindex="0"]:focus{
    text-decoration: none;
}

.slds-button:focus, .slds-combobox__input:focus, .slds-combobox__input.slds-has-focus{
    -webkit-box-shadow: none;
    box-shadow: none;
}

common-toggle-group .slds-button_brand:hover, common-toggle-group .slds-button_brand:focus, common-toggle-group .slds-button--brand:hover, common-toggle-group .slds-button--brand:focus{
    --slds-c-button-color-background-hover: #1D5573;
    --slds-c-button-color-border-hover: #1D5573;
    --slds-c-button-text-color-hover: white;
}

.slds-popover_tooltip, .slds-popover--tooltip{
    background-color: #1D5573;
}

td.neutral {
    font-weight: 700;
}

td.positive {
    font-weight: 700;
    color: #11845b;
}

td.negative {
    font-weight: 700;
    color: #dc2b2b;
}

div.slds-notify_toast{
    border-radius: 0.25rem;
}

div.slds-notify_toast .slds-notify__content{
    white-space: pre-line;
}

div.slds-notify__close lightning-primitive-icon svg.slds-button__icon.slds-button__icon_large{
    width: 1rem;
    height: 1rem;
}

div.slds-notify_toast lightning-icon.slds-icon-utility-error lightning-primitive-icon svg, 
div.slds-notify_toast lightning-icon.slds-icon-utility-success lightning-primitive-icon svg {
    display:none;
}

lightning-button:not(.favorite):hover, lightning-button-icon:hover, lightning-button-group lightning-button:hover{
    opacity: .8;
}

.slds-popover_tooltip .slds-popover__body, .slds-popover--tooltip .slds-popover__body {
    --slds-c-tooltip-font-size: var(--text-xs)
}

div.data-info lightning-helptext slds-button__icon:hover, div.data-info lightning-helptext slds-button__icon:focus {
    fill: #A8A8A8;
}

div.data-info lightning-helptext .slds-button:hover .slds-button__icon, div.data-info lightning-helptext .slds-button:focus .slds-button__icon, div.data-info lightning-helptext .slds-button:active .slds-button__icon, div.data-info lightning-helptext .slds-button[disabled] .slds-button__icon, div.data-info lightning-helptext .slds-button:disabled .slds-button__icon {
    fill: #A8A8A8;
    pointer-events: none;
}

div.radar-disclaimer{
    color:gray;
    font-size:0.75rem;
    position:absolute;
    top:55px;
    right:30px;
}

.potential-category-text{
    font-size:0.85rem;
}

lightning-tabset.border-hidden .slds-tabs_default__nav, .slds-tabs--default__nav {
    border: none;
}

.slds-tabs_default .slds-tabs_default__item {
    font-size: var(--text-med);
}

.slds-truncate + .private-dt-sort-icon_container {
    display: block !important;
    opacity: 1 !important;
}

lightning-card.header-card article {
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    border: 2px solid #DDDDDD;
}

.slds-box.follow-group{
    --slds-g-color-border-base-1: #dddddd;
    border-radius: 0.5rem;
    border-width: 2px;
}

lightning-badge.follow-group-members{
    --slds-c-badge-color-background: #cde5f3;
}

.follow-group-name{
    color:#1d5573;
    font-size: var(--text-sm);
}

.groups-scroll {
    display: flex;
    overflow-x: auto;
    gap: 8px;
    padding-bottom: 8px;
    max-width:90vw;
}

.follow-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 180px;
    min-height: 80px;
    flex-shrink: 0;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
    background-color: white;
}

.follow-group:hover {
    border-color: #1d5573;
    box-shadow: 0 0 0 1px #1d5573;
}

.follow-group--selected {
    border-color: #1d5573;
    box-shadow: 0 0 0 2px #1d5573;
    background-color: #f0f6f9;
}

.stacked {
    display: block;
    margin-top: 10px;
}

common-paginated-table.tags-item lightning-badge, lightning-badge.tags-item {
    --slds-c-badge-color-background: var(--color-item-100);
    --slds-c-badge-text-color: var(--color-item-300);
    border-radius: 1rem;
}

common-paginated-table.tags-seller lightning-badge, lightning-badge.tags-seller {
    --slds-c-badge-color-background: var(--color-seller-100);
    --slds-c-badge-text-color: var(--color-seller-300);
    border-radius: 1rem;
}

.favorite{
    --slds-c-icon-color-foreground: #ffd000;
    color: #ffd000;
}

.slds-input-has-icon lightning-button-icon.slds-input__icon {
    line-height: normal;
    width: auto;
    height: auto;
    transform: translateY(-50%);
    margin-block-start: 0;
}

.slds-input-has-icon_right .slds-input__icon, .slds-input-has-icon--right .slds-input__icon {
    inset-inline-end: var(--slds-g-spacing-2);
}