/* PandaHosting skin for the WHMCS "Twenty-One" client theme.
   Upload to: /clients/templates/twenty-one/css/custom.css */
@import url("https://fonts.googleapis.com/css2?family=Unbounded:wght@500;700&family=Onest:wght@400;500;600&display=swap");

:root{
  --p-bg:#f2f6f0; --p-surface:#ffffff; --p-ink:#131c16; --p-muted:#56635a; --p-line:#d7dfd6;
  --p-accent:#1f9d55; --p-accent-ink:#0c6a35; --p-accent-soft:#dcf1e2; --p-on-accent:#ffffff;
}
@media (prefers-color-scheme: dark){
  :root{
    --p-bg:#0d1410; --p-surface:#151e18; --p-ink:#eaf2ec; --p-muted:#9aa99f; --p-line:#27332b;
    --p-accent:#3ecf7a; --p-accent-ink:#62e296; --p-accent-soft:#16301f; --p-on-accent:#06210f;
    color-scheme:dark;
  }
}

body,section#main-body{background:var(--p-bg)!important;color:var(--p-ink);font-family:"Onest","Open Sans",system-ui,sans-serif;font-size:15px}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.navbar-brand,.card-title{font-family:"Unbounded","Trebuchet MS",sans-serif;color:var(--p-ink);letter-spacing:-.01em}
h1,.h1{font-size:1.7rem;font-weight:700} h2,.h2{font-size:1.4rem;font-weight:700} h3,.h3{font-size:1.1rem} h4,h5,h6,.card-title{font-size:1rem}
p,label,li,td,th,small,.text-muted,span{color:inherit}
.text-muted,small.text-muted,.form-text{color:var(--p-muted)!important}
a{color:var(--p-accent-ink)} a:hover{color:var(--p-accent)}

/* header and navigation */
header.header,header.header .navbar,header.header .topbar,.main-navbar-wrapper,.master-breadcrumb{background:var(--p-bg)!important;color:var(--p-ink)}
header.header{border-bottom:1px solid var(--p-line)}
header.header .navbar-brand{font-weight:700;color:var(--p-ink)!important}
header.header .logo-img{max-height:42px}
header.header .navbar a,header.header .nav-link,header.header .topbar a,.master-breadcrumb,.master-breadcrumb a,.breadcrumb-item,.breadcrumb-item.active{color:var(--p-muted)!important}
header.header .nav-link:hover,header.header .navbar a:hover{color:var(--p-ink)!important}
header.header .btn,header.header .cart-btn{background:var(--p-surface);border:1px solid var(--p-line);color:var(--p-ink)!important;border-radius:999px}
.breadcrumb{background:transparent}
.navbar-toggler{color:var(--p-ink);border-color:var(--p-line)}

/* surfaces */
.card,.panel,.list-group-item,.dropdown-menu,.modal-content,.popover,.well,.jumbotron,.table,.bg-white,.bg-light,
.sidebar .card,.order-summary,.view-cart-items,.product,.products .product,.domain-checker-container,.secondary-cart-body .sub-heading span{background-color:var(--p-surface)!important;color:var(--p-ink);border-color:var(--p-line)!important}
.card,.panel,.modal-content,.dropdown-menu{border-radius:14px}
.card-header,.card-footer,.panel-heading,.modal-header,.modal-footer,.table thead th,.view-cart-items-header,.order-summary h2,.products .product header{background-color:var(--p-accent-soft)!important;color:var(--p-ink)!important;border-color:var(--p-line)!important}
.table td,.table th,hr,.sub-heading{border-color:var(--p-line)!important}
.table-striped tbody tr:nth-of-type(odd){background-color:transparent}
.dropdown-item{color:var(--p-ink)} .dropdown-item:hover,.list-group-item-action:hover{background:var(--p-accent-soft)!important;color:var(--p-ink)}
.list-group-item.active{background:var(--p-accent)!important;border-color:var(--p-accent)!important;color:var(--p-on-accent)!important}

/* forms */
.form-control,.custom-select,select,textarea,.input-group-text,.field{background-color:var(--p-surface)!important;color:var(--p-ink)!important;border-color:var(--p-line)!important;border-radius:10px}
.form-control:focus,.custom-select:focus{border-color:var(--p-accent)!important;box-shadow:0 0 0 3px var(--p-accent-soft)!important}
.form-control::placeholder{color:var(--p-muted)}

/* buttons */
.btn{border-radius:999px;font-weight:600}
.btn-primary,.btn-success,.btn-info,.btn-checkout,.badge-primary,.badge-info,.bg-primary{background-color:var(--p-accent)!important;border-color:var(--p-accent)!important;color:var(--p-on-accent)!important}
.btn-primary:hover,.btn-success:hover,.btn-info:hover{filter:brightness(1.08)}
.btn-default,.btn-secondary,.btn-light,.btn-outline-primary,.btn-outline-secondary{background:transparent!important;border:1.5px solid var(--p-line)!important;color:var(--p-ink)!important}
.btn-default:hover,.btn-outline-primary:hover{border-color:var(--p-ink)!important}
.btn-link{color:var(--p-accent-ink)}
.text-primary{color:var(--p-accent-ink)!important}
.alert{border-radius:12px}
.alert-info,.alert-success{background:var(--p-accent-soft);border-color:var(--p-line);color:var(--p-ink)}

/* home tiles, store and cart */
.home-domain-search,.home-domain-search.bg-white,#home-banner{background:var(--p-bg)!important}
.card-accent-blue,.card-accent-teal,.card-accent-green,.card-accent-gold,.card-accent-red,.card-accent-midnight-blue,.card-accent-pomegranate,.card-accent-asbestos{border-top:3px solid var(--p-accent)!important}
.action-icon-btns a,.tiles .tile{background:var(--p-surface)!important;color:var(--p-ink)!important;border:1px solid var(--p-line);border-radius:14px}
.tiles .tile .stat,.tiles .tile i,.action-icon-btns a .ico-container{color:var(--p-accent-ink)!important}
.tiles .tile .highlight{background:var(--p-accent)!important}
#order-standard_cart .products .product header span,#order-standard_cart .products .product div.product-pricing span.price,.order-summary .total-due-today .amt{color:var(--p-ink)}
#order-standard_cart .order-summary{border-bottom:3px solid var(--p-accent)}
#order-standard_cart .order-summary .summary-container,#order-standard_cart .view-cart-items{background:var(--p-surface)}

/* footer */
footer.footer,#footer{background:var(--p-bg)!important;color:var(--p-muted)!important;border-top:1px solid var(--p-line)}
footer.footer a,footer.footer .nav-link,footer.footer .copyright{color:var(--p-muted)!important}
footer.footer .btn{border:1px solid var(--p-line);color:var(--p-ink)!important}

/* store, cart and domain search fixes */
.input-group-wrapper,.domain-selection-options .option,#order-standard_cart .domain-selection-options .option,.multiselect-container,#order-standard_cart .panel-addon,#order-standard_cart .order-summary,#order-standard_cart .summary-container,#order-standard_cart .product-info,#order-standard_cart .view-cart-items .item,#order-standard_cart .view-cart-tabs .tab-content,#order-standard_cart .view-cart-tabs .nav-tabs .nav-link.active,#order-standard_cart .account-select-container div.account,#order-standard_cart .payment-methods,.select-inline,.intl-tel-input .country-list{background:var(--p-surface)!important;border-color:var(--p-line)!important;color:var(--p-ink)!important}
#order-standard_cart .products .product header span,#order-standard_cart .products .product header,#order-standard_cart .order-summary h2,#order-standard_cart .order-summary .product-name,#order-standard_cart .order-summary .total-due-today span,#order-standard_cart .sub-heading span,#order-standard_cart .product-info .product-title,#order-standard_cart .view-cart-items .item-title,.domain-selection-options label{color:var(--p-ink)!important}
#order-standard_cart .sub-heading span,#order-standard_cart .sub-heading-borderless span{background:var(--p-bg)!important}
#order-standard_cart .products .product{border-radius:14px;overflow:hidden}
#order-standard_cart .products .product div.product-desc,#order-standard_cart .order-summary .clearfix,#order-standard_cart .order-summary .summary-totals{color:var(--p-ink);border-color:var(--p-line)!important}
.btn.multiselect,.multiselect-container label{color:var(--p-ink)!important}
[class*="card-accent-"]{border-top:3px solid var(--p-accent)!important}
#order-standard_cart .order-summary{border-color:var(--p-line)!important}

/* panda logo beside the company name */
header.header .navbar-brand{display:inline-flex;align-items:center;gap:10px;font-size:1.05rem;color:var(--p-ink)!important}
header.header .navbar-brand::before{content:"";width:40px;height:40px;flex:none;background:url(/assets/favicon.svg) center/contain no-repeat}
