/* Highly specific to prevent theme collisions */
.rwd-ls-box { border:1px solid rgba(0,0,0,.08); border-radius:12px; padding:12px; margin:12px 0; background:#fff; }
.rwd-ls-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.rwd-ls-title { margin:0; font-weight:700; }
.rwd-ls-balance .rwd-ls-txt { font-weight:600; }

.rwd-ls-body { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }

.rwd-ls-circles { display:flex; gap:8px; align-itemrwd-ls-boxs:center; }
.rwd-ls-circles .rwd-ls-circle {
    width: 20px;
    height: 20px;
    display: inline-flex;
    background: #f2f4f7;
    border: 2px solid #cbd5e1;
    border-radius: 999px !important;
    box-shadow: none;
    position: relative;
    align-items: center;
    justify-content: center;
    padding: 8px 10px 12px;
}

span.rwd-ls-txt {
    font-size: 12px;
    text-align: center;
    display: block;
    margin-top: 5px;
}

.stamp-title {
    font-size: 13px;
    font-weight: 600;
    color: #000000;
    text-align: center;
    margin-bottom: 5px;
}

.rwd-ls-circles .rwd-ls-circle.is-filled {
  background:#852471;
  border-color:#852471;
}

.rwd-ls-actions .rwd-ls-redeem[disabled] { opacity:.6; cursor:not-allowed; }
.rwd-ls-history { list-style:none; padding-left:0; margin:.75rem 0; }
.rwd-ls-history li { display:flex; gap:8px; align-items:center; padding:.25rem 0; border-bottom:1px dashed #eee; }
.rwd-ls-history .delta { min-width:42px; font-weight:700; }

.rwd-ls-ledger { margin-top: .75rem; display: grid; gap: .35rem; }
.rwd-ls-line { padding:.35rem .5rem; background:#fafafa; border:1px dashed #e5e7eb; border-radius:8px; }

.rwd-ls-circles {
    display: flex;
    gap: 6px;
    justify-content: center;
}

.rwd-ls-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #eee;
    color: #ccc;
    transition: all 0.2s ease;
}

.rwd-ls-circle.is-filled {
    background: #ffd700;
    color: #222;
}

/* Add these styles to your existing CSS */

.rwd-ls-redeem:not([disabled]) {
    background: #852471;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
}

.rwd-ls-redeem:not([disabled]):hover {
    background: #6d9534;
}

.rwd-ls-redeem[disabled] {
    background: #ccc;
    color: #666;
    cursor: not-allowed;
}

.stamp-progress {
    text-align: center;
    margin: 10px 0;
    font-size: 14px;
    color: #555;
}

/* Add these styles for better partial redemption display */

.rwd-ls-txt small {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    opacity: 0.8;
}

.rwd-ls-applied-discount {
    background: #d4edda;
    border: 1px solid #c3e6cb;
    border-radius: 4px;
    padding: 8px;
    margin: 8px 0;
    font-size: 13px;
    color: #155724;
}

.rwd-ls-remaining-value {
    background: #fff3cd;
    border: 1px solid #ffeaa7;
    border-radius: 4px;
    padding: 8px;
    margin: 8px 0;
    font-size: 13px;
    color: #856404;
}

/* Styles for the new redeem button in totals */
.rwd-ls-redeem-row {
    border-top: 1px solid #e5e5e5;
}

.rwd-ls-redeem-row th {
    font-weight: normal;
    padding: 15px 20px 10px 0;
    vertical-align: top;
}

.rwd-ls-redeem-row td {
    padding: 15px 0 10px 0;
    text-align: right;
    vertical-align: top;
}

.rwd-ls-redeem-totals {
    background: #852471 !important;
    border-color: #852471 !important;
    color: white !important;
    padding: 8px 15px !important;
    font-size: 14px !important;
}

.rwd-ls-redeem-totals:hover {
    background: #6d9534 !important;
    border-color: #6d9534 !important;
}

.rwd-ls-redeem-totals:disabled {
    background: #ccc !important;
    border-color: #ccc !important;
    cursor: not-allowed !important;
}

/* Small warning text */
.rwd-ls-redeem-row small {
    font-size: 10px !important;
    color: #666 !important;
    line-height: 1.3 !important;
    display: block !important;
    max-width: 200px !important;
    margin-top: 4px !important;
    text-align: right !important;
    float: right;
}
