@charset "utf-8";

.ol{position:relative;margin-bottom:12px;border:1px solid var(--color-border);border-radius:10px;background:var(--color-surface);overflow:hidden}
.ol legend{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.ol form{padding:20px}
.ol h2,.ol .ol-title{display:block;margin:0 0 14px;color:var(--color-text);font-size:15px;font-weight:600}
.ol-input-area{border:1px solid var(--color-border-light);border-radius:10px;overflow:hidden}
.ol-input-row{display:flex;align-items:center;height:40px;color:var(--color-text-sub)}
.ol-input-row:first-child{border-bottom:1px solid var(--color-border-light)}
.ol-input-row i{width:42px;color:#8e97b1;font-size:17px;text-align:center;transition:color .25s}
.ol-input-row:focus-within i{color:var(--color-success)}
.ol-input-row input{flex:1;width:auto!important;height:38px!important;margin:0!important;padding:0 10px 0 0!important;border:0!important;border-radius:0!important;background:var(--color-surface)!important;color:var(--color-text)!important;box-shadow:none!important;font-size:12px!important}
.ol-input-row input::placeholder{color:var(--color-text-sub)}
#ol_submit{width:100%;height:40px;margin-top:14px;border:0;border-radius:10px;background:var(--color-surface-strong);color:var(--color-text);font-size:16px;font-weight:600;cursor:pointer}
#ol_submit:hover,#ol_submit:focus-visible{background:#2dbb3d;animation:hub-darkback 3s linear infinite}
.ol-auto{margin-top:10px;color:var(--color-text-sub);font-size:11px}
.ol-auto input{margin-right:4px;vertical-align:-2px}
.ol-links{display:flex;align-items:center;height:55px;border-top:1px solid var(--color-border);background:var(--color-surface-strong)}
.ol-links a{flex:1;padding:12px 8px;border-radius:10px;color:var(--color-text-sub);font-size:12px;text-align:center;transition:background .5s,color .5s}
.ol-links a i{margin-right:6px;color:#475066;font-size:17px;vertical-align:-1px;transition:color .5s}
.ol-links a:hover,.ol-links a:focus-visible{background:var(--color-surface-hover);color:var(--color-text)}
.ol-links a:hover i,.ol-links a:focus-visible i{color:var(--color-success)}
.ol a.btn_admin{display:inline-block;height:24px;padding:0 8px;border:1px solid var(--color-primary);border-radius:3px;color:var(--color-primary);font-size:11px;line-height:22px}
#ol_after_hd{position:relative;height:80px;padding:12px 10px 10px 72px}
#ol_after_hd strong{display:block;margin:4px 0 8px;color:var(--color-text);font-size:13px;font-weight:600}
#ol_after_hd .profile_img{position:absolute;top:12px;left:12px;display:inline-block}
#ol_after_hd .profile_img img{width:45px;height:45px;border:1px solid var(--color-border);border-radius:50%}
#ol_after_info{display:inline-block;height:25px;padding:1px 5px;border:1px solid var(--color-primary);border-radius:3px;color:var(--color-primary);font-size:11px;line-height:21px}
#ol_after h2,#ol_after .ol-title{position:absolute;width:1px;height:1px;margin:0;padding:0;overflow:hidden;font-size:0;line-height:0}
#ol_after_private li{position:relative;text-align:left}
#ol_after_private a{display:block;padding:9px 10px 9px 16px;border-top:1px solid var(--color-border);color:var(--color-text-sub);font-size:11px;line-height:18px;transition:background .5s,color .5s}
#ol_after_private a:hover{background:var(--color-surface-hover);color:var(--color-text)}
#ol_after_private a strong{float:right;display:inline-block;max-width:87px;padding:0 5px;overflow:hidden;border-radius:15px;color:var(--color-primary-bright);font-size:11px;white-space:nowrap}
#ol_after_private li i{width:22px;margin-right:4px;color:var(--color-muted);transition:color .5s}
#ol_after_private li:hover i{color:var(--color-success)}
#ol_after_logout{display:block;padding:11px 0;border-top:1px solid var(--color-border);color:var(--color-text-sub);font-size:12px;font-weight:500;text-align:center;transition:background .5s,color .5s}
#ol_after_logout:hover{background:var(--color-surface-hover);color:var(--color-text)}
#ol_after_logout:hover i{color:var(--color-success)}

@keyframes hub-darkback{0%,100%{background:#7750f8;box-shadow:0 0 20px 3px rgba(119,80,248,.7)}50%{background:#40d04f;box-shadow:0 0 20px 3px rgba(64,208,79,.7)}}

@media(prefers-reduced-motion:reduce){#ol_submit:hover,#ol_submit:focus-visible{animation:none}}
