/* P0-053 — VIENTHONG LMS login landing */
:root{--dttt-login-ink:#102a43;--dttt-login-muted:#5d7184;--dttt-login-blue:#0869a6;--dttt-login-cyan:#13b9c8;--dttt-login-card:rgba(255,255,255,.91)}
body.login{background:#071d36;color:var(--dttt-login-ink);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh;display:block;overflow-x:hidden;overflow-y:auto;position:relative;padding:30px 0 42px;box-sizing:border-box}
body.login:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 18% 18%,rgba(21,173,202,.35),transparent 32%),radial-gradient(circle at 85% 78%,rgba(43,84,201,.45),transparent 38%),linear-gradient(135deg,#071d36,#0a4c74 54%,#061b33);z-index:-3}
body.login:after{content:"";position:fixed;inset:-20%;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:42px 42px;transform:perspective(720px) rotateX(58deg) translateY(27%);transform-origin:center;opacity:.55;z-index:-2;mask-image:linear-gradient(to bottom,transparent 0,#000 35%,transparent 90%)}
body.login.dttt-login-theme-1:before{background:radial-gradient(circle at 80% 15%,rgba(175,75,255,.38),transparent 34%),radial-gradient(circle at 15% 84%,rgba(0,206,190,.3),transparent 38%),linear-gradient(135deg,#170c43,#283b8a 55%,#071d36)}
body.login.dttt-login-theme-2:before{background:radial-gradient(ellipse at 20% 15%,rgba(52,224,255,.36),transparent 35%),radial-gradient(ellipse at 85% 80%,rgba(47,120,255,.46),transparent 42%),linear-gradient(140deg,#06152f,#0c6380 58%,#092449)}
body.login.dttt-login-theme-3:before{background:radial-gradient(circle at 75% 23%,rgba(248,169,77,.32),transparent 28%),radial-gradient(circle at 18% 72%,rgba(250,70,136,.28),transparent 37%),linear-gradient(130deg,#24103d,#124d79 55%,#071a36)}
#login{width:min(452px,calc(100vw - 28px));padding:0 0 10px;margin:0 auto;position:relative}
#login h1{margin:0 0 12px;text-align:center}
#login h1 a{width:92px;height:92px;margin:0 auto 12px;background-color:#fff;background-image:url("../assets/logo-cao-thang.png");background-repeat:no-repeat;background-position:center;background-size:72px auto;border-radius:28px;box-shadow:0 16px 48px rgba(0,0,0,.28);position:relative;transition:transform .25s ease}
#login h1 a:hover{transform:translateY(-2px) rotate(-1deg)}
#login h1 a:before,#login h1 a:after{content:"";position:absolute;inset:-12px;border:1px solid rgba(137,237,255,.65);border-radius:34px;transform:rotate(20deg);animation:dttt-login-orbit 10s linear infinite;pointer-events:none}
#login h1 a:after{inset:-18px;border-color:rgba(255,255,255,.28);border-radius:40px;transform:rotate(-34deg);animation-duration:14s;animation-direction:reverse}
.dttt-login-brand-copy{color:#fff;text-align:center;display:grid;gap:3px;margin:0 0 20px;text-shadow:0 2px 18px rgba(0,0,0,.24)}
.dttt-login-brand-copy strong{font-size:20px;letter-spacing:.11em;font-weight:850}.dttt-login-brand-copy span{font-size:16px;font-weight:750}.dttt-login-brand-copy small{font-size:12px;opacity:.8}
#loginform{margin:0;background:var(--dttt-login-card);border:1px solid rgba(255,255,255,.7);border-radius:24px;padding:26px;box-shadow:0 24px 74px rgba(0,0,0,.26);backdrop-filter:blur(14px)}
#loginform label{color:var(--dttt-login-ink);font-weight:750}#loginform input[type=text],#loginform input[type=password]{width:100%;border:1px solid #c9d8e4;border-radius:12px;padding:12px 13px;margin-top:7px;box-shadow:none;background:#fff;color:var(--dttt-login-ink);font-size:15px;box-sizing:border-box}#loginform input:focus,.dttt-password-form input:focus{border-color:var(--dttt-login-cyan);box-shadow:0 0 0 3px rgba(19,185,200,.15);outline:0}
#loginform .forgetmenot{margin:0 0 16px;color:var(--dttt-login-muted)}#loginform .forgetmenot label{font-size:13px;font-weight:650}#loginform .submit{margin:0}#wp-submit{width:100%;border:0;border-radius:12px;padding:12px 16px;background:linear-gradient(110deg,#0876b6,#10a9c2);box-shadow:0 10px 22px rgba(8,118,182,.25);font-size:15px;font-weight:800;text-shadow:none;transition:transform .2s ease,filter .2s ease}#wp-submit:hover{filter:brightness(1.05);transform:translateY(-1px)}
#nav,#backtoblog{color:rgba(255,255,255,.78);text-align:center;margin:14px 0 0;font-size:13px}#nav a,#backtoblog a{color:#fff;text-decoration:none;font-weight:750}#nav a:hover,#backtoblog a:hover{text-decoration:underline}
.dttt-login-status{border-radius:12px;padding:11px 13px;margin:0 0 16px;font-size:13px;line-height:1.45;background:#e7f3fb;color:#174c70}.dttt-login-status--ok{background:#e4f7ec;color:#17663a}.dttt-login-status--rate,.dttt-login-status--error,.dttt-login-status--weak{background:#fff0ed;color:#8b3026}
.dttt-login-password-panel{margin-top:14px;background:rgba(255,255,255,.93);border-radius:18px;border:1px solid rgba(255,255,255,.75);box-shadow:0 14px 38px rgba(0,0,0,.18);overflow:hidden}.dttt-login-password-panel details{padding:0}.dttt-login-password-panel summary{list-style:none;display:flex;align-items:center;gap:11px;padding:15px 16px;cursor:pointer;color:var(--dttt-login-ink)}.dttt-login-password-panel summary::-webkit-details-marker{display:none}.dttt-login-password-panel summary>span:nth-child(2){display:grid;gap:2px;flex:1}.dttt-login-password-panel summary strong{font-size:14px}.dttt-login-password-panel summary small{font-size:11px;color:var(--dttt-login-muted)}.dttt-login-summary-icon{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:#e8f5fb;color:var(--dttt-login-blue);flex:0 0 auto}.dttt-login-summary-icon svg,.dttt-login-chevron,.dttt-password-input button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.dttt-login-chevron{color:#688096;transition:transform .2s ease}.dttt-login-password-panel details[open] .dttt-login-chevron{transform:rotate(180deg)}.dttt-password-form{border-top:1px solid #e0eaf0;padding:16px;display:grid;gap:12px}.dttt-password-form label{display:grid;gap:5px;font-size:13px;color:var(--dttt-login-ink);font-weight:750}.dttt-password-form input{width:100%;box-sizing:border-box;border:1px solid #c9d8e4;border-radius:10px;padding:10px 42px 10px 11px;color:var(--dttt-login-ink);background:#fff;font-size:14px}.dttt-password-input{position:relative}.dttt-password-input button{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:31px;height:31px;border:0;border-radius:8px;background:transparent;color:#688096;display:grid;place-items:center;cursor:pointer}.dttt-password-input button:hover{background:#eaf4f8;color:var(--dttt-login-blue)}.dttt-password-help{font-size:11px;line-height:1.4;color:var(--dttt-login-muted);margin:0}.dttt-password-submit{width:100%;border:0!important;border-radius:10px!important;padding:11px 14px!important;background:var(--dttt-login-blue)!important;font-weight:800!important;text-shadow:none!important}
@keyframes dttt-login-orbit{to{transform:rotate(380deg)}}
@media (prefers-reduced-motion:reduce){#login h1 a:before,#login h1 a:after{animation:none}}
@media (max-width:480px){body.login{align-items:flex-start}.login #login{padding:22px 0 30px}.dttt-login-brand-copy{margin-bottom:16px}.dttt-login-brand-copy strong{font-size:18px}.dttt-login-brand-copy span{font-size:14px}#loginform{padding:20px;border-radius:20px}.dttt-login-password-panel summary{padding:13px}.dttt-password-form{padding:14px}}

/* Keep WordPress language controls in the same readable document flow. */
#language-switcher{width:min(452px,calc(100vw - 28px));margin:14px auto 0;padding:0;text-align:center;color:rgba(255,255,255,.84);display:flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box}#language-switcher select{max-width:210px;border:1px solid rgba(255,255,255,.42);border-radius:9px;padding:8px 32px 8px 10px;background:rgba(255,255,255,.9);color:#17334d}#language-switcher input[type=submit]{border:1px solid rgba(82,219,240,.75);border-radius:9px;padding:8px 12px;background:transparent;color:#dffaff;font-weight:750;cursor:pointer}#language-switcher input[type=submit]:hover{background:rgba(255,255,255,.12)}
@media (max-width:480px){body.login{padding:22px 0 30px}.login #login{padding:0 0 8px}.dttt-login-brand-copy{margin-bottom:14px}#language-switcher{margin-top:10px;flex-wrap:wrap}}
