/*
Theme Name: Lightning
Text Domain: lightning
Theme URI: https://lightning.vektor-inc.co.jp/en/
Description: Lightning is a very simple & easy to customize theme which is based on the Bootstrap. It is also very friendly with custom post types and custom taxonomies. When you add a new one, the breadcrumbs will be adjusted and posts will look beautifully without editing or adding a template files.
Author: Vektor,Inc.
Author URI: https://www.vektor-inc.co.jp
Version: 15.29.4
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

Lightning WordPress theme, Copyright (C) 2015-2024 Vektor,Inc.
Lightning WordPress theme is licensed under the GPL.

Lightning WordPress Theme bundles the following third-party resources:

Font Awesome icon font, Copyright 2012 Fonticons, Inc.
its fonts are licensed under the terms of the SIL OFL License 1.1, and its code is licensed under the terms of the MIT license
Source: https://fontawesome.com/

Bootstrap framework, Copyright 2011 Bootstrap Authors and Twitter, Inc.
Bootstrap is licensed under the terms of the MIT license
Source: https://getbootstrap.com/

CSS Simple Tree Shaking
CSS Simple Tree Shaking is licensed under the terms of the GNU General Public License v2 license
Source: https://celtislab.net/
*//* 📌 申し込みフォームの入力欄サイズを調整 */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="date"],
textarea,
select {
    width: 100%;  /* フォーム全体に広げる */
    max-width: 500px;  /* 最大幅 */
    padding: 10px;  /* 内側の余白 */
    border: 1px solid #ccc;  /* 枠線 */
    border-radius: 5px;  /* 角を丸める */
    font-size: 16px;
}

/* 📌 フォームの配置と間隔調整 */
form {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;  /* 各項目の間隔 */
}

/* 📌 住所欄の自動入力背景色 */
#address {
    background-color: #f5f5f5;  /* 灰色背景 */
}

/* 📌 クレジットカード入力欄 */
.credit-card {
    background: #fff;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* 📌 送信ボタンのデザイン */
input[type="submit"] {
    background: #007bff;  /* 青色 */
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 5px;
    font-size: 18px;
    cursor: pointer;
    transition: 0.3s;
}
input[type="submit"]:hover {
    background: #0056b3;  /* 濃い青に変化 */
}
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="date"],
textarea,
select {
    width: 100% !important;  
    max-width: 500px !important;  
    padding: 10px !important;  
    border: 1px solid #ccc !important;
    border-radius: 5px !important;  
    font-size: 16px !important;
}
/* フォーム全体を右寄せ */
form {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* 右寄せ */
}

/* 入力欄を適切なサイズに */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="date"],
textarea,
select {
    width: 100%;
    max-width: 400px; /* フィールドの最大幅 */
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 16px;
    text-align: right; /* テキストも右寄せ */
}

/* 送信ボタンを右寄せ */
input[type="submit"] {
    align-self: flex-end; /* ボタンを右寄せ */
    background: #007bff;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}
input[type="submit"]:hover {
    background: #0056b3;
}