/*
Theme Name: Papír Partner
Theme URI: https://papirpartner.hu
Author: Papír Partner
Description: Egyedi blokk-téma a Papír Partner WooCommerce webshophoz. Indigó–menta arculat, B2B-re hangolt termék- és pénztároldalakkal.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: papirpartner
Tags: full-site-editing, block-patterns, e-commerce, custom-colors, wide-blocks
*/

/* ==================================================================
   1. TOKENEK
   Ugyanazok az értékek, mint a főoldali HTML blokkban.
   Ha itt átírod, az egész oldal követi.
   ================================================================== */
:root{
  --pp-ink:#1B1940;
  --pp-brand:#2D2A72;
  --pp-brand-hi:#3E3A96;
  --pp-mint:#4FE0B0;
  --pp-mint-dk:#137360;
  --pp-sun:#FFD166;
  --pp-sun-ink:#5C4207;
  --pp-paper:#F6F5FF;
  --pp-white:#FFFFFF;
  --pp-line:#CFCCE8;
  --pp-hair:#E7E5F5;
  --pp-muted:#63608A;

  --pp-display:'Bricolage Grotesque',ui-sans-serif,system-ui,sans-serif;
  --pp-body:'Instrument Sans',ui-sans-serif,system-ui,sans-serif;
  --pp-mono:'IBM Plex Mono',ui-monospace,monospace;

  --pp-radius:14px;
  --pp-radius-lg:18px;
}

/* A főoldali HTML blokk saját tokenjeit is innen tápláljuk,
   így egy helyen kell színt váltani. */
.pp{
  --ink:var(--pp-ink);
  --brand:var(--pp-brand);
  --brand-hi:var(--pp-brand-hi);
  --mint:var(--pp-mint);
  --mint-dk:var(--pp-mint-dk);
  --sun:var(--pp-sun);
  --sun-ink:var(--pp-sun-ink);
  --paper:var(--pp-paper);
  --white:var(--pp-white);
  --line:var(--pp-line);
  --hair:var(--pp-hair);
  --muted:var(--pp-muted);
}

/* ==================================================================
   2. ALAPOK
   ================================================================== */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}

:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:3px solid var(--pp-sun);
  outline-offset:3px;
  border-radius:6px
}

.pp-skip{
  position:absolute;left:-9999px;top:0;z-index:9999;
  background:var(--pp-brand);color:#fff;padding:12px 20px;border-radius:0 0 10px 0
}
.pp-skip:focus{left:0}

.pp-eyebrow{
  font-family:var(--pp-mono);font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--pp-mint-dk)
}
.pp-mono{font-family:var(--pp-mono)}
.pp-muted{color:var(--pp-muted)}

/* perforáció-elválasztó: <hr> „is-style-pp-perf" stílussal */
.wp-block-separator.is-style-pp-perf{
  border:0;height:4px;max-width:100%;opacity:1;
  background-image:radial-gradient(circle,var(--pp-line) 1.6px,transparent 1.7px);
  background-size:13px 4px;background-repeat:repeat-x;background-position:center
}

/* ==================================================================
   3. FEJLÉC
   ================================================================== */
.pp-header{
  background:var(--pp-white);
  border-bottom:1px solid var(--pp-hair);
  position:sticky;top:0;z-index:100
}
.admin-bar .pp-header{top:32px}
@media(max-width:782px){.admin-bar .pp-header{top:46px}}

.pp-header .wp-block-site-title a{
  font-family:var(--pp-display);font-weight:800;font-size:22px;
  letter-spacing:-.02em;color:var(--pp-brand);text-decoration:none
}
.pp-header .wp-block-navigation{
  font-family:var(--pp-body);font-weight:500;font-size:15.5px
}
.pp-header .wp-block-navigation a{text-decoration:none;color:var(--pp-ink)}
.pp-header .wp-block-navigation a:hover{color:var(--pp-mint-dk)}
.pp-header .wp-block-navigation .current-menu-item a{color:var(--pp-brand);font-weight:600}

/* bejelentés-sáv a fejléc fölött */
.pp-topbar{
  background:var(--pp-ink);color:#EDECFA;
  font-family:var(--pp-mono);font-size:12.5px;letter-spacing:.03em
}
.pp-topbar a{color:#8FEBCC;text-decoration:none}
.pp-topbar a:hover{text-decoration:underline}

/* ==================================================================
   4. LÁBLÉC
   ================================================================== */
.pp-footer{background:var(--pp-ink);color:#C6C3E4}
.pp-footer a{color:#C6C3E4;text-decoration:none}
.pp-footer a:hover{color:var(--pp-mint);text-decoration:underline}
.pp-footer h2,.pp-footer h3{
  color:var(--pp-white);font-family:var(--pp-display);
  font-size:15px;font-weight:600;letter-spacing:.02em
}
.pp-footer .wp-block-navigation{font-size:14.5px}
.pp-footer .wp-block-navigation ul{gap:9px!important}
.pp-footer-legal{
  border-top:1px solid rgba(255,255,255,.14);
  font-family:var(--pp-mono);font-size:12px;color:#8E8AB8
}

/* ==================================================================
   5. GOMBOK – globális változatok
   ================================================================== */
.wp-block-button__link{transition:transform .18s ease,background .18s ease,border-color .18s ease}
.wp-block-button__link:hover{transform:translateY(-2px)}

.is-style-pp-mint .wp-block-button__link{background:var(--pp-mint);color:#0C3B2C}
.is-style-pp-mint .wp-block-button__link:hover{background:#6BEBC2}

.is-style-pp-dark .wp-block-button__link{background:var(--pp-brand);color:#fff}
.is-style-pp-dark .wp-block-button__link:hover{background:var(--pp-brand-hi)}

.is-style-pp-line .wp-block-button__link{
  background:var(--pp-white);color:var(--pp-brand);
  border:2px solid var(--pp-line)
}
.is-style-pp-line .wp-block-button__link:hover{border-color:var(--pp-brand)}

/* ==================================================================
   6. WOOCOMMERCE – közös
   ================================================================== */
.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wc-block-components-button{
  font-family:var(--pp-body)!important;
  font-weight:600!important;
  font-size:15.5px!important;
  border-radius:100px!important;
  padding:13px 24px!important;
  background:var(--pp-brand)!important;
  color:var(--pp-white)!important;
  border:0!important;
  line-height:1.3!important;
  transition:background .18s ease,transform .18s ease
}
.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce #respond input#submit:hover,
.wc-block-components-button:hover{
  background:var(--pp-brand-hi)!important;transform:translateY(-2px)
}

.woocommerce button.button.alt,
.woocommerce .single_add_to_cart_button,
.woocommerce .checkout-button,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button{
  background:var(--pp-sun)!important;
  color:var(--pp-sun-ink)!important
}
.woocommerce button.button.alt:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce .checkout-button:hover,
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover{
  background:#FFDD8C!important
}

/* űrlapmezők */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .quantity input.qty,
.wc-block-components-text-input input{
  border:1px solid var(--pp-line)!important;
  border-radius:10px!important;
  padding:12px 14px!important;
  font-family:var(--pp-body)!important;
  font-size:15.5px!important;
  background:var(--pp-white)!important;
  color:var(--pp-ink)!important
}
.woocommerce form .form-row input.input-text:focus,
.wc-block-components-text-input input:focus{
  border-color:var(--pp-brand)!important;
  box-shadow:0 0 0 3px rgba(45,42,114,.12)!important;
  outline:none!important
}

/* értesítések */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner{
  border-radius:var(--pp-radius)!important;
  border:1px solid var(--pp-hair)!important;
  border-top:0!important;
  background:var(--pp-white)!important;
  color:var(--pp-ink)!important;
  font-size:15px
}
.woocommerce-message{border-left:4px solid var(--pp-mint-dk)!important}
.woocommerce-info{border-left:4px solid var(--pp-brand)!important}
.woocommerce-error{border-left:4px solid #C43B3B!important}
.woocommerce-message::before{color:var(--pp-mint-dk)!important}
.woocommerce-info::before{color:var(--pp-brand)!important}

/* árak */
.woocommerce .price,
.woocommerce ul.products li.product .price,
.wc-block-components-product-price{
  color:var(--pp-brand)!important;
  font-family:var(--pp-display);
  font-weight:800;
  letter-spacing:-.01em
}
.woocommerce .price del{
  color:var(--pp-muted)!important;font-weight:400;opacity:.75;
  font-family:var(--pp-body);font-size:.85em
}
.woocommerce .price ins{text-decoration:none;background:transparent}

/* ==================================================================
   7. WOOCOMMERCE – terméklista (shop, kategória)
   ================================================================== */
.woocommerce ul.products{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px!important;
  margin:0!important
}
.woocommerce ul.products::before,
.woocommerce ul.products::after{display:none!important}
.woocommerce ul.products li.product{
  width:100%!important;margin:0!important;float:none!important;
  background:var(--pp-white);
  border:1px solid var(--pp-hair);
  border-radius:var(--pp-radius-lg);
  padding:16px 16px 20px;
  display:flex;flex-direction:column;
  transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease
}
.woocommerce ul.products li.product:hover{
  border-color:var(--pp-mint-dk);
  transform:translateY(-3px);
  box-shadow:0 14px 34px rgba(27,25,64,.10)
}
.woocommerce ul.products li.product img{
  border-radius:10px;margin-bottom:14px;background:var(--pp-paper)
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--pp-display)!important;
  font-weight:600!important;
  font-size:17px!important;
  line-height:1.25!important;
  letter-spacing:-.01em;
  padding:0!important;margin:0 0 8px!important;
  color:var(--pp-ink)
}
.woocommerce ul.products li.product .price{
  font-size:19px!important;margin:0 0 4px!important;display:block
}
.woocommerce ul.products li.product .button{
  margin-top:auto!important;width:100%;text-align:center
}
.woocommerce ul.products li.product .star-rating{
  font-size:.8em;color:var(--pp-sun);margin:0 0 10px
}
.woocommerce span.onsale{
  background:var(--pp-mint)!important;color:#0C3B2C!important;
  font-family:var(--pp-mono);font-size:11.5px;font-weight:500;
  letter-spacing:.05em;text-transform:uppercase;
  border-radius:100px;padding:5px 12px;
  min-height:0;min-width:0;line-height:1.4;
  top:14px;left:14px;margin:0
}

/* rendezés és találatszám */
.woocommerce .woocommerce-ordering select,
.woocommerce .woocommerce-result-count{
  font-family:var(--pp-body);font-size:14.5px;color:var(--pp-muted)
}
.woocommerce nav.woocommerce-pagination ul{border:0!important;gap:6px;display:flex}
.woocommerce nav.woocommerce-pagination ul li{border:0!important}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
  border-radius:10px;padding:10px 15px;
  border:1px solid var(--pp-hair);background:var(--pp-white);
  font-family:var(--pp-mono);font-size:14px
}
.woocommerce nav.woocommerce-pagination ul li span.current{
  background:var(--pp-brand);color:#fff;border-color:var(--pp-brand)
}

@media(max-width:1000px){ .woocommerce ul.products{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media(max-width:760px){  .woocommerce ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px!important} }
@media(max-width:420px){  .woocommerce ul.products{grid-template-columns:1fr} }

/* ==================================================================
   8. WOOCOMMERCE – termékoldal
   ================================================================== */
.woocommerce div.product .product_title{
  font-family:var(--pp-display);font-weight:800;
  font-size:clamp(26px,3.2vw,38px);line-height:1.08;letter-spacing:-.02em;
  margin-bottom:10px
}
.woocommerce div.product .summary .price{font-size:30px!important;margin:14px 0 6px!important}
.woocommerce div.product .woocommerce-product-details__short-description{
  color:var(--pp-muted);font-size:16px;margin-bottom:20px
}
.woocommerce div.product .stock.in-stock{
  color:var(--pp-mint-dk)!important;font-family:var(--pp-mono);
  font-size:13.5px;letter-spacing:.04em
}
.woocommerce div.product .stock.out-of-stock{color:#C43B3B!important;font-family:var(--pp-mono);font-size:13.5px}
.woocommerce div.product form.cart{
  display:flex;gap:12px;align-items:center;flex-wrap:wrap;
  padding:20px 0;border-top:1px solid var(--pp-hair);border-bottom:1px solid var(--pp-hair);
  margin:18px 0 20px
}
.woocommerce div.product form.cart .quantity input.qty{width:88px;text-align:center}
.woocommerce div.product form.cart .single_add_to_cart_button{flex:1;min-width:190px}

/* fülek */
.woocommerce div.product .woocommerce-tabs ul.tabs{padding:0!important;margin:0 0 22px!important;border:0!important;display:flex;gap:6px;flex-wrap:wrap}
.woocommerce div.product .woocommerce-tabs ul.tabs::before{display:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background:transparent!important;border:1px solid var(--pp-line)!important;
  border-radius:100px!important;margin:0!important;padding:0!important
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  padding:10px 20px!important;font-weight:500;font-size:15px;
  color:var(--pp-ink)!important;text-decoration:none
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{
  background:var(--pp-brand)!important;border-color:var(--pp-brand)!important
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:#fff!important}
.woocommerce div.product .woocommerce-tabs .panel h2{font-size:22px;margin-bottom:12px}

.woocommerce table.shop_attributes{border:1px solid var(--pp-hair);border-radius:var(--pp-radius);overflow:hidden;border-collapse:separate;border-spacing:0}
.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td{border-bottom:1px solid var(--pp-hair)!important;padding:12px 16px!important;font-style:normal!important}
.woocommerce table.shop_attributes th{background:var(--pp-paper);font-family:var(--pp-mono);font-size:13px;font-weight:500;letter-spacing:.03em;width:38%}

/* B2B bizalmi lista a kosárgomb alatt (lásd functions.php) */
.pp-assure{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:9px}
.pp-assure li{display:flex;gap:10px;align-items:flex-start;font-size:15px;color:var(--pp-ink)}
.pp-assure svg{flex:0 0 auto;margin-top:4px;stroke:var(--pp-mint-dk);stroke-width:2.4}

/* egységár kiemelés */
.pp-unit-price{
  font-family:var(--pp-mono);font-size:13.5px;color:var(--pp-muted);
  display:block;margin-top:2px
}

/* ==================================================================
   9. WOOCOMMERCE – kosár és pénztár
   ================================================================== */
.woocommerce table.shop_table{
  border:1px solid var(--pp-hair)!important;
  border-radius:var(--pp-radius-lg)!important;
  border-collapse:separate!important;border-spacing:0;
  background:var(--pp-white);overflow:hidden
}
.woocommerce table.shop_table th{
  background:var(--pp-paper);
  font-family:var(--pp-mono);font-size:12px;font-weight:500;
  letter-spacing:.08em;text-transform:uppercase;color:var(--pp-muted);
  padding:14px 16px!important
}
.woocommerce table.shop_table td{padding:16px!important;border-top:1px solid var(--pp-hair)!important}
.woocommerce table.shop_table img{border-radius:8px;width:64px}

.woocommerce .cart_totals h2,
.woocommerce-checkout h3{font-family:var(--pp-display);font-weight:800;font-size:21px;letter-spacing:-.01em;margin-bottom:14px}
.woocommerce .cart-collaterals .cart_totals,
.woocommerce-checkout #order_review{
  background:var(--pp-white);border:1px solid var(--pp-hair);
  border-radius:var(--pp-radius-lg);padding:24px
}
.woocommerce-checkout #payment{
  background:var(--pp-paper)!important;border-radius:var(--pp-radius)!important;
  border:1px solid var(--pp-hair)
}
.woocommerce-checkout #payment ul.payment_methods{border-bottom:1px solid var(--pp-hair)!important}
.woocommerce-checkout #payment div.payment_box{background:var(--pp-white)!important;border-radius:10px;font-size:14.5px}
.woocommerce-checkout #payment div.payment_box::before{border-bottom-color:var(--pp-white)!important}

/* lépésjelző (functions.php illeszti be) */
.pp-steps{
  display:flex;gap:8px;flex-wrap:wrap;align-items:center;
  font-family:var(--pp-mono);font-size:12.5px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--pp-muted);
  margin:0 0 28px;padding:0;list-style:none
}
.pp-steps li{display:flex;align-items:center;gap:8px}
.pp-steps li::after{content:"→";color:var(--pp-line)}
.pp-steps li:last-child::after{content:""}
.pp-steps li[aria-current="step"]{color:var(--pp-brand);font-weight:500}

/* ==================================================================
   10. BLOKK-SZERKESZTŐBEN IS LÁTSZÓ SEGÉDOSZTÁLYOK
   ================================================================== */
.pp-card{
  background:var(--pp-white);border:1px solid var(--pp-hair);
  border-radius:var(--pp-radius-lg);padding:26px
}
.pp-panel-dark{background:var(--pp-brand);color:var(--pp-white);border-radius:var(--pp-radius-lg);padding:clamp(28px,4vw,48px)}
.pp-panel-dark a{color:var(--pp-mint)}

/* ==================================================================
   11. NYOMTATÁS (számla, rendelés-visszaigazolás)
   ================================================================== */
@media print{
  .pp-header,.pp-footer,.pp-topbar,.pp-skip,.woocommerce-message,.pp-steps{display:none!important}
  body{background:#fff!important;color:#000!important}
  .woocommerce table.shop_table{border:1px solid #999!important}
}