/* 盖州市房屋交易合同网上签约备案系统 - 登录页 */
html, body {
    width: 100%;
    height: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans SC", sans-serif;
    color: #153f4a;
    background: #eef6f5;
    overflow: hidden;
}
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.container {
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 24px 20px 16px;
    background: url(../../img/Login/gaizhou-bg.svg) center center / cover no-repeat;
}
.container::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(245,250,249,.10) 0%, rgba(236,247,246,.28) 55%, rgba(224,240,239,.55) 100%);
    pointer-events: none;
}

.login-wrap {
    position: relative;
    z-index: 2;
    width: 556px;
    max-width: calc(100vw - 36px);
    height: auto;
    margin: 0 auto;
    background: none;
    text-align: center;
}

.login-header-box {
    padding: 0 0 16px;
}
.brand-mark {
    width: 58px;
    height: 58px;
    line-height: 54px;
    margin: 0 auto 12px;
    border: 2px solid rgba(166, 74, 62, .75);
    color: #a64a3e;
    border-radius: 50%;
    font-family: "STKaiti", "KaiTi", serif;
    font-size: 25px;
    letter-spacing: 1px;
    background: rgba(255,255,255,.38);
    box-shadow: 0 6px 18px rgba(59, 92, 99, .08);
}
.login-header-box .tit {
    font-size: 33px;
    line-height: 1.38;
    color: #153f4a;
    text-align: center;
    padding-bottom: 0;
    font-weight: 700;
    letter-spacing: 2px;
    text-shadow: 0 1px 0 rgba(255,255,255,.7);
}
.login-header-box .sub-tit {
    margin-top: 10px;
    font-size: 13px;
    color: #4f777b;
    letter-spacing: 5px;
    text-align: center;
    font-weight: 400;
}

.login-container {
    background: rgba(255, 255, 255, .93);
    border: 1px solid rgba(255,255,255,.8);
    border-radius: 18px;
    padding: 28px 30px 20px;
    box-sizing: border-box;
    box-shadow: 0 24px 60px rgba(25, 66, 71, .17), 0 2px 0 rgba(255,255,255,.8) inset;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}
.login-container form { margin: 0; }

.item-box {
    width: 100%;
    height: 50px;
    box-sizing: border-box;
    border: 1px solid #d7e5e2;
    background: #f7faf9;
    border-radius: 10px;
    margin: 0 0 14px;
    padding: 0 14px;
    display: flex;
    align-items: center;
    transition: border-color .2s, box-shadow .2s, background .2s;
}
.item-box:focus-within {
    border-color: #2b8c88;
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(43,140,136,.10);
}
.item-header {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    margin: 0 12px 0 0;
    background-color: transparent;
    display: inline-block;
    vertical-align: middle;
}
.icon-zhengjian { background: url(../../img/Login/zhengjianIcon.png) no-repeat center / contain; }
.icon-user { background: url(../../img/Login/icon_user.png) no-repeat center / contain; }
.icon_psd { background: url(../../img/Login/icon_psd.png) no-repeat center / contain; }
.icon_num { background: url(../../img/Login/icon_num.png) no-repeat center / contain; }

.item-container {
    flex: 1;
    width: auto;
    display: block;
    min-width: 0;
}
.item-container input,
.item-container select {
    width: 100%;
    height: 46px;
    line-height: 46px;
    padding: 0;
    font-size: 15px;
    color: #153f4a;
    border: none;
    outline: none;
    background: transparent;
    box-sizing: border-box;
}
.item-container input::placeholder { color: #91a7a7; }

.item-after {
    flex: 0 0 90px;
    width: 90px;
    margin: 0 0 0 8px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.item-after img {
    width: 88px;
    height: 32px;
    border-radius: 6px;
    object-fit: cover;
    cursor: pointer;
}

.item-footer-box {
    width: 100%;
    height: 24px;
    margin: 2px 0 16px;
    font-size: 13px;
    color: #547478;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.item-footer-box label { display: inline-flex; align-items: center; cursor: pointer; }
.item-footer-box input[type='checkbox'] { margin-right: 7px; accent-color: #1d8b88; }

.register-btn {
    padding: 0;
    color: #1d7778;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 13px;
}

.login-btn {
    width: 100%;
    height: 48px;
    line-height: 48px;
    background: linear-gradient(120deg, #0f6f7a 0%, #1d8b88 100%);
    border-radius: 10px;
    margin: 0 auto;
    text-align: center;
    color: #ffffff;
    font-size: 17px;
    letter-spacing: 5px;
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(20, 111, 116, .24);
    transition: transform .18s, box-shadow .18s, filter .18s;
}
.login-btn:hover { filter: brightness(1.06); transform: translateY(-1px); box-shadow: 0 14px 26px rgba(20,111,116,.28); }
.login-btn:active { transform: translateY(0); }

.bottom-box {
    width: 100%;
    min-height: 22px;
    margin: 14px auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.bottom-box .tel-box { margin: 0; font-size: 12px; color: #7c9496; }
.bottom-box .tel-box span { color: #3b666a; }
.bottom-box .forgetBtn { font-size: 12px; color: #1d7778; cursor: pointer; }

.footer {
    width: 100%;
    flex: 0 0 auto;
    min-height: 0;
    padding: 0;
    background-color: #f2f7f6;
    overflow: hidden;
    border-top: 1px solid #e2eeec;
}
.footer-box {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    padding: 10px 18px 12px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
}
.zfwz_zc, .zfjg { display: none; }
.footer-info {
    font-size: 12px;
    color: #6f8b8c;
    padding: 0;
    text-align: center;
    line-height: 1.65;
}
.footer-info a { color: #3d7778; text-decoration: none; }

.clone-demo-tip { display: none !important; }

@media (max-width: 640px) {
    .container { padding: 26px 14px 26px; }
    .login-header-box .tit { font-size: 25px; letter-spacing: 1px; }
    .brand-mark { width: 48px; height: 48px; line-height: 44px; font-size: 21px; }
    .login-container { padding: 22px 18px 16px; }
    .login-btn { letter-spacing: 3px; }
}

#clone-portal-switch, #clone-demo-hint { display: none !important; }

.portal-links {
    margin-top: 14px;
    font-size: 12px;
    color: #8aa0a0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}
.portal-links a { color: #2b7778; text-decoration: none; }
.portal-links a:hover { text-decoration: underline; }
.portal-links span { color: #b4c5c4; }

/* ============ 第二套：山海盖州 · 暮色 ============ */
html.theme-shanhai body { background: #06171d; color: #f3ead8; }
.theme-shanhai .container {
    background-image: url(../../img/Login/gaizhou-bg-shanhai.svg);
    background-position: center center;
}
.theme-shanhai .container::after {
    background: linear-gradient(180deg, rgba(3,13,18,.08) 0%, rgba(4,16,21,.18) 52%, rgba(3,13,18,.55) 100%);
}
.theme-shanhai .brand-mark {
    border-color: rgba(212,173,109,.8);
    color: #e3c184;
    background: rgba(4,18,24,.48);
    box-shadow: 0 6px 18px rgba(0,0,0,.22);
}
.theme-shanhai .login-header-box .tit {
    color: #f7efdd;
    text-shadow: 0 2px 16px rgba(0,0,0,.35);
}
.theme-shanhai .login-header-box .sub-tit { color: #d5c39d; }
.theme-shanhai .login-container {
    background: rgba(5, 20, 26, .74);
    border-color: rgba(212, 173, 109, .32);
    box-shadow: 0 26px 70px rgba(0, 0, 0, .42), 0 1px 0 rgba(255,255,255,.07) inset;
}
.theme-shanhai .item-box {
    background: rgba(255,255,255,.055);
    border-color: rgba(212, 173, 109, .25);
}
.theme-shanhai .item-box:focus-within {
    border-color: rgba(231,199,141,.75);
    background: rgba(255,255,255,.085);
    box-shadow: 0 0 0 3px rgba(212,173,109,.12);
}
.theme-shanhai .item-container input,
.theme-shanhai .item-container select { color: #f5edd9; }
.theme-shanhai .item-container input::placeholder { color: #a9b4ad; }
.theme-shanhai .item-container select option { color: #153f4a; background: #f7faf9; }
.theme-shanhai .item-header { filter: brightness(1.7) saturate(.8); }
.theme-shanhai .item-footer-box { color: #c5bda9; }
.theme-shanhai .item-footer-box input[type='checkbox'] { accent-color: #d4ad6d; }
.theme-shanhai .register-btn { color: #e0c184; }
.theme-shanhai .login-btn {
    background: linear-gradient(120deg, #b98a45 0%, #e2bd78 100%);
    color: #10262b;
    box-shadow: 0 12px 26px rgba(0,0,0,.35);
}
.theme-shanhai .login-btn:hover { filter: brightness(1.08); }
.theme-shanhai .bottom-box .tel-box,
.theme-shanhai .bottom-box .tel-box span { color: #b2b7a8; }
.theme-shanhai .bottom-box .forgetBtn { color: #e0c184; }
.theme-shanhai .portal-links { color: #9aa79d; }
.theme-shanhai .portal-links a { color: #d9bd83; }
.theme-shanhai .portal-links span { color: #6f827a; }
.theme-shanhai .footer { background: #07171d; border-top-color: #183238; }
.theme-shanhai .footer-info { color: #92a39b; }
.theme-shanhai .footer-info a { color: #d9bd83; }
.theme-shanhai #imgcode { background: #fff; }

/* ============ 第三套：政务蓝 · 现代简约 ============ */
html.theme-gov body { background: #f4f8fc; color: #143a57; }
.theme-gov .container {
    background: url(../../img/Login/gaizhou-bg-gov.svg) center center / cover no-repeat;
    padding: 54px 6vw;
    align-items: center;
}
.theme-gov .container::after { display: none; }
.theme-gov .login-wrap {
    width: min(1240px, 100%);
    max-width: 1240px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 470px;
    align-items: center;
    gap: 64px;
    text-align: left;
}
.theme-gov .login-header-box { padding: 0; text-align: left; }
.theme-gov .brand-mark {
    margin: 0 0 18px;
    border-color: rgba(227,195,126,.85);
    color: #efd59b;
    background: rgba(255,255,255,.06);
    box-shadow: none;
}
.theme-gov .login-header-box .tit {
    color: #ffffff;
    font-size: 40px;
    line-height: 1.42;
    text-align: left;
    letter-spacing: 3px;
    text-shadow: 0 2px 20px rgba(3,24,46,.28);
}
.theme-gov .login-header-box .sub-tit {
    color: #c5dced;
    text-align: left;
    letter-spacing: 4px;
    margin-top: 14px;
}
.theme-gov .login-container {
    width: 100%;
    box-sizing: border-box;
    background: #ffffff;
    border: 1px solid #e0ebf5;
    border-radius: 14px;
    padding: 30px 28px 22px;
    box-shadow: 0 22px 55px rgba(7, 45, 78, .16);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    text-align: left;
}
.theme-gov .item-box { background: #f7fbff; border-color: #dce9f4; }
.theme-gov .item-box:focus-within { border-color: #1769a8; box-shadow: 0 0 0 3px rgba(23,105,168,.10); }
.theme-gov .item-container input, .theme-gov .item-container select { color: #143a57; }
.theme-gov .login-btn {
    background: linear-gradient(120deg, #0c3d6a 0%, #1769a8 100%);
    letter-spacing: 5px;
    box-shadow: 0 10px 22px rgba(12,61,106,.22);
}
.theme-gov .login-btn:hover { filter: brightness(1.08); }
.theme-gov .portal-links a { color: #1769a8; }
.theme-gov .bottom-box .forgetBtn { color: #1769a8; }
.theme-gov .bottom-box .tel-box { color: #7993a7; }
.theme-gov .bottom-box .tel-box span { color: #315b79; }
.theme-gov .footer { background: #eef6fc; border-top-color: #dceaf5; }
.theme-gov .footer-info { color: #7390a5; }
.theme-gov .footer-info a { color: #1769a8; }
@media (max-width: 900px) {
    .theme-gov .container { display: flex; align-items: flex-start; padding: 28px 16px 30px; }
    .theme-gov .login-wrap { display: block; width: 100%; max-width: 520px; text-align: center; }
    .theme-gov .login-header-box { text-align: center; }
    .theme-gov .brand-mark { margin: 0 auto 12px; }
    .theme-gov .login-header-box .tit { font-size: 26px; text-align: center; letter-spacing: 1px; }
    .theme-gov .login-header-box .sub-tit { text-align: center; letter-spacing: 2px; }
    .theme-gov .login-container { padding: 22px 18px 16px; }
}

/* ============ 第四套：数字盖州 · 山海流韵（动态） ============ */
html.theme-dynamic body { background: #031018; color: #e9f7f3; }
.theme-dynamic .container {
    background: url(../../img/Login/gaizhou-bg-dynamic.svg) center center / cover no-repeat;
    overflow: hidden;
}
.theme-dynamic .container::after {
    z-index: 2;
    background: radial-gradient(ellipse at 50% 52%, rgba(3,16,24,.02) 0%, rgba(3,16,24,.18) 52%, rgba(3,16,24,.58) 100%);
    pointer-events: none;
}
.theme-dynamic #gaizhou-fx {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}
.theme-dynamic .login-wrap { z-index: 3; }
.theme-dynamic .brand-mark {
    border-color: rgba(112, 224, 210, .7);
    color: #a9f1e5;
    background: rgba(4, 25, 32, .52);
    box-shadow: 0 0 24px rgba(72, 207, 190, .12);
}
.theme-dynamic .login-header-box .tit {
    color: #f2fbf8;
    text-shadow: 0 2px 24px rgba(43, 189, 177, .28);
}
.theme-dynamic .login-header-box .sub-tit { color: #9fcfc5; }
.theme-dynamic .login-container {
    background: rgba(4, 21, 28, .72);
    border-color: rgba(101, 216, 201, .28);
    box-shadow: 0 28px 70px rgba(0,0,0,.45), 0 0 40px rgba(36, 151, 143, .06) inset;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}
.theme-dynamic .item-box {
    background: rgba(255,255,255,.05);
    border-color: rgba(128, 224, 210, .20);
}
.theme-dynamic .item-box:focus-within {
    border-color: rgba(118, 236, 220, .76);
    background: rgba(255,255,255,.085);
    box-shadow: 0 0 0 3px rgba(69, 211, 194, .12);
}
.theme-dynamic .item-container input,
.theme-dynamic .item-container select { color: #effbf7; }
.theme-dynamic .item-container input::placeholder { color: #93b6b0; }
.theme-dynamic .item-container select option { color: #143a57; background: #f4fbfa; }
.theme-dynamic .item-header { filter: brightness(1.8) saturate(.75); }
.theme-dynamic .item-footer-box { color: #b6cfc8; }
.theme-dynamic .item-footer-box input[type='checkbox'] { accent-color: #62d8c8; }
.theme-dynamic .register-btn { color: #8fe7db; }
.theme-dynamic .login-btn {
    background: linear-gradient(105deg, #0d7d83 0%, #19b7ad 55%, #84e4d7 100%);
    color: #052126;
    text-shadow: 0 1px 0 rgba(255,255,255,.22);
    box-shadow: 0 12px 30px rgba(12, 138, 135, .32);
}
.theme-dynamic .login-btn:hover { filter: brightness(1.08); }
.theme-dynamic .bottom-box .tel-box,
.theme-dynamic .bottom-box .tel-box span { color: #9db8b1; }
.theme-dynamic .bottom-box .forgetBtn { color: #8fe7db; }
.theme-dynamic .portal-links { color: #8ba7a1; }
.theme-dynamic .portal-links a { color: #9be9dd; }
.theme-dynamic .footer { background: #04141b; border-top-color: #16353a; }
.theme-dynamic .footer-info { color: #8fa9a2; }
.theme-dynamic .footer-info a { color: #9be9dd; }
.theme-dynamic #imgcode { background: #ffffff; }
@media (prefers-reduced-motion: reduce) {
    .theme-dynamic #gaizhou-fx { opacity: .85; }
}

@media (max-width: 640px) {
    html, body { overflow-y: auto; height: auto; min-height: 100%; }
    body { min-height: 100vh; }
    .container { min-height: calc(100vh - 60px); }
}
@media (max-height: 720px) and (min-width: 641px) {
    .login-header-box .tit { font-size: 28px; }
    .login-header-box .sub-tit { margin-top: 6px; }
    .login-container { padding: 20px 24px 14px; }
    .item-box { height: 44px; margin-bottom: 10px; }
    .item-container input, .item-container select { height: 40px; line-height: 40px; }
    .login-btn { height: 44px; line-height: 44px; }
}