/* Basic, theme-friendly styling */
.ob-wrap{max-width:none;width:100%;margin:24px 0;padding:0 12px}
.ob-section{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:14px;padding:18px;margin:16px 0;box-shadow:0 3px 10px rgba(0,0,0,.04)}
.ob-muted{opacity:.7;font-size:.95em}
.ob-notice{padding:12px 14px;border-radius:12px;background:rgba(0,0,0,.04)}
.ob-notice.ob-success{background:rgba(0,150,80,.08)}
.ob-notice.ob-error{background:rgba(200,0,0,.08)}
.ob-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.ob-card{display:flex;gap:14px;border:1px solid rgba(0,0,0,.08);border-radius:14px;overflow:hidden;background:#fff}
.ob-card--small{flex-direction:column;gap:0}
.ob-card__img{width:180px;object-fit:cover}
.ob-card--small .ob-card__img{width:100%;height:130px}
.ob-card__body{padding:14px;flex:1}
.ob-card__title{margin:0 0 6px;font-size:1.1rem;font-weight:700}
.ob-card__meta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
.ob-price{font-weight:700}
.ob-link{font-size:.95em;text-decoration:underline}
.ob-card__actions{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.ob-label{display:flex;flex-direction:column;gap:6px;font-size:.95em}
.ob-input{padding:10px 12px;border-radius:10px;border:1px solid rgba(0,0,0,.18);min-width:140px}
.ob-btn{padding:10px 14px;border-radius:12px;border:1px solid rgba(0,0,0,.15);background:#f8f8f8;cursor:pointer;font-weight:700}
.ob-btn:hover{filter:brightness(.98)}
.ob-btn--primary{background:#111;color:#fff;border-color:#111}
.ob-toggle-upsell.is-active{background:rgba(0,0,0,.06)}
.ob-toast{margin-top:10px;padding:10px 12px;border-radius:12px}
.ob-toast.is-ok{background:rgba(0,150,80,.08)}
.ob-toast.is-err{background:rgba(200,0,0,.08)}
.ob-table{width:100%;display:block;border:1px solid rgba(0,0,0,.08);border-radius:14px;overflow:hidden}
.ob-table__head,.ob-table__row{display:grid;grid-template-columns: 2fr 1fr 1fr 1fr auto;gap:10px;align-items:center;padding:12px 12px}
.ob-table__head{background:rgba(0,0,0,.03);font-weight:700}
.ob-table__row{border-top:1px solid rgba(0,0,0,.06)}
.ob-cell--title{display:flex;gap:12px;align-items:center}
.ob-thumb{width:54px;height:54px;object-fit:cover;border-radius:10px}
.ob-title{font-weight:700}
.ob-qty{padding:8px 10px;border-radius:10px;border:1px solid rgba(0,0,0,.18);width:110px}
.ob-linkbtn{background:none;border:none;color:#000;text-decoration:underline;cursor:pointer;padding:0}
.ob-summary{margin-top:14px;display:grid;gap:8px}
.ob-summary__row{display:flex;justify-content:space-between;align-items:center}
.ob-summary__row--total{font-size:1.05rem}
.ob-form__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ob-form__grid label{display:flex;flex-direction:column;gap:6px}
.ob-form__grid input,.ob-form__grid textarea{padding:10px 12px;border-radius:10px;border:1px solid rgba(0,0,0,.18)}
.ob-form__wide{grid-column:1 / -1}
.ob-checkbox{flex-direction:row!important;align-items:center;gap:10px}
.ob-info{margin-top:12px}
@media (max-width:700px){
  .ob-card{flex-direction:column}
  .ob-card__img{width:100%;height:160px}
  .ob-table__head,.ob-table__row{grid-template-columns: 1fr 1fr;grid-auto-rows:auto}
  .ob-table__head div:nth-child(3), .ob-table__head div:nth-child(4), .ob-table__head div:nth-child(5){display:none}
  .ob-table__row > div{padding:4px 0}
  .ob-table__row .ob-linkbtn{justify-self:end}
  .ob-form__grid{grid-template-columns:1fr}
}


/* Minimal product shortcode */
.ob-mini{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.ob-title-link{font-weight:700;text-decoration:underline}
.ob-desc{margin-top:4px;font-size:.92em;opacity:.78;line-height:1.35}

/* Diagonal ribbon for upsells */
.ob-upsell-row, .ob-card--small{position:relative}
.ob-ribbon{position:absolute;top:10px;left:-34px;transform:rotate(-35deg);pointer-events:none}
.ob-ribbon span{display:inline-block;padding:6px 46px;background:#111;color:#fff;font-weight:700;font-size:.8em;border-radius:10px;box-shadow:0 3px 10px rgba(0,0,0,.18)}
.ob-table--upsells .ob-table__row{position:relative}

.ob-js .ob-upsell-save{display:none;}

.ob-upsells-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width: 980px){.ob-upsells-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width: 640px){.ob-upsells-grid{grid-template-columns:1fr;}}
.ob-card__img img{width:100%;height:160px;object-fit:cover;display:block}
.ob-upsell-save{display:none !important}
.ob-added-msg{margin-top:8px;font-weight:600;}

/* Upsells: fixed max 3 per row without stretching */
.ob-grid{display:grid;grid-template-columns:repeat(3,minmax(0,360px));gap:18px;justify-content:start;align-content:start}
@media (max-width: 1100px){.ob-grid{grid-template-columns:repeat(2,minmax(0,360px));}}
@media (max-width: 720px){.ob-grid{grid-template-columns:1fr;}}
/* Make sure images don't stretch */
.ob-card__img img{width:100%;height:160px;object-fit:cover;display:block}
/* Hide save button text for upsell qty (autosave) */
.ob-upsell-save{display:none !important}