/*
Theme Name: Nestnet Child
Theme URI: http://demo.bravisthemes.com/nestnet
Author: Bravis-Themes
Author URI: https://themeforest.net/user/bravis-themes
Description: Nestnet is WordPress Theme specially for broadband, business, clean, corporate, dial-up, elegant, internet, modern, networking, telephone, tv, wifi. This WordPress Theme comes with fully layered & easily editable WordPress Artboards that are well-organized in layers & groups.
Version: 1.0.1
License: ThemeForest
License URI: https://themeforest.net/licenses
Template: nestnet
Text Domain: nestnet-child
Tags:cable, channel, connection, internet, iptv, modern, online, provider, responsive, satellite, services, technology, tv 
*/

:root {
  --main-color: #d80909;
  --second-color: #a40013;
  --trd-color: #a00000;
  --heading-color: #161c2d;
  --para-color: #869ab8;
  --border-color: #f1f4f8;
  --bg-color: #a0000f1a;
  --footer-links: #dddddd;
  --white: #ffffff;
}

.pxl-logo img {
  height: 85px;
}

.pxl-logo {
  padding: 15px 0;
}

/*--------------- # Collapsible Content # ---------------*/
.fixed-tabs {
  position: fixed;
  top: 50%;
  right: 0;
  z-index: 9999;
  transform: translateY(-50%);
}

.fixed-tabs ul {
  list-style: none;
  margin: 0;
  border-radius: 20px 0 0 20px;
  overflow: hidden;
}

.fixed-tabs li {
  width: auto;
  padding: 18px 12px;
  background: var(--main-color);
  color: #fff;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  transition: 0.4s ease all;
  user-select: none;
  min-width: 100px;
}

.fixed-tabs li a {
  color: #fff;
}

.fixed-tabs li:hover {
  background: var(--second-color);
  /* transform: translateX(-6px); */
}

.fixed-tabs li.active {
  background: var(--trd-color);
  /* transform: translateX(-8px) scale(1.02); */
  box-shadow: -8px 0 18px rgba(37, 99, 235, 0.3);
}

.tab-panel {
  position: fixed;
  top: 50%;
  right: 95px;
  min-width: 320px;
  max-width: 420px;
  width: max-content;
  background: #fff;
  border-radius: 22px 0 0 22px;
  padding: 28px;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.18);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform-origin: right center;
  transform: perspective(1200px) rotateY(-14deg) translateX(140px) translateY(-50%) scale(0.82);
  transition: 0.45s ease all;
  z-index: 9998;
  overflow: hidden;
}

/* OPEN EFFECT */
.tab-panel.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: perspective(1200px) rotateY(0) translateX(0) translateY(-50%) scale(1);
}

/* CLOSE EFFECT */
.tab-panel.closing {
  opacity: 0;
  transform: perspective(1200px) rotateY(-18deg) translateX(180px) scale(0.74);
}

.panel-inner {
  opacity: 0;
  transform: translateY(18px);
  transition: 0.45s ease all;
}

.tab-panel.active .panel-inner {
  opacity: 1;
  transform: translateY(0);
}

.close-tab {
  position: absolute;
  top: 10px;
  right: 16px;
  width: 34px;
  height: 34px;
  line-height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  cursor: pointer;
  color: #fff;
  transition: 0.4s ease all;
  background: #d80909;
  z-index: 11;
}

.close-tab:hover {
  background: #a40013;
  color: #fff;
  transform: rotate(90deg) scale(1.08);
}

.panel-title {
  color: #0d3b8e;
  margin-bottom: 20px;
  font-size: 28px;
}

.panel-content p {
  color: #555;
  line-height: 1.6;
  margin-bottom: 0px;
}

.panel-content input {
  width: 100%;
  padding: 14px 16px;
  border-radius: 40px;
  border: 1px solid #ddd;
  margin-bottom: 0px;
  outline: none;
  transition: 0.4s ease all;
}

.panel-content input:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12);
}

.panel-content button {
  width: 100%;
  padding: 14px;
  border: none;
  border-radius: 40px;
  background: #0d3b8e;
  color: #fff;
  font-weight: bold;
  cursor: pointer;
  transition: 0.4s ease all;
}

.panel-content button:hover {
  background: #2563eb;
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(37, 99, 235, 0.25);
}

.panel-content input[type="submit"] {
  margin: 0;
}

.fixed-tabs li i {
  width: 44px;
  height: 44px;
  line-height: 44px;
  background: #fff;
  color: red;
  border-radius: 50%;
  font-size: 24px;
}

.fixed-tabs li span {
  display: block;
}

/*--------------- # Collapsible Content Ends # ---------------*/

.plan_select select {
  background: #fff;
  height: auto;
}