/* ==========================================================================
   SAP Fiori Horizon (Morning Horizon / light) theme for Bulma 1.x
   Load AFTER bulma.min.css:
     <link rel="stylesheet" href="bulma.min.css">
     <link rel="stylesheet" href="bulma-horizon.css">
   ========================================================================== */
/* Optional: the SAP "72" font. Get the files from the npm package
   @sap-theming/theming-base-content and check its license before shipping.
   Without it, the stack falls back to Arial/Helvetica. */
@font-face {
    font-family: "72";
    src: url("../webfonts/72-Regular.woff2") format("woff2");
    font-weight: 400;
}

@font-face {
    font-family: "72";
    src: url("../webfonts/72-Bold.woff2") format("woff2");
    font-weight: 700;
}

:root,
:root.theme-light,
:root[data-theme=light] {
    /* ---------- Typography ---------- */
    --bulma-family-primary: "72", "72full", Arial, Helvetica, sans-serif;
    --bulma-family-secondary: var(--bulma-family-primary);
    /* Horizon's base font size is 14px (0.875rem) */
    --bulma-size-normal: 0.875rem;
    --bulma-size-small: 0.75rem;
    /* ---------- Brand & semantic colors (Bulma wants HSL parts) ---------- */
    /* Primary  #0070F2 (sapBrandColor / emphasized button) */
    --bulma-primary-h: 212deg;
    --bulma-primary-s: 100%;
    --bulma-primary-l: 47%;
    /* Link     #0064D9 (sapLinkColor) */
    --bulma-link-h: 212deg;
    --bulma-link-s: 100%;
    --bulma-link-l: 43%;
    /* Info     #0070F2 (sapInformativeColor) */
    --bulma-info-h: 212deg;
    --bulma-info-s: 100%;
    --bulma-info-l: 47%;
    /* Success  #256F3A (sapPositiveColor) */
    --bulma-success-h: 137deg;
    --bulma-success-s: 50%;
    --bulma-success-l: 29%;
    /* Warning  #E9730C (sapCriticalColor) */
    --bulma-warning-h: 28deg;
    --bulma-warning-s: 90%;
    --bulma-warning-l: 48%;
    /* Danger   #D20A0A (sapNegativeColor) */
    --bulma-danger-h: 0deg;
    --bulma-danger-s: 91%;
    --bulma-danger-l: 43%;
    /* ---------- Surfaces ---------- */
    --bulma-body-background-color: #f5f6f7; /* sapBackgroundColor */
    --bulma-scheme-main: #ffffff; /* cards, boxes, inputs */
    --bulma-scheme-main-bis: #f5f6f7;
    --bulma-scheme-main-ter: #eaecee;
    --bulma-background: #f5f6f7;
    /* ---------- Text ---------- */
    --bulma-text: #1d2d3e; /* sapTextColor */
    --bulma-text-strong: #1d2d3e;
    --bulma-text-weak: #556b82; /* sapContent_LabelColor */
    --bulma-title-color: #1d2d3e;
    --bulma-subtitle-color: #556b82;
    /* ---------- Borders ---------- */
    --bulma-border: #d9d9d9;
    --bulma-border-weak: #e5e5e5;
    /* ---------- Shape ---------- */
    --bulma-radius-small: 0.25rem;
    --bulma-radius: 0.5rem;
    --bulma-radius-medium: 0.5rem;
    --bulma-radius-large: 1rem;
    /* ---------- Navbar (Shell Bar) ---------- */
    --bulma-navbar-height: 2.75rem;
    --bulma-navbar-background-color: #ffffff;
    --bulma-navbar-item-color: #1d2d3e;
}

/* ==========================================================================
   Component tweaks (Bulma defines many variables per component, so a few
   direct rules are more reliable than guessing every variable name)
   ========================================================================== */
/*!* Shell bar *!*/
/*.navbar {*/
/*  box-shadow: 0 0 0 0.0625rem rgba(85, 107, 129, 0.25), 0 0.125rem 0.5rem rgba(85, 107, 129, 0.15);*/
/*}*/

/* Buttons: 36px high, 8px radius, blue text, light-grey hover */
.button {
    height: 2.25rem;
    border-radius: 0.5rem;
    border-color: #bcc3ca;
    color: #0064d9;
    background-color: #ffffff;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.button:hover {
    background-color: #eaecee;
    border-color: #bcc3ca;
    color: #0064d9;
}

/* Coloured buttons keep Bulma's own colours */
.button.is-primary,
.button.is-link,
.button.is-info,
.button.is-success,
.button.is-warning,
.button.is-danger {
    border-color: transparent;
}

.button.is-primary {
    color: #ffffff;
    background-color: #0070f2;
}

.button.is-primary:hover {
    background-color: #0064d9;
}

.button.is-primary:active {
    background-color: #0057d2;
}

/* Form fields: grey-blue border, 4px radius, 36px high */
.input,
.textarea,
.select select {
    border-color: #556b82;
    border-radius: 0.25rem;
    box-shadow: none;
}

.input,
.select select {
    height: 2.25rem;
}

.input:hover,
.textarea:hover,
.select select:hover {
    border-color: #0064d9;
}

.input:focus,
.textarea:focus,
.select select:focus {
    border-color: #0070f2;
    box-shadow: 0 0 0 0.0625rem #0070f2;
}

/* Cards & boxes: 16px radius with Horizon level-1 shadow */
.card,
.box {
    border-radius: 1rem;
    box-shadow: 0 0 0 0.0625rem rgba(85, 107, 129, 0.25), 0 0.125rem 0.5rem rgba(85, 107, 129, 0.15);
}

/* Tables */
.table {
    background-color: #ffffff;
}

.table th {
    color: #556b82;
    font-weight: 700;
}

.table.is-hoverable tbody tr:hover {
    background-color: #f5f6f7;
}

/* Focus ring */
:focus-visible {
    outline: 0.125rem solid #0032a5; /* sapContent_FocusColor */
    outline-offset: 0.0625rem;
}

/*# sourceMappingURL=bulma-horizon.css.map */
