@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');

:root {
    --g1: hsl(350, 80%, 55%);
    --g2: hsl(270, 60%, 50%);
    --g3: hsl(220, 70%, 50%);
    --gradient: linear-gradient(135deg, #de0b16, #030eb7);
    --gradient-hover: linear-gradient(135deg, hsl(350, 80%, 48%), hsl(270, 60%, 43%), hsl(220, 70%, 43%));
    --bg: #f7f7fc;
    --card: #ffffff;
    --border: #e4e2f0;
    --text: #1a1730;
    --muted: #6b6882;
    --radius: 16px;
    --shadow: 0 4px 24px rgba(100, 80, 180, 0.10);
    --shadow-lg: 0 8px 40px rgba(100, 80, 180, 0.16);
    --font: 'Plus Jakarta Sans', sans-serif;
}

.pstcode-wrapper {
  font-family: var(--font);
  background-color: var(--bg);
  color: var(--text);
  line-height: 1.6;
}

.pstcode-mono {
  font-family: var(--font) !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
}

.pstcode-hero-gradient {
  background: var(--gradient);
  color: #fff;
}

.pstcode-text-primary {
  color: var(--g2) !important;
}

.pstcode-text-destructive {
  color: var(--g1) !important;
}

.pstcode-text-muted {
  color: var(--muted) !important;
}

.pstcode-card {
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background-color: var(--card);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.pstcode-bg-primary-light {
  background-color: rgba(100, 80, 180, 0.05);
  border: 1px solid rgba(100, 80, 180, 0.2);
}

.pstcode-bg-destructive-light {
  background-color: rgba(222, 11, 22, 0.05);
  border: 1px solid rgba(222, 11, 22, 0.3);
}

.pstcode-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 9999px;
  padding: 0.25rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  border: 1px solid transparent;
}
.pstcode-badge-secondary {
  background-color: #f1f5f9;
  color: #0f172a;
}
.pstcode-badge-outline {
  border-color: var(--border);
  color: var(--text);
}
.pstcode-badge-destructive {
  background-color: var(--g1);
  color: #fff;
}

.pstcode-input-icon-wrapper {
  position: relative;
}
.pstcode-input-icon-wrapper svg {
  position: absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--muted);
}
.pstcode-input-with-icon {
  padding-left: 2.75rem !important;
}

.pstcode-accordion {
  border-bottom: 1px solid var(--border);
}
.pstcode-accordion-item {
  border-bottom: 1px solid var(--border);
}
.pstcode-accordion-item:last-child {
  border-bottom: none;
}
.pstcode-accordion-trigger {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 0;
  font-weight: 600;
  cursor: pointer;
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  color: var(--text);
}
.pstcode-accordion-trigger:hover {
  color: var(--g2);
}
.pstcode-accordion-content {
  overflow: hidden;
  font-size: 0.875rem;
  display: none;
  padding-bottom: 1rem;
}
.pstcode-accordion-content.open {
  display: block;
  animation: pstcode-slideDown 0.2s ease-out forwards;
}

@keyframes pstcode-slideDown {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

.pstcode-table-wrapper {
  width: 100%;
  overflow-x: auto;
}

.lucide {
  color: currentColor;
}


@media(min-width:1180px){
  .pstcode-wrapper .container{
    width: 1050px;
    max-width: 1050px;
  }
}

.pstcode-wrapper{
  padding-top:100px;
}

.pstcode-wrapper .container{ 
  margin: 0 auto;
  padding-left: 15px;
  padding-right: 15px;
}

.pstcode-wrapper #pstcode-popular-cities .btn{
  border-radius: 20px;
  padding: 2px 8px;
}

.pstcode-wrapper #pstcode-popular-cities .btn,
.pstcode-wrapper #pstcode-popular-cities .btn *{
  font-size: 15px !important;
}

.pstcode-wrapper #pstcode-popular-cities .btn:hover{
  background-image: linear-gradient(120deg, #de0b16, #1038a8);
}

.pstcode-wrapper #pstcode-popular-cities .btn:hover,
.pstcode-wrapper #pstcode-popular-cities .btn:hover span{
  color:#FFF !important;
}

.pstcode-wrapper .coaching-details{
  padding-top:0px;
}

.pstcode-wrapper small, .pstcode-wrapper .small,
.pstcode-text-muted,
.pstcode-wrapper .btn-group-sm>.btn, .pstcode-wrapper .btn-sm,
.table>:not(caption)>*>*{
  color:inherit !important;
  font-size:inherit !important; 
  
  font-size: var(--rr-fs-p) !important;
  font-weight: var(--rr-fw-normal) !important;
  color: var(--rr-text-body) !important;
  line-height: var(--rr-lh-p) !important;
}

.pstcode-wrapper .fw-medium{
  font-weight:600 !important;
}

.pstcode-wrapper main h2, .pstcode-wrapper main h3{
  font-size: 24px !important;
  font-weight: 800 !important;
  color: var(--text); 
}

.pstcode-wrapper main .pstcode-card h2, .pstcode-wrapper main .pstcode-card h3{
  font-size: 20px !important;
}

.pstcode-wrapper table tr:last-child,
.pstcode-wrapper table tr:last-child *{
  border-bottom:0px !important;
}

.pstcode-wrapper .pstcode-badge{
  font-size: var(--rr-fs-p) !important;
  transform: scale(0.85);
}

#pstcode-result-content .pstcode-mono,
.pstcode-wrapper .pstcode-mono.tracking-widest *{
  font-size: 35px !important; 
  font-weight:600 !important;
}

.pstcode-accordion-item{
  border:1px #DDD solid !important;
  background:#FFF !important;
}

.pstcode-badge-secondary,
.pstcode-badge-outline {
  background:#eff4ff;
  color: var(--text);
}

.postal-infra svg{
  width: 40px !important;
  height: 40px !important;
}

.postal-infra .fs-2{
  padding-top:15px;
  font-size: 30px !important;
  font-weight: 800 !important; 
}

.postal-infra .pstcode-card{
  margin:0px !important;
}

.postal-infra .pstcode-text-muted{
  margin-bottom: 0px !important;
}

.pstcode-input-icon-wrapper input,
#pstcode-finder select{
  font-size: var(--rr-fs-p) !important;
  font-weight: var(--rr-fw-normal) !important;
  color: var(--rr-text-body) !important;
  line-height: var(--rr-lh-p) !important;
  padding: 10px 12px;
  border-radius: 25px;
  height: auto !important;
  border: 1px solid rgba(0, 29, 8, 0.1) !important;
}

.pstcode-input-icon-wrapper input{
  width:calc(100% - 25px) !important;
}

.pstcode-wrapper .doc-link {
  list-style: none;
  padding-left: 0 !important;
}

.pstcode-wrapper .doc-link li {
  margin-bottom: 10px;
}

.pstcode-wrapper .doc-link li a {
  position: relative;
  padding-left: 28px;
  display: inline-block;
  text-decoration: none;
}

.pstcode-wrapper .doc-link li a::before { 
  content: "\f15c";
  font-family: "Font Awesome 6 Pro" !important;
  font-weight: 700;
  padding-left: 5px;
  font-size: 16px;
  color: #c5151e;
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 2px;
}

.pstcode-wrapper .doc-link li a::after{
  display:none !important;
}

.pstcode-wrapper .doc-link li br{
  display:none;
}

.pstcode-wrapper .doc-link ul{
  padding-left:0px !important;
}

.bg-destructive-5{
  background: #ef44440d;
  border-color: #ef44444d;
} 

.bg-destructive-5 .pstcode-text-destructive{
  color:#ef4444 !important;
}

.bg-destructive-5 .pstcode-mono{
  font-size:18px !important;
  font-weight:400;
}

.add_formatting .bg-light{
  background:#f1f5f9 !important;
}

.add_formatting .rounded-lg p{
  margin:0px;
}

.add_formatting .rounded-lg,
.bg-destructive-5 .rounded-lg{
  border-radius:15px;
}

@media(max-width:768px){
  .pstcode-wrapper main h2, .pstcode-wrapper main h3{
    font-size: 20px !important; 
    line-height:1.2em;
  }

  #pstcode-result-content .pstcode-mono,
  .pstcode-wrapper .pstcode-mono.tracking-widest *{
    font-size: 25px !important;  
  }
  
  .pstcode-wrapper main .pstcode-card h2, .pstcode-wrapper main .pstcode-card h3{
    font-size: 18px !important;
    line-height:1.2em;
  }
  
  .postal-infra svg{
    width: 30px !important;
    height: 30px !important;
  }
  
  .postal-infra .fs-2{ 
    font-size: 28px !important; 
  }

  .pstcode-wrapper {
    padding-top: 60px;
  }
  
  .bg-destructive-5 .pstcode-mono{
    font-size:16px !important; 
  }
  
}