/* AIEO Checkout Notice Modal — clean, modern restyle. Same `.om-wc-*` class
 * names preserved for back-compat. Notice rows no longer reuse WooCommerce's
 * `.woocommerce-error` (pink box + misaligned icon-font glyph); they use the
 * neutral `.om-wc-notice` rows styled below. Brand accent = #F46767.
 * Badge icons are SVG-drawn discs (glyph centered in the viewBox) so the icon
 * is perfectly centered regardless of font metrics. */

/* Overlay + card */
.om-wc-modal-overlay{position:fixed;inset:0;background:rgba(17,24,39,.55);display:none;z-index:99998}
.om-wc-modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);max-width:480px;width:calc(100% - 2rem);background:#fff;border-radius:16px;box-shadow:0 16px 48px rgba(17,24,39,.22);z-index:99999;display:none;overflow:hidden;font-family:inherit}
.om-wc-modal-header{padding:16px 20px;border-bottom:1px solid #f0f0f3;display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.om-wc-modal-title{font-size:1.05rem;font-weight:700;color:#111827;margin:0;line-height:1.3}
.om-wc-modal-close{background:transparent;border:0;font-size:1.4rem;line-height:1;cursor:pointer;color:#9ca3af;width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;transition:background .15s ease,color .15s ease}
.om-wc-modal-close:hover{background:#f3f4f6;color:#111827}
.om-wc-modal-body{padding:18px 20px;max-height:70vh;overflow:auto}

/* Notice rows — icon + text vertically centered as a pair */
.om-wc-notices{display:flex;flex-direction:column;gap:10px}
.om-wc-modal .om-wc-notice{display:flex;align-items:center;gap:11px;margin:0;padding:12px 15px;border:1px solid #f9d6d6;border-left:4px solid #F46767;border-radius:10px;background:#fef2f2;color:#7a2e2e;font-size:.92rem;line-height:1.5;box-shadow:none}
.om-wc-modal .om-wc-notice::before{content:"";flex:0 0 20px;width:20px;height:20px;background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2020%2020'%3E%3Ccircle%20cx='10'%20cy='10'%20r='10'%20fill='%23F46767'/%3E%3Crect%20x='9'%20y='4.3'%20width='2'%20height='7'%20rx='1'%20fill='%23fff'/%3E%3Ccircle%20cx='10'%20cy='14.6'%20r='1.15'%20fill='%23fff'/%3E%3C/svg%3E") center/contain no-repeat}
.om-wc-modal .om-wc-notice-text{flex:1 1 auto;min-width:0}
.om-wc-modal .om-wc-notice-text a{color:inherit;text-decoration:underline;font-weight:600}
.om-wc-modal .om-wc-notice--info{border-color:#cfe2ff;border-left-color:#2563eb;background:#eff6ff;color:#1e3a8a}
.om-wc-modal .om-wc-notice--info::before{background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2020%2020'%3E%3Ccircle%20cx='10'%20cy='10'%20r='10'%20fill='%232563eb'/%3E%3Ccircle%20cx='10'%20cy='5.7'%20r='1.15'%20fill='%23fff'/%3E%3Crect%20x='9'%20y='8.4'%20width='2'%20height='7'%20rx='1'%20fill='%23fff'/%3E%3C/svg%3E") center/contain no-repeat}
.om-wc-modal .om-wc-notice--success{border-color:#cdebd6;border-left-color:#16a34a;background:#f0fdf4;color:#14532d}
.om-wc-modal .om-wc-notice--success::before{background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2020%2020'%3E%3Ccircle%20cx='10'%20cy='10'%20r='10'%20fill='%2316a34a'/%3E%3Cpath%20d='M5.8%2010.3l2.6%202.6%205.8-5.8'%20fill='none'%20stroke='%23fff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}

/* WooCommerce block order-summary quantity badge — ALIGNMENT ONLY, no recolour.
 * WC already flex-centers the number, but its text line box reserves descender
 * space so the digit sits a touch high; nudge the visible digit down to optical
 * centre. Colour stays WooCommerce's default. Loaded only on checkout. */
.wc-block-components-order-summary .wc-block-components-order-summary-item__quantity{
  align-items:center;
  justify-content:center;
}
.wc-block-components-order-summary .wc-block-components-order-summary-item__quantity span[aria-hidden="true"]{
  display:block;
  line-height:1;
  transform:translateY(1px);
}

/* Body lock + hide the original inline notices (classic + block) while open */
body.om-wc-notice-open{overflow:hidden}
body.om-wc-notice-open .woocommerce-NoticeGroup-checkout,
body.om-wc-notice-open .woocommerce-notices-wrapper,
body.om-wc-notice-open .wc-block-components-notice-banner{display:none!important}

@media (max-width:480px){
  .om-wc-modal{border-radius:14px}
  .om-wc-modal-header{padding:14px 16px}
  .om-wc-modal-body{padding:16px}
}