:root{
  --df-bg:#071018;
  --df-panel:#0d1b27;
  --df-panel-2:#11283a;
  --df-text:#ecf7fa;
  --df-muted:#a8bdc8;
  --df-cyan:#18d4cb;
  --df-blue:#2388d8;
  --df-red:#ff2448;
  --df-border:rgba(111,225,221,.22);
  --df-shadow:0 24px 60px rgba(0,0,0,.35);
}
html,body{min-height:100%;}
body{
  margin:0!important;
  background:
    radial-gradient(circle at 12% 12%,rgba(24,212,203,.11),transparent 28%),
    radial-gradient(circle at 88% 8%,rgba(255,36,72,.10),transparent 24%),
    linear-gradient(145deg,#06101a 0%,#0a1722 55%,#09131d 100%) fixed!important;
  color:var(--df-text)!important;
  font-family:"Segoe UI",Inter,Arial,sans-serif!important;
}
a{color:#7cf8ef!important;text-decoration:none!important}a:hover{color:#fff!important}
#container{
  width:min(1100px,calc(100% - 32px))!important;
  margin:24px auto 0!important;
  background:rgba(8,20,30,.93)!important;
  border:1px solid var(--df-border)!important;
  border-radius:22px!important;
  box-shadow:var(--df-shadow)!important;
  overflow:hidden!important;
}
#header{
  box-sizing:border-box!important;
  min-height:112px!important;
  padding:18px 24px!important;
  background:linear-gradient(135deg,rgba(14,34,49,.98),rgba(9,23,35,.98))!important;
  border-bottom:1px solid var(--df-border)!important;
}
#header #logo{height:72px!important;display:flex!important;align-items:center!important}
#header #logo img{max-height:68px!important;max-width:245px!important;filter:drop-shadow(0 8px 18px rgba(0,0,0,.25))}
#header .pull-right{color:var(--df-muted)!important;font-size:14px!important;padding-top:8px!important}
.df-site-return{
  display:inline-flex!important;align-items:center!important;gap:8px!important;
  margin:0 0 10px!important;padding:10px 15px!important;
  border-radius:12px!important;background:linear-gradient(135deg,var(--df-red),#dd1238)!important;
  color:#fff!important;font-weight:800!important;box-shadow:0 12px 28px rgba(255,36,72,.23)!important;
}
.df-site-return:hover{transform:translateY(-1px);filter:brightness(1.08)}
#nav{
  margin:0!important;padding:12px 20px!important;
  background:rgba(12,31,44,.96)!important;border-bottom:0!important;box-shadow:none!important;
  display:flex!important;flex-wrap:wrap!important;gap:8px!important;
}
#nav li{margin:0!important;border:0!important}
#nav li a{
  display:block!important;padding:10px 15px!important;border-radius:11px!important;
  color:#dff9f7!important;background:rgba(255,255,255,.055)!important;border:1px solid rgba(255,255,255,.08)!important;
  font-weight:700!important;
}
#nav li a:hover,#nav li a.active{background:linear-gradient(135deg,rgba(24,212,203,.25),rgba(35,136,216,.22))!important;border-color:rgba(63,231,222,.45)!important;color:#fff!important}
#content{box-sizing:border-box!important;padding:28px!important;min-height:390px!important;background:transparent!important;color:var(--df-text)!important}
#content h1,#content h2,#content h3,#content .headline{color:#fff!important}
#content p,#content label,#content td,#content th,#content div{line-height:1.5}
#content form,#content .dialog,#content .ticket_info,#content .thread-entry,#content table.list{
  border-radius:14px!important;
}
input[type=text],input[type=email],input[type=password],input[type=tel],textarea,select,.select2-container .select2-choice{
  box-sizing:border-box!important;background:#102435!important;color:#edfafa!important;
  border:1px solid rgba(126,219,220,.30)!important;border-radius:9px!important;
  padding:9px 11px!important;min-height:38px!important;box-shadow:none!important;
}
textarea{min-height:130px!important}
input:focus,textarea:focus,select:focus{outline:none!important;border-color:var(--df-cyan)!important;box-shadow:0 0 0 3px rgba(24,212,203,.12)!important}
input[type=submit],input[type=button],button,.button,a.button{
  border:0!important;border-radius:10px!important;padding:10px 17px!important;
  background:linear-gradient(135deg,var(--df-cyan),#087d88)!important;color:#fff!important;
  font-weight:800!important;cursor:pointer!important;box-shadow:0 10px 24px rgba(24,212,203,.16)!important;
}
input[type=reset]{
  background:#eaf4f7!important;
  color:#153447!important;
  border:1px solid rgba(97,203,208,.55)!important;
  box-shadow:0 8px 20px rgba(0,0,0,.14)!important;
}
input[type=reset]:hover{
  background:#ffffff!important;
  color:#082230!important;
  border-color:var(--df-cyan)!important;
}
.cancel{
  background:#315267!important;
  color:#ffffff!important;
  border:1px solid rgba(148,210,216,.28)!important;
}
.cancel:hover{background:#3d667d!important}
table.list{width:100%!important;border-collapse:separate!important;border-spacing:0!important;overflow:hidden!important;border:1px solid var(--df-border)!important;background:rgba(255,255,255,.025)!important}
table.list th{background:#122b3c!important;color:#fff!important;padding:12px!important;border-color:rgba(255,255,255,.08)!important}
table.list td{padding:12px!important;color:#e9f5f8!important;border-color:rgba(255,255,255,.07)!important;background:rgba(255,255,255,.015)!important}
table.list tr:hover td{background:rgba(24,212,203,.055)!important}
#msg_notice,.notice_bar{background:rgba(33,188,119,.15)!important;border:1px solid rgba(73,227,154,.38)!important;color:#bdfbdd!important;border-radius:10px!important}
#msg_error,.error_bar{background:rgba(255,36,72,.14)!important;border:1px solid rgba(255,86,113,.42)!important;color:#ffd7df!important;border-radius:10px!important}
#msg_warning,.warning_bar{background:rgba(255,179,45,.14)!important;border:1px solid rgba(255,190,76,.40)!important;color:#ffe5b3!important;border-radius:10px!important}
#footer{width:min(1100px,calc(100% - 32px))!important;margin:18px auto 30px!important;color:#8fa7b3!important;text-align:center!important}
#footer a{color:#62ded8!important}#poweredBy{opacity:.7}
hr{border:0!important;border-top:1px solid var(--df-border)!important}
@media(max-width:760px){
  #container{width:calc(100% - 16px)!important;margin-top:8px!important;border-radius:15px!important}
  #header{min-height:auto!important;padding:15px!important}
  #header #logo{float:none!important;height:auto!important;margin-bottom:12px!important}
  #header .pull-right{float:none!important;text-align:left!important;width:100%!important}
  .df-site-return{width:100%!important;box-sizing:border-box!important;justify-content:center!important}
  #nav{padding:10px!important}#nav li{flex:1 1 140px!important}#nav li a{text-align:center!important}
  #content{padding:18px 14px!important;overflow-x:auto!important}
  input[type=text],input[type=email],input[type=password],input[type=tel],textarea,select{max-width:100%!important;width:100%!important}
  table.list{min-width:620px!important}
}


/* v2 refinements requested after live test */
#nav, #nav ul, #nav li, #nav li a{border-bottom-width:0!important;text-decoration:none!important}
#nav li a.active, #nav li a:hover{box-shadow:none!important}
#ticketForm input[type="reset"], form input[type="reset"]{
  background:#eef7f9!important;
  color:#153447!important;
  border:1px solid #8fd9dc!important;
  text-shadow:none!important;
}
#ticketForm input[type="reset"]:hover, form input[type="reset"]:hover{
  background:#ffffff!important;
  border-color:#18d4cb!important;
}


/* v3 – Main-site logo and bilingual landing page */
#header #logo{
  width:auto!important;
  min-width:230px!important;
  height:82px!important;
  padding:7px 15px!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.96)!important;
  border:1px solid rgba(255,255,255,.72)!important;
  box-shadow:0 10px 26px rgba(0,0,0,.22)!important;
  overflow:hidden!important;
}
#header #logo img{
  display:block!important;
  width:210px!important;
  max-width:210px!important;
  height:68px!important;
  max-height:68px!important;
  object-fit:contain!important;
  filter:none!important;
}
#landing_page .thread-body{
  background:transparent!important;
  padding:0!important;
  border:0!important;
}
.df-landing-message{
  display:flex!important;
  align-items:flex-start!important;
  gap:16px!important;
  width:100%!important;
  max-width:590px!important;
  box-sizing:border-box!important;
  padding:22px 24px!important;
  border-radius:15px!important;
  background:#ffffff!important;
  color:#17212b!important;
  border:1px solid rgba(210,223,232,.95)!important;
  box-shadow:0 15px 34px rgba(0,0,0,.18)!important;
}
.df-info-icon{
  flex:0 0 46px!important;
  width:46px!important;
  height:46px!important;
  border-radius:50%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:linear-gradient(145deg,#2499ed,#086dcc)!important;
  color:#fff!important;
  font:900 30px/1 Georgia,serif!important;
  box-shadow:0 8px 18px rgba(15,118,210,.25)!important;
}
.df-landing-copy h1{
  margin:0 0 8px!important;
  color:#142131!important;
  font-size:20px!important;
  font-weight:800!important;
}
.df-landing-copy p{
  margin:0!important;
  color:#273544!important;
  font-size:15px!important;
  line-height:1.52!important;
}
.df-landing-copy strong{color:#111b27!important}
@media(max-width:760px){
  #header #logo{
    min-width:0!important;
    width:225px!important;
    height:78px!important;
    padding:6px 12px!important;
  }
  #header #logo img{
    width:200px!important;
    height:64px!important;
  }
  .df-landing-message{
    max-width:none!important;
    padding:18px!important;
    gap:12px!important;
  }
  .df-info-icon{
    flex-basis:40px!important;
    width:40px!important;
    height:40px!important;
    font-size:26px!important;
  }
}


/* Digital Future patch 2026-07-19: language persistence + mobile layout */
@media (max-width:760px){
  #container{width:calc(100% - 16px)!important;margin:8px auto 0!important;border-radius:16px!important;overflow:hidden!important}
  #header{min-height:0!important;height:auto!important;padding:14px!important;display:flex!important;flex-direction:column!important;gap:12px!important;align-items:stretch!important}
  #header .pull-right{float:none!important;width:100%!important;padding:0!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;text-align:center!important;order:2!important}
  #header #logo{float:none!important;order:1!important;width:100%!important;max-width:none!important;height:auto!important;min-height:74px!important;padding:8px 12px!important;margin:0!important;justify-content:center!important;background:#fff!important;border-radius:14px!important}
  #header #logo img{width:auto!important;max-width:220px!important;height:auto!important;max-height:64px!important;object-fit:contain!important}
  .df-site-return{align-self:center!important;margin:0 0 8px!important;font-size:14px!important;padding:9px 13px!important}
  #header .pull-right p{margin:0 0 8px!important}
  .df-language-bar{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;width:100%!important}
  .df-language-button{min-width:0!important;justify-content:center!important;padding:9px 5px!important;font-size:12px!important;white-space:nowrap!important}
  #nav{padding:10px!important;display:grid!important;grid-template-columns:1fr!important;gap:7px!important}
  #nav li,#nav li a{width:100%!important;text-align:center!important;box-sizing:border-box!important}
  #content{padding:18px 14px!important;min-height:0!important;overflow-x:hidden!important}
  #content form,#content table,#content .dialog{max-width:100%!important}
  input[type=text],input[type=email],input[type=password],input[type=tel],textarea,select{max-width:100%!important;width:100%!important}
  #footer{padding:14px 10px!important;text-align:center!important}
}
@media (max-width:390px){
  .df-language-button{font-size:11px!important;padding:8px 3px!important}
  .df-mini-flag{margin-right:3px!important}
}
