/* propertyVerificationWidget.css */

.load-property-verification {
    margin-bottom: 30px;
    width: 100%;
}

/* Card Container - Exact Figma Dev Mode Properties */
.property-verification-card {
    background-color: #FFFFFF; /* Figma fill: pure white #FFFFFF */
    border: 0.5px solid #BFBFBF; /* Figma border: 0.5px #BFBFBF */
    border-radius: 40px; /* Figma radius: 40px */
    padding: 25px 20px; /* Figma padding: Top 25px, Right 20px, Bottom 25px, Left 20px */
    font-family: 'Nunito', sans-serif;
    box-sizing: border-box;
    max-width: 680px;
    width: 100%;
}

.p-v-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.p-v-icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Header Title - Figma GAir H4 (Nunito 700 20px 100% -5% letter spacing #1C1B1F) */
.p-v-title {
    font-size: 20px;
    font-weight: 700;
    color: #1C1B1F;
    margin: 0;
    line-height: 100%;
    letter-spacing: -0.05em;
}

/* Description - Figma GAir Body Desktop (Nunito 400 16px 160% -5% letter spacing #595959) */
.p-v-description {
    font-size: 16px;
    font-weight: 400;
    color: #595959;
    line-height: 160%;
    letter-spacing: -0.05em;
    margin: 0 0 16px 0;
    max-width: 95%;
}

/* Footer flex container */
.p-v-footer {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 14px;
}

/* Element ordering on Desktop */
.p-v-btn-wrap {
    order: 1;
    display: inline-flex;
    flex-shrink: 0;
}

/* Info group on Desktop: inline flex, no wrap so Check now stays on the same line */
.p-v-info-group {
    order: 2;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Next Check Line - Figma GAir Body Desktop (Nunito 400/700 16px 160% -5% letter spacing #595959) */
.p-v-next-check {
    font-size: 16px;
    font-weight: 400;
    color: #595959;
    line-height: 160%;
    letter-spacing: -0.05em;
    white-space: nowrap;
}

.p-v-next-check span.p-v-date {
    font-weight: 700;
}

.p-v-dot {
    font-size: 16px;
    color: #595959;
    white-space: nowrap;
}

.p-v-action-link {
    display: inline-block;
    color: #BF2829;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    letter-spacing: -0.05em;
    transition: opacity 0.2s ease;
}

.p-v-action-link:hover {
    opacity: 0.85;
}

/* Request Property Check Button - Exact Figma Dev Mode Properties */
.p-v-btn-disabled {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px; /* Figma: 4px gap */
    background-color: #E6E6E6; /* Figma background: #E6E6E6 */
    color: #999999; /* Figma text color: #999999 */
    font-family: 'Nunito', sans-serif; /* Figma typography name: Nunito */
    font-size: 16px; /* Figma font size: 16px */
    font-weight: 700; /* Figma font weight: 700 (Bold) */
    line-height: 140%; /* Figma line height: 140% */
    letter-spacing: -0.04em; /* Figma letter spacing: -4% */
    height: 48px; /* Figma fixed height: 48px */
    padding: 10px 20px; /* Figma padding: 10px */
    border-radius: 49px; /* Figma border radius: 49px */
    border: none;
    box-sizing: border-box;
    cursor: not-allowed;
    user-select: none;
}

.p-v-lock-icon {
    width: 18px;
    height: 18px;
    object-fit: contain;
}

/* Responsive Mobile Layout (< 650px) matching Screenshot 2 */
@media (max-width: 650px) {
    .property-verification-card {
        padding: 25px 20px; /* Figma padding: Top 25px, Right 20px, Bottom 25px, Left 20px */
        border-radius: 40px; /* Figma radius: 40px */
        border: 0.5px solid #BFBFBF; /* Figma border: 0.5px #BFBFBF */
        max-width: 100%;
    }

    .p-v-title {
        font-size: 20px;
    }

    .p-v-description {
        font-size: 16px;
        max-width: 90%;
        margin-bottom: 14px;
    }

    .p-v-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        margin-top: 10px;
    }

    .p-v-info-group {
        display: contents; /* Unwraps children into direct flex items of .p-v-footer for mobile reordering */
    }

    .p-v-next-check {
        order: 1;
        font-size: 14.5px;
        white-space: normal;
    }

    .p-v-btn-wrap {
        order: 2;
        width: auto;
    }

    .p-v-dot {
        display: none; /* Hide dot separator on mobile stacked view */
    }

    .p-v-action-link {
        order: 3;
        font-size: 15px;
        white-space: normal;
    }

    .p-v-btn-disabled {
        font-size: 15px;
        height: 48px;
        padding: 10px 18px;
    }
}