/*
Theme Name: Lukman Batik Blog
Theme URI: https://lukmanbatik.com/blog/
Description: Child theme of Twenty Twenty-Five, matched to the Lukman Batik Workshop site — Recia headings over Supreme text, the amber palette, rounded cards and gradient buttons. Colours and typography live in theme.json so the block editor shows them too; this file only carries what theme.json cannot express.
Author: Lukman Batik Workshop
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Tested up to: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lukman-batik-blog
*/

/* ---------------------------------------------------------------------------
   Buttons — the site uses a horizontal amber gradient. theme.json can only set
   a flat background for the button element, so the gradient is applied here.
   --------------------------------------------------------------------------- */
.wp-element-button,
.wp-block-button__link,
.wp-block-search__button {
  background-image: linear-gradient(90deg, #DE560D 0%, #FF7A18 48%, #FF8A2B 62%, #E45D10 100%);
  border: none;
  color: #fff;
  font-weight: 700;
  border-radius: 999px;
  box-shadow: 0 12px 26px -12px rgba(226, 90, 15, .55);
  transition: transform .2s cubic-bezier(.2, 0, 0, 1), box-shadow .2s ease, filter .2s ease;
}
.wp-element-button:hover,
.wp-block-button__link:hover,
.wp-block-search__button:hover {
  color: #fff;
  transform: translateY(-3px);
  filter: brightness(.95);
  box-shadow: 0 18px 34px -14px rgba(226, 90, 15, .6);
}

/* Outline button variant keeps the same pill shape */
.wp-block-button.is-style-outline .wp-block-button__link {
  background-image: none;
  background-color: transparent;
  border: 1px solid #E2E3E7;
  color: #14161C;
  box-shadow: none;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: #FF7A18; }

/* ---------------------------------------------------------------------------
   Surfaces — the main site's card language: white, hairline border, 22px radius
   and a COOL shadow (a warm shadow is what made the old site look dusty).
   --------------------------------------------------------------------------- */
.wp-block-post-template li,
.wp-block-latest-posts li,
.wp-block-quote,
.wp-block-pullquote {
  background: #fff;
  border: 1px solid #E7E8EB;
  border-radius: 22px;
  padding: 26px 24px;
  box-shadow: 0 14px 34px -22px rgba(20, 22, 28, .4);
}
.wp-block-post-featured-image img,
.wp-block-image img {
  border-radius: 16px;
}

/* Quotes get the accent rule rather than the theme default */
.wp-block-quote {
  border-left: 3px solid #FF8A2B;
}

/* ---------------------------------------------------------------------------
   Reading comfort — long-form posts want a narrower measure than the theme's
   default content width.
   --------------------------------------------------------------------------- */
.wp-block-post-content p,
.wp-block-post-content ul,
.wp-block-post-content ol {
  max-width: 68ch;
}

/* Keyboard focus, same as the main site */
:focus-visible {
  outline: 2px solid #F2691C;
  outline-offset: 3px;
}