<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>

<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/jquery-ui.css"/>"/>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/jquery-ui.theme.css"/>"/>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/ui.jqgrid.css"/>"/>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/jquery.contextMenu.css"/>"/>
<%-- <link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/common.css"/>" /> --%>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/Nwagon.css"/>"/>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/web_ui.css"/>"/>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/jexcel.css"/>"></link>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/jsuites.css"/>"></link>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/theme_${themeColor}.css"/>"/>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/select2.min.css"/>"></link>

<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/addon/codemirror/lib/codemirror.css"/>"/>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/addon/codemirror/theme/dracula.css"/>"/>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/addon/codemirror/addon/lint/lint.css"/>"/>

<link rel="stylesheet" type="text/css" media="screen"
      href="<c:url value="/addon/summernote/summernote-lite.min.css"/>"/>
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/addon/summernote/summernote-lite.css"/>"/>

<jsp:include page="/jsp/common/include/fonts.jsp"/>

<c:choose>
    <c:when test="${messageLocale eq 'en'}">
        <link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/elink_components_en.css"/>"/>
    </c:when>
    <c:otherwise>
        <link rel="stylesheet" type="text/css" media="screen" href="<c:url value="/css/elink_components.css"/>"/>
    </c:otherwise>
</c:choose>


<style type="text/css">
    .ajax_wait_modal {
        display: none;
        position: fixed;
        z-index: 300;
        padding-top: 100px;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: auto;
        background-color: rgb(0, 0, 0);
        background-color: rgba(0, 0, 0, 0.4);
    }


    .cssbtn {
        border: 1px solid rgba(0, 128, 128, 0.6);
        background-color: rgba(0, 0, 0, 0);
        color: rgb(100, 100, 100);
        border-radius: 5px;
        box-shadow: 0px 2px 3px rgba(0, 128, 128, 0.15);
        min-width: 100px;
        padding: 3px;
        height: 28px;
        font-family: var(--css-btn-font-family);
        vertical-align: middle;
        font-size: var(--css-btn-font-size);
    }

    .cssbtn:hover {
        color: rgba(0, 128, 128, 1);
        background-color: rgba(0, 128, 128, 0.3);
    }

    .cssbtn:disabled {
        cursor: not-allowed;
        color: rgb(230, 230, 230);
        background-color: rgb(150, 150, 150);
    }

    .logoText {
        font-family: 'Limelight';
        font-size: 40px;
        color: black;
    }

    .logoTextLarge {
        font-family: 'Limelight';
        font-size: 70px;
        color: black;
    }

    .material-icons {
        font-family: 'Material Icons';
        font-weight: normal;
        font-style: normal;
        vertical-align: sub;
        color: rgb(65 125 200);
        font-size: var(--css-btn-icon-font-size); /* Preferred icon size */
        /*display: inline-block;*/
        line-height: 1;
        /*text-transform: none;*/
        /*letter-spacing: normal;*/
        /*word-wrap: normal;*/
        /*white-space: nowrap;*/
        direction: ltr;

        /* Support for all WebKit browsers. */
        -webkit-font-smoothing: antialiased;
        /* Support for Safari and Chrome. */
        text-rendering: optimizeLegibility;

        /* Support for Firefox. */
        -moz-osx-font-smoothing: grayscale;

        /* Support for IE. */
        font-feature-settings: 'liga';
    }

    .material-icons-outlined {
        font-family: 'Material Icons Outlined';
        font-weight: normal;
        font-style: normal;
        vertical-align: middle;
        color: rgb(65 125 200);
        font-size: var(--css-btn-icon-font-size); /* Preferred icon size */
        line-height: 1;
        letter-spacing: normal;
        text-transform: none;
        display: inline-block;
        white-space: nowrap;
        word-wrap: normal;
        direction: ltr;
        -webkit-font-smoothing: antialiased;
    }

    .smallBtn > .material-icons {
        font-size: calc(var(--css-btn-icon-font-size) - 5px) !important;
    }

    .smallBtn > .material-icons-outlined {
        font-size: calc(var(--css-btn-icon-font-size) - 5px) !important;
    }

    .smallBtn {
        width: 70px;
        height: 20px;
        padding: 0;
        font-size: calc(var(--css-btn-font-size) - 2px);
        border-radius: 4px;
        box-shadow: none;
        background-color: rgb(245, 255, 250);
        color: rgb(0, 139, 139);
    }

    .smallBtn2 > .material-icons {
        font-size: calc(var(--css-btn-icon-font-size) - 5px) !important;
    }

    .smallBtn2 > .material-icons-outlined {
        font-size: calc(var(--css-btn-icon-font-size) - 5px) !important;
    }

    .smallBtn2 {
        min-width: 50px;
        height: 23px;
        padding: 0;
        font-size: calc(var(--css-btn-font-size) - 2px);
        border-radius: 4px;
        box-shadow: none;
        background-color: rgb(245, 255, 250);
        color: rgb(0, 139, 139);
    }

    .jexcel > tbody > tr > td.readonly {
        color: rgb(0, 0, 0);
        background: rgb(255, 255, 255);
    }

    .CodeMirror-matchingbracket {
        color: #b46914 !important;
        background-color: #fef4e8 !important;
        font-weight: bold;
    }

    .cm-string:not(.cm-property) {
        color: #0451A5 !important;
    }

    .cm-property {
        color: #A31515 !important;
    }

    .CodeMirror-wrap pre {
        word-break: break-all;
    }

    .CodeMirror-lint-tooltip {
        z-index: 500;
    }


    fieldset.groupbox-border {
        border: 1px groove #ddd !important;
        border-radius: 5px;
        background-color: rgb(251, 253, 251);
        padding: 0.3em 1.4em 1.4em 1.4em !important;
        margin: 1em 0 0.5em 0 !important;
        -webkit-box-shadow: 0px 0px 0px 0px #000;
        box-shadow: 0px 0px 0px 0px #000;
    }

    legend.groupbox-border {
        font-size: 1em !important;
        font-weight: bold !important;
        color: rgb(60, 70, 110);
        text-align: left !important;
        width: auto;
        padding: 0px 10px 0px 10px;
        border-bottom: none;
    }

    .toggle.ios, .toggle-on.ios, .toggle-off.ios {
        border-radius: 20rem;
    }

    .toggle.ios .toggle-handle {
        border-radius: 20rem;
    }

    .toggle.disabled {
        pointer-events: none;
    }

    .disabled-select {
        background-color: #d5d5d5;
        opacity: 0.5;
        border-radius: 3px;
        cursor: not-allowed;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
    }

    select[readonly].select2-hidden-accessible + .select2-container {
        pointer-events: none;
        touch-action: none;
    }

    select[readonly].select2-hidden-accessible + .select2-container .select2-selection {
        background: #eee;
        box-shadow: none;
    }

    select[readonly].select2-hidden-accessible + .select2-container .select2-selection__arrow,
    select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear {
        display: none;
    }

    .input-group {
        display: flex;
        width: 100%;
    }

    .input-group input {
        flex-grow: 1;
        min-width: 0;
        transition: all 0.3s ease;
    }

    .input-group button {
        flex-shrink: 0;
        margin-left: 10px;
        transition: all 0.3s ease;
    }

    .input-group.readonly input {
        width: 100%;
    }

    .input-group.readonly button {
        display: none;
    }
</style>
