﻿
/* TON STYLE IVQA COMPLET QUE TU AS DEMANDÉ */

:root {
   --ivqa-primary: #0f172a;
   --ivqa-accent: #2563eb;
   --ivqa-accent-soft: #dbeafe;
   --ivqa-success: #16a34a;
   --ivqa-muted: #6b7280;
}

 .badge-chip.error {

         background: rgba(220, 38, 38, 0.18);

         color: #fecaca;

         border: 1px solid rgba(239, 68, 68, 0.9);

      }

	   

		 .verification-form .input-group-lg > .btn {

    border-radius: 0 999px 999px 0!important;

    font-weight: 600;

    padding-inline: 26px;

}




/* Note: global responsive logo sizing is handled by temps/assets/css/ivqa-pro.css */



/* ✅ Smaller variant of tv-btn-primary for inside the card */

.btn-sm-custom {

   padding: 6px 18px !important;

   font-size: 14px !important;

   line-height: 1.2 !important;

}

.btn-sm-custom .btn-wrap {

   display: inline-block;

}



/* ✅ Legal text under buttons – small & professional */

.verification-legal-small {

   font-size: 0.75rem;

   color: #6b7280;

   line-height: 1.6;

   margin-top: 16px;

   padding-left: 8px;

   border-left: 3px solid #d1d5db;

}



/* HERO – background dark, text white */

.verification-hero {

   background: radial-gradient(circle at 0% 0%, #1f2937 0%, #020617 55%, #020617 100%);

   padding: 40px 0 24px;

   color: #ffffff;

   border-bottom: 1px solid rgba(148, 163, 184, 0.35);

}



.verification-hero h1 {

   font-size: 1.9rem;

   margin-bottom: 0.4rem;

   color: #ffffff;

   letter-spacing: 0.01em;

}



@media (min-width: 992px) {

   .verification-hero h1 {

      font-size: 2.05rem;

   }

}



.verification-hero p {

   margin-bottom: 0;

   color: #e5e7eb;

}



.verification-hero strong {

   color: #ffffff;

}



/* small meta text on right – white too (hero) */

.verification-meta-small {

   font-size: 0.78rem;

   color: #e5e7eb;

}



/* ✅ DARK version for text inside the white card (left column) */

.verification-meta-dark {

   font-size: 0.8rem;

   color: #374151;

}



/* ✅ Status badge */

.verification-status-chip {

   display: inline-flex;

   align-items: center;

   gap: 8px;

   padding: 4px 14px;

   border-radius: 999px;

   font-size: 0.78rem;

   font-weight: 600;

   background-color: rgba(22, 163, 74, 0.16);

   color: #bbf7d0;

   border: 1px solid rgba(34, 197, 94, 0.6);

   text-transform: uppercase;

   letter-spacing: 0.05em;

}



/* MAIN SECTION */

.verification-main {

   padding: 40px 0 80px;

   background: #f3f4f6;

}



/* Center card and give it premium look */

.verification-card {

   border-radius: 20px;

   background: #ffffff;

   box-shadow: 0 24px 55px rgba(15, 23, 42, 0.11);

   overflow: hidden;

   border: 1px solid rgba(209, 213, 219, 0.7);

}

/* Extracted from inline styles in the view */
.verification-error {
   display: flex;
   gap: 12px;
   padding: 14px;
   border-radius: 12px;
   background: rgba(220, 38, 38, 0.08);
   border: 1px solid rgba(239, 68, 68, 0.4);
   color: #b91c1c;
}

.verification-error-icon {
   font-size: 1.6rem;
   line-height: 1;
}



.verification-card-inner {

   padding: 24px 20px;

}



@media (min-width: 768px) {

   .verification-card-inner {

      padding: 30px 34px;

   }

}



@media (max-width: 575.98px) {

   .verification-card-inner {

      padding: 22px 18px;

   }

}



/* LEFT SIDE */

.verification-left {

   border-bottom: 1px solid #e5e7eb;

   background: radial-gradient(circle at 0 0, #e5f9ff 0%, #f9fafb 50%, #ffffff 100%);

}



@media (min-width: 992px) {

   .verification-left {

      border-bottom: none;

      border-right: 1px solid #e5e7eb;

   }

}



/* ✅ Make "Certificate Validated" area bigger (icon + name + holder) */

.validation-icon-wrap {

   display: inline-flex;

   align-items: center;

   justify-content: center;

   width: 140px;

   height: 140px;

   border-radius: 999px;

   background: radial-gradient(circle at 20% 20%, #4ade80, #15803d);

   box-shadow: 0 18px 40px rgba(22, 163, 74, 0.45);

   margin-bottom: 18px;

}



.validation-icon-wrap img {

   max-width: 70%;

   max-height: 70%;

   filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.4));

}



.holder-name {

   font-size: 1.45rem;

   font-weight: 700;

   color: #111827;

   letter-spacing: 0.02em;

}



.holder-label {

   font-size: 0.95rem;

   color: var(--ivqa-muted);

}



/* Right side titles */

.details-title {

   font-size: 1.1rem;

   font-weight: 600;

   color: #111827;

   display: inline-flex;

   align-items: center;

   gap: 8px;

}



.details-title::before {

   content: "";

   width: 22px;

   height: 3px;

   border-radius: 999px;

   background: linear-gradient(90deg, var(--ivqa-accent), #38bdf8);

}



.details-subtitle {

   font-size: 0.85rem;

   color: var(--ivqa-muted);

   margin-bottom: 18px;

}



/* Details list */

.verification-details-list {

   list-style: none;

   padding-left: 0;

   margin-bottom: 0;

   font-size: 0.9rem;

}



.verification-details-list li {

   display: flex;

   align-items: flex-start;

   gap: 6px;

   margin-bottom: 8px;

}



.details-label {

   min-width: 165px;

   font-weight: 600;

   color: #374151;

}



.details-separator {

   font-weight: 600;

   color: #9ca3af;

}



.details-value {

   color: #111827;

   flex: 1;

}



.verification-details-list li:nth-child(1) .details-value,

.verification-details-list li:nth-child(9) .details-value {

   font-weight: 600;

   color: var(--ivqa-primary);

}



@media (max-width: 575.98px) {

   .verification-details-list li {

      align-items: flex-start;

   }

   .details-label {

      min-width: 140px;

      font-size: 0.8rem;

   }

   .details-value {

      font-size: 0.85rem;

   }

}



/* ACTIONS AREA */

.verification-actions {

   border-top: 1px solid #e5e7eb;

   padding-top: 16px;

   margin-top: 22px;

}



.verification-actions .tv-btn-primary {

   min-width: 110px;

   justify-content: center;

}



/* Stack buttons nicely on small screens */

@media (max-width: 575.98px) {

   .verification-actions .d-flex {

      flex-direction: column;

      align-items: flex-start !important;

   }

}



/* Print optimization */

@media print {

   header,

   footer,

   .no-print,

   .scroll-top,

   #preloader,

   #magic-cursor {

      display: none !important;

   }

   body {

      background: #ffffff !important;

   }

   .verification-main {

      padding: 0;

      background: #ffffff !important;

   }

   .verification-card {

      box-shadow: none;

      border-radius: 0;

      border: none;

   }

}

.badge-chip {

         display: inline-flex;

         align-items: center;

         gap: 6px;

         padding: 4px 14px;

         border-radius: 999px;

         font-size: 0.75rem;

         font-weight: 600;

         /* 🔵 back to blue style */

         background: rgba(37, 99, 235, 0.18);

         color: #bfdbfe;

         border: 1px solid rgba(59, 130, 246, 0.9);

         text-transform: uppercase;

         letter-spacing: 0.08em;

         margin-bottom: 12px;

      }

	   .verification-partners {

         margin-top: 24px;

         padding: 20px 18px;

         border-radius: 18px;

         background: #f9fafb;

         border: 1px solid #e5e7eb;

      }



      .verification-partners-title {

         font-size: 0.9rem;

         font-weight: 700;

         color: #111827;

         margin-bottom: 10px;

         text-transform: uppercase;

         letter-spacing: 0.06em;

         display: flex;

         align-items: center;

         gap: 8px;

      }



      .verification-partners-title::before {

         content: "";

         width: 18px;

         height: 3px;

         border-radius: 999px;

         background: linear-gradient(90deg, #2563eb, #38bdf8);

      }



      .verification-partners-text {

         font-size: 0.78rem;

         color: var(--ivqa-muted);

         margin-bottom: 12px;

      }



      .partners-logos {

         display: flex;

         align-items: center;

         justify-content: flex-start;

         gap: 18px;

         flex-wrap: wrap;

      }



      /* Each logo in same size pill */

      .partner-logo-item {

         flex: 0 0 auto;

         height: 52px;

         min-width: 140px;

         padding: 8px 16px;

         border-radius: 999px;

         background: #ffffff;

         display: flex;

         align-items: center;

         justify-content: center;

         box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);

      }



      .partner-logo-item img {

         max-height: 26px;

         max-width: 120px;

         width: auto;

         object-fit: contain;

         opacity: 0.95;

         transition: 0.25s;

      }



      .partner-logo-item:hover img {

         opacity: 1;

         transform: translateY(-2px);

      }

      /* ===== Powered By Footer (page bottom, outside content) ===== */

      .ivqa-verification-footer {
         padding: 28px 20px 24px;
         border-top: 1px solid #e5e7eb;
         background: #f9fafb;
         text-align: center;
      }

      .ivqa-verification-footer-label {
         font-size: 0.82rem;
         color: #9ca3af;
         margin-bottom: 10px;
         font-weight: 500;
      }

      .ivqa-verification-footer-logo {
         margin-bottom: 14px;
      }

      .ivqa-verification-footer-logo img {
         height: 28px;
         width: auto;
         object-fit: contain;
      }

      .ivqa-verification-footer-desc {
         font-size: 0.82rem;
         color: #6b7280;
         line-height: 1.6;
         max-width: 460px;
         margin: 0 auto;
      }

      .ivqa-verification-footer-desc a {
         color: #2563eb;
         text-decoration: none;
         font-weight: 600;
      }

      .ivqa-verification-footer-desc a:hover {
         text-decoration: underline;
      }

/* ===== VERIFICATION HERO LOGO ===== */
.verification-hero .ivqa-hero-logo {
   height: 46px;
   max-width: 100%;
   opacity: .98;
}

