.subscriptions-view{flex:1 1 auto;min-width:0;min-height:0;height:calc(100vh - 42px);padding:30px clamp(22px,3vw,44px) 42px;overflow:auto;background:#f5f7fa;color:#102035;scrollbar-gutter:stable}
.subscriptions-inner{width:min(1180px,100%);margin:0 auto}
.content .subscriptions-header{display:flex;flex:none;height:auto;padding:0;border:0;background:transparent;align-items:flex-start;justify-content:space-between;gap:28px;margin:0 0 22px}
.subscriptions-heading{min-width:0;max-width:720px}
.subscriptions-heading>span{display:block;color:#267158;font-size:11px;font-weight:800;letter-spacing:.11em;line-height:1.2}
.subscriptions-header h1{margin:6px 0 7px;font-size:28px;line-height:1.15;letter-spacing:-.015em}
.subscriptions-header p{margin:0;color:#687586;font-size:14px;line-height:1.5}
.subscriptions-header-actions{display:flex;flex:0 0 auto;align-items:center;gap:9px;padding-top:2px}
.subscriptions-header-actions button{min-height:42px;padding:9px 14px;border:1px solid #ccddd6;background:#fff;color:#245543;white-space:nowrap}
.subscriptions-header-actions button:hover:not(:disabled){border-color:#8db9a8;background:#f4f9f7}
#subscriptions-new{background:#15513e;border-color:#15513e;color:#fff}
#subscriptions-new:hover:not(:disabled){background:#0f3c2e}

.subscriptions-message{min-height:20px;margin:0 0 10px;color:#526b62;font-size:13px;line-height:1.45;overflow-wrap:anywhere}
.subscriptions-message:empty{min-height:0;margin:0}
.subscriptions-message.success{color:#116346;font-weight:650}
.subscriptions-message.error{color:#a43a31}

.subscription-builder{margin-bottom:20px;padding:22px 24px;border:1px solid #b7d8ca;border-radius:15px;background:linear-gradient(135deg,#f7fcfa,#edf8f3)}
.subscription-builder-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:6px}
.subscription-builder-head h2{margin:0;font-size:19px;color:#123d31}
#subscription-builder-close{width:32px;height:32px;border:0;background:transparent;color:#526b62;font-size:20px;line-height:1;cursor:pointer}
#subscription-builder-close:hover{color:#123d31}
.subscription-builder-message{min-height:18px;margin:2px 0 12px;color:#526b62;font-size:13px;line-height:1.4}
.subscription-builder-message:empty{min-height:0;margin:0}
.subscription-builder-message.success{color:#116346;font-weight:650}
.subscription-builder-message.error{color:#a43a31}
#subscription-form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.subscription-field{display:grid;gap:7px;min-width:0}
.subscription-field.wide{grid-column:1/-1}
.subscription-field>span{color:#43564f;font-size:12px;font-weight:700}
.subscription-field input,.subscription-field select{width:100%;box-sizing:border-box;height:44px;padding:0 12px;border:1px solid #d6e0dc;border-radius:8px;background:#fff;color:#18352c;font-size:14px}
.subscription-field input:focus,.subscription-field select:focus{outline:2px solid #8db9a8;outline-offset:1px}

.subscription-product-results{position:relative;display:none;flex-direction:column;gap:2px;margin-top:2px;padding:6px;border:1px solid #d6e0dc;border-radius:10px;background:#fff;box-shadow:0 10px 26px rgba(16,58,45,.1);max-height:260px;overflow:auto}
.subscription-product-results.open{display:flex}
.subscription-product-hit{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:9px 10px;border:0;border-radius:7px;background:transparent;color:#18352c;text-align:left;cursor:pointer}
.subscription-product-hit:hover{background:#eef6f1}
.subscription-product-hit small{color:#77847f;font-size:11px}
.subscription-product-empty{padding:10px;color:#77847f;font-size:12px;text-align:center}

.subscription-items{display:grid;gap:8px}
.subscription-items-empty{margin:0;padding:16px;border:1px dashed #cadad2;border-radius:10px;color:#77847f;font-size:13px;text-align:center}
.subscription-item-row{display:grid;grid-template-columns:minmax(0,1fr) 90px auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid #e4ebe8;border-radius:10px;background:#fff}
.subscription-item-info{display:grid;gap:2px;min-width:0}
.subscription-item-info strong{font-size:13px;overflow-wrap:anywhere}
.subscription-item-info span{color:#77847f;font-size:11px}
.subscription-item-row input[type=number]{height:38px;padding:0 8px;text-align:center}
.subscription-item-row button{min-height:38px;padding:0 12px;border:1px solid #e4bdb8;background:#fff;color:#98372e;white-space:nowrap}
.subscription-item-row button:hover{border-color:#b94c42;background:#b74439;color:#fff}

.subscription-payment-options{display:grid;gap:8px}
.subscription-payment-option{display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid #e4ebe8;border-radius:10px;background:#fff;font-size:13px;color:#18352c;cursor:pointer}
.subscription-payment-option:has(input:checked){border-color:#8db9a8;background:#eef6f1}
.subscription-payment-option input{width:auto;height:auto}

.subscription-builder-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:10px;padding-top:4px}
.subscription-builder-actions button{min-height:44px;padding:0 18px;border:0;background:#15513e;color:#fff;font-weight:750}
.subscription-builder-actions button:hover:not(:disabled){background:#0f3c2e}
.subscription-builder-actions button.secondary{background:#e3ebe8;color:#244b3f}
.subscription-builder-actions button.secondary:hover:not(:disabled){background:#d6e2dd}
.subscription-builder-actions button:disabled{opacity:.6;cursor:not-allowed}

.subscriptions-list{display:grid;align-content:start;gap:14px}
.subscriptions-list[aria-busy=true]{cursor:progress}
.subscription-card{padding:19px 20px 17px;border:1px solid #dce7e2;border-radius:14px;background:#fff;box-shadow:0 5px 18px rgba(16,58,45,.045);transition:border-color .16s ease,box-shadow .16s ease,opacity .16s ease}
.subscription-card:hover{border-color:#bad3c9;box-shadow:0 8px 24px rgba(16,58,45,.075)}
.subscription-card[aria-busy=true]{opacity:.65}
.subscription-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding-bottom:12px;border-bottom:1px solid #edf1ef}
.subscription-card-head>div{display:grid;min-width:0;gap:4px}
.subscription-status-badge{justify-self:start;display:inline-flex;align-items:center;padding:4px 9px;border-radius:999px;background:#e2f2eb;color:#17664d;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.subscription-status-paused .subscription-status-badge{background:#fff3d9;color:#8a5a06}
.subscription-status-cancelled .subscription-status-badge{background:#f4e4e2;color:#98372e}
.subscription-card-head h2{margin:0;color:#123d31;font-size:16px;line-height:1.3;overflow-wrap:anywhere}
.subscription-card-head p{margin:0;color:#687586;font-size:12px}
.subscription-card-meta{flex:0 0 auto;display:grid;justify-items:end;gap:2px;text-align:right}
.subscription-card-meta>span{color:#77847f;font-size:10px;font-weight:750;letter-spacing:.06em}
.subscription-card-meta time{color:#173d32;font-size:13px;font-weight:700}
.subscription-card ul{display:grid;gap:8px;margin:13px 0;padding:0;list-style:none}
.subscription-card li{display:flex;justify-content:space-between;gap:18px;color:#334b43;font-size:13px;line-height:1.4}
.subscription-card li span{min-width:0;overflow-wrap:anywhere}
.subscription-card li b{flex:0 0 auto;color:#173d32;white-space:nowrap}
.subscription-card li.subscription-more{color:#718079;font-size:12px;font-style:italic}
.subscription-no-preview{margin:14px 0;color:#718079;font-size:12px}
.subscription-card-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:13px;border-top:1px solid #edf1ef;color:#66776f;font-size:12px}
.subscription-card-foot>span{line-height:1.4}
.subscription-card-actions{display:flex;flex:0 0 auto;gap:9px}
.subscription-card-actions button{min-height:42px;padding:9px 15px;white-space:nowrap}
.subscription-toggle{border:1px solid #f0d7a4;background:#fff8e8;color:#76540b}
.subscription-toggle:hover:not(:disabled){border-color:#d9ac4c;background:#fdedc7}
.subscription-edit{border:1px solid #ccddd6;background:#fff;color:#245543}
.subscription-edit:hover:not(:disabled){border-color:#8db9a8;background:#f4f9f7}
.subscription-delete{border:1px solid #e4bdb8;background:#fff;color:#98372e}
.subscription-delete:hover:not(:disabled){border-color:#b94c42;background:#b74439;color:#fff}

.subscriptions-empty{display:grid;justify-items:center;gap:9px;padding:50px 24px;border:1px solid #dfe7e4;border-radius:14px;background:#fff;color:#687586;text-align:center}
.subscriptions-empty strong{color:#233f36;font-size:17px}
.subscriptions-empty span{max-width:520px;font-size:13px;line-height:1.5}
.subscriptions-empty button{min-height:42px;margin-top:5px;border:1px solid #c9ddd4;background:#e7f3ee;color:#145c42}
.subscriptions-pagination{display:flex;align-items:center;justify-content:center;gap:14px;padding:22px 0 10px}
.subscriptions-pagination button{min-height:42px;border:1px solid #cbdad4;background:#fff;color:#245543}
.subscriptions-pagination span{color:#68786f;font-size:12px;text-align:center}

@media(max-width:900px){
  .subscriptions-view{height:auto;min-height:calc(100vh - 48px);padding:24px 20px 36px;overflow:visible;scrollbar-gutter:auto}
}

@media(max-width:760px){
  .content>.page.hidden{display:none!important}
  .subscriptions-view{min-height:0;padding:20px 12px 32px}
  .content .subscriptions-header{display:grid;gap:15px;margin-bottom:18px}
  .subscriptions-header h1{font-size:24px}
  .subscriptions-header-actions{display:grid;grid-template-columns:1fr 1fr;width:100%;padding:0}
  .subscriptions-header-actions button{width:100%;white-space:normal}
  .subscription-builder{padding:18px}
  #subscription-form{grid-template-columns:1fr}
  .subscription-builder-actions{display:grid;grid-template-columns:1fr 1fr}
  .subscription-builder-actions button{width:100%}
  .subscription-item-row{grid-template-columns:1fr;gap:8px}
  .subscription-item-row input[type=number]{width:100%}
  .subscription-card{padding:15px}
  .subscription-card-head{display:grid;gap:5px}
  .subscription-card-meta{justify-items:start;text-align:left}
  .subscription-card-foot{display:grid;gap:12px}
  .subscription-card-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
  .subscription-card-actions button{width:100%;padding-inline:6px;white-space:normal}
  .subscriptions-pagination{display:grid;grid-template-columns:1fr 1fr;gap:8px;text-align:center}
  .subscriptions-pagination span{grid-column:1/-1;grid-row:1}
}

@media(max-width:430px){
  .subscriptions-header-actions{grid-template-columns:1fr}
  .subscription-card li{gap:10px}
  .subscription-card-actions{grid-template-columns:1fr}
}