/* =====================================================================
   Freshspot Hosting - WHMCS "Twenty-One" theme skin
   File: templates/twenty-one/css/custom.css  (WHMCS loads it automatically
   and does not overwrite it on updates). Delete this file to undo.
   ===================================================================== */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");

:root{
  --ch-blue:#5a8a0f; --ch-blue-d:#476f0a; --ch-blue-soft:#eef6dd;
  --ch-orange:#94c120; --ch-orange-d:#82ab14;
  --ch-ink:#1d2a17; --ch-text:#2d3328; --ch-muted:#6b7266;
  --ch-line:#e4e8de; --ch-bg:#f6f8f3; --ch-radius:14px;
}

/* ---------- base ---------- */
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ch-text);background:var(--ch-bg);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4{color:var(--ch-ink);font-weight:700;letter-spacing:-.01em}
a{color:var(--ch-blue)}
a:hover{color:var(--ch-blue-d)}
section#main-body{padding-top:36px;padding-bottom:56px}
.primary-content h1,.header-lined h1{font-size:2rem;line-height:1.2}

/* ---------- header ---------- */
#header.header,.header{background:#fff;border-bottom:1px solid var(--ch-line);box-shadow:0 6px 24px -20px rgba(29,42,23,.35)}
.header .logo-img{max-height:56px}
.header .topbar{background:var(--ch-ink)}
.main-navbar-wrapper{border-top:1px solid var(--ch-line)}
.main-navbar-wrapper .navbar-nav .nav-link{color:var(--ch-text)!important;font-weight:500;padding:.9rem 1rem!important;position:relative}
.main-navbar-wrapper .navbar-nav .nav-link:hover,
.main-navbar-wrapper .navbar-nav .active>.nav-link{color:var(--ch-blue)!important}
.main-navbar-wrapper .navbar-nav>li>.nav-link:after{content:"";position:absolute;left:1rem;right:1rem;bottom:.45rem;height:2px;background:var(--ch-orange);transform:scaleX(0);transition:transform .2s}
.main-navbar-wrapper .navbar-nav>li>.nav-link:hover:after{transform:scaleX(1)}
.dropdown-menu{border:1px solid var(--ch-line);border-radius:12px;box-shadow:0 18px 40px -18px rgba(29,42,23,.35);padding:.5rem}
.dropdown-item{border-radius:8px;padding:.5rem .8rem}
.dropdown-item:hover,.dropdown-item:focus{background:var(--ch-blue-soft);color:var(--ch-blue)}
.header .search .form-control,.header .input-group .form-control{border-radius:999px 0 0 999px;border-color:var(--ch-line);background:var(--ch-bg)}
.header .search .input-group-prepend .btn,.header .input-group-prepend .btn{border-radius:999px 0 0 999px;background:var(--ch-bg);border-color:var(--ch-line)}
.header .cart-btn .badge,.badge-info{background:var(--ch-orange)!important;color:#1d2a17!important}

/* ---------- breadcrumb ---------- */
.master-breadcrumb{background:linear-gradient(90deg,var(--ch-ink),#3e5f12);border:0}
.master-breadcrumb .breadcrumb{background:transparent;padding:14px 0;margin:0}
.master-breadcrumb .breadcrumb-item,.master-breadcrumb .breadcrumb-item a{color:#cdd5c6}
.master-breadcrumb .breadcrumb-item.active{color:#fff}
.master-breadcrumb .breadcrumb-item+.breadcrumb-item:before{color:#84907c}

/* ---------- buttons ---------- */
.btn{border-radius:10px;font-weight:600;transition:transform .15s,box-shadow .15s,background .15s}
.btn:hover{transform:translateY(-1px)}
.btn-primary,.btn-info{background:var(--ch-blue);border-color:var(--ch-blue)}
.btn-primary:hover,.btn-primary:focus,.btn-info:hover,.btn-info:focus,
.btn-primary:not(:disabled):not(.disabled):active{background:var(--ch-blue-d);border-color:var(--ch-blue-d);box-shadow:0 10px 20px -12px rgba(90,138,15,.8)}
.btn-success,.btn-order-now,#order-standard_cart .btn-checkout{background:var(--ch-orange)!important;border-color:var(--ch-orange)!important;color:#1d2a17!important}
.btn-success:hover,.btn-success:focus,.btn-order-now:hover,#order-standard_cart .btn-checkout:hover{background:var(--ch-orange-d)!important;border-color:var(--ch-orange-d)!important;box-shadow:0 10px 20px -12px rgba(148,193,32,.8)}
.btn-default,.btn-light,.btn-outline-secondary{background:#fff;border:1px solid var(--ch-line);color:var(--ch-ink)}
.btn-default:hover,.btn-light:hover,.btn-outline-secondary:hover{background:var(--ch-blue-soft);color:var(--ch-blue);border-color:#d6e8b0}

/* ---------- cards & sidebar ---------- */
.card{border:1px solid var(--ch-line);border-radius:var(--ch-radius);box-shadow:0 14px 34px -28px rgba(29,42,23,.45);overflow:hidden}
.card-header{background:#fff;border-bottom:1px solid var(--ch-line)}
.card-sidebar .card-header,.sidebar .card-header{background:#fff;padding:14px 18px}
.card-sidebar .card-title,.sidebar .card-title{font-size:1.02rem;font-weight:600;color:var(--ch-ink)}
.card-sidebar .card-title i,.sidebar .card-title i{color:var(--ch-blue)}
.list-group-item{border-color:var(--ch-line);color:var(--ch-text);padding:.7rem 1.1rem}
.list-group-item-action:hover{background:var(--ch-blue-soft);color:var(--ch-blue)}
.list-group-item.active,.list-group-item.active:hover{background:var(--ch-blue)!important;border-color:var(--ch-blue)!important;color:#fff!important;box-shadow:inset 4px 0 0 var(--ch-orange)}
.form-control,.custom-select{border-radius:10px;border-color:#d9dfd2}
.form-control:focus,.custom-select:focus{border-color:var(--ch-blue);box-shadow:0 0 0 .2rem rgba(90,138,15,.15)}

/* ---------- store: product listing (standard_cart) ---------- */
#order-standard_cart .header-lined h1{font-size:2rem}
#order-standard_cart .header-lined p{color:var(--ch-muted);font-size:1.05rem}
#order-standard_cart .products .product{position:relative;background:#fff;border:1px solid var(--ch-line);border-radius:18px;padding:0;margin-bottom:24px;overflow:hidden;box-shadow:0 18px 40px -32px rgba(29,42,23,.5);transition:transform .2s,box-shadow .2s,border-color .2s}
#order-standard_cart .products .product:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--ch-blue),#94c120 70%,var(--ch-orange))}
#order-standard_cart .products .product:hover{transform:translateY(-4px);border-color:#d6e8b0;box-shadow:0 28px 54px -34px rgba(29,42,23,.55)}
#order-standard_cart .products .product header{background:#fff;border-bottom:1px solid var(--ch-line);padding:22px 24px 16px}
#order-standard_cart .products .product header span{font-size:1.3rem;font-weight:700;color:var(--ch-ink)}
#order-standard_cart .products .product div.product-desc{padding:18px 24px;font-size:.92rem;line-height:1.9;color:var(--ch-text)}
#order-standard_cart .products .product div.product-desc ul{list-style:none;padding:0;margin:0}
#order-standard_cart .products .product div.product-desc li{position:relative;padding-left:24px}
#order-standard_cart .products .product div.product-desc li:before{content:"";position:absolute;left:2px;top:.55em;width:12px;height:7px;border:solid var(--ch-blue);border-width:0 0 2px 2px;transform:rotate(-45deg)}
#order-standard_cart .products .product footer{padding:18px 24px 24px}
#order-standard_cart .products .product .product-pricing{color:var(--ch-muted);font-size:.9rem}
#order-standard_cart .products .product .product-pricing .price{display:block;font-size:2rem;font-weight:700;color:var(--ch-blue);letter-spacing:-.02em;line-height:1.1}
#order-standard_cart .products .product .btn-order-now{display:inline-block;padding:.7rem 1.4rem;border-radius:999px;font-size:.95rem;margin-top:10px}
#order-standard_cart .products .product .btn-order-now i{margin-right:4px}
#order-standard_cart .products .product .product-desc .feature-value{color:var(--ch-ink);font-weight:600}

/* cart / checkout */
#order-standard_cart .view-cart-items-header{background:var(--ch-ink);border-radius:12px 12px 0 0}
#order-standard_cart .order-summary{background:var(--ch-ink);border-radius:var(--ch-radius);border:0}
#order-standard_cart .order-summary h2{color:#fff}
#order-standard_cart .summary-container{border-radius:0 0 var(--ch-radius) var(--ch-radius)}
#order-standard_cart .total-due-today .amt,#order-standard_cart .order-summary .total-due-today .amt{color:var(--ch-blue)}
#order-standard_cart .sub-heading span{background:var(--ch-bg);color:var(--ch-ink);font-weight:600}
#order-standard_cart .domain-checker-container{background:linear-gradient(120deg,var(--ch-ink),var(--ch-blue));border-radius:var(--ch-radius)}
#order-standard_cart .domain-checker-bg{background-image:none}

/* ---------- client area ---------- */
.tiles .tile{border-radius:var(--ch-radius);border:1px solid var(--ch-line);background:#fff}
.tiles .tile .stat{color:var(--ch-ink);font-weight:700}
.tiles .tile i{color:var(--ch-blue)!important;opacity:.18}
.tiles .tile .highlight{background:var(--ch-blue)!important}
.tiles .tile:nth-child(2) .highlight{background:var(--ch-orange)!important}
.table thead th,.table-list thead th{background:var(--ch-bg);color:var(--ch-ink);border-bottom:1px solid var(--ch-line)}
.label-success,.badge-success,.status-active,.status-paid{background:#1f9d6b!important}
.label-warning,.badge-warning,.status-unpaid,.status-pending{background:#e8a317!important;color:#1d2a17!important}
.alert{border-radius:12px}
.alert-info{background:var(--ch-blue-soft);border-color:#d6e8b0;color:#3f600b}

/* ---------- home page panels ---------- */
/* domain search banner */
.home-domain-search{background:linear-gradient(120deg,var(--ch-ink),var(--ch-blue))!important;border-radius:0!important}
.home-domain-search h1,.home-domain-search h2,.home-domain-search h3,.home-domain-search .h2{color:#fff!important;font-weight:700;margin-bottom:22px}
.home-domain-search .input-group-wrapper{background:#fff;border-radius:16px!important;overflow:visible!important;padding:10px 12px;box-shadow:0 24px 50px -24px rgba(0,0,0,.55)}
.home-domain-search .input-group-wrapper .form-control,
.home-domain-search textarea,.home-domain-search input[type=text]{border:0!important;box-shadow:none!important;background:transparent!important;padding:10px 12px!important;color:var(--ch-ink);font-size:1rem;line-height:1.5;border-radius:12px!important;min-height:0;resize:none}
.home-domain-search .input-group-wrapper .form-control::placeholder,
.home-domain-search textarea::placeholder{color:#858c80}
.home-domain-search .input-group-wrapper .btn{border-radius:10px!important;padding:.6rem 1.2rem}
.home-domain-search .input-group-wrapper .btn+.btn{margin-left:8px}
/* filter row (TLDs, length, safe search) under the box */
.home-domain-search .dropdown-toggle,.home-domain-search .btn-link,.home-domain-search label,
.home-domain-search .form-check-label,.home-domain-search .custom-control-label{color:#e6ecdf!important}
.home-domain-search .dropdown-menu .dropdown-item,.home-domain-search .dropdown-menu label{color:var(--ch-text)!important}
.home-domain-search .input-group-wrapper .dropdown-toggle,.home-domain-search .input-group-wrapper label,
.home-domain-search .input-group-wrapper .form-check-label,.home-domain-search .input-group-wrapper .custom-control-label{color:var(--ch-ink)!important}
/* prices and links */
.home-domain-search .tld-logos li,.home-domain-search .tld-logos span,.home-domain-search .tld-pricing,
.home-domain-search .price,.home-domain-search p{color:#fff!important}
.home-domain-search .tld-logos img{filter:brightness(0) invert(1);opacity:.95}
.home-domain-search a.btn-link,.home-domain-search a:not(.btn){color:#fff!important;opacity:.9;text-decoration:underline;text-underline-offset:3px}
.home-domain-search a:not(.btn):hover{opacity:1}
.action-icon-btns a{border-radius:var(--ch-radius);border:1px solid var(--ch-line);background:#fff;color:var(--ch-ink);transition:transform .2s,box-shadow .2s}
.action-icon-btns a:hover{transform:translateY(-3px);box-shadow:0 20px 40px -28px rgba(29,42,23,.6);color:var(--ch-blue)}
.action-icon-btns .ico-container{background:var(--ch-blue-soft)!important;color:var(--ch-blue)!important;border-radius:14px}
.action-icon-btns a[menuitemname="Buy A Domain"] .ico-container,
.action-icon-btns a:nth-child(2) .ico-container{background:#f1f8e1!important;color:var(--ch-orange)!important}

/* ---------- footer ---------- */
#footer.footer,.footer{background:var(--ch-ink);color:#bcc6b5;padding:40px 0 30px;border-top:4px solid;border-image:linear-gradient(90deg,var(--ch-blue),var(--ch-orange)) 1}
.footer a,.footer .nav-link{color:#d8dfd2}
.footer a:hover{color:#fff}
.footer .copyright{color:#96a28e;font-size:.88rem}
.footer .btn{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:#fff}

/* ---------- small screens ---------- */
@media (max-width:767px){
  .primary-content h1,#order-standard_cart .header-lined h1{font-size:1.55rem}
  #order-standard_cart .products .product footer{text-align:left}
}