@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root {
    --color-primary: var(--emerald-600);
    --color-success: var(--emerald-600);
}

.ea-dark-scheme {
    --color-primary: var(--emerald-500);
    --color-success: var(--emerald-500);
}

:root, .ea-dark-scheme {
    --font-family-sans-serif:
        'Inter', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-family-monospace: "JetBrains Mono", ui-monospace, "Roboto Mono", SFMono-Regular, Menlo, Monaco, Consolas,
        "Liberation Mono", "Courier New", monospace;
    --font-family-base: var(--font-family-sans-serif);

    --color-warning: var(--red-600);
    --color-danger: var(--red-600);

    --link-color: var(--color-primary);
    --link-hover-color: var(--emerald-500);
    --link-hover-decoration: none;

    --button-primary-box-shadow: 0px 1px 1px 0px #1f23280f, 0px 1px 3px 0px #1f23280f;
    --button-primary-bg: var(--emerald-600);
    --button-primary-color: var(--white);
    --button-primary-icon-color: inherit;
    --button-primary-border-color: var(--emerald-700);
    --button-primary-hover-bg: var(--emerald-700);
    --button-primary-hover-color: var(--white);
    --button-primary-hover-border-color: var(--emerald-800);
    --button-primary-active-box-shadow: inset 0 1px 0 0 #002d114d;
    --button-primary-active-bg: var(--emerald-700);
    --button-primary-active-color: var(--white);
    --button-primary-active-border-color: var(--emerald-800);

    --button-danger-box-shadow: 0 1px 0 0 #1f23280a;
    --button-danger-bg: var(--red-600);
    --button-danger-color: var(--white);
    --button-danger-icon-color: inherit;
    --button-danger-border-color: var(--red-700);
    --button-danger-hover-bg: var(--red-700);
    --button-danger-hover-color: var(--white);
    --button-danger-hover-border-color: var(--red-800);
    --button-danger-active-box-shadow: inset 0 1px 0 0 #4c001433;
    --button-danger-active-bg: var(--red-700);
    --button-danger-active-color: var(--white);
    --button-danger-active-border-color: var(--red-800);

    --alert-warning-bg: var(--orange-200);
    --alert-warning-color: var(--orange-800);
    --alert-warning-border-color: var(--orange-300);

    --form-type-check-input-checked-bg: var(--emerald-700);
    --form-type-check-input-border-color: var(--emerald-500);

    --form-switch-bg: var(--gray-600);
    --form-switch-border-color: var(--gray-700);
    --form-switch-checked-bg: var(--color-primary);

    --pagination-active-bg: var(--color-primary);

    --table-thead-sorted-color: var(--color-primary);
    --table-thead-sorted-marker-color: var(--color-primary);

    --table-selected-cell-bg: rgba(from var(--emerald-800) r g b / .25);

    --badge-boolean-false-bg: var(--color-danger);
    --badge-boolean-false-box-shadow: inset 0 0 0 1px var(--red-800);
    --badge-boolean-false-color: white;
    --badge-boolean-true-bg: var(--emerald-700);
    --badge-boolean-true-box-shadow: none;
    --badge-boolean-true-color: white;
}

.fw-100 { font-weight: 100; }
.fw-200 { font-weight: 200; }
.fw-300 { font-weight: 300; }
.fw-400 { font-weight: 400; }
.fw-500 { font-weight: 500; }
.fw-600 { font-weight: 600; }
.fw-700 { font-weight: 700; }
.fw-800 { font-weight: 800; }
.fw-900 { font-weight: 900; }

p,
.sidebar,
.form-tabs-tablist .nav-tabs a,
.form-tabs-tablist .nav-tabs a:hover {
    font-size: var(--font-size-lg);
}

.form-check {
    padding-left: 0;
}
.form-control {
    &:focus {
        border-color: var(--color-primary);
        box-shadow: 0 0 0 .25rem rgba(from var(--emerald-800) r g b / .25);
    }
}
.content-top .content-search input[type="search"][name="query"] {
    &:focus {
        border-color: var(--color-primary);
        box-shadow: 0 0 0 .25rem rgba(from var(--emerald-800) r g b / .5);
    }
}
.content-top .content-search .badge {
    margin-left: 8px;
}
.btn > .btn-icon {
    font-size: 1.25em;
}
.btn-link-danger {
    color: var(--color-danger);
}
.form-group.field-collection .accordion-item .form-group legend.col-form-label, .form-group.field-collection .accordion-item .form-group > label {
    inline-size: max-content;
}
.card-clickable {
    &:hover {
        border: 1px solid var(--color-primary);
    }
}


/* TRIX TEXT EDITOR */
.with-upload trix-toolbar .trix-button-group--file-tools {
  display: flex !important;
}
.with-upload trix-toolbar .trix-button--icon-attach:before {
  bottom:0 !important;
  top:0 !important;
}
.trix-content h2 {
    font-size: 1.5rem;
}
.trix-content p,
.trix-content ul {
    margin-bottom: 1em;
}
.trix-content pre {
    white-space: pre-wrap !important;
}

/* TOM SELECT */
.full-item .ts-control .item {
    inline-size: 100%;
    justify-content: space-between;
}

.vichuploader-accordion .accordion-body {
    padding: 0px;
}
.vichuploader-accordion .accordion-item .form-group {
    padding: 0px !important;
}



.accordion-header .move-button {
    border: none;
    background-color: transparent;
    margin-right: 4px;
    margin-left: 3px;
    cursor: move;
}

.form-group.field-collection .accordion-button,
.form-group.field-collection .accordion-button:hover {
    flex: none;
}

.form-group.field-collection .accordion-button:not(:first-child),
.form-group.field-collection .accordion-button:hover:not(:first-child) {
    padding-left: 0;
}

.form-group.field-collection .accordion-button:first-child,
.form-group.field-collection .accordion-button:hover:first-child {
    padding-right: 0;
}

.accordion-button {
    width: inherit;
}

.form-group.field-collection {
    .accordion-header {
        padding-inline-end: inherit;
    }
    .field-collection-delete-button {
        position: inherit;
        inset-block-start: auto;
        inset-inline-end: auto;
        padding: 8px 10px;
        border-radius: 0px;

        &:hover {
            background-color: var(--color-danger);
        }
    }
}
