/* ═══════════════════════════════════════════════
 * Authletic — Back in Stock Notification v1.2
 * ═══════════════════════════════════════════════ */

/* ── Container ── */
#dt-bis-container {
   margin: 14px 0 14px;
}

.dt-bis-wrapper {
   border: 2.5px dashed #ffc107;
   border-radius: 10px;
   padding: 18px 20px 16px;
   background: #faf9f2;
   text-align: center;
   transition: border-color 0.2s;
}

.dt-bis-wrapper:hover {
   border-color: #999;
}

/* ── Bell icon ── */
.dt-bis-bell {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 36px;
   height: 36px;
   border-radius: 50%;
   background: #000;
   margin: 0 auto 10px;
}

.dt-bis-bell svg {
   width: 18px;
   height: 18px;
   fill: #fff;
}

/* ── Title — sold out notice ── */
.dt-bis-title {
   font-family: 'Work Sans', sans-serif;
   font-size: 14px;
   font-weight: 700;
   color: #000;
   margin: 0 0 4px;
   letter-spacing: 0.01em;
}

/* ── Subtitle ── */
.dt-bis-subtitle {
   font-family: 'Work Sans', sans-serif;
   font-size: 12.5px;
   font-weight: 400;
   color: #666;
   margin: 0 0 14px;
   line-height: 1.4;
}

/* ── Form row ── */
.dt-bis-form {
   display: flex;
   gap: 0;
   align-items: stretch;
   max-width: 420px;
   margin: 0 auto;
   border: 1.5px solid #ddd;
   border-radius: 8px;
   overflow: hidden;
   background: #fff;
   transition: border-color 0.2s;
}

.dt-bis-form:focus-within {
   border-color: #000;
}

/* ── Email input ── */
.dt-bis-form input[type="email"] {
   flex: 1;
   min-width: 0;
   padding: 12px 14px;
   border: none;
   outline: none;
   font-family: 'Work Sans', sans-serif;
   font-size: 13px;
   color: #333;
   background: transparent;
   -webkit-appearance: none;
}

.dt-bis-form input[type="email"]::placeholder {
   color: #aaa;
}

/* ── Submit button ── */
.dt-bis-form button {
   padding: 12px 22px;
   background: #000;
   color: #fff;
   border: none;
   font-family: 'Work Sans', sans-serif;
   font-size: 13px;
   font-weight: 600;
   letter-spacing: 0.02em;
   cursor: pointer;
   white-space: nowrap;
   transition: background 0.15s;
}

.dt-bis-form button:hover {
   background: #333;
}

.dt-bis-form button:disabled {
   background: #999;
   cursor: not-allowed;
}

/* ── Messages ── */
.dt-bis-msg-area {
   margin-top: 0;
}

.dt-bis-msg {
   font-family: 'Work Sans', sans-serif;
   font-size: 12.5px;
   margin: 10px auto 0;
   padding: 10px 14px;
   border-radius: 6px;
   max-width: 420px;
   line-height: 1.4;
}

.dt-bis-msg.success {
   background: #d4edda;
   color: #155724;
   border: 1px solid #c3e6cb;
}

.dt-bis-msg.error {
   background: #fce4ec;
   color: #c62828;
   border: 1px solid #f5c6cb;
}

.dt-bis-msg.already {
   background: #fff3e0;
   color: #e65100;
   border: 1px solid #ffe0b2;
}

/* ── Mobile ── */
@media (max-width: 480px) {
   .dt-bis-wrapper {
      padding: 14px 14px 12px;
   }

   .dt-bis-form {
      flex-direction: column;
      border-radius: 8px;
   }

   .dt-bis-form input[type="email"] {
      border-bottom: 1px solid #eee;
      text-align: center;
      padding: 12px;
   }

   .dt-bis-form button {
      border-radius: 0 0 6px 6px;
      padding: 12px;
   }
}

/* ═══════════════════════════════════════════════
 * Woo Variation Swatches — OOS swatch overrides
 * ═══════════════════════════════════════════════ */

/* Make disabled swatches clickable (override pointer-events: none) */
.variable-items-wrapper .variable-item.disabled {
   pointer-events: auto !important;
   cursor: pointer !important;
}

/* Visual highlight when an OOS swatch is clicked for notification */
.variable-items-wrapper .variable-item.disabled.dt-bis-selected {
   border-color: #ffc107 !important;
   background: #fffef0 !important;
   box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.35);
   opacity: 1 !important;
}