/* Hyyat Host — client area (theme: hyyat, parent: twenty-one) — v1 */
:root{
  --hy-b:#1557b0;--hy-bd:#0e4a9e;--hy-n:#0b2a55;--hy-nd:#081f40;
  --hy-o:#f7931e;--hy-od:#e8850f;--hy-g:#8cc63f;--hy-red:#d64545;
  --hy-bg:#f4f7fb;--hy-br:#e3eaf3;--hy-t:#3d5373;--hy-m:#4d6180;
  --hy-r:12px;--hy-sh:0 2px 10px rgba(11,42,85,.06);--hy-shh:0 10px 28px rgba(11,42,85,.12)
}

/* ---------- base ---------- */
body,button,input,select,textarea,.tooltip,.popover,.modal,.dropdown-menu{font-family:Tajawal,Tahoma,Arial,sans-serif!important}
body.primary-bg-color,.primary-bg-color{background-color:var(--hy-bg)}
body{color:var(--hy-t);font-size:15px;line-height:1.7}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{color:var(--hy-n);font-weight:800;line-height:1.35}
a{color:var(--hy-b)}a:hover{color:var(--hy-bd)}
.text-muted{color:var(--hy-m)!important}
.text-primary{color:var(--hy-b)!important}
.bg-primary{background-color:var(--hy-b)!important}
hr{border-color:var(--hy-br)}
::selection{background:rgba(247,147,30,.3)}

/* ---------- header ---------- */
header.header{background:#fff;box-shadow:0 1px 0 var(--hy-br)}
header.header .topbar{background:var(--hy-nd);color:rgba(255,255,255,.8);padding:4px 0}
header.header .topbar .btn,header.header .topbar .input-group-text{color:rgba(255,255,255,.85)}
header.header .topbar .btn:hover{color:#fff}
header.header .topbar .btn-active-client{background:rgba(255,255,255,.1);border-radius:8px;color:#fff;font-weight:700}
header.header .topbar .btn-return-to-admin{background:var(--hy-o);color:var(--hy-n);border-radius:8px;font-weight:700}
header.header .navbar{padding-top:10px;padding-bottom:10px}
header.header .logo-img{max-height:52px;width:auto}
header.header .navbar a{color:var(--hy-n)}
header.header .search .form-control{border-radius:0 10px 10px 0;border-color:#cfd9e6;background:var(--hy-bg)}
header.header .search .btn{border-radius:10px 0 0 10px;border-color:#cfd9e6;background:var(--hy-bg);color:var(--hy-m)}
[dir=ltr] header.header .search .form-control{border-radius:0 10px 10px 0}
[dir=ltr] header.header .search .btn{border-radius:10px 0 0 10px}
[dir=rtl] header.header .search .form-control{border-radius:10px 0 0 10px}
[dir=rtl] header.header .search .btn{border-radius:0 10px 10px 0}
header.header .cart-btn{position:relative;border:1.5px solid var(--hy-br);border-radius:10px;padding:6px 12px;color:var(--hy-n)!important}
header.header .cart-btn:hover{border-color:var(--hy-b);color:var(--hy-b)!important}
header.header .cart-btn .badge{background:var(--hy-o);color:var(--hy-n);font-weight:800;border-radius:20px}
header.header .navbar-light .navbar-toggler,header.header .toolbar .btn{color:var(--hy-n)}

/* main nav */
header.header .main-navbar-wrapper{background:var(--hy-n)}
header.header .main-navbar-wrapper .navbar-collapse{padding:0 1rem}
header.header .main-navbar-wrapper .navbar-nav>li>a,
header.header .main-navbar-wrapper .navbar-nav .nav-link{color:#fff!important;font-weight:700;padding:14px 14px;position:relative}
header.header .main-navbar-wrapper .navbar-nav>li>a:hover,
header.header .main-navbar-wrapper .navbar-nav .nav-link:hover,
header.header .main-navbar-wrapper .navbar-nav .show>.nav-link,
header.header .main-navbar-wrapper .navbar-nav .active>.nav-link{color:var(--hy-o)!important}
@media (min-width:1200px){
  header.header .main-navbar-wrapper .navbar-nav .nav-link::after{content:"";position:absolute;bottom:0;left:14px;right:14px;height:3px;border-radius:3px 3px 0 0;background:var(--hy-o);transform:scaleX(0);transition:transform .15s;border:0;margin:0;vertical-align:0}
  header.header .main-navbar-wrapper .navbar-nav .nav-link:hover::after,
  header.header .main-navbar-wrapper .navbar-nav .show>.nav-link::after{transform:scaleX(1)}
  header.header .main-navbar-wrapper .dropdown-toggle::after{display:block}
}
header.header .main-navbar-wrapper .search .form-control{background:#fff}
.dropdown-menu{border:1px solid var(--hy-br);border-radius:var(--hy-r);box-shadow:var(--hy-shh);padding:6px}
.dropdown-item{border-radius:8px;color:var(--hy-t);padding:8px 14px}
.dropdown-item:hover,.dropdown-item:focus,.dropdown-item.active,.dropdown-item:active{background:var(--hy-bg);color:var(--hy-b)}
header.header .main-navbar-wrapper .dropdown-menu a{color:var(--hy-t)!important}

/* breadcrumb */
.master-breadcrumb{background:#fff;border-bottom:1px solid var(--hy-br)}
.master-breadcrumb .breadcrumb{padding:10px 0;font-size:.88rem}
.master-breadcrumb .breadcrumb-item.active{color:var(--hy-m)}

/* ---------- main body ---------- */
#main-body{padding:32px 0 48px}
.header-lined h1,.header-lined h2,#main-body h1{font-size:1.6rem}

/* cards */
.card{border:1px solid var(--hy-br);border-radius:var(--hy-r);box-shadow:var(--hy-sh)}
.card-header{background:#fff;border-bottom:1px solid var(--hy-br);color:var(--hy-n);font-weight:800;border-radius:var(--hy-r) var(--hy-r) 0 0!important}
.card-header .card-title,.card-title{color:var(--hy-n);font-weight:800}
.card-footer{background:#fff;border-top:1px solid var(--hy-br);border-radius:0 0 var(--hy-r) var(--hy-r)!important}
.card-accent-midnight-blue,.card-accent-blue,.card-accent-teal,.card-accent-green,.card-accent-emerald,.card-accent-red,.card-accent-pomegranate,.card-accent-sun-flower,.card-accent-asbestos,.card-accent-gold,.card-accent-orange{border-top-color:var(--hy-b)!important}

/* sidebar */
.sidebar .card-sidebar{overflow:hidden}
.sidebar .card-sidebar .card-header{background:#fff}
.sidebar .card-sidebar .panel-title,.sidebar .card-sidebar .card-title{font-size:15px;font-weight:800;color:var(--hy-n)}
.sidebar .card-sidebar .panel-title i,.sidebar .card-sidebar .card-title i{color:var(--hy-b)}
.sidebar .list-group-item{border-color:var(--hy-br);color:var(--hy-t);padding:9px 16px;transition:background .12s}
.sidebar .list-group-item:hover{background:var(--hy-bg);color:var(--hy-b)}
.sidebar .list-group-item.active,.sidebar .list-group-item.active:focus,.sidebar .list-group-item.active:hover{background:var(--hy-b);border-color:var(--hy-b);color:#fff}
.sidebar .list-group-item .badge{background:var(--hy-bg);color:var(--hy-n);border-radius:20px;font-weight:700}
.sidebar .list-group-item.active .badge{background:rgba(255,255,255,.2);color:#fff}

/* client home tiles */
.tiles{background:transparent}
.tiles .row{margin:0 -6px}
.tiles .row>[class*=col-]{padding:0 6px;margin-bottom:12px}
.tiles .tile{background:#fff;border:1px solid var(--hy-br)!important;border-radius:var(--hy-r);box-shadow:var(--hy-sh);padding:18px 20px 16px;height:100%}
.tiles .tile:hover{transform:translateY(-2px);box-shadow:var(--hy-shh);background:#fff}
.tiles .tile i{color:var(--hy-b);opacity:.18;font-size:2.4em;top:18px}
.tiles .tile .stat{color:var(--hy-n);font-weight:800;font-size:36px;margin-top:6px}
.tiles .tile .title{color:var(--hy-m);font-size:14px;text-transform:none;font-weight:700}
.tiles .tile .highlight{height:4px;border-radius:4px;width:42px;margin-top:10px}
.bg-color-blue{background-color:var(--hy-b)!important}
.bg-color-green{background-color:var(--hy-g)!important}
.bg-color-red{background-color:var(--hy-o)!important}
.bg-color-gold{background-color:var(--hy-n)!important}
.client-home-cards .card-header{font-weight:800}
.client-home-cards .card-header .btn{border-radius:8px}
.client-home-cards .list-group-item{border-color:var(--hy-br)}

/* buttons */
.btn{border-radius:10px;font-weight:700;transition:background-color .15s,border-color .15s,color .15s}
.btn-primary,.btn-info{background:var(--hy-b);border-color:var(--hy-b);color:#fff}
.btn-primary:hover,.btn-primary:focus,.btn-primary:not(:disabled):not(.disabled):active,
.btn-info:hover,.btn-info:focus{background:var(--hy-bd);border-color:var(--hy-bd);color:#fff}
.btn-success,.btn-warning{background:var(--hy-o);border-color:var(--hy-o);color:var(--hy-n)}
.btn-success:hover,.btn-success:focus,.btn-success:not(:disabled):not(.disabled):active,
.btn-warning:hover,.btn-warning:focus{background:var(--hy-od);border-color:var(--hy-od);color:var(--hy-n)}
.btn-default,.btn-light,.btn-secondary{background:#fff;border:1.5px solid var(--hy-br);color:var(--hy-n)}
.btn-default:hover,.btn-light:hover,.btn-secondary:hover{background:var(--hy-bg);border-color:#cfd9e6;color:var(--hy-b)}
.btn-outline-primary{border:1.5px solid var(--hy-b);color:var(--hy-b);background:#fff}
.btn-outline-primary:hover,.btn-outline-primary:focus{background:var(--hy-b);border-color:var(--hy-b);color:#fff}
.btn-danger{background:var(--hy-red);border-color:var(--hy-red)}
.btn:focus,.btn.focus{box-shadow:0 0 0 3px rgba(21,87,176,.2)}

/* forms */
.form-control,.custom-select{border-radius:10px;border-color:#cfd9e6;color:var(--hy-n);min-height:42px}
.form-control:focus,.custom-select:focus{border-color:var(--hy-b);box-shadow:0 0 0 3px rgba(21,87,176,.15)}
.input-group>.form-control:not(:last-child){border-radius:0}
label,.col-form-label{color:var(--hy-n);font-weight:700}
.custom-control-input:checked~.custom-control-label::before{background-color:var(--hy-b);border-color:var(--hy-b)}

/* tables */
.table thead th,table.dataTable thead th{background:var(--hy-bg);color:var(--hy-n);border-bottom:1px solid var(--hy-br)!important;font-weight:800}
.table td,.table th{border-color:var(--hy-br)}
.table-list tbody tr:hover td,.table-hover tbody tr:hover{background:#f8fbff}
.page-item.active .page-link{background:var(--hy-b);border-color:var(--hy-b)}
.page-link{color:var(--hy-b);border-color:var(--hy-br)}

/* alerts & badges */
.alert{border-radius:var(--hy-r);border-width:1px}
.alert-info{background:#eaf2fc;border-color:#cfe0f6;color:var(--hy-n)}
.alert-warning{background:#fff6ea;border-color:#fde2bd;color:#7a4a08}
.badge-info,.badge-primary{background:var(--hy-b)}
.label{border-radius:20px;padding:3px 10px;font-weight:700}

/* modals */
.modal-content{border:0;border-radius:16px;box-shadow:0 20px 60px rgba(11,42,85,.25)}
.modal-header{border-bottom:1px solid var(--hy-br)}
.modal-footer{border-top:1px solid var(--hy-br)}

/* ---------- homepage ---------- */
.home-domain-search{background:linear-gradient(135deg,var(--hy-n) 0%,var(--hy-b) 100%)!important;color:#fff}
.home-domain-search h2{color:#fff;font-size:2rem;font-weight:800}
.home-domain-search .input-group-wrapper{max-width:820px;margin:24px auto 8px}
.home-domain-search .input-group{background:#fff;border-radius:14px;padding:6px;box-shadow:0 12px 40px rgba(0,0,0,.18)}
.home-domain-search .form-control{border:0!important;box-shadow:none!important;font-size:18px;min-height:52px;direction:ltr;text-align:left;background:transparent}
.home-domain-search .btn{min-height:52px;padding:0 26px;font-size:16px;border-radius:10px!important;margin-inline-start:6px}
.home-domain-search .btn-primary{background:var(--hy-o);border-color:var(--hy-o);color:var(--hy-n)}
.home-domain-search .btn-primary:hover{background:var(--hy-od);border-color:var(--hy-od);color:var(--hy-n)}
.home-domain-search .btn-success{background:#fff;border:1.5px solid var(--hy-br);color:var(--hy-n)}
.home-domain-search .btn-success:hover{background:var(--hy-bg);color:var(--hy-b)}
.home-domain-search .tld-logos{color:rgba(255,255,255,.85)}
.home-domain-search .tld-logos li{color:#fff}
.home-domain-search a{color:#fff;text-decoration:underline}
.card-columns.home .card{transition:transform .15s,box-shadow .15s}
.card-columns.home .card:hover{transform:translateY(-3px);box-shadow:var(--hy-shh)}
.pricing-card-title{color:var(--hy-n);font-weight:800;font-size:1.25rem}
.action-icon-btns a{background:#fff;border:1px solid var(--hy-br);border-radius:var(--hy-r);color:var(--hy-n);font-weight:700;box-shadow:var(--hy-sh)}
.action-icon-btns a:hover{color:var(--hy-b);box-shadow:var(--hy-shh);transform:translateY(-2px)}
.action-icon-btns a .ico-container i{color:var(--hy-b)}
.action-icon-btns a:hover .ico-container i{color:var(--hy-o)}

/* ---------- login ---------- */
.login-form,.logincontainer{max-width:480px;margin:0 auto}
.login-form .card,.logincontainer .card{border-radius:16px;box-shadow:var(--hy-shh)}

/* ---------- footer ---------- */
footer.footer{background:var(--hy-n);color:#c9d4e5;padding:44px 0 56px;border-top:4px solid var(--hy-o)}
footer.footer .nav-link{color:#fff;font-weight:500}
footer.footer .nav-link:hover{color:var(--hy-o)}
footer.footer .btn{background:rgba(255,255,255,.1);color:#fff;border-radius:8px}
footer.footer .btn:hover{background:rgba(255,255,255,.18)}
footer.footer .copyright{color:#9fb0c8}

/* ---------- misc ---------- */
.hy-sar{display:inline-block;width:.85em;height:1em;vertical-align:-.1em;fill:currentColor;margin-inline:2px}
#se-wa{z-index:1030}
@media (max-width:1199px){
  header.header .main-navbar-wrapper .navbar-collapse{padding:10px 1rem 14px}
  header.header .main-navbar-wrapper .navbar-nav .nav-link{padding:10px 6px;border-bottom:1px solid rgba(255,255,255,.08)}
}
@media (max-width:575px){
  .home-domain-search h2{font-size:1.4rem}
  .home-domain-search .p-5{padding:28px 16px!important}
  #main-body{padding:20px 0 32px}
}