/* ===================== EPC — корпоративное оформление ===================== */

div.login-ui {
    background: #071729 url('app/ext/epc-branding/images/bg.jpg') center center / cover no-repeat fixed !important;
}
div.login-ui::before {
    content: '';
    position: fixed;
    left: 0; right: 0; top: 0; bottom: 0;
    background: linear-gradient(160deg, rgba(6,20,36,.70) 0%, rgba(6,20,36,.86) 55%, rgba(3,10,20,.94) 100%);
    pointer-events: none;
}
.login-ui .login-dialog-middle { position: relative; }

/* ---- карточка входа ---- */
.login-ui .login-dialog {
    position: relative;
    background: rgba(9,26,46,.74);
    -webkit-backdrop-filter: blur(20px) saturate(125%);
    backdrop-filter: blur(20px) saturate(125%);
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 18px;
    padding: 2.3em 2.2em 2em;
    max-width: 400px;
    width: 88vw;
    box-shadow: 0 30px 80px rgba(0,0,0,.55), 0 2px 10px rgba(0,0,0,.3);
    color: #e8eef6;
    text-align: left;
}

/* ---- логотип ---- */
.login-ui .login-dialog .logo {
    float: none;
    display: block;
    width: 100%;
    height: 118px;
    margin: 0 0 1.5em 0;
    background-image: url('app/ext/epc-branding/images/logo-mark.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    mix-blend-mode: screen;
    -webkit-mask-image: radial-gradient(ellipse 78% 76% at 50% 50%, #000 58%, rgba(0,0,0,0) 100%);
            mask-image: radial-gradient(ellipse 78% 76% at 50% 50%, #000 58%, rgba(0,0,0,0) 100%);
}
.login-ui .login-dialog .version { display: none; }
.login-ui .login-dialog h1 { color: #e8eef6; }

/* ---- поля ---- */
.login-ui .login-dialog .login-fields { margin-bottom: 1.1em; }
.login-ui .login-dialog .login-fields .labeled-field {
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.17);
    border-radius: 11px;
    margin-bottom: .75em;
    transition: border-color .15s, background .15s, box-shadow .15s;
}
.login-ui .login-dialog .login-fields .labeled-field:focus-within {
    border-color: #4a9be8;
    background: rgba(255,255,255,.11);
    box-shadow: 0 0 0 3px rgba(74,155,232,.18);
}
.login-ui .login-dialog .login-fields .labeled-field .field-header {
    z-index: 0;
    opacity: 1;
    color: rgba(232,238,246,.52);
    font-size: .95em;
    margin: .92em 1.05em;
}
.login-ui .login-dialog .login-fields .labeled-field:not(.empty) .field-header { opacity: 0; }
.login-ui .login-dialog .login-fields .labeled-field input {
    position: relative;
    z-index: 1;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: 100%;
    box-sizing: border-box;
    padding: .9em 1em;
    color: #eef4fb;
    font-size: 1em;
}
.login-ui .login-dialog .login-fields .labeled-field input:focus { outline: none; }

/* ---- кнопка ---- */
.login-ui .login-dialog .buttons { margin: 0; }
.login-ui .login-dialog .buttons input[type=submit] {
    width: 100%;
    margin-top: .35em;
    padding: .95em;
    border: none;
    border-radius: 11px;
    background: linear-gradient(180deg, #2f84da 0%, #1c5fa8 100%);
    color: #fff;
    font-size: 1em;
    font-weight: 600;
    letter-spacing: .01em;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(28,95,168,.38);
    transition: filter .15s, transform .05s;
}
.login-ui .login-dialog .buttons input[type=submit]:hover { filter: brightness(1.09); }
.login-ui .login-dialog .buttons input[type=submit]:active { transform: translateY(1px); }

/* ---- подпись ---- */
.login-ui .login-dialog::after {
    content: "EPC Engineering · защищённое подключение";
    display: block;
    margin-top: 1.6em;
    text-align: center;
    font-size: .76em;
    letter-spacing: .03em;
    color: rgba(232,238,246,.42);
}

/* ---- второй фактор ---- */
.login-ui.continuation .login-dialog .logo { display: block; height: 64px; opacity: .92; }

/* ---- ошибка ---- */
.login-ui.error p.login-error {
    background: rgba(120,32,32,.9);
    border: 1px solid rgba(224,120,120,.5);
    color: #ffe9e9;
    border-radius: 11px;
    max-width: 430px;
    margin: 1em auto;
    left: 0; right: 0;
}

/* ===================== АДАПТИВНОСТЬ ===================== */

div.login-ui {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.login-ui .login-dialog-middle { padding: 1.2em 0; }

/* планшеты и узкие окна */
@media (max-width: 640px) {
    div.login-ui { background-attachment: scroll !important; }
    .login-ui .login-dialog {
        width: calc(100vw - 1.8em);
        max-width: 420px;
        padding: 1.8em 1.4em 1.5em;
        border-radius: 15px;
    }
    .login-ui .login-dialog .logo { height: 88px; margin-bottom: 1.2em; }
}

/* телефоны */
@media (max-width: 420px) {
    .login-ui .login-dialog {
        width: calc(100vw - 1.2em);
        padding: 1.5em 1.15em 1.3em;
        border-radius: 14px;
    }
    .login-ui .login-dialog .logo { height: 72px; margin-bottom: 1em; }
    .login-ui .login-dialog .login-fields .labeled-field { margin-bottom: .6em; }
    .login-ui .login-dialog::after { margin-top: 1.1em; font-size: .72em; }
}

/* низкие экраны и горизонтальная ориентация */
@media (max-height: 620px) {
    .login-ui .login-dialog-middle { padding: .8em 0; }
    .login-ui .login-dialog { padding: 1.3em 1.4em 1.1em; }
    .login-ui .login-dialog .logo { height: 58px; margin-bottom: .8em; }
    .login-ui .login-dialog .buttons input[type=submit] { padding: .8em; }
    .login-ui .login-dialog::after { margin-top: .9em; }
}
@media (max-height: 430px) {
    .login-ui .login-dialog .logo { height: 44px; margin-bottom: .6em; }
    .login-ui .login-dialog { padding: 1em 1.2em .9em; }
}

/* iOS: 16px во избежание автозума при фокусе */
.login-ui .login-dialog .login-fields .labeled-field input { font-size: 16px; }

/* крупные экраны — карточка чуть просторнее */
@media (min-width: 1400px) and (min-height: 900px) {
    .login-ui .login-dialog { max-width: 430px; padding: 2.6em 2.4em 2.2em; }
    .login-ui .login-dialog .logo { height: 128px; }
}

/* уважение к системной настройке уменьшенной анимации */
@media (prefers-reduced-motion: reduce) {
    .login-ui .login-dialog .buttons input[type=submit] { transition: none; }
}

/* на узких экранах фотофон обрезается некрасиво — чистый градиент */
@media (max-width: 760px) {
    div.login-ui {
        background: #071729 !important;
        background-image:
            radial-gradient(ellipse 110% 45% at 50% -8%, rgba(47,132,218,.32) 0%, rgba(7,23,41,0) 62%),
            radial-gradient(ellipse 90% 40% at 50% 108%, rgba(28,95,168,.30) 0%, rgba(7,23,41,0) 60%),
            linear-gradient(172deg, #0f3459 0%, #0a2440 52%, #061628 100%) !important;
    }
    div.login-ui::before { display: none; }
}
/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */

/* Label/tag denoting the user that shared a connection */
.jdbc-share-tag {

    background: #0095ff;
    padding: 0.25em;

    -moz-border-radius:    0.25em;
    -webkit-border-radius: 0.25em;
    -khtml-border-radius:  0.25em;
    border-radius:         0.25em;

    color: white;
    font-size: 0.75em;
    font-weight: bold;

}
.totp-enroll p,.totp-details{font-size:.8em}.totp-qr-code{text-align:center}.totp-qr-code img{margin:1em;border:1px solid rgba(0,0,0,0.25);box-shadow:1px 1px 2px rgba(0,0,0,0.25);cursor:pointer}h3.totp-details-header{font-size:.8em}h3.totp-details-header::before{content:'▸ '}.totp-details-visible h3.totp-details-header::before{content:'▾ '}.totp-details,.totp-hide-details{display:none}.totp-details-visible .totp-details{display:table}.totp-details-visible .totp-hide-details{display:inline}.totp-details-visible .totp-show-details{display:none}.totp-hide-details,.totp-show-details{color:blue;text-decoration:underline;cursor:pointer;margin:0 .25em;font-weight:normal}.totp-details{margin:0 auto}.totp-details th{padding-right:.25em;text-align:left}.totp-details td{font-family:monospace}.totp-detail{display:inline-block;margin:0 .25em}