/* =========================================================
   ViséoTop WHOIS - CSS COMPLET (Hostco compatible)
   - Form aligné comme le thème (bouton dans le champ)
   - Bouton texte "Vérifier" (robuste)
   - Résultats centrés + tableau/grille stable
   - Couleurs statut (vert/orange)
   ========================================================= */

/* Largeur globale (modifie ici uniquement) */
:root{
  --vt-whois-width: 850px;   /* ex: 850px / 1050px / 1140px */
  --vt-btn-width: 130px;     /* largeur bouton "Vérifier" */
  --vt-input-pr: 140px;      /* padding-right input (>= vt-btn-width + marge) */
}

/* =========================
   WRAPPER + FORM
   ========================= */

.vt-whois-wrap{
  max-width: var(--vt-whois-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/* Form en mode thème: bouton à droite dans le champ */
.vt-whois-wrap .vt-whois-form{
  position: relative;
  width: 100%;
  display: block;
  margin: 0;
}

/* Input plein + place pour bouton */
.vt-whois-wrap .vt-whois-input{
  width: 100%;
  box-sizing: border-box;
  padding-right: var(--vt-input-pr);
  margin: 0;
}

/* Bouton collé à droite */
.vt-whois-wrap .vt-whois-submit{
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: var(--vt-btn-width);
  min-width: var(--vt-btn-width);
  margin: 0;
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  float: none;
  z-index: 5;
  white-space: nowrap;
  overflow: visible;
}

/* Neutralise pseudo-éléments injectés par thèmes */
.vt-whois-wrap .vt-whois-form::before,
.vt-whois-wrap .vt-whois-form::after,
.vt-whois-wrap .vt-whois-submit::before,
.vt-whois-wrap .vt-whois-submit::after{
  content: none !important;
  display: none !important;
}

/* Texte bouton (robuste) */
.vt-whois-submit.vt-submit-icon .vt-submit-text{
  display: inline !important;
  font-size: 16px !important;
  line-height: 1 !important;
  color: #fff !important;
}
.vt-whois-submit{
  font-size: 16px !important;
  color: #fff !important;
}

/* =========================
   RESULTS CONTAINER
   ========================= */

/* Important : le conteneur #whois peut être dans une section full width */
#whois,
#whois.vt-whois-results,
.vt-whois-results#whois,
.vt-whois-wrap .vt-whois-results{
  max-width: var(--vt-whois-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  float: none;
  display: block;
}

/* =========================
   ROW / TABLE GRID
   ========================= */

.vt-whois-row{
  width: 100%;
  box-sizing: border-box;

  display: grid;
  grid-template-columns: 1.2fr 0.8fr 0.8fr;
  gap: 12px;
  align-items: center;

  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.08);
  margin-bottom: 10px;
  background: rgba(255,255,255,0.65);

  float: none;
}

/* Sécurise contre floats/width du thème */
.vt-whois-domain,
.vt-whois-status,
.vt-whois-action{
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
}

/* Domaine */
.vt-whois-domain{
  font-weight: 600;
}

/* =========================
   STATUS + COLORS
   ========================= */

.vt-label{
  font-weight: 700;
}

/* Orange pour "Déjà réservé" */
.vt-status-not_available .vt-label,
.vt-status-reserved .vt-label,
.vt-status-closed .vt-label{
  color: #d97706;
}

/* Vert pour "Disponible" */
.vt-status-available .vt-label,
.vt-status-available_reserved .vt-label,
.vt-status-available_pending .vt-label{
  color: #16a34a;
}

/* Erreur */
.vt-error{
  color: #b91c1c;
  font-weight: 700;
}

/* =========================
   ACTION BUTTONS
   ========================= */

.vt-whmcs-cart-form{
  margin: 0;
}

/* Le bouton action doit occuper la colonne */
.vt-action-btn{
  width: 100%;
}

/* Petit label "Indisponible" si besoin */
.vt-taken,
.vt-unknown{
  font-weight: 600;
  opacity: 0.85;
}

/* =========================
   DETAILS TOGGLE
   ========================= */

.vt-raw-toggle{
  margin-left: 10px;
  font-size: 12px;
  opacity: 0.8;
  background: none;
  border: 0;
  cursor: pointer;
  padding: 0;
}

.vt-raw{
  margin-top: 8px;
  padding: 10px;
  border-radius: 10px;
  background: rgba(0,0,0,0.06);
  overflow: auto;
  max-height: 160px;
}

/* =========================
   SPINNER (loading)
   ========================= */

.vt-spinner{
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid rgba(0,0,0,.20);
  border-top-color: rgba(0,0,0,.55);
  animation: vtspin .8s linear infinite;
  margin-right: 8px;
  vertical-align: -2px;
}

.vt-loading-text{
  font-weight: 600;
  opacity: 0.85;
}

@keyframes vtspin{
  to{ transform: rotate(360deg); }
}

/* =========================
   RESPONSIVE
   ========================= */

@media (max-width: 768px){
  :root{
    --vt-whois-width: 94vw;
    --vt-btn-width: 110px;
    --vt-input-pr: 120px;
  }

  .vt-whois-row{
    grid-template-columns: 1fr;
  }

  .vt-action-btn{
    width: 100%;
  }
}