/* Shared reward form and winner lists. Inherit the site's Futura font. */
#blog-section.rewards-section { padding: 48px 0; font-family: inherit; scroll-margin-top: 90px; }
#blog-section > .container, #blog-section > .container > .row { padding-top: 0 !important; padding-bottom: 0 !important; }
#blog-section .rewards-column { max-width: 760px; }
#blog-section .reward-panel {
 background: linear-gradient(145deg, #074b38, #043e30) !important;
 border: 1px solid rgba(229,205,144,.3) !important; border-radius: 24px !important;
 box-shadow: 0 20px 50px rgba(0,25,17,.18) !important; margin: 0 auto 24px; overflow: visible;
 color: #f8faf6; font-family: inherit; transform: none !important;
}
#blog-section .reward-panel > .card-body { padding: 36px !important; background: transparent !important; border-radius: inherit !important; }
#blog-section .reward-panel :is(h3,h4,h5) { font-family: inherit !important; color: #e5cd90 !important; text-shadow: none !important; line-height: 1.5; }
#blog-section .reward-panel h4, #blog-section .reward-panel-title { font-size: 26px !important; text-align: left !important; margin: 0 0 12px !important; }
#blog-section .reward-intro { color: #d4ded8; font-size: 15px; line-height: 1.8; margin-bottom: 28px; }
#blog-section .reward-login-form > .row { margin: 0 0 22px !important; }
#blog-section .reward-login-form > .row > * { padding-left: 0; padding-right: 0; }
#blog-section .form-label { margin: 0 0 9px; font-size: 14px; font-weight: 400 !important; white-space: normal !important; }
#blog-section .reward-panel :is(input,button,label,small) { font-family: inherit !important; }
#blog-section .reward-panel :is(.input-sdt,.input-pin,#code-input) {
 display: block; width: 100% !important; max-width: none !important; min-width: 0;
 height: 56px !important; border: 1px solid #c8d8ce !important; border-radius: 12px !important;
 background: #f7faf6 !important; color: #153f30 !important; padding: 12px 16px !important;
 font-size: 17px !important; font-weight: 400 !important; box-shadow: none !important;
}
#blog-section .reward-panel input::placeholder { color: #6a8173 !important; font-weight: 400 !important; opacity: 1; }
#blog-section .reward-panel :is(.input-sdt,.input-pin,#code-input):focus { outline: 2px solid #e5cd90; outline-offset: 3px; }
#blog-section .form-check-input { position: static; flex: 0 0 20px; width: 20px; height: 20px; margin: 0; accent-color: #e5cd90; }
#blog-section .form-check-label { margin-left: 0 !important; font-weight: 400 !important; }
#blog-section :is(#login-btn,.submit-btn) {
 min-height: 52px; padding: 13px 20px !important; border: 1px solid #e5cd90 !important;
 border-radius: 12px !important; background: #e5cd90 !important; color: #153f30 !important;
 font-size: 17px !important; font-weight: 600; box-shadow: none !important; line-height: 1.5;
 white-space: normal; margin: 0; transition: background .18s;
}
#blog-section :is(#login-btn,.submit-btn):hover { background: #f4dfa8 !important; transform: none; }
#blog-section button:focus-visible { outline: 2px solid #f4dc9c; outline-offset: 4px; }
#blog-section button:disabled { opacity: .5; cursor: default; }
#blog-section .reward-panel small { display: block; font-size: 13px; line-height: 1.85; color: #d4ded8 !important; text-shadow: none !important; text-align: left; }
#blog-section .reward-account { flex-wrap: wrap; gap: 14px; padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,.12); font-size: 15px; }
#blog-section .reward-account .btn { margin: 0; padding: 8px 14px; min-height: 40px; color: #e5cd90; background: transparent; border: 1px solid rgba(229,205,144,.4); border-radius: 10px; }
#blog-section .tab-header { display: flex; gap: 5px; padding: 5px; border: 1px solid rgba(229,205,144,.2); border-radius: 14px; background: rgba(0,0,0,.12) !important; margin: 24px 0 !important; }
#blog-section .tab-btn { flex: 1; padding: 12px; min-height: 46px; border: 0; border-radius: 9px; color: #d4ded8; background: transparent; font-size: 15px; line-height: 1.5; cursor: pointer; white-space: normal; }
#blog-section .tab-btn.active { background: #e5cd90; color: #153f30; }
#blog-section .tab-btn::after { display: none; }
#blog-section .tab-content { padding: 0 !important; width: 100%; height: auto; max-height: none; overflow: visible; }
#blog-section #code-inputs-wrapper { align-items: stretch !important; }
#blog-section #code-inputs-wrapper > .mb-4 { margin-bottom: 8px !important; display: block !important; text-align: left !important; }
#blog-section .redeem-header { margin: 0 !important; text-align: left !important; }
#blog-section .redeem-header label { font-size: 15px; color: #d4ded8; margin: 0 0 8px; }
#blog-section .code-input-wrapper { display: block; margin-bottom: 24px; width: 100%; }
#blog-section #code-input { text-align: left; letter-spacing: .08em; }
#blog-section .alert { border-radius: 12px; line-height: 1.8; overflow-wrap: anywhere; }
#blog-section #login-message { display: none; margin-top: 16px; padding: 12px; border-radius: 10px; }
#blog-section .text-error { background: #fff0f2; color: #8a2533; border: 1px solid #efb6bf; padding: 12px; border-radius: 10px; }
#blog-section #login-message.text-success { background: #e7f9ee; color: #155734; }
/* Tables keep their existing data and pagination. */
.winners-section .winners-table-shell, #blog-section .table-responsive { border: 1px solid rgba(229,205,144,.28); border-radius: 18px; overflow: auto; background: #f7faf6; }
.winners-section table, #blog-section .history-table { width: 100% !important; margin: 0 !important; border: 0 !important; border-collapse: collapse; border-radius: 0; font-family: inherit; font-size: 15px; table-layout: fixed; }
.winners-section table :is(th,td), #blog-section .history-table :is(th,td) { padding: 18px 16px !important; height: auto !important; border: 0 !important; border-bottom: 1px solid #e0e9e2 !important; text-align: left; vertical-align: middle; line-height: 1.7; white-space: normal; overflow-wrap: anywhere; }
.winners-section table th, #blog-section .history-table th { background: #064332 !important; color: #e5cd90 !important; font-weight: 600; font-size: 14px; }
.winners-section table th center { text-align: left; }
.winners-section table td, #blog-section .history-table td { background: #f7faf6 !important; color: #234b39 !important; }
.winners-section table tr:nth-child(even) td, #blog-section .history-table tr:nth-child(even) td { background: #edf3ed !important; }
.winners-section table tr:hover td, #blog-section .history-table tr:hover td { background: #e6efe7 !important; }
#blog-section .history-table tr:hover { transform: none; }
.winners-section table th:first-child { width: 70px; }
#blog-section .history-table td.success { color: #146440 !important; font-weight: 600; }
#blog-section .history-table td.warning { color: #8a611a !important; font-weight: 600; }
#blog-section .history-table td[colspan] { padding: 32px 18px !important; text-align: center; }
.winners-section .winners-empty td { text-align: center !important; padding: 36px 20px !important; }
.winners-section .custom-pagination { margin: 22px 0 0 !important; font-family: inherit; }
.winners-section .custom-pagination ul { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; margin: 0 !important; }
.winners-section .custom-pagination button { min-width: 46px; min-height: 46px; padding: 10px 16px; margin: 0 !important; border: 1px solid rgba(229,205,144,.4); border-radius: 12px; background: #064332; color: #e5cd90; font-family: inherit; }
.winners-section .custom-pagination button:disabled { opacity: .4; }
.winners-section .custom-pagination span { color: #f2e1b6; font-size: 14px; }
#blog-section .panel-footer { float: none !important; margin-top: 20px; overflow-wrap: anywhere; }
#blog-section .pagination { flex-wrap: wrap; justify-content: center; gap: 6px; }
#blog-section .page-link { border-radius: 8px; color: #e5cd90; border-color: rgba(229,205,144,.3); background: transparent; margin: 0; }
#blog-section .page-item.active .page-link { background: #e5cd90; color: #153f30; border-color: #e5cd90; }
@media (max-width: 767px) {
 #blog-section.rewards-section { padding: 28px 0; }
 #blog-section .reward-panel { border-radius: 18px !important; }
 #blog-section .reward-panel > .card-body { padding: 24px 18px !important; }
 #blog-section .reward-panel h4, #blog-section .reward-panel-title { font-size: 23px !important; }
 .winners-section table, .winners-section tbody, #blog-section .history-table, #blog-section .history-table tbody { display: block; }
 .winners-section table thead, #blog-section .history-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
 .winners-section table tr, #blog-section .history-table tr { display: block; padding: 14px 16px; border-bottom: 1px solid #d8e4d9; background: #f7faf6; }
 .winners-section table tr:nth-child(even), #blog-section .history-table tr:nth-child(even) { background: #edf3ed; }
 .winners-section table td, #blog-section .history-table td { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 12px; padding: 8px 0 !important; border: 0 !important; background: transparent !important; font-size: 14px; }
 .winners-section table td::before, #blog-section .history-table td[data-label]::before { content: attr(data-label); color: #718274; font-weight: 400; }
 .winners-section .winners-empty td, #blog-section .history-table td[colspan] { display: block; }
 .winners-section .winners-empty td::before { display: none; }
 .winners-section table tr:hover td, #blog-section .history-table tr:hover td { background: transparent !important; }
 .winners-section > .container, .winners-section .container > .row { padding-top: 12px !important; padding-bottom: 12px !important; }
}
.winners-section { scroll-margin-top: 100px; }
.winners-section .winners-table-shell { scroll-margin-top: 100px; }
.winners-section table { font-weight: 400; }
.winners-section .winner-cell-value { min-width: 0; }
#blog-section .reward-intro { font-weight: 400; }
/* Keep previous / page / next together, including inside narrow mobile sections. */
.winners-section .custom-pagination ul.custom-pagination {
 display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important;
 align-items: center !important; justify-content: center !important;
 width: 100% !important; padding: 0 !important; margin: 0 !important; gap: 12px;
 list-style: none;
}
.winners-section .custom-pagination ul.custom-pagination > li { display: block !important; float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; flex: 0 0 auto; }
.winners-section .custom-pagination span { display: inline-block; white-space: nowrap; }
.campaign-brand-logo { display: inline-block; vertical-align: middle; overflow: hidden; }
@media (max-width: 767px) {
 .winners-section .custom-pagination button { min-width: 40px; min-height: 40px; padding: 8px 12px; }
 .winners-section .custom-pagination span { font-size: 13px; }
 .winners-section .header-qt { margin-top: 24px !important; }
 .winners-section .header-qt .campaign-brand-logo { width: 54px; height: 77px; }
}
@media (max-width: 767px) {
 .winners-section .top-115 { margin-top: 0 !important; }
 .winners-section > .row.mb-5-1 { margin: 0 auto 20px !important; }
 .winners-section .post { margin: 0 !important; width: 100% !important; }
 .winners-section .post-center { margin-left: 0 !important; }
 .winners-section .header-qt { margin-top: 0 !important; }
}
/* Winner lists remain tabular on phones; redemption history keeps its own layout. */
@media (max-width: 767px) {
 .winners-section .winners-table-shell { overflow-x: auto; border-radius: 14px; }
 .winners-section table { display: table; table-layout: fixed; font-size: 12px; }
 .winners-section table thead { display: table-header-group; position: static; width: auto; height: auto; overflow: visible; clip-path: none; }
 .winners-section table tbody { display: table-row-group; }
 .winners-section table tr { display: table-row; padding: 0; }
 .winners-section table :is(th,td) { display: table-cell; padding: 12px 9px !important; vertical-align: top; line-height: 1.65; border-bottom: 1px solid #dce6de !important; font-size: 12px; }
 .winners-section table th:first-child { width: 36px; }
 .winners-section table th:nth-child(2) { width: 90px; }
 .winners-section table td::before { display: none; }
 .winners-section table tr:nth-child(even) td { background: #edf3ed !important; }
 .winners-section .winners-empty td { display: table-cell; padding: 28px 12px !important; }
 .winners-section .winner-cell-value { display: block; }
}
@media (max-width: 767px) {
 .winners-section table.winners-mobile-table { table-layout: auto; }
 .winners-section table.winners-mobile-table th:first-child { width: 38px; }
 .winners-section table.winners-mobile-table th:nth-child(2) { width: auto; }
 .winners-section .winners-mobile-table :is(th,td) { white-space: nowrap; overflow-wrap: normal; word-break: normal; }
 .winners-section .winners-mobile-table :is(.winner-mobile-name,.winner-mobile-detail,.winner-mobile-date) { display: block; white-space: nowrap; }
 .winners-section .winner-mobile-name { font-weight: 600; }
 .winners-section .winner-mobile-detail { margin-top: 3px; }
 .winners-section .winner-mobile-date { margin-top: 4px; color: #64796a; font-size: 11px; }
 .winners-section .winners-mobile-table .winners-empty td { white-space: normal; }
}
@media (max-width: 767px) {
 .winners-section table.winners-mobile-table { table-layout: fixed; }
 .winners-section table.winners-mobile-table th:first-child { width: 30px; }
 .winners-section table.winners-mobile-table th:nth-child(2) { width: 44%; }
 .winners-section table.winners-mobile-table :is(th,td) { padding: 11px 7px !important; font-size: 11px; }
 .winners-section table.winners-mobile-table th { white-space: normal; }
 .winners-section .winners-mobile-table .winner-mobile-detail { margin-top: 0; }
 .winners-section .winners-mobile-table td { overflow-wrap: normal; }
}
@media (max-width: 767px) {
 .winners-section .winners-mobile-table .winner-mobile-name,
 .winners-section .winners-mobile-table td:nth-child(3) .winner-mobile-detail { white-space: normal; overflow-wrap: normal; word-break: normal; }
 .winners-section .winners-mobile-table .winner-mobile-date { white-space: nowrap; }
}
#blog-section .reward-panel h4,
#blog-section .reward-panel-title,
#blog-section .reward-intro { text-align: center !important; }
.campaign-brand-logo { background: transparent !important; border: none !important; box-shadow: none !important; }
#blog-section .reward-sms-guide span { display: block; line-height: 1.8; }
#blog-section .reward-sms-guide span:first-child { white-space: nowrap; }
@media (max-width: 575px) {
 #blog-section .reward-sms-guide { font-size: 12px; }
 #blog-section .reward-sms-guide span { margin-bottom: 3px; }
}

#blog-section .reward-panel .reward-sms-guide { text-align: center !important; }
#blog-section .reward-sms-guide .reward-sms-instruction { white-space: nowrap; font-size: 12px; }
@media (max-width: 575px) {
 #blog-section .reward-sms-guide .reward-sms-instruction { font-size: clamp(8px, 2.35vw, 12px); }
 #blog-section .reward-sms-guide { text-align: center !important; }
}