/* ==========================================================================
   ProHost Client Portal — Style v4
   Theme: Crisp Professional Light
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Source+Sans+3:ital,wght@0,300;0,400;0,600;1,300&display=swap');

/* ==========================================================================
   Variables
   ========================================================================== */
:root {
  --navy:       #0f3d0f;
  --navy-2:     #1a5c1a;
  --navy-3:     #236b23;
  --accent:     #2d8a2d;
  --accent-2:   #1e6b1e;
  --accent-dim: rgba(45,138,45,.1);
  --green:      #2d8a2d;
  --red:        #ef4444;
  --orange:     #f59e0b;
  --bg:         #f8fafc;
  --bg-2:       #ffffff;
  --bg-3:       #f1f5f9;
  --border:     #e2e8f0;
  --border-2:   #cbd5e1;
  --text:       #0f172a;
  --text-2:     #475569;
  --text-3:     #94a3b8;
  --r:          8px;
  --r-lg:       12px;
  --sh:         0 1px 3px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.06);
  --sh-lg:      0 8px 40px rgba(0,0,0,.12);
  --font:       'Source Sans 3',-apple-system,sans-serif;
  --display:    'Outfit',-apple-system,sans-serif;
  --t:          .18s ease;
}

/* ==========================================================================
   Reset
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{overflow-y:scroll;overflow-x:hidden;scroll-behavior:smooth}
body{
  font-family:var(--font);font-size:16px;line-height:1.6;
  color:var(--text);background:var(--bg);
  -webkit-font-smoothing:antialiased;margin:0;padding:0;
  display:grid;grid-template-rows:auto 1fr auto;min-height:100vh;overflow-x:hidden;
}
a{color:var(--accent-2);text-decoration:none;transition:color var(--t)}
a:hover{color:var(--navy)}
p{margin:0;line-height:1.6}
h1,h2,h3,h4,h5,h6{font-family:var(--display);font-weight:600;color:var(--navy);margin:0;line-height:1.2}
ul,ol{margin:0;padding:0;list-style:none}
img{display:block;max-width:100%}
input,textarea,select,button{font-family:var(--font);font-size:16px}
input:focus,textarea:focus,select:focus{outline:none}
input[type=text],input[type=email],input[type=password],input[type=search]{-webkit-appearance:none}
small{font-size:13px;color:var(--text-3);display:block;margin-top:4px}

/* ==========================================================================
   Foundation grid compat
   ========================================================================== */
.row{width:100%;margin:0;padding:0}
.row::before,.row::after{content:'';display:table;clear:both}
.twelve.columns{width:100%;float:none;margin:0;padding:0}
.eight.columns{width:66.66%;float:left;padding:0 8px}
.six.columns{width:50%;float:left;padding:0 8px}
.four.columns{width:33.33%;float:left;padding:0 8px}
.three.columns{width:25%;float:left;padding:0 8px}
.two.columns{width:16.66%;float:left;padding:0 8px}
.columns,.column{float:left;padding:0 8px}
.row .row{max-width:100%;min-width:0}
.centered{float:none;margin:0 auto}

/* ==========================================================================
   Utilities
   ========================================================================== */
.cf::after{content:'';display:table;clear:both}
.vam{vertical-align:middle}.tac{text-align:center}.tar{text-align:right}
.sepH_a{margin-bottom:5px}.sepH_b{margin-bottom:12px}.sepH_c{margin-bottom:24px}
.sepV_a{margin-right:5px}.sepV_b{margin-right:10px}.sepV_c{margin-right:20px}
.sepH_a_line{padding-bottom:8px;margin-bottom:20px;border-bottom:1px solid var(--border)}
.sepH_no{margin-bottom:0}.small{font-size:13px}.medium{font-size:15px}.large{font-size:18px}

/* ==========================================================================
   Container
   ========================================================================== */
.container{max-width:1100px;width:100%;margin:0 auto;padding:0 24px;box-sizing:border-box}
.container>.row{padding-top:32px;padding-bottom:32px}

/* ==========================================================================
   HEADER — deep navy with subtle diagonal stripe texture
   ========================================================================== */
header{
  width:100%;max-width:100vw;overflow:hidden;
  background:var(--navy);
  background-image:
    repeating-linear-gradient(
      -45deg,
      transparent,
      transparent 12px,
      rgba(255,255,255,.02) 12px,
      rgba(255,255,255,.02) 24px
    );
  position:sticky;top:0;z-index:200;
  box-shadow:0 2px 20px rgba(0,0,0,.2);
}

.container.head_s_a{padding-top:0!important;padding-bottom:0!important}
.container.head_s_a>.row{padding:0;display:flex;align-items:center;width:100%}
.container.head_s_a>.row.sepH_b{margin:0;padding:0}

/* Logo area */
#logo{display:inline-flex;align-items:center;gap:10px;padding:14px 0;text-decoration:none}
#logo img{height:28px;width:auto;padding:0!important;filter:brightness(0) invert(1)}
#logo::after{
  content:'ProHost';
  font-family:var(--display);
  font-size:20px;font-weight:700;
  color:#fff;letter-spacing:-.3px;
}

/* Hamburger */
.nav-toggle-cb{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;appearance:none;-webkit-appearance:none}
.nav-toggle{
  display:none;position:absolute;top:50%;right:16px;transform:translateY(-50%);
  width:42px;height:42px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);
  border-radius:var(--r);cursor:pointer;
  color:#fff;font-size:20px;line-height:42px;text-align:center;
  user-select:none;-webkit-user-select:none;
  transition:background var(--t);z-index:201;
}
.nav-toggle:hover{background:rgba(255,255,255,.2)}

/* ==========================================================================
   NAVIGATION
   ========================================================================== */
#smoothmenu_h{
  background:none!important;border:none!important;border-radius:0!important;width:100%;
  position:relative;z-index:190;
}
#smoothmenu_h ul{
  display:flex!important;flex-direction:row!important;align-items:center!important;
  gap:0!important;margin:0!important;padding:0!important;list-style:none!important;
}
#smoothmenu_h ul li{position:relative;display:block!important;float:none!important}
#smoothmenu_h ul li>a{
  display:flex!important;align-items:center;
  padding:16px 16px!important;
  font-family:var(--display);font-size:14px!important;font-weight:500;
  color:rgba(255,255,255,.75)!important;
  border:none!important;text-shadow:none!important;
  white-space:nowrap;line-height:1!important;
  transition:color var(--t),background var(--t);
  border-bottom:3px solid transparent;
  margin-bottom:-3px;
}
#smoothmenu_h ul li>a:hover,
#smoothmenu_h ul li>a.selected{
  color:#fff!important;
  border-bottom-color:var(--accent)!important;
  text-decoration:none!important;
  background:rgba(255,255,255,.05)!important;
}
#smoothmenu_h ul li:last-child>a{
  color:rgba(255,255,255,.5)!important;margin-left:auto;
}
#smoothmenu_h ul li:last-child>a:hover{
  color:rgba(255,255,255,.85)!important;
  border-bottom-color:rgba(255,255,255,.3)!important;
}
/* Kill old nav junk */
.downarrowclass,.rightarrowclass,.ddshadow,.toplevelshadow,.tinynav{display:none!important}

/* ==========================================================================
   BOX — card component
   ========================================================================== */
.box_c{
  background:var(--bg-2);
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  overflow:hidden;
  margin-bottom:24px;
  box-shadow:var(--sh);
  transition:box-shadow var(--t);
}

.box_c_heading{
  display:flex;align-items:center;
  min-height:52px;padding:0 20px;gap:12px;
  flex-wrap:wrap;
  background:var(--bg-2);
  border-bottom:1px solid var(--border);
}

.box_c_heading .box_c_ico{
  width:32px;height:32px;border-radius:8px;
  background:var(--accent-dim);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;overflow:hidden;
}
.box_c_heading .box_c_ico img{
  width:16px;height:16px;
  filter:brightness(0) saturate(100%) invert(46%) sepia(98%) saturate(400%) hue-rotate(175deg);
}

.box_c_heading p{
  font-family:var(--display)!important;
  font-size:16px!important;font-weight:600!important;
  color:var(--navy)!important;
  padding-left:0!important;float:none!important;
  margin-bottom:0!important;line-height:1!important;
  flex:1;
}

.box_c_content{padding:24px;background:transparent;border:none}
.cntn_noP{padding:0!important}

/* ==========================================================================
   BUTTONS
   ========================================================================== */
.gh_button{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 16px;font-size:14px;font-weight:600;
  font-family:var(--display);
  color:var(--text-2);
  background:var(--bg-3);
  border:1px solid var(--border-2);
  border-radius:var(--r);cursor:pointer;
  text-decoration:none;white-space:nowrap;
  transition:background var(--t),color var(--t),border-color var(--t),box-shadow var(--t);
}
.gh_button:hover,.gh_button:focus{
  background:var(--accent-dim);
  border-color:var(--accent);
  color:var(--accent-2);
  text-decoration:none;
  box-shadow:0 0 0 3px rgba(45,138,45,.15);
}
.gh_button:active{transform:translateY(1px)}
.gh_button+.gh_button{margin-left:6px}

/* Icons */
.gh_button.icon::before{
  content:'';width:14px;height:14px;
  background:url(../img/ico/gh-icons.png) 0 99px no-repeat;
  background-size:24px auto;
  display:block;flex-shrink:0;
  filter:brightness(0) saturate(100%) invert(46%) sepia(10%) saturate(600%) hue-rotate(182deg);
  transition:filter var(--t);
}
.gh_button:hover::before,.gh_button:focus::before{
  filter:brightness(0) saturate(100%) invert(46%) sepia(98%) saturate(400%) hue-rotate(175deg);
}
.gh_button.log.icon::before{background-position:0 -72px}
.gh_button.mail.icon::before{background-position:0 -240px}
.gh_button.edit.icon::before{background-position:0 -264px}
.gh_button.trash.icon::before{background-position:0 -336px}
.gh_button.add.icon::before{background-position:0 -288px}
.gh_button.approve.icon::before{background-position:0 -48px}
.gh_button.loop.icon::before{background-position:0 -216px}
.gh_button.move.icon::before{background-position:0 -252px}

/* Primary button */
.gh_button.primary,input[type=submit],input[type=button],.button.white.small.radius.nice{
  background:var(--navy);
  border-color:var(--navy);
  color:#fff;font-weight:600;
  font-family:var(--display);
}
.gh_button.primary:hover,input[type=submit]:hover,input[type=button]:hover,.button.white.small.radius.nice:hover{
  background:var(--navy-2);
  border-color:var(--navy-2);
  color:#fff;
  box-shadow:0 4px 12px rgba(15,32,64,.25);
}

input[type=submit],input[type=button]{
  border:none;border-radius:var(--r);
  padding:10px 24px;font-size:15px;cursor:pointer;
  letter-spacing:.2px;transition:background var(--t),box-shadow var(--t);
}

.button.white.small.radius.nice{
  display:inline-flex;align-items:center;
  padding:8px 18px;font-size:14px;border-radius:var(--r);cursor:pointer;
  transition:background var(--t),box-shadow var(--t);
}

/* ==========================================================================
   FORMS
   ========================================================================== */
.form_a{background:transparent;padding:0}
.form_a form{padding:0}
.form_a small{display:block}

.formRow{padding:16px 24px;border-bottom:1px solid var(--border)}
.formRow:last-child{border-bottom:none}

label{
  display:block;font-size:13px;font-weight:600;
  color:var(--text-2);margin-bottom:6px;
  text-transform:uppercase;letter-spacing:.5px;
}
label+input.input-text,label+textarea,label+select{margin-top:0}

input.input-text,
input[type=text],input[type=email],input[type=password]{
  display:block;width:100%;
  background:#fff;
  border:1.5px solid var(--border-2);
  border-radius:var(--r);
  color:var(--text);
  padding:10px 14px;font-size:15px;font-family:var(--font);
  line-height:1.4;box-shadow:none;
  transition:border-color var(--t),box-shadow var(--t);
}
input.input-text:focus,
input[type=text]:focus,input[type=email]:focus,input[type=password]:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(45,138,45,.15);
}
input[disabled]{opacity:.45;cursor:not-allowed;background:var(--bg-3)}

select{
  display:block;width:100%;
  background:#fff;border:1.5px solid var(--border-2);border-radius:var(--r);
  color:var(--text);padding:10px 36px 10px 14px;font-size:15px;font-family:var(--font);
  cursor:pointer;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2394a3b8' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;
  transition:border-color var(--t),box-shadow var(--t);
}
select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(45,138,45,.15);outline:none}
textarea{height:120px;resize:vertical;width:100%;background:#fff;border:1.5px solid var(--border-2);border-radius:var(--r);color:var(--text);padding:10px 14px;font-size:15px;font-family:var(--font);transition:border-color var(--t),box-shadow var(--t)}
textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(45,138,45,.15);outline:none}

label.error{color:var(--red)!important;font-size:12px;text-transform:none;letter-spacing:0;margin-top:4px}
.form-field.error input,.form-field.error textarea{border-color:var(--red)!important}

/* ==========================================================================
   LOGIN PAGE — centered card with branding
   ========================================================================== */
/* ==========================================================================
   LOGIN PAGE — detected by presence of .login_form
   ========================================================================== */
body:has(.login_form){
  background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 50%,#0c3460 100%)!important;
  display:flex!important;flex-direction:column;
  align-items:center;justify-content:center;
}
body:has(.login_form) header{ display:none; }
body:has(.login_form) #footer{ background:transparent; }

body:has(.login_form) .container{
  width:100%;max-width:500px;
  padding:32px 24px;
}
body:has(.login_form) .row,
body:has(.login_form) .twelve.columns{
  width:100%!important;float:none!important;
  padding:0!important;margin:0!important;
}

/* ProHost title above card */
body:has(.login_form) div.container::before{
  content:'ProHost';
  display:block;
  font-family:var(--display);font-size:32px;font-weight:700;
  color:#fff;text-align:center;margin-bottom:24px;letter-spacing:-.5px;
}


/* Card */
body:has(.login_form) .box_c{
  border:none;border-radius:16px;
  box-shadow:0 24px 80px rgba(0,0,0,.4);
  overflow:hidden;
}

/* Heading */
body:has(.login_form) .box_c_heading{
  background:var(--navy);border-bottom:none;
  padding:20px 28px;
}
body:has(.login_form) .box_c_heading p{color:#fff!important;font-size:18px!important}
body:has(.login_form) .box_c_heading .box_c_ico{background:rgba(255,255,255,.15)}
body:has(.login_form) .box_c_heading .box_c_ico img{filter:brightness(0) invert(1)}

/* Content */
body:has(.login_form) .box_c_content{padding:28px}
body:has(.login_form) .box_c_content .row{width:100%!important}
body:has(.login_form) .box_c_content .columns,.box_c_content .column{
  width:100%!important;float:none!important;padding:0!important;margin-bottom:16px;
}

/* Submit */
body:has(.login_form) input[type=submit]{
  width:100%;padding:13px;font-size:16px;
  background:linear-gradient(135deg,var(--accent) 0%,var(--accent-2) 100%);
  color:#fff;border-radius:var(--r);font-family:var(--display);font-weight:700;
  letter-spacing:.3px;box-shadow:0 4px 20px rgba(45,138,45,.35);
}
body:has(.login_form) input[type=submit]:hover{
  transform:translateY(-2px);box-shadow:0 8px 28px rgba(45,138,45,.45);
}

/* Inputs */
body:has(.login_form) input[type=text],
body:has(.login_form) input[type=password]{padding:12px 16px;font-size:16px}

/* Error row */
body:has(.login_form) .formRow:first-child{border-bottom:none;padding:0 0 8px}

/* ==========================================================================
   DOMAINS TABLE
   ========================================================================== */
table.display{width:100%;border-collapse:collapse;font-size:15px}
table.display thead tr{border-bottom:2px solid var(--border)}
table.display thead th{
  padding:12px 16px;text-align:left;
  font-family:var(--display);font-size:12px;font-weight:600;
  letter-spacing:.8px;text-transform:uppercase;
  color:var(--text-3);white-space:nowrap;background:transparent;
}
table.display thead th.center{text-align:center}
table.display tbody tr{border-bottom:1px solid var(--border);transition:background var(--t)}
table.display tbody tr:last-child{border-bottom:none}
table.display tbody tr:hover{background:var(--bg-3)}
table.display tbody tr.odd{background:transparent}
table.display tbody tr.odd:hover{background:var(--bg-3)}
table.display tbody td{padding:14px 16px;color:var(--text);vertical-align:middle}
table.display tbody td.center{text-align:center}
table.display tbody td.center .gh_button{margin:0 2px}

/* Domain name styling */
table.display tbody td:nth-child(2){
  font-family:var(--display);font-weight:600;font-size:15px;color:var(--navy);
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
#footer{
  background:var(--navy);
  color:rgba(255,255,255,.4);
  font-size:13px;text-align:center;
  padding:20px 0;margin-top:0;height:auto;border-top:none;
  letter-spacing:.3px;
}
footer.container#footer{max-width:100%;width:100%;border-radius:0}

/* ==========================================================================
   MISC
   ========================================================================== */
.lbl{display:inline-block;padding:3px 10px;font-size:12px;font-weight:600;border-radius:50em;letter-spacing:.3px;text-transform:uppercase}
.ok_bg{background:#dcfce7;color:#166534}
.alert_bg{background:#fef3c7;color:#92400e}
.info_bg{background:#dbeafe;color:#1e40af}
.error_bg{background:#fee2e2;color:#991b1b}
.neutral_bg{background:var(--bg-3);color:var(--text-3)}

.alert-box{padding:14px 18px;border-radius:var(--r);font-size:14px;margin-bottom:16px;border:1px solid transparent}
.alert-box.info{background:#dbeafe;border-color:#93c5fd;color:#1e40af}
.alert-box.success{background:#dcfce7;border-color:#86efac;color:#166534}
.alert-box.warning{background:#fef3c7;border-color:#fde68a;color:#92400e}
.alert-box.error{background:#fee2e2;border-color:#fca5a5;color:#991b1b}

/* Success message */
.bold-title{font-family:var(--display);font-size:13px!important;font-weight:700!important;text-transform:uppercase;letter-spacing:.8px;color:var(--text-3)!important;margin-bottom:12px}
.editcontact{margin-top:12px}
.form_a label{margin-bottom:4px!important}
.editcontact input[type=submit]{width:100%!important;box-sizing:border-box}
.form_a .input-text,.admin-contact .input-text,.tech-contact .input-text,.nameservers .input-text{width:100%!important;max-width:100%!important;box-sizing:border-box!important;display:block!important}
.admin-contact input,.tech-contact input,.nameservers input{width:100%!important;max-width:100%!important;box-sizing:border-box!important}
.admin-contact,.tech-contact{float:left;width:50%;padding-right:20px;margin-top:20px;padding-top:20px;border-top:1px solid var(--border);box-sizing:border-box}
.admin-contact .columns,.tech-contact .columns,.nameservers .columns,.ns-left .columns,.ns-right .columns{padding-left:0!important;padding-right:0!important;width:100%!important;float:none!important}
.nameservers{clear:both;width:100%;margin-top:20px;padding-top:20px;border-top:1px solid var(--border)}
.notification{overflow:hidden;width:100%;box-sizing:border-box}
.ns-left{float:left;width:50%;padding-right:16px}.ns-right{float:left;width:50%}
.notif{background:#fef3c7;border:1px solid #fde68a;border-radius:var(--r);padding:16px 20px;margin-top:16px;clear:both;width:100%;color:#78350f;line-height:1.75;box-sizing:border-box}

/* List-icon button */
.gh_button.icon.list-icon::before{
  background:none;width:14px;height:10px;display:block;flex-shrink:0;
  background-image:linear-gradient(var(--text-3),var(--text-3)),linear-gradient(var(--text-3),var(--text-3)),linear-gradient(var(--text-3),var(--text-3));
  background-size:14px 2px,14px 2px,14px 2px;
  background-position:0 0,0 4px,0 8px;
  background-repeat:no-repeat;
  transition:background-image var(--t);
}
.gh_button:hover.icon.list-icon::before,.gh_button:focus.icon.list-icon::before{
  background-image:linear-gradient(var(--accent-2),var(--accent-2)),linear-gradient(var(--accent-2),var(--accent-2)),linear-gradient(var(--accent-2),var(--accent-2));
}

/* Suppress old admin-only classes */
.ssw_trigger,.sw_width,.style_switcher,.sticky_nav,.bAct_hide,.bAct_toggle{display:none!important}



/* ==========================================================================
   Domain search box
   ========================================================================== */
.domain-search-wrap{
  padding:12px 20px;border-bottom:1px solid var(--border);
  background:var(--bg-2);
}
.domain-search-wrap input{
  width:100%;max-width:400px;
  background:var(--bg-3);
  border:1.5px solid var(--border-2);
  border-radius:var(--r);
  color:var(--text);
  padding:9px 14px 9px 36px;
  font-size:14px;font-family:var(--font);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cline x1='11' y1='11' x2='14' y2='14'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:10px center;
  transition:border-color var(--t),box-shadow var(--t);
}
.domain-search-wrap input:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(45,138,45,.15);
  outline:none;
}
.domain-search-wrap input::placeholder{color:var(--text-3)}
.domain-search-none{
  padding:20px;text-align:center;
  color:var(--text-3);font-size:14px;display:none;
}
@media only screen and (max-width:767px){
  .domain-search-wrap{padding:10px 14px}
  .domain-search-wrap input{max-width:100%}
}


#domainSearch{background:#f1f5f9;border:1.5px solid #e2e8f0;border-radius:8px;padding:8px 14px 8px 36px;font-size:14px;font-family:inherit;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cline x1='11' y1='11' x2='14' y2='14'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:10px center;outline:none;transition:border-color .18s;width:100%;box-sizing:border-box}
#domainSearch:focus{border-color:#2d8a2d;box-shadow:0 0 0 3px rgba(45,138,45,.15)}
#searchNone{padding:14px 20px;color:#94a3b8;font-size:14px;display:none}

#dt2 tbody tr.dom-hidden{display:none!important;visibility:hidden!important;height:0!important;overflow:hidden!important;padding:0!important;margin:0!important}
#dt2 tbody tr.dom-hidden td{display:none!important}

/* ==========================================================================
   Domain status badges
   ========================================================================== */
.dom-status{
  display:inline-block;padding:3px 10px;border-radius:50em;
  font-size:12px;font-weight:700;letter-spacing:.3px;
  font-family:var(--display);
}
.dom-status.aktiven{background:#dcfce7;color:#166534}
.dom-status.istecen{background:#fef3c7;color:#92400e}
.dom-status.izbrisan{background:#fee2e2;color:#991b1b}
.dom-status.unknown{background:var(--bg-3);color:var(--text-3)}

}
/* ==========================================================================
   RESPONSIVE — Tablet
   ========================================================================== */
@media only screen and (max-width:959px){
  .container{padding:0 16px}
  .container.head_s_a{padding:0 16px}
}
@media only screen and (min-width:768px) and (max-width:959px){
  .admin-contact,.tech-contact{width:100%;padding-right:0}
}

/* ==========================================================================
   RESPONSIVE — Mobile <=767px
   ========================================================================== */
@media only screen and (max-width:767px){

  /* Header: sticky, full width, explicit height so hamburger is fully inside */
  header{position:sticky;top:0;z-index:200;min-height:60px;width:100vw!important;max-width:100vw!important;left:0;box-sizing:border-box!important;overflow:hidden!important}
  .container.head_s_a{position:relative;padding-right:64px!important;padding-top:0!important;padding-bottom:0!important;min-height:60px;width:100%!important;max-width:100%!important;box-sizing:border-box!important;display:flex;align-items:center}
  .container.head_s_a .row,.container.head_s_a .twelve.columns{width:100%!important;max-width:100%!important;box-sizing:border-box!important}

  /* Show hamburger */
  .nav-toggle{display:block!important}

  /* Nav: fixed below header, covers page content */
  #smoothmenu_h{
    display:none;
    position:fixed;
    top:60px;
    left:0;right:0;width:100%;
    background:var(--navy)!important;
    border-top:1px solid rgba(255,255,255,.1)!important;
    border-bottom:3px solid var(--accent)!important;
    box-shadow:0 8px 32px rgba(0,0,0,.4);
    z-index:199;
    max-height:calc(100vh - 60px);
    overflow-y:auto;
  }

  /* Checkbox checked — show nav */
  .nav-toggle-cb:checked~.container.head_s_a #smoothmenu_h{display:block!important}
  #smoothmenu_h ul{flex-direction:column!important;gap:0!important;padding:8px 0!important}
  #smoothmenu_h ul li{width:100%;display:block!important;float:none!important}
  #smoothmenu_h ul li>a{
    padding:14px 20px!important;font-size:16px!important;
    border-bottom:1px solid rgba(255,255,255,.08)!important;
    border-left:none!important;border-right:none!important;
    width:100%;display:block!important;border-bottom-width:1px!important;
  }
  #smoothmenu_h ul li>a:hover{border-bottom-color:rgba(255,255,255,.08)!important}
  #smoothmenu_h ul li:last-child>a{border-bottom:none!important}

  .container{padding:0 16px}
  .container>.row{padding-top:20px;padding-bottom:20px}

  /* Login */
  body:has(.login_form) .container{max-width:100%;padding:0}
  body:has(.login_form) .box_c{border-radius:0;box-shadow:none}
  body:has(.login_form) div.container::before{margin-top:32px;margin-bottom:16px}

  body:has(.login_form) .box_c_heading{border-radius:0}
  body:has(.login_form) .box_c_content{padding:20px}

  .six.columns,.four.columns,.three.columns,.two.columns,.eight.columns,.columns,.column{
    width:100%!important;float:none!important;padding:0!important;margin-bottom:16px
  }
  .twelve.columns{margin-bottom:0}
  .formRow{padding:14px 16px}
  .box_c_content{padding:16px}
  .box_c_heading{padding:0 16px}

  .admin-contact,.tech-contact,.nameservers{width:100%!important;float:none!important;padding-right:0!important}
  .ns-left,.ns-right{width:100%!important;float:none!important;padding-right:0!important}

  .sepH_c{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table.display{min-width:0}
  table.display tbody td.center{display:flex!important;flex-wrap:wrap;gap:4px;justify-content:center}

  input[type=submit],input[type=button]{max-width:100%!important;box-sizing:border-box!important}
}


@media only screen and (max-width:767px){
  /* Domain table — vertical card layout on mobile */
  table.display thead{display:none}
  table.display,table.display tbody,table.display td{
    display:block!important;width:100%!important;
  }
  table.display tbody tr{
    display:block!important;
    border:1px solid var(--border)!important;
    border-radius:var(--r)!important;
    margin-bottom:10px!important;
    padding:12px 14px!important;
    background:var(--bg-2)!important;
    box-shadow:0 1px 4px rgba(0,0,0,.05)!important;
  }
  table.display tbody tr[style*="display: none"],
  table.display tbody tr[style*="display:none"]{
    display:none!important;
  }
  table.display tbody tr:hover{background:var(--bg-3)!important}
  table.display tbody td{
    padding:4px 0!important;border:none!important;
    text-align:left!important;font-size:14px;
    display:flex!important;align-items:center;gap:8px;
  }
  table.display tbody td:first-child{display:none!important}
  table.display tbody td:nth-child(2){
    font-size:16px!important;font-weight:700!important;
    color:var(--navy)!important;padding-bottom:8px!important;
    border-bottom:1px solid var(--border)!important;margin-bottom:4px!important;
  }
  table.display tbody td:last-child{
    display:flex!important;flex-wrap:wrap!important;
    gap:6px!important;padding-top:10px!important;
    border-top:1px solid var(--border)!important;margin-top:4px!important;
    justify-content:flex-start!important;
  }
  table.display tbody td .gh_button{font-size:12px!important;padding:5px 10px!important}
  td.dom-contact,td.dom-ns,td.dom-info{display:block!important;padding:2px 0!important;font-size:14px;text-align:left!important}
  #dt2 tbody td{display:block!important;width:100%!important;padding:2px 0!important;text-align:left!important;border:none!important;font-size:14px}
  #dt2 tbody td:first-child{display:none!important}
  #dt2 tbody td:nth-child(2){font-size:16px!important;font-weight:700!important;color:var(--navy)!important;padding-bottom:8px!important;border-bottom:1px solid var(--border)!important;margin-bottom:6px!important}
  #dt2 tbody td:last-child{display:flex!important;flex-wrap:wrap;gap:6px;padding-top:10px!important;border-top:1px solid var(--border)!important;margin-top:6px!important}
  .box_c_heading{flex-wrap:nowrap}
  #domainSearch:focus{border-color:#2d8a2d;box-shadow:0 0 0 3px rgba(45,138,45,.15)}
}

@media only screen and (max-width:479px){
  body{font-size:15px}
  .gh_button{font-size:13px;padding:6px 12px}
}

/* ==========================================================================
   Domain table — global
   ========================================================================== */
#dt2 tbody tr.dom-hidden{display:none!important}
#dt2 tbody tr.dom-hidden td{display:none!important}

/* ==========================================================================
   Domain table — MOBILE cards
   ========================================================================== */
@media only screen and (max-width:767px){
  #dt2 thead{display:none!important}
  #dt2,#dt2 tbody{display:block!important}
  #dt2 tbody tr{
    display:block!important;background:var(--bg-2)!important;
    border:1px solid var(--border)!important;border-radius:var(--r)!important;
    margin-bottom:10px!important;padding:14px!important;
    box-shadow:0 1px 4px rgba(0,0,0,.05)!important;
  }
  #dt2 tbody td{display:block!important;padding:3px 0!important;border:none!important;font-size:14px!important;text-align:left!important;width:auto!important}
  #dt2 tbody td:first-child{display:none!important}
  #dt2 tbody td.dom-name{font-size:16px!important;font-weight:700!important;color:var(--navy)!important;padding-bottom:8px!important;border-bottom:1px solid var(--border)!important;margin-bottom:6px!important}
  #dt2 tbody td.dom-contact::before{content:'Контакт: ';font-weight:700;color:#94a3b8;font-size:11px;text-transform:uppercase;letter-spacing:.5px}
  #dt2 tbody td.dom-ns::before{content:'NS: ';font-weight:700;color:#94a3b8;font-size:11px;text-transform:uppercase;letter-spacing:.5px}
  #dt2 tbody td.dom-valen::before{content:'Валиден до: ';font-weight:700;color:#94a3b8;font-size:11px;text-transform:uppercase;letter-spacing:.5px}
  #dt2 tbody td.dom-badge::before{content:'Статус: ';font-weight:700;color:#94a3b8;font-size:11px;text-transform:uppercase;letter-spacing:.5px}
  #dt2 tbody td.dom-actions{display:flex!important;flex-wrap:wrap!important;gap:6px!important;padding-top:10px!important;border-top:1px solid var(--border)!important;margin-top:6px!important}
}

/* ==========================================================================
   Domain table — DESKTOP (must be last to win)
   ========================================================================== */
@media only screen and (min-width:768px){
  #dt2{display:table!important;width:100%!important;border-collapse:collapse!important}
  #dt2 thead{display:table-header-group!important}
  #dt2 thead tr{display:table-row!important;border-bottom:2px solid var(--border)!important}
  #dt2 thead th{display:table-cell!important;padding:12px 14px!important;font-size:12px!important;font-weight:600!important;text-transform:uppercase!important;letter-spacing:.8px!important;color:var(--text-3)!important;white-space:nowrap!important;text-align:left!important}
  #dt2 thead th:first-child{display:none!important}
  #dt2 tbody{display:table-row-group!important}
  #dt2 tbody tr{display:table-row!important;border-bottom:1px solid var(--border)!important;background:transparent!important;border-radius:0!important;box-shadow:none!important;margin:0!important;padding:0!important}
  #dt2 tbody tr.dom-hidden{display:none!important}
  #dt2 tbody tr[style*="display: none"]{display:none!important}
  #dt2 tbody tr[style*="display:none"]{display:none!important}
  #dt2 tbody tr:hover{background:var(--bg-3)!important}
  #dt2 tbody td{display:table-cell!important;padding:13px 14px!important;border:none!important;font-size:14px!important;vertical-align:middle!important;text-align:left!important;width:auto!important}
  #dt2 tbody td:first-child{display:none!important}
  #dt2 tbody td.dom-name{font-size:15px!important;font-weight:600!important;color:var(--navy)!important;width:25%!important}
  #dt2 tbody td.dom-contact,#dt2 tbody td.dom-ns{width:16%!important;white-space:nowrap!important}
  #dt2 tbody td.dom-valen{width:14%!important;white-space:nowrap!important}
  #dt2 tbody td.dom-badge{width:10%!important}
  #dt2 tbody td.dom-actions{width:1%!important;white-space:nowrap!important;text-align:left!important;display:table-cell!important;vertical-align:middle!important}
  #dt2 tbody td.dom-actions a{display:inline-flex!important;margin:0 4px 0 0!important}

  /* Sortable header */
  .th-sortable{cursor:pointer!important}
  .th-sortable:hover{color:var(--accent)!important}
  .sort-arrow{opacity:.5;font-size:11px;margin-left:4px}
  .th-sortable:hover .sort-arrow{opacity:1}
}

/* ── Language switcher ────────────────────────────────────────────── */
.lang-wrap { position:relative; margin-left:auto; padding:0 12px 0 0; flex-shrink:0; display:flex; align-items:center; }
.lang-select {
    appearance:none; -webkit-appearance:none;
    background:rgba(255,255,255,.1);
    border:1px solid rgba(255,255,255,.25);
    color:#fff; font-size:13px; font-weight:700;
    padding:5px 28px 5px 10px; border-radius:6px;
    cursor:pointer; outline:none; letter-spacing:.5px;
    transition:background .15s, border-color .15s;
    font-family:var(--display);
}
.lang-select:hover { background:rgba(255,255,255,.18); border-color:rgba(255,255,255,.45); }
.lang-select option { background:#1a3d1a; color:#fff; font-weight:600; }
.lang-wrap::after {
    content:'▾'; position:absolute; right:22px;
    color:rgba(255,255,255,.7); font-size:11px; pointer-events:none;
}
@media(max-width:767px){ .lang-wrap { padding:0 8px; } .lang-select { font-size:12px; padding:4px 24px 4px 8px; } .lang-wrap::after { right:14px; } }
