/* Basic reset + inherit theme typography */
.poshmark-calc {
    font-family: inherit;
    color: inherit;
}

.poshmark-calc .card {
    background: var(--wp--preset--color--background, #fff);
    border: 1px solid var(--wp--preset--color--border, #ececec);
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 1px 0 rgba(0,0,0,0.02);
}

.top-row {
    margin-bottom: 12px;
}

.email-row {
    display:flex;
    gap:10px;
    align-items:center;
}

.email-input-wrap {
    display:flex;
    align-items:center;
    background: var(--wp--preset--color--base, #f5f7fb);
    padding:8px 12px;
    border-radius:6px;
    flex:1;
}

.email-icon {
    margin-right:8px;
    opacity:0.6;
}

.email-input-wrap input {
    border: none;
    background: transparent;
    outline: none;
    width:100%;
    font-family:inherit;
}

.btn {
    padding: 8px 14px;
    border-radius: 6px;
    border: none;
    cursor:pointer;
    font-weight:600;
    background: var(--wp--preset--color--primary, var(--e-global-color-primary, #34d399));
    color: var(--wp--preset--color--on-primary, #fff);
}

.btn:disabled {
    opacity:0.6;
    cursor:not-allowed;
}

.btn-outline {
    background: transparent;
    border:1px solid var(--wp--preset--color--border, #d1d5db);
    color: inherit;
}

.grid {
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    margin-top: 18px;
}

.form-group {
    display:flex;
    flex-direction:column;
}

.form-group input, .form-group select {
    padding:10px;
    border-radius:6px;
    border:1px solid var(--wp--preset--color--border, #e6e7ee);
    background: transparent;
    font-family:inherit;
}

.results {
    margin-top:20px;
    border-top:1px solid var(--wp--preset--color--border, #eee);
    padding-top:18px;
    display:none;
}

.result-row {
    display:flex;
    justify-content:space-between;
    padding:6px 0;
}

.result-row.total {
    font-weight:700;
}

.value {
    color: var(--posh-value-color, inherit);
}

.value.positive {
    color: var(--posh-positive-color, var(--wp--preset--color--success, #10b981));
}

.value.negative {
    color: var(--posh-negative-color, var(--wp--preset--color--danger, #ef4444));
}

/* Modal */
.modal {
    position: fixed;
    left:0;
    top:0;
    right:0;
    bottom:0;
    display:none;
    align-items:center;
    justify-content:center;
    background: rgba(0,0,0,0.25);
}

.modal .modal-content {
    background: var(--wp--preset--color--background, #fff);
    padding:18px;
    border-radius:8px;
    max-width:420px;
    position:relative;
}

.modal-close {
    position:absolute;
    right:8px;
    top:6px;
    border:none;
    background:transparent;
    font-size:20px;
    cursor:pointer;
}

/* Responsive */
@media (max-width: 768px) {
    .grid {
        grid-template-columns: 1fr;
    }

    .email-row {
        flex-direction:column;
        align-items:stretch;
    }
}

/* Disabled look for inputs (before email confirmed) */
.poshmark-disabled input, .poshmark-disabled select {
    opacity:0.6;
}