.spr-payouts-wrapper { margin: 0 auto 20px; padding: 10px; background: #f8f9fc; border: 1px solid #d6dbe3; border-radius: 4px; max-width: 980px; } .spr-payouts-wrapper h3 { margin: 0 0 8px; font-size: 18px; font-weight: 600; color: #2b587a; } .spr-payouts-wrapper > p { margin: 0 0 12px; font-size: 13px; color: #555; } .spr-payouts-intro { margin: 0 0 14px; padding: 10px 12px 12px; background: #FAEBD7; border: 1px dashed #F9BEC0; border-radius: 4px; font-size: 13px; line-height: 1.5; } .spr-payouts-stage-summary { margin: 0 0 8px; color: #404b5a; } .spr-individual-info p { margin: 10px 0 0 !important; font-size: 14px; color: #555; } .spr-payouts-more-toggle-wrap, .spr-tax-toggle-wrap { margin: 6px 0 8px; text-align: right; } .spr-payouts-more-toggle, .spr-tax-toggle { font-size: 13px; cursor: pointer; color: #2b587a; text-decoration: none; border-bottom: 1px dashed currentColor; padding-bottom: 1px; } .spr-payouts-more-toggle:hover, .spr-tax-toggle:hover { opacity: 0.85; } .spr-payouts-more-toggle.is-open, .spr-tax-toggle.is-open { font-weight: 600; } .spr-payouts-more { margin-top: 10px; padding: 10px 12px; background: #ffffff; border: 1px solid #d6dbe3; border-radius: 4px; font-size: 13px; line-height: 1.5; } .spr-payouts-info { margin: 10px 0 15px; padding: 10px 12px; background: #fff8e6; border: 1px solid #f0d8a8; border-radius: 4px; font-size: 13px; line-height: 1.5; } .spr-payouts-info h4 { margin: 0 0 6px; font-size: 14px; font-weight: 600; color: #8a6d3b; } .spr-payouts-info h5 { margin: 8px 0 4px; font-size: 13px; font-weight: 600; } .spr-payouts-info ul { margin: 0 0 4px 18px; padding: 0; } .spr-payouts-form .form-table { width: 100%; border-collapse: collapse; background: transparent; } .spr-payouts-form .form-table th, .spr-payouts-form .form-table td { padding: 6px 10px; border: 0; } .spr-payouts-form .form-table th { width: 38%; background: #eef1f6; font-weight: 600; color: #333; text-align: left; vertical-align: middle; } .spr-payouts-form .form-table td { background: #ffffff; } .spr-payouts-form .form-table tr:nth-child(even) td { background: #f7f9fc; } .spr-payouts-form .form-table tr:nth-child(odd) td { background: #ffffff; } .spr-payouts-form .form-table tr:hover td, .spr-payouts-form .form-table tr:hover th { background-color: inherit !important; } .spr-payouts-form input[type="text"], .spr-payouts-form input[type="email"], .spr-payouts-form input[type="tel"], .spr-payouts-form .regular-text { width: 100%; max-width: 100%; box-sizing: border-box; } .spr-payouts-form .description { margin-top: 5px !important; font-size: 14px; color: #777; } .spr-individual-info th, .spr-individual-info td { background: transparent; padding-top: 8px; padding-bottom: 12px; } .spr-individual-info .rcl-notice { margin: 0 0 8px; padding: 10px 12px; border-radius: 4px; background: #f9bec0; display: flex; align-items: flex-start; font-size: 13px; line-height: 1.5; } .spr-individual-info .rcl-notice__text { color: #5a3135; } .spr-payouts-wrapper .button-primary { background: #e26266; font-size: 13px; padding: 10px 16px; } .spr-payouts-wrapper .button-primary:hover, .spr-payouts-wrapper .button-primary:focus { background: #c74c51; border-color: #c74c51; } .spr-ipay-frame { border: 1px solid #d9dee3; border-radius: 6px; background: #fff; padding: 12px; } .spr-ipay-commission-note { border: 1px solid #f0d8a8; background: #fff8e6; border-radius: 6px; padding: 10px 12px; margin: 0 0 12px 0; font-size: 13px; line-height: 1.45; color: #50575e; } .spr-ipay-commission-note strong { color: #8a6d3b; } .spr-section-title { padding: 10px 12px; background: #f6f7f9; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; color: #2b587a; } .spr-row-ipay-title th { background: transparent !important; padding: 0 !important; } @media screen and (max-width: 640px) { .spr-payouts-form .form-table th, .spr-payouts-form .form-table td { display: block; width: 100%; } .spr-payouts-form .form-table th { padding-bottom: 0; } .spr-payouts-form .form-table td { padding-top: 4px; } .spr-tax-toggle-wrap, .spr-payouts-more-toggle-wrap { text-align: left; } } .spr-payouts-form .form-table tr:nth-child(odd) td { background-color: #ffffff !important; } .spr-payouts-form .form-table tr:nth-child(even) td { background-color: #f7f9fc !important; } .spr-payouts-form .form-table tr:hover td { background-color: inherit !important; } .spr-payouts-form .form-table tr:nth-child(odd):hover td { background-color: #ffffff !important; } .spr-payouts-form .form-table tr:nth-child(even):hover td { background-color: #f7f9fc !important; } .spr-payouts-form .form-table tr:hover th { background-color: #eef1f6 !important; } .spr-offer-link { text-decoration: underline !important; text-underline-offset: 3px; } .spr-ipay-frame{ background:#fff; border:1px solid #e3e7ee; border-radius:8px; padding:14px 14px 12px; box-shadow:0 1px 0 rgba(0,0,0,.03); } .spr-ipay-commission-note{ background:#fff7e6; border:1px solid #ffe1b3; border-radius:7px; padding:10px 12px; line-height:1.45; font-size:13px; color:#6b4a00; margin:0 0 12px 0; } .spr-ipay-commission-note strong{ font-weight:700; } .spr-ipay-commission-note span{ display:block; margin-top:2px; color:#7a5a16; } .spr-ipay-meta{ margin:0 0 10px 0; } .spr-ipay-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 0; border-top:1px dashed #e8edf5; } .spr-ipay-row:first-child{ border-top:0; padding-top:0; } .spr-ipay-label{ font-size:13px; color:#425466; font-weight:600; } .spr-ipay-value{ font-size:13px; color:#111827; text-align:right; } .spr-ipay-code{ padding:3px 8px; border-radius:999px; background:#f3f6fb; border:1px solid #e3eaf6; font-size:12px; } .spr-ipay-badge{ display:inline-flex; align-items:center; justify-content:center; padding:4px 10px; border-radius:999px; font-size:12px; font-weight:700; border:1px solid transparent; line-height:1.2; white-space:nowrap; } .spr-ipay-status--active, .spr-ipay-status--active_smch{ background:#ecfdf3; color:#11643a; border-color:#bdeccf; } .spr-ipay-status--pending{ background:#eef6ff; color:#1f4b99; border-color:#cfe2ff; } .spr-ipay-status--no_smch{ background:#f6f7fb; color:#4b5563; border-color:#e6e9f2; } .spr-ipay-status--blocked{ background:#fff1f2; color:#9f1239; border-color:#fecdd3; } .spr-ipay-desc{ margin:8px 0 0 0; font-size:12px; color:#6b7280; line-height:1.5; } @media (max-width: 520px){ .spr-ipay-row{ flex-direction:column; align-items:flex-start; } .spr-ipay-value{ text-align:left; } } body.spr-modal-open { overflow: hidden; } .spr-modal { display: none; position: fixed; inset: 0; z-index: 99999; } .spr-modal.is-open { display: block; } .spr-modal__overlay { position: absolute; inset: 0; background: rgba(0,0,0,.45); } .spr-modal__dialog { position: relative; max-width: 560px; margin: 10vh auto 0; background: #fff; border-radius: 6px; box-shadow: 0 10px 30px rgba(0,0,0,.25); padding: 18px 18px 16px; } .spr-modal__close { position: absolute; right: 10px; top: 8px; width: 32px; height: 32px; line-height: 30px; text-align: center; border: 0; background: transparent; font-size: 22px; cursor: pointer; color: #666; } .spr-modal__title { font-size: 16px; font-weight: 700; margin: 0 0 8px 0; color: #2b587a; } .spr-modal__text { margin: 0; font-size: 13px; line-height: 1.6; color: #444; } .spr-modal__actions { margin-top: 14px; text-align: right; } .spr-sales-wrapper { margin: 0 auto 20px; padding: 5px 10px 10px; background: #f8f9fc; border: 1px solid #d6dbe3; border-radius: 4px; } .spr-sales-wrapper h3 { margin: 0 0 8px; font-size: 18px; font-weight: 600; color: #2b587a; } .spr-sales-intro, .spr-sales-note { margin: 0 0 10px; font-size: 13px; color: #555; } .spr-sales-subnote { margin-top: 4px; font-size: 12px; color: #666; } .spr-sales-mini { font-size: 11px; color: #777; margin-top: 2px; } .spr-sales-tabs { display: flex; gap: 8px; margin: 10px 0 12px; flex-wrap: wrap; } .spr-sales-tab-btn { appearance: none; border: 1px solid #d6dbe3; background: #ffffff; color: #2b587a; padding: 7px 10px; border-radius: 4px; font-size: 13px; font-weight: 600; cursor: pointer; } .spr-sales-tab-btn:hover { background: #4c8cbd; color: #fff; } .spr-sales-tab-btn.is-active { background: #ffffff; color: #2b587a; } .spr-sales-tab-panel { display: none; } .spr-sales-tab-panel.is-active { display: block; } .spr-sales-summary { display: flex; flex-wrap: wrap; gap: 12px; margin: 10px 0 12px; } .spr-sales-summary-item { flex: 1 1 180px; padding: 8px 10px; background: #ffffff; border: 1px solid #d6dbe3; border-radius: 4px; } .spr-sales-summary-label { font-size: 12px; color: #666; margin-bottom: 4px; } .spr-sales-summary-value { font-size: 15px; font-weight: 600; color: #333; } .spr-sales-value-green { color: #2e7d32; } .spr-sales-value-red { color: #c62828; } .spr-sales-summary{ flex-wrap: nowrap; } .spr-sales-summary-item{ flex: 1 1 0; min-width: 0; } .spr-sales-summary-value{ white-space: nowrap; } @media screen and (max-width: 860px){ .spr-sales-summary{ flex-wrap: wrap; } .spr-sales-summary-item{ flex: 1 1 calc(50% - 12px); } } @media screen and (max-width: 640px){ .spr-sales-summary{ flex-direction: column; } .spr-sales-summary-item{ flex: 1 1 auto; } } .spr-sales-table-wrapper { margin-top: 10px; overflow-x: auto; } .spr-sales-table { width: 100%; border-collapse: collapse; font-size: 12px; background: #ffffff; } .spr-sales-table th, .spr-sales-table td { padding: 6px 8px; border: 1px solid #dfe3ec; text-align: left; vertical-align: top; } .spr-sales-table th { background: #eef1f6; font-weight: 600; color: #333; white-space: nowrap; } .spr-sales-table tbody tr:nth-child(even) td { background: #f7f9fc; } .spr-sales-table a { color: #5f9cdb; text-decoration: underline; } .spr-sales-table a:hover { text-decoration: none; } .spr-col-num { width: 50px; white-space: nowrap; } .spr-col-product { min-width: 220px; } .spr-col-buyer { min-width: 160px; } .spr-col-price, .spr-col-date { white-space: nowrap; } .spr-sales-col-seller { font-weight: 600; color: #2e7d32; } .spr-sales-col-commission { color: #c62828; } .spr-status { display: inline-block; padding: 2px 8px 2px 6px; border-radius: 10px; font-size: 12px; font-weight: 600; line-height: 1.4; vertical-align: middle; white-space: nowrap; } .spr-status-active { background: #e6f4ea; color: #1e7e34; border: 1px solid #b7dfc2; } .spr-status-inactive { background: #f1f3f5; color: #c62828; border: 1px solid #d6d8db; } @media screen and (max-width: 640px) { .spr-sales-summary { flex-direction: column; } .spr-sales-table { font-size: 11px; } } .spr-col-balance { white-space: nowrap; } .spr-col-date { white-space: normal; } .spr-date-wrap { line-height: 1.25; } .spr-date-day, .spr-date-time { display: flex; align-items: center; gap: 4px; } .spr-date-day { font-weight: 600; } .spr-date-time { font-size: 12px; color: #666; } .spr-date-ico, .spr-time-ico { font-size: 17px; color: #8a94a6; }